@progress/kendo-react-treelist 6.1.1 → 7.0.0-develop.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.
- package/LICENSE.md +1 -1
- package/ScrollMode.d.ts +5 -0
- package/{dist/es/TreeList.d.ts → TreeList.d.ts} +6 -2
- package/{dist/es/TreeListNoRecords.d.ts → TreeListNoRecords.d.ts} +4 -0
- package/TreeListToolbar.d.ts +15 -0
- package/cells/EditCells/TreeListBooleanEditor.d.ts +11 -0
- package/cells/EditCells/TreeListDateEditor.d.ts +11 -0
- package/{dist/es/cells → cells}/EditCells/TreeListNumericEditor.d.ts +4 -0
- package/cells/EditCells/TreeListTextEditor.d.ts +11 -0
- package/{dist/npm/cells → cells}/FilterCells/TreeListBooleanFilter.d.ts +4 -0
- package/{dist/npm/cells → cells}/FilterCells/TreeListDateFilter.d.ts +4 -0
- package/{dist/es/cells → cells}/FilterCells/TreeListNumericFilter.d.ts +4 -0
- package/{dist/es/cells → cells}/FilterCells/TreeListTextFilter.d.ts +4 -0
- package/{dist/npm/cells → cells}/FilterCells/utils.d.ts +4 -0
- package/cells/TreeListCell.d.ts +9 -0
- package/cells/TreeListSelectionCell.d.ts +11 -0
- package/{dist/es/constants → constants}/index.d.ts +4 -0
- package/dist/cdn/js/kendo-react-treelist.js +5 -1
- package/header/TreeListHeaderCell.d.ts +7 -0
- package/header/TreeListHeaderSelectionCell.d.ts +15 -0
- package/index.d.ts +38 -0
- package/index.js +5 -0
- package/index.mjs +1181 -0
- package/interfaces/DataItemWrapper.d.ts +14 -0
- package/{dist/npm/interfaces → interfaces}/TreeListCellProps.d.ts +4 -1
- package/{dist/es/interfaces → interfaces}/TreeListColumnProps.d.ts +4 -0
- package/interfaces/TreeListFilterCellProps.d.ts +10 -0
- package/interfaces/TreeListFilterOperator.d.ts +10 -0
- package/interfaces/TreeListHeaderCellProps.d.ts +10 -0
- package/interfaces/TreeListNoRecordsProps.d.ts +13 -0
- package/{dist/es/interfaces → interfaces}/TreeListProps.d.ts +4 -1
- package/{dist/es/interfaces → interfaces}/TreeListRowProps.d.ts +4 -1
- package/{dist/es/interfaces → interfaces}/TreeListSelectableSettings.d.ts +5 -1
- package/interfaces/TreeListSortSettings.d.ts +13 -0
- package/interfaces/TreeListToolbarProps.d.ts +13 -0
- package/{dist/es/interfaces → interfaces}/events.d.ts +4 -0
- package/{dist/npm/messages → messages}/index.d.ts +4 -0
- package/package-metadata.d.ts +9 -0
- package/package.json +36 -57
- package/{dist/es/rows → rows}/TreeListDraggableRow.d.ts +5 -1
- package/rows/TreeListRow.d.ts +10 -0
- package/{dist/npm/utils → utils}/index.d.ts +4 -0
- package/about.md +0 -3
- package/debug.log +0 -3
- package/dist/es/ScrollMode.d.ts +0 -1
- package/dist/es/ScrollMode.js +0 -1
- package/dist/es/TreeList.js +0 -632
- package/dist/es/TreeListNoRecords.js +0 -37
- package/dist/es/TreeListToolbar.d.ts +0 -11
- package/dist/es/TreeListToolbar.js +0 -33
- package/dist/es/cells/EditCells/TreeListBooleanEditor.d.ts +0 -8
- package/dist/es/cells/EditCells/TreeListBooleanEditor.js +0 -41
- package/dist/es/cells/EditCells/TreeListDateEditor.d.ts +0 -8
- package/dist/es/cells/EditCells/TreeListDateEditor.js +0 -40
- package/dist/es/cells/EditCells/TreeListNumericEditor.js +0 -41
- package/dist/es/cells/EditCells/TreeListTextEditor.d.ts +0 -8
- package/dist/es/cells/EditCells/TreeListTextEditor.js +0 -39
- package/dist/es/cells/FilterCells/TreeListBooleanFilter.d.ts +0 -10
- package/dist/es/cells/FilterCells/TreeListBooleanFilter.js +0 -30
- package/dist/es/cells/FilterCells/TreeListDateFilter.d.ts +0 -10
- package/dist/es/cells/FilterCells/TreeListDateFilter.js +0 -30
- package/dist/es/cells/FilterCells/TreeListNumericFilter.js +0 -30
- package/dist/es/cells/FilterCells/TreeListTextFilter.js +0 -30
- package/dist/es/cells/FilterCells/utils.d.ts +0 -38
- package/dist/es/cells/FilterCells/utils.js +0 -66
- package/dist/es/cells/TreeListCell.d.ts +0 -6
- package/dist/es/cells/TreeListCell.js +0 -61
- package/dist/es/cells/TreeListSelectionCell.d.ts +0 -8
- package/dist/es/cells/TreeListSelectionCell.js +0 -31
- package/dist/es/constants/index.js +0 -7
- package/dist/es/header/TreeListHeaderCell.d.ts +0 -3
- package/dist/es/header/TreeListHeaderCell.js +0 -14
- package/dist/es/header/TreeListHeaderSelectionCell.d.ts +0 -11
- package/dist/es/header/TreeListHeaderSelectionCell.js +0 -45
- package/dist/es/interfaces/DataItemWrapper.d.ts +0 -10
- package/dist/es/interfaces/DataItemWrapper.js +0 -1
- package/dist/es/interfaces/TreeListCellProps.d.ts +0 -42
- package/dist/es/interfaces/TreeListCellProps.js +0 -1
- package/dist/es/interfaces/TreeListColumnProps.js +0 -1
- package/dist/es/interfaces/TreeListFilterCellProps.d.ts +0 -6
- package/dist/es/interfaces/TreeListFilterCellProps.js +0 -1
- package/dist/es/interfaces/TreeListFilterOperator.d.ts +0 -6
- package/dist/es/interfaces/TreeListFilterOperator.js +0 -1
- package/dist/es/interfaces/TreeListHeaderCellProps.d.ts +0 -6
- package/dist/es/interfaces/TreeListHeaderCellProps.js +0 -1
- package/dist/es/interfaces/TreeListNoRecordsProps.d.ts +0 -10
- package/dist/es/interfaces/TreeListNoRecordsProps.js +0 -1
- package/dist/es/interfaces/TreeListProps.js +0 -1
- package/dist/es/interfaces/TreeListRowProps.js +0 -1
- package/dist/es/interfaces/TreeListSelectableSettings.js +0 -2
- package/dist/es/interfaces/TreeListSortSettings.d.ts +0 -9
- package/dist/es/interfaces/TreeListSortSettings.js +0 -1
- package/dist/es/interfaces/TreeListToolbarProps.d.ts +0 -10
- package/dist/es/interfaces/TreeListToolbarProps.js +0 -1
- package/dist/es/interfaces/events.js +0 -1
- package/dist/es/main.d.ts +0 -34
- package/dist/es/main.js +0 -23
- package/dist/es/messages/index.d.ts +0 -120
- package/dist/es/messages/index.js +0 -121
- package/dist/es/package-metadata.d.ts +0 -5
- package/dist/es/package-metadata.js +0 -11
- package/dist/es/rows/TreeListDraggableRow.js +0 -171
- package/dist/es/rows/TreeListRow.d.ts +0 -6
- package/dist/es/rows/TreeListRow.js +0 -31
- package/dist/es/utils/index.d.ts +0 -17
- package/dist/es/utils/index.js +0 -68
- package/dist/npm/ScrollMode.d.ts +0 -1
- package/dist/npm/ScrollMode.js +0 -2
- package/dist/npm/TreeList.d.ts +0 -133
- package/dist/npm/TreeList.js +0 -635
- package/dist/npm/TreeListNoRecords.d.ts +0 -12
- package/dist/npm/TreeListNoRecords.js +0 -40
- package/dist/npm/TreeListToolbar.d.ts +0 -11
- package/dist/npm/TreeListToolbar.js +0 -36
- package/dist/npm/cells/EditCells/TreeListBooleanEditor.d.ts +0 -8
- package/dist/npm/cells/EditCells/TreeListBooleanEditor.js +0 -45
- package/dist/npm/cells/EditCells/TreeListDateEditor.d.ts +0 -8
- package/dist/npm/cells/EditCells/TreeListDateEditor.js +0 -44
- package/dist/npm/cells/EditCells/TreeListNumericEditor.d.ts +0 -8
- package/dist/npm/cells/EditCells/TreeListNumericEditor.js +0 -45
- package/dist/npm/cells/EditCells/TreeListTextEditor.d.ts +0 -8
- package/dist/npm/cells/EditCells/TreeListTextEditor.js +0 -43
- package/dist/npm/cells/FilterCells/TreeListBooleanFilter.js +0 -34
- package/dist/npm/cells/FilterCells/TreeListDateFilter.js +0 -34
- package/dist/npm/cells/FilterCells/TreeListNumericFilter.d.ts +0 -10
- package/dist/npm/cells/FilterCells/TreeListNumericFilter.js +0 -34
- package/dist/npm/cells/FilterCells/TreeListTextFilter.d.ts +0 -10
- package/dist/npm/cells/FilterCells/TreeListTextFilter.js +0 -34
- package/dist/npm/cells/FilterCells/utils.js +0 -70
- package/dist/npm/cells/TreeListCell.d.ts +0 -6
- package/dist/npm/cells/TreeListCell.js +0 -65
- package/dist/npm/cells/TreeListSelectionCell.d.ts +0 -8
- package/dist/npm/cells/TreeListSelectionCell.js +0 -35
- package/dist/npm/constants/index.d.ts +0 -6
- package/dist/npm/constants/index.js +0 -10
- package/dist/npm/header/TreeListHeaderCell.d.ts +0 -3
- package/dist/npm/header/TreeListHeaderCell.js +0 -18
- package/dist/npm/header/TreeListHeaderSelectionCell.d.ts +0 -11
- package/dist/npm/header/TreeListHeaderSelectionCell.js +0 -48
- package/dist/npm/interfaces/DataItemWrapper.d.ts +0 -10
- package/dist/npm/interfaces/DataItemWrapper.js +0 -2
- package/dist/npm/interfaces/TreeListCellProps.js +0 -2
- package/dist/npm/interfaces/TreeListColumnProps.d.ts +0 -41
- package/dist/npm/interfaces/TreeListColumnProps.js +0 -2
- package/dist/npm/interfaces/TreeListFilterCellProps.d.ts +0 -6
- package/dist/npm/interfaces/TreeListFilterCellProps.js +0 -2
- package/dist/npm/interfaces/TreeListFilterOperator.d.ts +0 -6
- package/dist/npm/interfaces/TreeListFilterOperator.js +0 -2
- package/dist/npm/interfaces/TreeListHeaderCellProps.d.ts +0 -6
- package/dist/npm/interfaces/TreeListHeaderCellProps.js +0 -2
- package/dist/npm/interfaces/TreeListNoRecordsProps.d.ts +0 -10
- package/dist/npm/interfaces/TreeListNoRecordsProps.js +0 -2
- package/dist/npm/interfaces/TreeListProps.d.ts +0 -234
- package/dist/npm/interfaces/TreeListProps.js +0 -2
- package/dist/npm/interfaces/TreeListRowProps.d.ts +0 -93
- package/dist/npm/interfaces/TreeListRowProps.js +0 -2
- package/dist/npm/interfaces/TreeListSelectableSettings.d.ts +0 -18
- package/dist/npm/interfaces/TreeListSelectableSettings.js +0 -3
- package/dist/npm/interfaces/TreeListSortSettings.d.ts +0 -9
- package/dist/npm/interfaces/TreeListSortSettings.js +0 -2
- package/dist/npm/interfaces/TreeListToolbarProps.d.ts +0 -10
- package/dist/npm/interfaces/TreeListToolbarProps.js +0 -2
- package/dist/npm/interfaces/events.d.ts +0 -265
- package/dist/npm/interfaces/events.js +0 -2
- package/dist/npm/main.d.ts +0 -34
- package/dist/npm/main.js +0 -63
- package/dist/npm/messages/index.js +0 -124
- package/dist/npm/package-metadata.d.ts +0 -5
- package/dist/npm/package-metadata.js +0 -14
- package/dist/npm/rows/TreeListDraggableRow.d.ts +0 -32
- package/dist/npm/rows/TreeListDraggableRow.js +0 -174
- package/dist/npm/rows/TreeListRow.d.ts +0 -6
- package/dist/npm/rows/TreeListRow.js +0 -34
- package/dist/npm/utils/index.js +0 -74
- package/dist/systemjs/kendo-react-treelist.js +0 -1
- package/e2e-next/basic.tests.ts +0 -24
package/dist/npm/TreeList.js
DELETED
|
@@ -1,635 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __extends = (this && this.__extends) || (function () {
|
|
3
|
-
var extendStatics = function (d, b) {
|
|
4
|
-
extendStatics = Object.setPrototypeOf ||
|
|
5
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
6
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
7
|
-
return extendStatics(d, b);
|
|
8
|
-
};
|
|
9
|
-
return function (d, b) {
|
|
10
|
-
if (typeof b !== "function" && b !== null)
|
|
11
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
12
|
-
extendStatics(d, b);
|
|
13
|
-
function __() { this.constructor = d; }
|
|
14
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
15
|
-
};
|
|
16
|
-
})();
|
|
17
|
-
var __assign = (this && this.__assign) || function () {
|
|
18
|
-
__assign = Object.assign || function(t) {
|
|
19
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
20
|
-
s = arguments[i];
|
|
21
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
22
|
-
t[p] = s[p];
|
|
23
|
-
}
|
|
24
|
-
return t;
|
|
25
|
-
};
|
|
26
|
-
return __assign.apply(this, arguments);
|
|
27
|
-
};
|
|
28
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
29
|
-
var t = {};
|
|
30
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
31
|
-
t[p] = s[p];
|
|
32
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
33
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
34
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
35
|
-
t[p[i]] = s[p[i]];
|
|
36
|
-
}
|
|
37
|
-
return t;
|
|
38
|
-
};
|
|
39
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
40
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
41
|
-
if (ar || !(i in from)) {
|
|
42
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
43
|
-
ar[i] = from[i];
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
47
|
-
};
|
|
48
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
49
|
-
exports.TreeList = void 0;
|
|
50
|
-
var React = require("react");
|
|
51
|
-
var PropTypes = require("prop-types");
|
|
52
|
-
var kendo_react_common_1 = require("@progress/kendo-react-common");
|
|
53
|
-
var kendo_react_data_tools_1 = require("@progress/kendo-react-data-tools");
|
|
54
|
-
var index_1 = require("./utils/index");
|
|
55
|
-
var TreeListCell_1 = require("./cells/TreeListCell");
|
|
56
|
-
var TreeListNoRecords_1 = require("./TreeListNoRecords");
|
|
57
|
-
var TreeListRow_1 = require("./rows/TreeListRow");
|
|
58
|
-
var package_metadata_1 = require("./package-metadata");
|
|
59
|
-
/**
|
|
60
|
-
* Represents the [KendoReact TreeList component]({% slug getstarted_treelist %}).
|
|
61
|
-
*/
|
|
62
|
-
var TreeList = /** @class */ (function (_super) {
|
|
63
|
-
__extends(TreeList, _super);
|
|
64
|
-
function TreeList(props) {
|
|
65
|
-
var _this = _super.call(this, props) || this;
|
|
66
|
-
_this.wrapperScrollLeft = 0;
|
|
67
|
-
_this.wrapperScrollTop = 0;
|
|
68
|
-
_this.updateOnScroll = false;
|
|
69
|
-
_this.tbodyOffsetTop = 0;
|
|
70
|
-
_this.prevData = [];
|
|
71
|
-
_this.flattedData = [];
|
|
72
|
-
_this.extendedColumn = [];
|
|
73
|
-
_this.columnsMap = [];
|
|
74
|
-
_this.element = null;
|
|
75
|
-
_this._treeListId = (0, kendo_react_common_1.guid)();
|
|
76
|
-
_this.contextStateRef = { current: undefined };
|
|
77
|
-
_this.navigationStateRef = { current: undefined };
|
|
78
|
-
/**
|
|
79
|
-
* Method to allow the scroll to be set to a specific row index.
|
|
80
|
-
*
|
|
81
|
-
* @param options - Object, containing the rowIndex to which is going to be scrolled.
|
|
82
|
-
*/
|
|
83
|
-
_this.scrollIntoView = function (options) {
|
|
84
|
-
if (!_this.element) {
|
|
85
|
-
return;
|
|
86
|
-
}
|
|
87
|
-
var _a = options.rowIndex, rowIndex = _a === void 0 ? 0 : _a;
|
|
88
|
-
var _b = _this.props, scrollable = _b.scrollable, _c = _b.rowHeight, rowHeight = _c === void 0 ? 0 : _c;
|
|
89
|
-
if (scrollable === 'virtual' || rowHeight) {
|
|
90
|
-
_this.element.scroll(0, (rowIndex - 1) * rowHeight);
|
|
91
|
-
}
|
|
92
|
-
else {
|
|
93
|
-
var selectedRow = _this.element.querySelector("tbody > tr:nth-child(".concat(rowIndex, ")"));
|
|
94
|
-
if (selectedRow) {
|
|
95
|
-
var offsetTop = selectedRow.offsetTop - _this.tbodyOffsetTop;
|
|
96
|
-
_this.element.scroll(0, offsetTop);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
};
|
|
100
|
-
_this.getExtendedColumn = (0, kendo_react_common_1.memoizeOne)(function (columns, idPrefix) {
|
|
101
|
-
return (0, kendo_react_data_tools_1.readColumns)(columns, { prevId: 0, idPrefix: idPrefix });
|
|
102
|
-
});
|
|
103
|
-
_this.getColumnsMap = (0, kendo_react_common_1.memoizeOne)(function (extendedColumn) {
|
|
104
|
-
return (0, kendo_react_data_tools_1.mapColumns)(extendedColumn);
|
|
105
|
-
});
|
|
106
|
-
_this.onKeyDown = function (event) {
|
|
107
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onKeyDown(event, {
|
|
108
|
-
contextStateRef: _this.contextStateRef,
|
|
109
|
-
navigationStateRef: _this.navigationStateRef
|
|
110
|
-
});
|
|
111
|
-
if (_this.props.onKeyDown) {
|
|
112
|
-
var _a = (0, kendo_react_data_tools_1.getSelectionOptions)(_this.props.selectable), mode = _a.mode, cell = _a.cell;
|
|
113
|
-
var ev = __assign({ dataItems: _this.getLeafDataItems(), mode: mode, cell: cell, componentId: _this._treeListId, selectedField: _this.props.selectedField }, _this.getArguments(event));
|
|
114
|
-
_this.props.onKeyDown.call(undefined, ev);
|
|
115
|
-
}
|
|
116
|
-
};
|
|
117
|
-
_this.onFocus = function (event) {
|
|
118
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onFocus(event, {
|
|
119
|
-
contextStateRef: _this.contextStateRef
|
|
120
|
-
});
|
|
121
|
-
};
|
|
122
|
-
_this.onRowDrag = function (event) {
|
|
123
|
-
if (_this.props.onRowDrag) {
|
|
124
|
-
_this.props.onRowDrag.call(undefined, __assign(__assign({}, event), { target: _this }));
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
|
-
_this.onRowDrop = function (event) {
|
|
128
|
-
if (_this.props.onRowDrop) {
|
|
129
|
-
_this.props.onRowDrop.call(undefined, __assign(__assign({}, event), { target: _this }));
|
|
130
|
-
}
|
|
131
|
-
};
|
|
132
|
-
_this.columnReorder = function (prev, next, nativeEvent) {
|
|
133
|
-
var _a;
|
|
134
|
-
var depth = _this.extendedColumn[prev].depth;
|
|
135
|
-
var end = function (index) {
|
|
136
|
-
do {
|
|
137
|
-
index++;
|
|
138
|
-
} while (index < _this.extendedColumn.length && _this.extendedColumn[index].depth > depth);
|
|
139
|
-
return index;
|
|
140
|
-
};
|
|
141
|
-
var spliced = _this.extendedColumn.splice(prev, end(prev) - prev);
|
|
142
|
-
(_a = _this.extendedColumn).splice.apply(_a, __spreadArray([prev < next ? end(next - spliced.length) : next, 0], spliced, false));
|
|
143
|
-
_this.extendedColumn.filter(function (q) { return q.declarationIndex >= 0; }).forEach(function (c, i) { return c.orderIndex = i; });
|
|
144
|
-
if (_this.props.onColumnReorder) {
|
|
145
|
-
var event_1 = {
|
|
146
|
-
target: _this,
|
|
147
|
-
columns: _this.columns,
|
|
148
|
-
nativeEvent: nativeEvent
|
|
149
|
-
};
|
|
150
|
-
_this.props.onColumnReorder.call(undefined, event_1);
|
|
151
|
-
}
|
|
152
|
-
};
|
|
153
|
-
_this.onResize = function (index, newWidth, oldWidth, nativeEvent, end) {
|
|
154
|
-
if (_this.props.onColumnResize) {
|
|
155
|
-
var sumWidth = _this.extendedColumn.filter(function (c) { return c.children.length === 0; }).
|
|
156
|
-
reduce(function (acc, column) { return acc += parseFloat(String(column.width)); }, 0);
|
|
157
|
-
var event_2 = {
|
|
158
|
-
columns: _this.columns,
|
|
159
|
-
totalWidth: sumWidth,
|
|
160
|
-
index: index,
|
|
161
|
-
nativeEvent: nativeEvent,
|
|
162
|
-
newWidth: newWidth,
|
|
163
|
-
oldWidth: oldWidth,
|
|
164
|
-
end: end,
|
|
165
|
-
target: _this
|
|
166
|
-
};
|
|
167
|
-
_this.props.onColumnResize.call(undefined, event_2);
|
|
168
|
-
}
|
|
169
|
-
};
|
|
170
|
-
_this.handleOnScroll = function (event) {
|
|
171
|
-
var scrollLeft = event.currentTarget.scrollLeft;
|
|
172
|
-
var scrollTop = event.currentTarget.scrollTop;
|
|
173
|
-
var _a = _this.props, columnVirtualization = _a.columnVirtualization, scrollable = _a.scrollable, _b = _a.rowHeight, rowHeight = _b === void 0 ? 0 : _b;
|
|
174
|
-
var minTopChange = rowHeight;
|
|
175
|
-
var minLeftChange = 0;
|
|
176
|
-
var shouldForceUpdate = false;
|
|
177
|
-
if (columnVirtualization && Math.abs(_this.wrapperScrollLeft - scrollLeft) > minLeftChange) {
|
|
178
|
-
_this.wrapperScrollLeft = scrollLeft;
|
|
179
|
-
shouldForceUpdate = true;
|
|
180
|
-
}
|
|
181
|
-
if (scrollable === 'virtual' && Math.abs(_this.wrapperScrollTop - scrollTop) > minTopChange) {
|
|
182
|
-
_this.wrapperScrollTop = scrollTop;
|
|
183
|
-
shouldForceUpdate = true;
|
|
184
|
-
}
|
|
185
|
-
if (shouldForceUpdate) {
|
|
186
|
-
_this.updateOnScroll = true;
|
|
187
|
-
_this.forceUpdate();
|
|
188
|
-
}
|
|
189
|
-
};
|
|
190
|
-
_this.calculateSizes = function (div) {
|
|
191
|
-
if (!div || _this.props.scrollable === 'none') {
|
|
192
|
-
return;
|
|
193
|
-
}
|
|
194
|
-
var children = Array.from(div.childNodes);
|
|
195
|
-
var table = children.find(function (n) { return n.nodeName === 'TABLE'; });
|
|
196
|
-
var toolbar = _this.props.toolbar &&
|
|
197
|
-
children.find(function (n) {
|
|
198
|
-
return n.nodeType === 1 && n.classList.contains('k-grid-toolbar');
|
|
199
|
-
});
|
|
200
|
-
var toolbarHeight = 0;
|
|
201
|
-
if (toolbar) {
|
|
202
|
-
var boxSizing = toolbar.style.boxSizing;
|
|
203
|
-
toolbar.style.boxSizing = 'border-box';
|
|
204
|
-
toolbarHeight = parseFloat(String(window.getComputedStyle(toolbar).height)) ||
|
|
205
|
-
toolbar.offsetHeight;
|
|
206
|
-
toolbar.style.boxSizing = boxSizing;
|
|
207
|
-
if (!toolbar.getAttribute('style')) {
|
|
208
|
-
toolbar.removeAttribute('style');
|
|
209
|
-
}
|
|
210
|
-
}
|
|
211
|
-
_this.tbodyOffsetTop = table.tBodies[0].offsetTop;
|
|
212
|
-
(0, index_1.setHeaderRowsTop)(table, toolbarHeight);
|
|
213
|
-
};
|
|
214
|
-
_this.itemChange = function (event) {
|
|
215
|
-
var itemChange = _this.props.onItemChange;
|
|
216
|
-
if (event.field === _this.props.expandField) {
|
|
217
|
-
var expandChange = _this.props.onExpandChange;
|
|
218
|
-
if (expandChange) {
|
|
219
|
-
var expandEvent = __assign(__assign({}, _this.getArguments(event.syntheticEvent)), { dataItem: event.dataItem, level: event.level, value: event.value });
|
|
220
|
-
expandChange.call(undefined, expandEvent);
|
|
221
|
-
}
|
|
222
|
-
return;
|
|
223
|
-
}
|
|
224
|
-
if (itemChange) {
|
|
225
|
-
var itemChangeEvent = __assign(__assign({}, _this.getArguments(event.syntheticEvent)), { dataItem: event.dataItem, level: event.level, field: event.field, value: event.value });
|
|
226
|
-
itemChange.call(undefined, itemChangeEvent);
|
|
227
|
-
}
|
|
228
|
-
};
|
|
229
|
-
_this.onHeaderSelectionChange = function (event) {
|
|
230
|
-
if (_this.props.onHeaderSelectionChange) {
|
|
231
|
-
var selectionEvent = {
|
|
232
|
-
field: event.field,
|
|
233
|
-
nativeEvent: event.syntheticEvent && event.syntheticEvent.nativeEvent,
|
|
234
|
-
syntheticEvent: event.syntheticEvent,
|
|
235
|
-
target: _this,
|
|
236
|
-
dataItems: _this.getLeafDataItems()
|
|
237
|
-
};
|
|
238
|
-
_this.props.onHeaderSelectionChange.call(undefined, selectionEvent);
|
|
239
|
-
}
|
|
240
|
-
};
|
|
241
|
-
_this.selectionRelease = function (event) {
|
|
242
|
-
if (_this.props.onSelectionChange) {
|
|
243
|
-
var selectionEvent = __assign({ syntheticEvent: undefined, target: _this, selectedField: _this.props.selectedField || '', componentId: _this._treeListId, dataItems: _this.getLeafDataItems(), dataItem: null, level: [] }, event);
|
|
244
|
-
_this.props.onSelectionChange.call(undefined, selectionEvent);
|
|
245
|
-
}
|
|
246
|
-
};
|
|
247
|
-
_this.sortChange = function (syntheticEvent, sort, field) {
|
|
248
|
-
_this.raiseDataEvent(_this.props.onSortChange, { sort: sort, field: field }, syntheticEvent);
|
|
249
|
-
};
|
|
250
|
-
_this.headerFilterChange = function (syntheticEvent, filter, field) {
|
|
251
|
-
_this.raiseDataEvent(_this.props.onFilterChange, { filter: filter, field: field }, syntheticEvent);
|
|
252
|
-
};
|
|
253
|
-
_this.filterChange = function (event) {
|
|
254
|
-
var filter = event.filter, field = event.field;
|
|
255
|
-
_this.raiseDataEvent(_this.props.onFilterChange, { filter: filter, field: field }, event.syntheticEvent);
|
|
256
|
-
};
|
|
257
|
-
_this.columnMenuFilterChange = function (syntheticEvent, filter, field) {
|
|
258
|
-
var onColumnMenuFilterChange = _this.props.onColumnMenuFilterChange;
|
|
259
|
-
if (!onColumnMenuFilterChange) {
|
|
260
|
-
return;
|
|
261
|
-
}
|
|
262
|
-
var event = {
|
|
263
|
-
syntheticEvent: syntheticEvent,
|
|
264
|
-
filter: filter,
|
|
265
|
-
field: field,
|
|
266
|
-
target: _this,
|
|
267
|
-
nativeEvent: syntheticEvent.nativeEvent
|
|
268
|
-
};
|
|
269
|
-
onColumnMenuFilterChange.call(undefined, event);
|
|
270
|
-
};
|
|
271
|
-
_this.expandChange = function (event, dataItem, level) {
|
|
272
|
-
var _a = _this.props, expandField = _a.expandField, onExpandChange = _a.onExpandChange;
|
|
273
|
-
if (expandField && onExpandChange) {
|
|
274
|
-
var expandEvent = __assign(__assign({}, _this.getArguments(event)), { dataItem: dataItem, level: level, value: _this.expanded(dataItem) });
|
|
275
|
-
onExpandChange.call(undefined, expandEvent);
|
|
276
|
-
}
|
|
277
|
-
};
|
|
278
|
-
_this.rowClick = function (e, item) {
|
|
279
|
-
if (_this.props.onRowClick && e.target.nodeName === 'TD') {
|
|
280
|
-
var rowClickEvent = __assign({ dataItem: item.dataItem, level: item.level }, _this.getArguments(e));
|
|
281
|
-
_this.props.onRowClick.call(undefined, rowClickEvent);
|
|
282
|
-
}
|
|
283
|
-
};
|
|
284
|
-
_this.rowDoubleClick = function (e, item) {
|
|
285
|
-
if (_this.props.onRowDoubleClick && e.target.nodeName === 'TD') {
|
|
286
|
-
var rowDoubleClickEvent = __assign({ dataItem: item.dataItem, level: item.level }, _this.getArguments(e));
|
|
287
|
-
_this.props.onRowDoubleClick.call(undefined, rowDoubleClickEvent);
|
|
288
|
-
}
|
|
289
|
-
};
|
|
290
|
-
_this.rowContextMenu = function (e, item) {
|
|
291
|
-
if (_this.props.onRowContextMenu && e.target.nodeName === 'TD') {
|
|
292
|
-
var rowContextMenuEvent = __assign({ dataItem: item.dataItem, level: item.level }, _this.getArguments(e));
|
|
293
|
-
_this.props.onRowContextMenu.call(undefined, rowContextMenuEvent);
|
|
294
|
-
}
|
|
295
|
-
};
|
|
296
|
-
_this.onPageChange = function (e) {
|
|
297
|
-
if (_this.props.onPageChange) {
|
|
298
|
-
var event_3 = __assign(__assign({}, _this.getArguments(e.syntheticEvent)), { skip: e.skip, take: e.take });
|
|
299
|
-
_this.props.onPageChange.call(undefined, event_3);
|
|
300
|
-
}
|
|
301
|
-
};
|
|
302
|
-
_this.expandedSubItems = function (dataItem) {
|
|
303
|
-
var items = [];
|
|
304
|
-
if (_this.expanded(dataItem) && _this.hasChildren(dataItem)) {
|
|
305
|
-
items.push.apply(items, (0, kendo_react_common_1.getNestedValue)(_this.props.subItemsField, dataItem));
|
|
306
|
-
}
|
|
307
|
-
return items;
|
|
308
|
-
};
|
|
309
|
-
_this.getLeafDataItems = function () {
|
|
310
|
-
return _this.flatData.map(function (item) { return item.dataItem; });
|
|
311
|
-
};
|
|
312
|
-
_this.expanded = function (dataItem) { return Boolean((0, kendo_react_common_1.getNestedValue)(_this.props.expandField, dataItem)); };
|
|
313
|
-
_this.hasChildren = function (dataItem) { return Boolean((0, kendo_react_common_1.getNestedValue)(_this.props.subItemsField, dataItem)); };
|
|
314
|
-
(0, kendo_react_common_1.validatePackage)(package_metadata_1.packageMetadata);
|
|
315
|
-
_this.dragLogic = new kendo_react_data_tools_1.CommonDragLogic(_this.columnReorder, kendo_react_common_1.noop, kendo_react_common_1.noop);
|
|
316
|
-
_this.columnResize = new kendo_react_data_tools_1.ColumnResize(_this.onResize.bind(_this));
|
|
317
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onConstructor({
|
|
318
|
-
navigatable: Boolean(props.navigatable),
|
|
319
|
-
contextStateRef: _this.contextStateRef,
|
|
320
|
-
navigationStateRef: _this.navigationStateRef
|
|
321
|
-
});
|
|
322
|
-
return _this;
|
|
323
|
-
}
|
|
324
|
-
Object.defineProperty(TreeList.prototype, "document", {
|
|
325
|
-
get: function () {
|
|
326
|
-
if (!kendo_react_common_1.canUseDOM) {
|
|
327
|
-
return;
|
|
328
|
-
}
|
|
329
|
-
// useful only for user actions
|
|
330
|
-
return (this.element && this.element.ownerDocument) || document;
|
|
331
|
-
},
|
|
332
|
-
enumerable: false,
|
|
333
|
-
configurable: true
|
|
334
|
-
});
|
|
335
|
-
/**
|
|
336
|
-
* @hidden
|
|
337
|
-
*/
|
|
338
|
-
TreeList.prototype.componentDidMount = function () {
|
|
339
|
-
this.calculateSizes(this.element);
|
|
340
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onComponentDidMount({
|
|
341
|
-
scope: this.element || undefined,
|
|
342
|
-
contextStateRef: this.contextStateRef,
|
|
343
|
-
navigationStateRef: this.navigationStateRef
|
|
344
|
-
});
|
|
345
|
-
};
|
|
346
|
-
/**
|
|
347
|
-
* @hidden
|
|
348
|
-
*/
|
|
349
|
-
TreeList.prototype.getSnapshotBeforeUpdate = function () {
|
|
350
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({
|
|
351
|
-
document: this.document,
|
|
352
|
-
contextStateRef: this.contextStateRef,
|
|
353
|
-
navigationStateRef: this.navigationStateRef
|
|
354
|
-
});
|
|
355
|
-
return null;
|
|
356
|
-
};
|
|
357
|
-
/**
|
|
358
|
-
* @hidden
|
|
359
|
-
*/
|
|
360
|
-
TreeList.prototype.componentDidUpdate = function (prevProps) {
|
|
361
|
-
if (prevProps.columns !== this.props.columns) {
|
|
362
|
-
this.calculateSizes(this.element);
|
|
363
|
-
}
|
|
364
|
-
kendo_react_data_tools_1.tableKeyboardNavigation.onComponentDidUpdate({
|
|
365
|
-
scope: this.element || undefined,
|
|
366
|
-
contextStateRef: this.contextStateRef,
|
|
367
|
-
navigationStateRef: this.navigationStateRef
|
|
368
|
-
});
|
|
369
|
-
};
|
|
370
|
-
/**
|
|
371
|
-
* @hidden
|
|
372
|
-
*/
|
|
373
|
-
TreeList.prototype.componentWillUnmount = function () {
|
|
374
|
-
this.columnsMap = [];
|
|
375
|
-
this.prevData = [];
|
|
376
|
-
this.flattedData = [];
|
|
377
|
-
this.updateOnScroll = false;
|
|
378
|
-
this.getExtendedColumn.clear();
|
|
379
|
-
this.getColumnsMap.clear();
|
|
380
|
-
};
|
|
381
|
-
/**
|
|
382
|
-
* @hidden
|
|
383
|
-
*/
|
|
384
|
-
TreeList.prototype.render = function () {
|
|
385
|
-
var _this = this;
|
|
386
|
-
var _a = this.props, _b = _a.columns, columns = _b === void 0 ? [] : _b, filterRow = _a.filterRow, _c = _a.scrollable, scrollable = _c === void 0 ? 'scrollable' : _c, _d = _a.resizable, resizable = _d === void 0 ? false : _d, _e = _a.reorderable, reorderable = _e === void 0 ? false : _e, skip = _a.skip, take = _a.take;
|
|
387
|
-
var filterable = columns.some(function (c) { return Boolean(c.filter) || Boolean(c.filterCell); }) || filterRow !== undefined;
|
|
388
|
-
var FilterRow = filterRow || kendo_react_data_tools_1.FilterRow;
|
|
389
|
-
var idPrefix = kendo_react_data_tools_1.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef);
|
|
390
|
-
this.extendedColumn = this.getExtendedColumn(columns, idPrefix);
|
|
391
|
-
this.columnsMap = this.getColumnsMap(this.extendedColumn);
|
|
392
|
-
var leafColumns = this.extendedColumn.filter(function (c) { return c.children.length === 0; });
|
|
393
|
-
this.columnResize.columns = this.extendedColumn;
|
|
394
|
-
this.columnResize.resizable = resizable;
|
|
395
|
-
this.dragLogic.columns = this.extendedColumn;
|
|
396
|
-
this.dragLogic.reorderable = reorderable;
|
|
397
|
-
this.dragLogic.groupable = false;
|
|
398
|
-
var header = (React.createElement(kendo_react_data_tools_1.Header, { headerRow: React.createElement(kendo_react_data_tools_1.HeaderRow, { sort: this.props.sort, sortable: this.props.sortable, sortChange: this.sortChange, selectionChange: this.onHeaderSelectionChange, columns: this.extendedColumn, columnsMap: this.columnsMap, cellRender: this.props.headerCellRender, columnResize: this.columnResize, columnMenu: this.props.columnMenu, columnMenuFilter: this.props.columnMenuFilter, columnMenuFilterChange: this.columnMenuFilterChange, pressHandler: this.dragLogic.pressHandler, dragHandler: this.dragLogic.dragHandler, releaseHandler: this.dragLogic.releaseHandler, filterChange: this.headerFilterChange }), filterRow: filterable && React.createElement(FilterRow, { columns: leafColumns, filter: this.props.filter, filterChange: this.filterChange, sort: this.props.sort, ariaRowIndex: this.columnsMap.length + 1 }) || undefined, columnResize: this.columnResize }));
|
|
399
|
-
var wrapperStyles = this.props.style || {};
|
|
400
|
-
var _f = (0, kendo_react_data_tools_1.tableColumnsVirtualization)({
|
|
401
|
-
enabled: this.props.columnVirtualization,
|
|
402
|
-
columns: leafColumns,
|
|
403
|
-
scrollLeft: this.wrapperScrollLeft,
|
|
404
|
-
tableViewPortWidth: parseFloat((wrapperStyles.width || '').toString())
|
|
405
|
-
}), colSpans = _f.colSpans, hiddenColumns = _f.hiddenColumns;
|
|
406
|
-
var dataRow = function (item, inEdit, rowId, isRowExpanded, rowDataIndex, selectedValue) { return leafColumns.map(function (column, columnIndex) {
|
|
407
|
-
if (hiddenColumns[columnIndex]) {
|
|
408
|
-
return null;
|
|
409
|
-
}
|
|
410
|
-
var columnKey = column.id ? column.id : columnIndex;
|
|
411
|
-
var className = "".concat(column.className ? column.className + ' ' : '')
|
|
412
|
-
+ "".concat(column.locked ? 'k-grid-content-sticky' : '');
|
|
413
|
-
var cellProps = {
|
|
414
|
-
id: kendo_react_data_tools_1.tableKeyboardNavigationTools.generateNavigatableId("".concat(rowId, "-").concat(String(columnIndex)), idPrefix),
|
|
415
|
-
colSpan: colSpans[columnIndex],
|
|
416
|
-
dataItem: item.dataItem,
|
|
417
|
-
field: column.field,
|
|
418
|
-
format: column.format,
|
|
419
|
-
className: className || undefined,
|
|
420
|
-
render: _this.props.cellRender,
|
|
421
|
-
onChange: _this.itemChange,
|
|
422
|
-
selectionChange: (_this.props.onSelectionChange) ? (function (e) {
|
|
423
|
-
_this.selectionChange({ event: e, item: item, columnIndex: columnIndex, dataIndex: rowDataIndex });
|
|
424
|
-
}) : undefined,
|
|
425
|
-
level: item.level,
|
|
426
|
-
expandable: column.expandable,
|
|
427
|
-
expanded: isRowExpanded,
|
|
428
|
-
hasChildren: _this.hasChildren(item.dataItem),
|
|
429
|
-
onExpandChange: _this.expandChange,
|
|
430
|
-
colIndex: columnIndex,
|
|
431
|
-
ariaColumnIndex: column.ariaColumnIndex,
|
|
432
|
-
style: (column.left !== undefined) && {
|
|
433
|
-
left: column.left,
|
|
434
|
-
right: column.right,
|
|
435
|
-
borderRightWidth: column.rightBorder ? '1px' : ''
|
|
436
|
-
} || {},
|
|
437
|
-
isSelected: Array.isArray(selectedValue) && selectedValue.indexOf(columnIndex) > -1
|
|
438
|
-
};
|
|
439
|
-
if (inEdit && column.editCell) {
|
|
440
|
-
return (React.createElement(column.editCell, __assign({ key: columnKey }, cellProps, { onChange: _this.itemChange })));
|
|
441
|
-
}
|
|
442
|
-
if (column.cell) {
|
|
443
|
-
return React.createElement(column.cell, __assign({ key: columnKey }, cellProps));
|
|
444
|
-
}
|
|
445
|
-
return React.createElement(TreeListCell_1.TreeListCell, __assign({ key: columnKey }, cellProps));
|
|
446
|
-
}); };
|
|
447
|
-
var flattedData = this.flatData;
|
|
448
|
-
var total = flattedData.length;
|
|
449
|
-
if (skip !== undefined && take !== undefined) {
|
|
450
|
-
flattedData = flattedData.slice(skip, skip + take);
|
|
451
|
-
}
|
|
452
|
-
if (scrollable === 'virtual') {
|
|
453
|
-
flattedData = (0, index_1.tableRowsVirtualization)({
|
|
454
|
-
rows: flattedData,
|
|
455
|
-
tableViewPortHeight: parseFloat((wrapperStyles.height || wrapperStyles.maxHeight || '').toString()),
|
|
456
|
-
scrollTop: this.wrapperScrollTop
|
|
457
|
-
});
|
|
458
|
-
this.updateOnScroll = false;
|
|
459
|
-
}
|
|
460
|
-
var levels = flattedData.map(function (i) { return i.level; });
|
|
461
|
-
var rowIndexStart = this.columnsMap.length + (filterable ? 1 : 0) + 1;
|
|
462
|
-
var body = flattedData.length > 0 && flattedData.map(function (item, rowIndex) {
|
|
463
|
-
var inEdit = (0, kendo_react_common_1.getNestedValue)(_this.props.editField, item.dataItem);
|
|
464
|
-
var dataItemKeyValue = _this.props.dataItemKey && (0, kendo_react_common_1.getter)(_this.props.dataItemKey)(item.dataItem);
|
|
465
|
-
var rowId = String(dataItemKeyValue ? dataItemKeyValue : item.level.join('.'));
|
|
466
|
-
var isRowExpanded = _this.expanded(item.dataItem);
|
|
467
|
-
var selectedValue = _this.props.selectedField ? (0, kendo_react_common_1.getNestedValue)(_this.props.selectedField, item.dataItem) : undefined;
|
|
468
|
-
var rowProps = {
|
|
469
|
-
key: rowId,
|
|
470
|
-
level: item.level,
|
|
471
|
-
levels: levels,
|
|
472
|
-
dataItem: item.dataItem,
|
|
473
|
-
selectedField: _this.props.selectedField,
|
|
474
|
-
rowHeight: scrollable === 'virtual' ? item.height : _this.props.rowHeight,
|
|
475
|
-
render: _this.props.rowRender,
|
|
476
|
-
onDrop: _this.onRowDrop,
|
|
477
|
-
onDrag: _this.onRowDrag,
|
|
478
|
-
onClick: function (e) { return _this.rowClick(e, item); },
|
|
479
|
-
onDoubleClick: function (e) { return _this.rowDoubleClick(e, item); },
|
|
480
|
-
onContextMenu: function (e) { return _this.rowContextMenu(e, item); },
|
|
481
|
-
isAltRow: rowIndex % 2 !== 0,
|
|
482
|
-
expanded: isRowExpanded,
|
|
483
|
-
rowIndex: rowIndex,
|
|
484
|
-
ariaRowIndex: rowIndexStart + rowIndex,
|
|
485
|
-
ariaSetSize: item.levelCount,
|
|
486
|
-
ariaPosInSet: item.level[item.level.length - 1] + 1,
|
|
487
|
-
isSelected: typeof selectedValue === 'boolean' && selectedValue
|
|
488
|
-
};
|
|
489
|
-
var EditRow = _this.props.editRow;
|
|
490
|
-
var Row = _this.props.row || TreeListRow_1.TreeListRow;
|
|
491
|
-
var cells = dataRow(item, inEdit, rowId, isRowExpanded, rowIndex, selectedValue);
|
|
492
|
-
return inEdit && EditRow ?
|
|
493
|
-
React.createElement(EditRow, __assign({}, rowProps), cells) :
|
|
494
|
-
React.createElement(Row, __assign({}, rowProps), cells);
|
|
495
|
-
}) || (React.createElement("tr", { className: "k-table-row k-grid-norecords" },
|
|
496
|
-
React.createElement("td", { colSpan: leafColumns.length }, this.props.noRecords || React.createElement(TreeListNoRecords_1.TreeListNoRecords, null))));
|
|
497
|
-
var sorted = function (field) {
|
|
498
|
-
return _this.props.sort && _this.props.sort.some(function (descriptor) { return descriptor.field === field; });
|
|
499
|
-
};
|
|
500
|
-
var colGroups = (React.createElement("colgroup", { ref: function (c) { _this.columnResize.colGroupMain = c; } }, leafColumns.map(function (column, index) { return (React.createElement("col", { key: index.toString(), className: sorted(column.field) ? 'k-sorted' : undefined, style: column.width !== undefined ? { width: column.width } : undefined })); })));
|
|
501
|
-
var virtualScroll = this.props.columnVirtualization || this.props.scrollable === 'virtual';
|
|
502
|
-
var tableUserSelect = this.props.selectable && this.props.selectable.drag ? 'none' : undefined;
|
|
503
|
-
var tableProps = (this.props.tableProps || {});
|
|
504
|
-
return (React.createElement(kendo_react_data_tools_1.TableKeyboardNavigationContext.Provider, { value: this.contextStateRef.current },
|
|
505
|
-
React.createElement("div", __assign({ style: this.props.style, className: (0, kendo_react_common_1.classNames)('k-grid k-grid-md', this.props.className, { 'k-treelist-scrollable': scrollable !== 'none' }), ref: function (e) { return _this.element = e; }, onScroll: virtualScroll ? this.handleOnScroll : undefined, onKeyDown: this.onKeyDown, onFocus: this.onFocus, "aria-rowcount": total, "aria-colcount": leafColumns.length, role: 'treegrid' }, kendo_react_data_tools_1.tableKeyboardNavigationScopeAttributes),
|
|
506
|
-
this.props.toolbar,
|
|
507
|
-
React.createElement(kendo_react_data_tools_1.TableSelection, { selectable: this.props.selectable, onRelease: this.selectionRelease },
|
|
508
|
-
React.createElement("table", __assign({ className: 'k-table k-table-md k-grid-table' }, tableProps, { style: __assign(__assign({}, (tableProps.style || {})), { userSelect: tableUserSelect }), role: 'presentation' }),
|
|
509
|
-
colGroups,
|
|
510
|
-
header,
|
|
511
|
-
React.createElement("tbody", __assign({ className: 'k-table-tbody' }, kendo_react_data_tools_1.tableKeyboardNavigationBodyAttributes, { role: 'presentation' }), body))),
|
|
512
|
-
this.props.pager && (React.createElement(this.props.pager, { className: "k-grid-pager", total: total, skip: skip, take: take, onPageChange: this.onPageChange })),
|
|
513
|
-
reorderable && (React.createElement(React.Fragment, null,
|
|
514
|
-
React.createElement(kendo_react_data_tools_1.DropClue, { ref: this.dragLogic.refDropElementClue }),
|
|
515
|
-
React.createElement(kendo_react_data_tools_1.DragClue, { ref: this.dragLogic.refDragElementClue }))))));
|
|
516
|
-
};
|
|
517
|
-
Object.defineProperty(TreeList.prototype, "columns", {
|
|
518
|
-
get: function () {
|
|
519
|
-
var shuffledColumns = this.extendedColumn.filter(function (q) { return q.declarationIndex >= 0 && q.parentIndex === -1; });
|
|
520
|
-
var sanitize = function (columns) {
|
|
521
|
-
columns.sort(function (a, b) { return a.declarationIndex - b.declarationIndex; });
|
|
522
|
-
return columns.map(function (column) {
|
|
523
|
-
var declarationIndex = column.declarationIndex, parentIndex = column.parentIndex, depth = column.depth, colSpan = column.colSpan, rowSpan = column.rowSpan, index = column.index, kFirst = column.kFirst, groupable = column.groupable, children = column.children, props = __rest(column, ["declarationIndex", "parentIndex", "depth", "colSpan", "rowSpan", "index", "kFirst", "groupable", "children"]);
|
|
524
|
-
return children.length ? __assign({ children: sanitize(children) }, props) : props;
|
|
525
|
-
});
|
|
526
|
-
};
|
|
527
|
-
return sanitize(shuffledColumns);
|
|
528
|
-
},
|
|
529
|
-
enumerable: false,
|
|
530
|
-
configurable: true
|
|
531
|
-
});
|
|
532
|
-
Object.defineProperty(TreeList.prototype, "flatData", {
|
|
533
|
-
get: function () {
|
|
534
|
-
var _a = this.props, _b = _a.data, data = _b === void 0 ? [] : _b, _c = _a.rowHeight, rowHeight = _c === void 0 ? 0 : _c;
|
|
535
|
-
var offsetTop = 0;
|
|
536
|
-
var itemDataMap = function (_item) {
|
|
537
|
-
var result = { height: rowHeight, offsetTop: offsetTop };
|
|
538
|
-
offsetTop += result.height;
|
|
539
|
-
return result;
|
|
540
|
-
};
|
|
541
|
-
var flattedData = (this.updateOnScroll &&
|
|
542
|
-
this.prevData === data &&
|
|
543
|
-
this.tbodyOffsetTop > 0 &&
|
|
544
|
-
this.flattedData.length) ?
|
|
545
|
-
this.flattedData :
|
|
546
|
-
(0, kendo_react_data_tools_1.flatData)(data, this.expandedSubItems, itemDataMap);
|
|
547
|
-
this.prevData = data;
|
|
548
|
-
this.flattedData = flattedData;
|
|
549
|
-
return flattedData;
|
|
550
|
-
},
|
|
551
|
-
enumerable: false,
|
|
552
|
-
configurable: true
|
|
553
|
-
});
|
|
554
|
-
TreeList.prototype.selectionChange = function (options) {
|
|
555
|
-
if (this.props.onSelectionChange) {
|
|
556
|
-
var event_4 = options.event, item = options.item, dataIndex = options.dataIndex, columnIndex = options.columnIndex;
|
|
557
|
-
var _a = (0, kendo_react_data_tools_1.getSelectionOptions)(this.props.selectable), mode = _a.mode, cell = _a.cell;
|
|
558
|
-
var selectionEvent = __assign(__assign({}, this.getArguments(event_4.syntheticEvent)), { dataItem: item.dataItem, level: item.level, startColIndex: columnIndex, endColIndex: columnIndex, startRowIndex: dataIndex, endRowIndex: dataIndex, dataItems: this.getLeafDataItems(), altKey: false, ctrlKey: false, shiftKey: false, metaKey: false, mode: mode, cell: cell, isDrag: false, componentId: this._treeListId, selectedField: this.props.selectedField || '' });
|
|
559
|
-
this.props.onSelectionChange.call(undefined, selectionEvent);
|
|
560
|
-
}
|
|
561
|
-
};
|
|
562
|
-
TreeList.prototype.raiseDataEvent = function (handler, data, syntheticEvent) {
|
|
563
|
-
var dataStateChange = this.props.onDataStateChange;
|
|
564
|
-
if (handler) {
|
|
565
|
-
handler.call(undefined, __assign(__assign({}, this.getArguments(syntheticEvent)), data));
|
|
566
|
-
}
|
|
567
|
-
else if (dataStateChange) {
|
|
568
|
-
var dataStateEvent = __assign(__assign({}, this.getArguments(syntheticEvent)), { dataState: __assign(__assign({}, this.getDataState()), data) });
|
|
569
|
-
dataStateChange.call(undefined, dataStateEvent);
|
|
570
|
-
}
|
|
571
|
-
};
|
|
572
|
-
TreeList.prototype.getDataState = function () {
|
|
573
|
-
return {
|
|
574
|
-
filter: this.props.filter,
|
|
575
|
-
sort: this.props.sort
|
|
576
|
-
};
|
|
577
|
-
};
|
|
578
|
-
TreeList.prototype.getArguments = function (syntheticEvent) {
|
|
579
|
-
return {
|
|
580
|
-
nativeEvent: syntheticEvent && syntheticEvent.nativeEvent,
|
|
581
|
-
syntheticEvent: syntheticEvent,
|
|
582
|
-
target: this
|
|
583
|
-
};
|
|
584
|
-
};
|
|
585
|
-
/**
|
|
586
|
-
* @hidden
|
|
587
|
-
*/
|
|
588
|
-
TreeList.propTypes = {
|
|
589
|
-
data: PropTypes.array,
|
|
590
|
-
resizable: PropTypes.bool,
|
|
591
|
-
reorderable: PropTypes.bool,
|
|
592
|
-
sortable: PropTypes.oneOfType([
|
|
593
|
-
PropTypes.bool,
|
|
594
|
-
PropTypes.shape({
|
|
595
|
-
mode: PropTypes.oneOf(['single', 'multiple']),
|
|
596
|
-
allowUnsort: PropTypes.bool
|
|
597
|
-
})
|
|
598
|
-
]),
|
|
599
|
-
onSortChange: PropTypes.func,
|
|
600
|
-
sort: PropTypes.array,
|
|
601
|
-
columns: PropTypes.arrayOf(PropTypes.object),
|
|
602
|
-
columnVirtualization: PropTypes.bool,
|
|
603
|
-
filter: PropTypes.array,
|
|
604
|
-
onFilterChange: PropTypes.func,
|
|
605
|
-
filterRow: PropTypes.any,
|
|
606
|
-
toolbar: PropTypes.any,
|
|
607
|
-
noRecords: PropTypes.any,
|
|
608
|
-
onExpandChange: PropTypes.func,
|
|
609
|
-
expandField: PropTypes.string,
|
|
610
|
-
subItemsField: PropTypes.string,
|
|
611
|
-
selectedField: PropTypes.string,
|
|
612
|
-
onSelectionChange: PropTypes.func,
|
|
613
|
-
onHeaderSelectionChange: PropTypes.func,
|
|
614
|
-
onRowClick: PropTypes.func,
|
|
615
|
-
onItemChange: PropTypes.func,
|
|
616
|
-
editField: PropTypes.string,
|
|
617
|
-
scrollable: PropTypes.oneOf(['none', 'scrollable', 'virtual']),
|
|
618
|
-
rowHeight: PropTypes.number,
|
|
619
|
-
style: PropTypes.object,
|
|
620
|
-
tableProps: PropTypes.object,
|
|
621
|
-
pager: PropTypes.any,
|
|
622
|
-
skip: PropTypes.number,
|
|
623
|
-
take: PropTypes.number,
|
|
624
|
-
onPageChange: PropTypes.func,
|
|
625
|
-
onDataStateChange: PropTypes.func,
|
|
626
|
-
onColumnResize: PropTypes.func,
|
|
627
|
-
onColumnReorder: PropTypes.func,
|
|
628
|
-
dataItemKey: PropTypes.string,
|
|
629
|
-
navigatable: PropTypes.bool
|
|
630
|
-
};
|
|
631
|
-
/** @hidden */
|
|
632
|
-
TreeList.contextType = kendo_react_data_tools_1.TableKeyboardNavigationContext;
|
|
633
|
-
return TreeList;
|
|
634
|
-
}(React.Component));
|
|
635
|
-
exports.TreeList = TreeList;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { TreeListNoRecordsProps } from './interfaces/TreeListNoRecordsProps';
|
|
3
|
-
/**
|
|
4
|
-
* Represents the TreeListNoRecords component.
|
|
5
|
-
* The component is rendered when the `data` property of the TreeList is an empty array or undefined.
|
|
6
|
-
*/
|
|
7
|
-
export declare class TreeListNoRecords extends React.Component<TreeListNoRecordsProps, {}> {
|
|
8
|
-
/**
|
|
9
|
-
* @hidden
|
|
10
|
-
*/
|
|
11
|
-
render(): any;
|
|
12
|
-
}
|