@elliemae/ds-treeview 2.0.0-next.7 → 2.0.0-rc.2
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/cjs/TreeView.js +5 -0
- package/cjs/deprecated/TreeView.js +5 -0
- package/cjs/deprecated/__testUtils__/utils.js +9 -1
- package/cjs/deprecated/plugins/dnd/TreeDndPlugin.js +14 -8
- package/cjs/deprecated/plugins/dnd/renderers/DraggableItem.js +7 -3
- package/cjs/deprecated/plugins/dnd/renderers/DroppableList.js +20 -15
- package/cjs/deprecated/plugins/dnd/utils.js +41 -34
- package/cjs/deprecated/plugins/roving/TreeRovingPlugin.js +12 -3
- package/cjs/deprecated/plugins/searchable/SearchableTreePlugin.js +5 -3
- package/cjs/deprecated/plugins/selectable/SelectablePluginTree.js +52 -33
- package/cjs/deprecated/plugins/toolbar/TreeToolbarPlugin.js +11 -7
- package/cjs/deprecated/plugins/tree/TreeDataPlugin.js +38 -28
- package/cjs/deprecated/plugins/tree/useExpandTreeState.js +8 -5
- package/cjs/deprecated/plugins/tree/utils.js +17 -4
- package/cjs/deprecated/plugins/tree/walkTreeStrategy.js +11 -9
- package/cjs/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +24 -10
- package/cjs/deprecated/renderers.js +16 -8
- package/cjs/parts/CheckboxSelectable.js +7 -3
- package/cjs/parts/ExpandCaret.js +10 -10
- package/cjs/parts/Icon.js +2 -2
- package/cjs/parts/NestingSpace.js +5 -0
- package/cjs/parts/RadioSelectable.js +2 -3
- package/cjs/parts/TreeItem.js +29 -19
- package/cjs/parts/TreeItemText.js +12 -9
- package/cjs/parts/TreeList.js +17 -7
- package/cjs/related-components/TreeViewSearchBar.js +2 -2
- package/cjs/utils/dnd-helpers.js +29 -25
- package/cjs/utils/group-expands-helpers.js +7 -5
- package/cjs/utils/keyboard-helpers.js +6 -3
- package/cjs/utils/object-helpers.js +8 -0
- package/cjs/utils/refs-helpers.js +11 -1
- package/cjs/utils/selectable-helper.js +9 -2
- package/cjs/utils/tree-helpers.js +26 -8
- package/cjs/utils/useDnDHelpers.js +18 -12
- package/cjs/utils/useInstanceRefActions.js +13 -10
- package/cjs/utils/useTree.js +5 -0
- package/esm/TreeView.js +5 -0
- package/esm/deprecated/TreeView.js +5 -0
- package/esm/deprecated/__testUtils__/utils.js +9 -1
- package/esm/deprecated/plugins/dnd/TreeDndPlugin.js +13 -7
- package/esm/deprecated/plugins/dnd/renderers/DraggableItem.js +6 -1
- package/esm/deprecated/plugins/dnd/renderers/DroppableList.js +17 -11
- package/esm/deprecated/plugins/dnd/utils.js +34 -27
- package/esm/deprecated/plugins/roving/TreeRovingPlugin.js +11 -2
- package/esm/deprecated/plugins/searchable/SearchableTreePlugin.js +4 -1
- package/esm/deprecated/plugins/selectable/SelectablePluginTree.js +44 -22
- package/esm/deprecated/plugins/toolbar/TreeToolbarPlugin.js +8 -3
- package/esm/deprecated/plugins/tree/TreeDataPlugin.js +28 -16
- package/esm/deprecated/plugins/tree/useExpandTreeState.js +6 -2
- package/esm/deprecated/plugins/tree/utils.js +17 -4
- package/esm/deprecated/plugins/tree/walkTreeStrategy.js +11 -9
- package/esm/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +24 -10
- package/esm/deprecated/renderers.js +16 -8
- package/esm/parts/CheckboxSelectable.js +7 -2
- package/esm/parts/ExpandCaret.js +8 -6
- package/esm/parts/Icon.js +1 -1
- package/esm/parts/NestingSpace.js +5 -0
- package/esm/parts/RadioSelectable.js +2 -2
- package/esm/parts/TreeItem.js +29 -18
- package/esm/parts/TreeItemText.js +10 -7
- package/esm/parts/TreeList.js +16 -6
- package/esm/related-components/TreeViewSearchBar.js +1 -1
- package/esm/utils/dnd-helpers.js +29 -25
- package/esm/utils/group-expands-helpers.js +7 -5
- package/esm/utils/keyboard-helpers.js +6 -3
- package/esm/utils/object-helpers.js +8 -0
- package/esm/utils/refs-helpers.js +11 -1
- package/esm/utils/selectable-helper.js +9 -2
- package/esm/utils/tree-helpers.js +26 -8
- package/esm/utils/useDnDHelpers.js +18 -12
- package/esm/utils/useInstanceRefActions.js +13 -10
- package/esm/utils/useTree.js +5 -0
- package/package.json +11 -10
- package/types/deprecated/plugins/tree/useExpandTreeState.d.ts +12 -2
|
@@ -1,7 +1,11 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
|
-
import { cx, set, get, cloneDeep, arrayMove } from '@elliemae/ds-utilities
|
|
4
|
-
import { mergeRefs } from '@elliemae/ds-utilities/system';
|
|
8
|
+
import { cx, mergeRefs, set, get, cloneDeep, arrayMove } from '@elliemae/ds-utilities';
|
|
5
9
|
|
|
6
10
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
7
11
|
|
|
@@ -56,7 +60,8 @@ const isSourceBeforeTarget = (sourcePath, targetPath) => {
|
|
|
56
60
|
|
|
57
61
|
return sourceIsBeforeTarget;
|
|
58
62
|
};
|
|
59
|
-
const updateTargetPath = (sourcePath, targetPath
|
|
63
|
+
const updateTargetPath = function (sourcePath, targetPath) {
|
|
64
|
+
let incr = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : -1;
|
|
60
65
|
const nextTargetPath = [...targetPath];
|
|
61
66
|
const posToUpdate = sourcePath.length ? sourcePath.length - 1 : 0;
|
|
62
67
|
nextTargetPath.splice(posToUpdate, 1, targetPath[posToUpdate] + incr);
|
|
@@ -68,24 +73,25 @@ const getTreePosition = recordPath => ({
|
|
|
68
73
|
parentPath: getParentPath(recordPath),
|
|
69
74
|
index: recordPath.slice(-1)[0]
|
|
70
75
|
});
|
|
71
|
-
const changePositionBetweenDifferentArrays =
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
76
|
+
const changePositionBetweenDifferentArrays = _ref => {
|
|
77
|
+
let {
|
|
78
|
+
sourceTreePosition,
|
|
79
|
+
// already extracted sourceRecord.path
|
|
80
|
+
targetTreePosition,
|
|
81
|
+
// already extracted targetRecord.path
|
|
82
|
+
// combineWith the element we want to append to the children of (this is null when the drag doesn't result in adding children)
|
|
83
|
+
combineWith,
|
|
84
|
+
sourceRecord,
|
|
85
|
+
// what we are dragging
|
|
86
|
+
targetRecord,
|
|
87
|
+
// what we are dropping on top of
|
|
88
|
+
down,
|
|
89
|
+
// ???
|
|
90
|
+
data,
|
|
91
|
+
// tree before dragEnd changes
|
|
92
|
+
childrenKey = 'children' // constant -> 'children'
|
|
93
|
+
|
|
94
|
+
} = _ref;
|
|
89
95
|
let nextTreeData = cloneDeep(data);
|
|
90
96
|
if (!sourceRecord || !sourceRecord.data) throw new Error('error while dragging, no dragged item received');
|
|
91
97
|
const sourceTreeChildren = getParentChildrenByPath(nextTreeData, sourceTreePosition.parentPath); // When moving an item we remove the item from it's former parent children array
|
|
@@ -115,12 +121,13 @@ const changePositionBetweenDifferentArrays = ({
|
|
|
115
121
|
return nextTreeData;
|
|
116
122
|
};
|
|
117
123
|
const combineWithTarget = () => {};
|
|
118
|
-
const changePositionSameArray =
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
+
const changePositionSameArray = _ref2 => {
|
|
125
|
+
let {
|
|
126
|
+
targetTreePosition,
|
|
127
|
+
sourceRecord,
|
|
128
|
+
targetRecord,
|
|
129
|
+
data
|
|
130
|
+
} = _ref2;
|
|
124
131
|
let nextTreeData = cloneDeep(data);
|
|
125
132
|
const targetTreeChildren = getParentChildrenByPath(nextTreeData, targetTreePosition.parentPath);
|
|
126
133
|
const nextChildren = arrayMove(targetTreeChildren, sourceRecord.index, targetRecord.index); // mutates the tree. That's the reason of the clone above
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
8
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
@@ -5,7 +10,7 @@ import 'core-js/modules/web.dom-collections.iterator.js';
|
|
|
5
10
|
import { useState, useMemo, useRef } from 'react';
|
|
6
11
|
import FocusGroupProvider from '@elliemae/ds-shared/FocusGroup/FocusGroupManager';
|
|
7
12
|
import useFocusGroupItem from '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
|
|
8
|
-
import { mergeRefs } from '@elliemae/ds-utilities
|
|
13
|
+
import { mergeRefs } from '@elliemae/ds-utilities';
|
|
9
14
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
10
15
|
import { jsx } from 'react/jsx-runtime';
|
|
11
16
|
|
|
@@ -58,9 +63,13 @@ const TreeRovingPlugin = createInstancePlugin('tree-data', {
|
|
|
58
63
|
|
|
59
64
|
if (instance !== null && instance !== void 0 && (_instance$props = instance.props) !== null && _instance$props !== void 0 && _instance$props.onItemFocus) {
|
|
60
65
|
instance.props.onItemFocus({
|
|
61
|
-
scrollToItem: (
|
|
66
|
+
scrollToItem: function () {
|
|
62
67
|
var _props$listRef, _props$listRef$curren;
|
|
63
68
|
|
|
69
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
70
|
+
args[_key] = arguments[_key];
|
|
71
|
+
}
|
|
72
|
+
|
|
64
73
|
return props === null || props === void 0 ? void 0 : (_props$listRef = props.listRef) === null || _props$listRef === void 0 ? void 0 : (_props$listRef$curren = _props$listRef.current) === null || _props$listRef$curren === void 0 ? void 0 : _props$listRef$curren.scrollToItem(args);
|
|
65
74
|
},
|
|
66
75
|
itemIndex: props === null || props === void 0 ? void 0 : props.index
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
4
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
2
5
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
3
6
|
import Highlighter from 'react-highlight-words';
|
|
4
7
|
import 'react';
|
|
5
|
-
import usePrevious from '@elliemae/ds-utilities
|
|
8
|
+
import { usePrevious } from '@elliemae/ds-utilities';
|
|
6
9
|
|
|
7
10
|
const markParentsAsChildMatch = record => {
|
|
8
11
|
let currRecord = record;
|
|
@@ -1,11 +1,16 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
3
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
4
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
5
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
6
|
+
import 'core-js/modules/esnext.async-iterator.reduce.js';
|
|
7
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
8
|
+
import 'core-js/modules/esnext.iterator.reduce.js';
|
|
9
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
10
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
11
|
import { useMemo, useCallback } from 'react';
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import { cx, isFunction } from '@elliemae/ds-utilities/utils';
|
|
8
|
-
import useDerivedStateFromProps from '@elliemae/ds-utilities/hooks/useDerivedStateFromProps';
|
|
12
|
+
import { DSCheckbox, DSRadio } from '@elliemae/ds-form';
|
|
13
|
+
import { cx, useDerivedStateFromProps, isFunction } from '@elliemae/ds-utilities';
|
|
9
14
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
10
15
|
import { walkTreeStrategy } from '../tree/walkTreeStrategy.js';
|
|
11
16
|
import { getParentId, getParentChildren } from '../tree/utils.js';
|
|
@@ -16,12 +21,13 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
16
21
|
|
|
17
22
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
18
23
|
|
|
19
|
-
const updateParentState =
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
24
|
+
const updateParentState = _ref => {
|
|
25
|
+
let {
|
|
26
|
+
node,
|
|
27
|
+
checked,
|
|
28
|
+
selectionState,
|
|
29
|
+
isCurrentParentChildren = true
|
|
30
|
+
} = _ref;
|
|
25
31
|
const {
|
|
26
32
|
parentNode
|
|
27
33
|
} = node;
|
|
@@ -73,10 +79,16 @@ const useSelectableTreeState = instance => {
|
|
|
73
79
|
|
|
74
80
|
return 'mixed';
|
|
75
81
|
}, [selection]);
|
|
76
|
-
const select = useCallback((record
|
|
82
|
+
const select = useCallback(function (record) {
|
|
83
|
+
let additionalActions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
84
|
+
|
|
77
85
|
if (isFunction(onSelect)) {
|
|
78
86
|
onSelect(record.data, {
|
|
79
|
-
scrollToItem: (
|
|
87
|
+
scrollToItem: function () {
|
|
88
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
89
|
+
args[_key] = arguments[_key];
|
|
90
|
+
}
|
|
91
|
+
|
|
80
92
|
if (additionalActions.scrollToItem) additionalActions.scrollToItem(args);
|
|
81
93
|
},
|
|
82
94
|
itemIndex: additionalActions === null || additionalActions === void 0 ? void 0 : additionalActions.itemIndex
|
|
@@ -118,7 +130,11 @@ const useSelectableTreeState = instance => {
|
|
|
118
130
|
}
|
|
119
131
|
|
|
120
132
|
onSelectionChange(nextSelectionState, record.data, {
|
|
121
|
-
scrollToItem: (
|
|
133
|
+
scrollToItem: function () {
|
|
134
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
135
|
+
args[_key2] = arguments[_key2];
|
|
136
|
+
}
|
|
137
|
+
|
|
122
138
|
if (additionalActions.scrollToItem) additionalActions.scrollToItem(args);
|
|
123
139
|
},
|
|
124
140
|
itemIndex: additionalActions === null || additionalActions === void 0 ? void 0 : additionalActions.itemIndex
|
|
@@ -180,9 +196,10 @@ const SelectablePluginTree = createInstancePlugin('selectable', {
|
|
|
180
196
|
return record;
|
|
181
197
|
},
|
|
182
198
|
|
|
183
|
-
getItemProps(props, instance, {
|
|
184
|
-
|
|
185
|
-
|
|
199
|
+
getItemProps(props, instance, _ref3) {
|
|
200
|
+
let {
|
|
201
|
+
record
|
|
202
|
+
} = _ref3;
|
|
186
203
|
const {
|
|
187
204
|
actions: {
|
|
188
205
|
select
|
|
@@ -196,15 +213,19 @@ const SelectablePluginTree = createInstancePlugin('selectable', {
|
|
|
196
213
|
} = instance.getInstance();
|
|
197
214
|
|
|
198
215
|
const handleSelect = () => select(record, {
|
|
199
|
-
scrollToItem: (
|
|
216
|
+
scrollToItem: function () {
|
|
200
217
|
var _props$listRef, _props$listRef$curren;
|
|
201
218
|
|
|
219
|
+
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
220
|
+
args[_key3] = arguments[_key3];
|
|
221
|
+
}
|
|
222
|
+
|
|
202
223
|
return props === null || props === void 0 ? void 0 : (_props$listRef = props.listRef) === null || _props$listRef === void 0 ? void 0 : (_props$listRef$curren = _props$listRef.current) === null || _props$listRef$curren === void 0 ? void 0 : _props$listRef$curren.scrollToItem(args);
|
|
203
224
|
},
|
|
204
225
|
itemIndex: props === null || props === void 0 ? void 0 : props.index
|
|
205
226
|
});
|
|
206
227
|
|
|
207
|
-
const checkboxAddon = isMultiSelect && /*#__PURE__*/_jsx(
|
|
228
|
+
const checkboxAddon = isMultiSelect && /*#__PURE__*/_jsx(DSCheckbox, {
|
|
208
229
|
checked: record.checked,
|
|
209
230
|
disabled: record.isGroup ? disableGroups : disableLeafs,
|
|
210
231
|
className: "tree-item-checkbox",
|
|
@@ -213,7 +234,7 @@ const SelectablePluginTree = createInstancePlugin('selectable', {
|
|
|
213
234
|
tabIndex: -1
|
|
214
235
|
});
|
|
215
236
|
|
|
216
|
-
const radioAddon = isSingleSelect && !isMultiSelect && /*#__PURE__*/_jsx(
|
|
237
|
+
const radioAddon = isSingleSelect && !isMultiSelect && /*#__PURE__*/_jsx(DSRadio, {
|
|
217
238
|
checked: !!record.checked,
|
|
218
239
|
disabled: record.isGroup ? disableGroups : disableLeafs,
|
|
219
240
|
className: "tree-item-radio",
|
|
@@ -239,9 +260,10 @@ const SelectablePluginTree = createInstancePlugin('selectable', {
|
|
|
239
260
|
hotKeys(grid) {
|
|
240
261
|
return {
|
|
241
262
|
key: 'space',
|
|
242
|
-
handler:
|
|
243
|
-
|
|
244
|
-
|
|
263
|
+
handler: _ref4 => {
|
|
264
|
+
let {
|
|
265
|
+
index
|
|
266
|
+
} = _ref4;
|
|
245
267
|
const {
|
|
246
268
|
records,
|
|
247
269
|
actions: {
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
3
8
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
4
9
|
import { useMemo, useContext, useRef } from 'react';
|
|
5
|
-
import MoreOptionsVert from '@elliemae/ds-icons
|
|
6
|
-
import Button from '@elliemae/ds-
|
|
7
|
-
import { runAll } from '@elliemae/ds-utilities
|
|
10
|
+
import { MoreOptionsVert } from '@elliemae/ds-icons';
|
|
11
|
+
import Button from '@elliemae/ds-button';
|
|
12
|
+
import { runAll } from '@elliemae/ds-utilities';
|
|
8
13
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
9
14
|
import ToolbarProvider, { ToolbarContext } from '@elliemae/ds-shared/toolbar/ToolbarProvider';
|
|
10
15
|
import FocusGroupContext from '@elliemae/ds-shared/FocusGroup/FocusGroupContext';
|
|
@@ -1,11 +1,19 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
3
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
4
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
5
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
7
|
+
import 'core-js/modules/esnext.async-iterator.some.js';
|
|
8
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
9
|
+
import 'core-js/modules/esnext.iterator.some.js';
|
|
3
10
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
11
|
+
import 'core-js/modules/esnext.async-iterator.find.js';
|
|
12
|
+
import 'core-js/modules/esnext.iterator.find.js';
|
|
4
13
|
import React, { useCallback } from 'react';
|
|
5
|
-
import { cx, isFunction } from '@elliemae/ds-utilities
|
|
6
|
-
import Button from '@elliemae/ds-
|
|
7
|
-
import ArrowheadDown from '@elliemae/ds-icons
|
|
8
|
-
import ArrowheadRight from '@elliemae/ds-icons/ArrowheadRight';
|
|
14
|
+
import { cx, isFunction } from '@elliemae/ds-utilities';
|
|
15
|
+
import Button from '@elliemae/ds-button';
|
|
16
|
+
import { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';
|
|
9
17
|
import { aggregatedClasses } from '@elliemae/ds-classnames';
|
|
10
18
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
11
19
|
import { walkTreeStrategy } from './walkTreeStrategy.js';
|
|
@@ -80,9 +88,10 @@ const TreePluginList = createInstancePlugin('tree-data', {
|
|
|
80
88
|
}));
|
|
81
89
|
},
|
|
82
90
|
|
|
83
|
-
getItemProps(props, instance, {
|
|
84
|
-
|
|
85
|
-
|
|
91
|
+
getItemProps(props, instance, _ref) {
|
|
92
|
+
let {
|
|
93
|
+
record
|
|
94
|
+
} = _ref;
|
|
86
95
|
const {
|
|
87
96
|
nestingLevel
|
|
88
97
|
} = record;
|
|
@@ -159,9 +168,10 @@ const TreePluginList = createInstancePlugin('tree-data', {
|
|
|
159
168
|
},
|
|
160
169
|
|
|
161
170
|
hotKeys(instance) {
|
|
162
|
-
function handleExpand({
|
|
163
|
-
|
|
164
|
-
|
|
171
|
+
function handleExpand(_ref2) {
|
|
172
|
+
let {
|
|
173
|
+
index
|
|
174
|
+
} = _ref2;
|
|
165
175
|
const {
|
|
166
176
|
records,
|
|
167
177
|
actions: {
|
|
@@ -172,9 +182,10 @@ const TreePluginList = createInstancePlugin('tree-data', {
|
|
|
172
182
|
if (record && record.data.children.length > 0) _toggleExpand(record.data);
|
|
173
183
|
}
|
|
174
184
|
|
|
175
|
-
function handleCollapse({
|
|
176
|
-
|
|
177
|
-
|
|
185
|
+
function handleCollapse(_ref3) {
|
|
186
|
+
let {
|
|
187
|
+
index
|
|
188
|
+
} = _ref3;
|
|
178
189
|
const {
|
|
179
190
|
records,
|
|
180
191
|
actions: {
|
|
@@ -226,9 +237,10 @@ const TreePluginList = createInstancePlugin('tree-data', {
|
|
|
226
237
|
handler: handleCollapse
|
|
227
238
|
}, {
|
|
228
239
|
key: 'enter',
|
|
229
|
-
handler:
|
|
230
|
-
|
|
231
|
-
|
|
240
|
+
handler: _ref4 => {
|
|
241
|
+
let {
|
|
242
|
+
index
|
|
243
|
+
} = _ref4;
|
|
232
244
|
const {
|
|
233
245
|
records,
|
|
234
246
|
actions: {
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
8
|
import { useRef, useState, useEffect } from 'react';
|
|
4
|
-
import useExpandState from '@elliemae/ds-utilities
|
|
5
|
-
import { isFunction } from '@elliemae/ds-utilities/utils';
|
|
9
|
+
import { useExpandState, isFunction } from '@elliemae/ds-utilities';
|
|
6
10
|
import { walkTreeStrategy } from './walkTreeStrategy.js';
|
|
7
11
|
|
|
8
12
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -1,12 +1,25 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.find.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.find.js';
|
|
1
4
|
import get from 'lodash/get';
|
|
2
5
|
|
|
3
6
|
const getParentId = record => get(record, ['parentNode', 'id']);
|
|
4
7
|
const findItemOnDocument = id => document.querySelector("[data-id=\"".concat(id, "\"]"));
|
|
5
8
|
const getListFromDocument = () => document.querySelector("[data-testid=\"tree-list\"]");
|
|
6
|
-
const getParentChildren = (record
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
9
|
+
const getParentChildren = function (record) {
|
|
10
|
+
let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
|
|
11
|
+
return get(record, ['parentNode', 'data', childrenKey]);
|
|
12
|
+
};
|
|
13
|
+
const getItemLabel = function (record) {
|
|
14
|
+
let nameKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'name';
|
|
15
|
+
return get(record, ['data', nameKey]);
|
|
16
|
+
};
|
|
17
|
+
const getItemChildren = function (record) {
|
|
18
|
+
let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
|
|
19
|
+
return get(record, ['data', childrenKey]);
|
|
20
|
+
};
|
|
21
|
+
const getItemChildrenLength = function (record) {
|
|
22
|
+
let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
|
|
10
23
|
const children = get(record, ['data', childrenKey]);
|
|
11
24
|
return children && children.length;
|
|
12
25
|
};
|
|
@@ -5,15 +5,17 @@ function getPath(parentNode, index, childrenKey) {
|
|
|
5
5
|
return [...parentNode.path, childrenKey, index];
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
function walkTreeStrategy({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
8
|
+
function walkTreeStrategy(_ref) {
|
|
9
|
+
let {
|
|
10
|
+
data,
|
|
11
|
+
childrenKey = 'children',
|
|
12
|
+
level = 0,
|
|
13
|
+
getId = item => item.id,
|
|
14
|
+
parentNode,
|
|
15
|
+
shouldWalkChildren = () => true,
|
|
16
|
+
cb
|
|
17
|
+
} = _ref;
|
|
18
|
+
|
|
17
19
|
// eslint-disable-next-line no-plusplus
|
|
18
20
|
for (let i = 0; i < data.length; i++) {
|
|
19
21
|
const currLevel = level + 1;
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
8
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
@@ -49,11 +54,12 @@ function areEqualRecords(prevProps, nextProps) {
|
|
|
49
54
|
// https://react-window.now.sh/#/examples/list/memoized-list-items
|
|
50
55
|
|
|
51
56
|
|
|
52
|
-
const VirtualizedTreeItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(({
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
+
const VirtualizedTreeItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
58
|
+
let {
|
|
59
|
+
index,
|
|
60
|
+
style,
|
|
61
|
+
data
|
|
62
|
+
} = _ref;
|
|
57
63
|
const {
|
|
58
64
|
instance,
|
|
59
65
|
records,
|
|
@@ -84,13 +90,13 @@ const VirtualizedTreeItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardR
|
|
|
84
90
|
}));
|
|
85
91
|
}), areEqualRecords); // eslint-disable-next-line react/display-name
|
|
86
92
|
|
|
87
|
-
const VirtualizedTree = (renderers, instance) =>
|
|
93
|
+
const VirtualizedTree = (renderers, instance) => _ref2 => {
|
|
88
94
|
let {
|
|
89
95
|
records,
|
|
90
96
|
itemRenderer,
|
|
91
97
|
innerRef
|
|
92
|
-
} =
|
|
93
|
-
rest = _objectWithoutProperties(
|
|
98
|
+
} = _ref2,
|
|
99
|
+
rest = _objectWithoutProperties(_ref2, _excluded);
|
|
94
100
|
|
|
95
101
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
96
102
|
const {
|
|
@@ -152,17 +158,25 @@ const TreeVirtualizationPlugin = createInstancePlugin('tree-virtualization', {
|
|
|
152
158
|
listRef
|
|
153
159
|
},
|
|
154
160
|
actions: {
|
|
155
|
-
scrollTo: (
|
|
161
|
+
scrollTo: function () {
|
|
156
162
|
var _listRef$current;
|
|
157
163
|
|
|
158
164
|
if (listRef !== null && listRef !== void 0 && (_listRef$current = listRef.current) !== null && _listRef$current !== void 0 && _listRef$current.scrollTo) {
|
|
165
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
166
|
+
args[_key] = arguments[_key];
|
|
167
|
+
}
|
|
168
|
+
|
|
159
169
|
listRef.current.scrollTo(args);
|
|
160
170
|
}
|
|
161
171
|
},
|
|
162
|
-
scrollToItem: (
|
|
172
|
+
scrollToItem: function () {
|
|
163
173
|
var _listRef$current2;
|
|
164
174
|
|
|
165
175
|
if (listRef !== null && listRef !== void 0 && (_listRef$current2 = listRef.current) !== null && _listRef$current2 !== void 0 && _listRef$current2.scrollToItem) {
|
|
176
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
177
|
+
args[_key2] = arguments[_key2];
|
|
178
|
+
}
|
|
179
|
+
|
|
166
180
|
listRef.current.scrollToItem(args);
|
|
167
181
|
}
|
|
168
182
|
}
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
3
8
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
@@ -21,22 +26,25 @@ const TreeListItemAddonsWrapper = aggregatedClasses('div')(treeItemBlockName, 'a
|
|
|
21
26
|
const TreeList = aggregatedClasses('ul', {
|
|
22
27
|
'data-testid': treeListBlockName,
|
|
23
28
|
role: 'tree'
|
|
24
|
-
})(treeListBlockName, null,
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
+
})(treeListBlockName, null, _ref => {
|
|
30
|
+
let {
|
|
31
|
+
rowSize
|
|
32
|
+
} = _ref;
|
|
33
|
+
return {
|
|
34
|
+
["rowsize-".concat(rowSize)]: rowSize
|
|
35
|
+
};
|
|
36
|
+
});
|
|
29
37
|
const TreeListNoItems = aggregatedClasses('div', {
|
|
30
38
|
'data-testid': treeListNoItemsBn
|
|
31
39
|
})(treeListNoItemsBn);
|
|
32
40
|
|
|
33
|
-
function TreeItem(
|
|
41
|
+
function TreeItem(_ref2) {
|
|
34
42
|
let {
|
|
35
43
|
leftAddons,
|
|
36
44
|
rightAddons,
|
|
37
45
|
children
|
|
38
|
-
} =
|
|
39
|
-
rest = _objectWithoutProperties(
|
|
46
|
+
} = _ref2,
|
|
47
|
+
rest = _objectWithoutProperties(_ref2, _excluded);
|
|
40
48
|
|
|
41
49
|
return /*#__PURE__*/jsxs(TreeListItem, _objectSpread(_objectSpread({}, rest), {}, {
|
|
42
50
|
children: [leftAddons && /*#__PURE__*/_jsx(TreeListItemAddonsWrapper, {}, void 0, leftAddons), children, rightAddons && /*#__PURE__*/_jsx(TreeListItemAddonsWrapper, {}, void 0, rightAddons)]
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
8
|
import { useContext, useCallback, useMemo } from 'react';
|
|
4
|
-
import
|
|
9
|
+
import { DSCheckbox } from '@elliemae/ds-form';
|
|
5
10
|
import styled from 'styled-components';
|
|
6
11
|
import TreeViewContext from '../TreeViewContext.js';
|
|
7
12
|
import { toggleCheckboxItem } from '../utils/selectable-helper.js';
|
|
@@ -62,7 +67,7 @@ function CheckboxSelectable(props) {
|
|
|
62
67
|
|
|
63
68
|
return false;
|
|
64
69
|
}, [selectedCheckboxes, id]);
|
|
65
|
-
return /*#__PURE__*/_jsx(StyledCheckboxWrapper, {}, void 0, /*#__PURE__*/_jsx(
|
|
70
|
+
return /*#__PURE__*/_jsx(StyledCheckboxWrapper, {}, void 0, /*#__PURE__*/_jsx(DSCheckbox, {
|
|
66
71
|
checked: isChecked,
|
|
67
72
|
disabled: item.isGroup ? disableGroups : disableLeafs,
|
|
68
73
|
className: "em-ds-tree-item-checkbox",
|
package/esm/parts/ExpandCaret.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import { useCallback, useContext } from 'react';
|
|
3
|
-
import Button from '@elliemae/ds-
|
|
4
|
-
import ArrowheadDown from '@elliemae/ds-icons
|
|
5
|
-
import ArrowheadRight from '@elliemae/ds-icons/ArrowheadRight';
|
|
3
|
+
import Button from '@elliemae/ds-button';
|
|
4
|
+
import { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';
|
|
6
5
|
import { toggleItemExpand } from '../utils/group-expands-helpers.js';
|
|
7
6
|
import { focusItem } from '../utils/tree-helpers.js';
|
|
8
7
|
import TreeViewContext from '../TreeViewContext.js';
|
|
@@ -56,9 +55,12 @@ const ExpandCaret = props => {
|
|
|
56
55
|
setLatestToggledItem(item);
|
|
57
56
|
onItemFocus({
|
|
58
57
|
itemIndex: item.virtualIndex,
|
|
59
|
-
scrollToItem: (
|
|
60
|
-
|
|
61
|
-
|
|
58
|
+
scrollToItem: function () {
|
|
59
|
+
let opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
|
60
|
+
align: 'start'
|
|
61
|
+
};
|
|
62
|
+
return scrollToIndex(item.virtualIndex, opts);
|
|
63
|
+
},
|
|
62
64
|
item
|
|
63
65
|
});
|
|
64
66
|
setFocusedItem(item);
|
package/esm/parts/Icon.js
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
8
|
import 'react';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import { useContext, useCallback, useMemo } from 'react';
|
|
3
|
-
import
|
|
3
|
+
import { DSRadio } from '@elliemae/ds-form';
|
|
4
4
|
import TreeViewContext from '../TreeViewContext.js';
|
|
5
5
|
|
|
6
6
|
function RadioSelectable(props) {
|
|
@@ -41,7 +41,7 @@ function RadioSelectable(props) {
|
|
|
41
41
|
if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);
|
|
42
42
|
}, [item, id, onSelectionChange, scrollToIndex]);
|
|
43
43
|
const radioName = useMemo(() => "radios-".concat(uniqueTreeViewUUID), [uniqueTreeViewUUID]);
|
|
44
|
-
return /*#__PURE__*/_jsx(
|
|
44
|
+
return /*#__PURE__*/_jsx(DSRadio, {
|
|
45
45
|
checked: selectedCheckboxes[id] === true,
|
|
46
46
|
name: radioName,
|
|
47
47
|
disabled: item.isGroup ? disableGroups : disableLeafs,
|