@elliemae/ds-treeview 2.0.0-alpha.1 → 2.0.0-alpha.13
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 +9 -3
- package/cjs/TreeViewContext.js +1 -1
- package/cjs/config/cssClassesConstants.js +1 -1
- package/cjs/deprecated/TreeView.js +11 -5
- package/cjs/deprecated/__testUtils__/utils.js +13 -4
- package/cjs/deprecated/plugins/dnd/TreeDndPlugin.js +17 -10
- package/cjs/deprecated/plugins/dnd/renderers/DraggableItem.js +13 -8
- package/cjs/deprecated/plugins/dnd/renderers/DroppableList.js +26 -20
- package/cjs/deprecated/plugins/dnd/utils.js +43 -35
- package/cjs/deprecated/plugins/roving/TreeRovingPlugin.js +18 -8
- package/cjs/deprecated/plugins/searchable/SearchableTreePlugin.js +7 -5
- package/cjs/deprecated/plugins/searchable/utils.js +1 -1
- package/cjs/deprecated/plugins/selectable/SelectablePluginTree.js +55 -35
- package/cjs/deprecated/plugins/toolbar/TreeToolbarPlugin.js +18 -14
- package/cjs/deprecated/plugins/tree/TreeDataPlugin.js +51 -40
- package/cjs/deprecated/plugins/tree/useExpandTreeState.js +10 -6
- package/cjs/deprecated/plugins/tree/utils.js +21 -8
- package/cjs/deprecated/plugins/tree/walkTreeStrategy.js +13 -9
- package/cjs/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +27 -13
- package/cjs/deprecated/renderers.js +19 -11
- package/cjs/parts/CheckboxSelectable.js +10 -6
- package/cjs/parts/ChildrenCountDisplayer.js +3 -3
- package/cjs/parts/ExpandCaret.js +14 -14
- package/cjs/parts/Icon.js +4 -4
- package/cjs/parts/NestingSpace.js +8 -3
- package/cjs/parts/RadioSelectable.js +4 -5
- package/cjs/parts/TreeItem.js +44 -33
- package/cjs/parts/TreeItemText.js +27 -24
- package/cjs/parts/TreeList.js +30 -20
- package/cjs/plugins/dnd/TreeDndPlugin.js +2 -2
- package/cjs/prop-types.js +20 -20
- package/cjs/related-components/TreeViewSearchBar.js +2 -2
- package/cjs/utils/array-helpers.js +2 -0
- package/cjs/utils/dnd-helpers.js +29 -25
- package/cjs/utils/group-expands-helpers.js +7 -5
- package/cjs/utils/keyboard-helpers.js +7 -4
- package/cjs/utils/object-helpers.js +8 -0
- package/cjs/utils/refs-helpers.js +11 -1
- package/cjs/utils/selectable-helper.js +10 -3
- package/cjs/utils/tree-helpers.js +27 -9
- package/cjs/utils/useDnDHelpers.js +22 -15
- package/cjs/utils/useInstanceRefActions.js +14 -10
- package/cjs/utils/useTree.js +8 -2
- package/esm/TreeView.js +6 -0
- package/esm/config/cssClassesConstants.js +1 -1
- package/esm/deprecated/TreeView.js +7 -1
- package/esm/deprecated/__testUtils__/utils.js +10 -1
- package/esm/deprecated/plugins/dnd/TreeDndPlugin.js +14 -7
- package/esm/deprecated/plugins/dnd/renderers/DraggableItem.js +9 -3
- package/esm/deprecated/plugins/dnd/renderers/DroppableList.js +18 -11
- package/esm/deprecated/plugins/dnd/utils.js +35 -27
- package/esm/deprecated/plugins/roving/TreeRovingPlugin.js +12 -2
- package/esm/deprecated/plugins/searchable/SearchableTreePlugin.js +4 -1
- package/esm/deprecated/plugins/searchable/utils.js +1 -1
- package/esm/deprecated/plugins/selectable/SelectablePluginTree.js +45 -22
- package/esm/deprecated/plugins/toolbar/TreeToolbarPlugin.js +8 -3
- package/esm/deprecated/plugins/tree/TreeDataPlugin.js +35 -22
- package/esm/deprecated/plugins/tree/useExpandTreeState.js +7 -2
- package/esm/deprecated/plugins/tree/utils.js +19 -6
- package/esm/deprecated/plugins/tree/walkTreeStrategy.js +13 -9
- package/esm/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +24 -10
- package/esm/deprecated/renderers.js +17 -9
- package/esm/parts/CheckboxSelectable.js +7 -2
- package/esm/parts/ChildrenCountDisplayer.js +2 -2
- package/esm/parts/ExpandCaret.js +9 -7
- package/esm/parts/Icon.js +1 -1
- package/esm/parts/NestingSpace.js +6 -1
- package/esm/parts/RadioSelectable.js +3 -3
- package/esm/parts/TreeItem.js +34 -22
- package/esm/parts/TreeItemText.js +16 -13
- package/esm/parts/TreeList.js +25 -15
- package/esm/related-components/TreeViewSearchBar.js +1 -1
- package/esm/utils/array-helpers.js +2 -0
- 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 +27 -9
- package/esm/utils/useDnDHelpers.js +21 -14
- package/esm/utils/useInstanceRefActions.js +14 -10
- package/esm/utils/useTree.js +6 -0
- package/package.json +14 -13
- package/types/TreeView.d.ts +118 -28
- package/types/deprecated/__testUtils__/utils.d.ts +49 -49
- package/types/deprecated/plugins/tree/useExpandTreeState.d.ts +12 -2
- package/types/react-desc-prop-types.d.ts +113 -27
- package/cjs/package.json +0 -7
- package/esm/package.json +0 -7
|
@@ -2,11 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
8
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
9
|
+
require('core-js/modules/esnext.async-iterator.find.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.find.js');
|
|
11
|
+
require('core-js/modules/esnext.async-iterator.every.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.every.js');
|
|
5
13
|
var React = require('react');
|
|
6
14
|
var stringHelpers = require('./string-helpers.js');
|
|
7
15
|
|
|
8
|
-
|
|
9
|
-
|
|
16
|
+
const walkVisibles = function (node, callback) {
|
|
17
|
+
let skipRoot = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
18
|
+
let highlightOnlyQuery = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
10
19
|
const {
|
|
11
20
|
children,
|
|
12
21
|
model
|
|
@@ -28,7 +37,8 @@ const walkVisibles = (node, callback, skipRoot = true, highlightOnlyQuery = fals
|
|
|
28
37
|
});
|
|
29
38
|
}
|
|
30
39
|
};
|
|
31
|
-
const walkParents = (nodePath, callback
|
|
40
|
+
const walkParents = function (nodePath, callback) {
|
|
41
|
+
let skipRoot = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
32
42
|
const parents = [...nodePath].reverse();
|
|
33
43
|
parents.shift(); // remove current node from the parents array
|
|
34
44
|
|
|
@@ -36,7 +46,8 @@ const walkParents = (nodePath, callback, skipRoot = true) => {
|
|
|
36
46
|
|
|
37
47
|
parents.forEach(callback);
|
|
38
48
|
};
|
|
39
|
-
const walkAllNodeChildren = (node, callback
|
|
49
|
+
const walkAllNodeChildren = function (node, callback) {
|
|
50
|
+
let isFirst = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
40
51
|
const {
|
|
41
52
|
children = []
|
|
42
53
|
} = node;
|
|
@@ -54,7 +65,9 @@ const getNodeById = (treeRoot, id) => {
|
|
|
54
65
|
return nodes[0];
|
|
55
66
|
};
|
|
56
67
|
const cloneNode = (tree, node) => tree.parse(node.model);
|
|
57
|
-
const getItemsParentNode = (
|
|
68
|
+
const getItemsParentNode = function () {
|
|
69
|
+
let items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
70
|
+
let skipSameParentCheck = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
58
71
|
if (items.length === 0) throw new Error("Received empty items, can't retrieve parent"); // in case we already know the items compared shares the same parent
|
|
59
72
|
|
|
60
73
|
if (!skipSameParentCheck) if (!itemsShareSameParent(items)) // if we don't know (default, we don't) check if they share the parent
|
|
@@ -71,7 +84,8 @@ const getItemsParentNode = (items = [], skipSameParentCheck = false) => {
|
|
|
71
84
|
const directParentNode = firstExistingItemPath[firstExistingItemPath.length - 2];
|
|
72
85
|
return directParentNode;
|
|
73
86
|
};
|
|
74
|
-
const itemsShareSameParent = (
|
|
87
|
+
const itemsShareSameParent = function () {
|
|
88
|
+
let items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
75
89
|
if (items.length === 0) throw new Error('Received empty items for comparison');
|
|
76
90
|
if (items.length === 1) return true; // when moving in first position we receive [undefined,...{items}]
|
|
77
91
|
// when moving in last position we receive [...{items}, undefined]
|
|
@@ -92,21 +106,25 @@ const itemsShareSameParent = (items = []) => {
|
|
|
92
106
|
return directParentNode === itemDirectParent;
|
|
93
107
|
});
|
|
94
108
|
};
|
|
95
|
-
const getNodeMatchesSearchQuery = (node
|
|
109
|
+
const getNodeMatchesSearchQuery = function (node) {
|
|
110
|
+
let searchQuery = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
96
111
|
const standardizedName = stringHelpers.standardizeSearchQueryString(node.model.name);
|
|
97
112
|
const standardizedSearchQuery = stringHelpers.standardizeSearchQueryString(searchQuery);
|
|
98
113
|
return standardizedName.includes(standardizedSearchQuery);
|
|
99
114
|
};
|
|
100
|
-
const getChildrenMatchesSearchQuery = (parentNode
|
|
115
|
+
const getChildrenMatchesSearchQuery = function (parentNode) {
|
|
116
|
+
let searchQuery = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
101
117
|
let anyChildMatch = false;
|
|
102
118
|
walkAllNodeChildren(parentNode, node => {
|
|
103
119
|
if (getNodeMatchesSearchQuery(node, searchQuery)) anyChildMatch = true;
|
|
104
120
|
});
|
|
105
121
|
return anyChildMatch;
|
|
106
122
|
};
|
|
107
|
-
const enrichNodeModelInPlace = (node
|
|
123
|
+
const enrichNodeModelInPlace = function (node) {
|
|
108
124
|
var _node$model, _node$model$children;
|
|
109
125
|
|
|
126
|
+
let searchQuery = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
127
|
+
let selection = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
|
|
110
128
|
const path = node.getPath();
|
|
111
129
|
const depth = path.length - 1;
|
|
112
130
|
node.model.nodePath = path;
|
|
@@ -2,15 +2,19 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.constructor.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.drop.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.drop.js');
|
|
9
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
5
10
|
var React = require('react');
|
|
6
11
|
var lodash = require('lodash');
|
|
7
12
|
var TreeViewContext = require('../TreeViewContext.js');
|
|
8
13
|
var treeHelpers = require('./tree-helpers.js');
|
|
9
14
|
var dndHelpers = require('./dnd-helpers.js');
|
|
10
15
|
|
|
11
|
-
/* eslint-disable max-depth */
|
|
12
16
|
const useDnDHelpers = () => {
|
|
13
|
-
const ctx = React.useContext(TreeViewContext[
|
|
17
|
+
const ctx = React.useContext(TreeViewContext["default"]);
|
|
14
18
|
const {
|
|
15
19
|
props: {
|
|
16
20
|
data,
|
|
@@ -31,11 +35,12 @@ const useDnDHelpers = () => {
|
|
|
31
35
|
treeRoot,
|
|
32
36
|
draggedItem
|
|
33
37
|
} = ctx;
|
|
34
|
-
const onSortEnd = React.useCallback(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
38
|
+
const onSortEnd = React.useCallback(_ref => {
|
|
39
|
+
let {
|
|
40
|
+
oldIndex,
|
|
41
|
+
newIndex,
|
|
42
|
+
isKeySorting
|
|
43
|
+
} = _ref;
|
|
39
44
|
let newItems = lodash.cloneDeep(data);
|
|
40
45
|
const {
|
|
41
46
|
isBefore,
|
|
@@ -130,13 +135,14 @@ const useDnDHelpers = () => {
|
|
|
130
135
|
// at the top/center/bottom of an element to choose where to move the element
|
|
131
136
|
// requested in the specs
|
|
132
137
|
|
|
133
|
-
const onMouseDragOverItem = React.useCallback(
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
138
|
+
const onMouseDragOverItem = React.useCallback(_ref2 => {
|
|
139
|
+
let {
|
|
140
|
+
event,
|
|
141
|
+
item,
|
|
142
|
+
itemIndex,
|
|
143
|
+
setIsDraggingOverThis,
|
|
144
|
+
openFolderOnHoverTimeout
|
|
145
|
+
} = _ref2;
|
|
140
146
|
const {
|
|
141
147
|
node
|
|
142
148
|
} = item;
|
|
@@ -183,7 +189,8 @@ const useDnDHelpers = () => {
|
|
|
183
189
|
setIsDraggingOverThis(true);
|
|
184
190
|
|
|
185
191
|
if (!(openFolderOnHoverTimeout !== null && openFolderOnHoverTimeout !== void 0 && openFolderOnHoverTimeout.current) && // only set the interval if it wasn't set already once
|
|
186
|
-
(draggedItem === null || draggedItem === void 0 ? void 0 : draggedItem.id) !== (item === null || item === void 0 ? void 0 : item.id) && (
|
|
192
|
+
(draggedItem === null || draggedItem === void 0 ? void 0 : draggedItem.id) !== (item === null || item === void 0 ? void 0 : item.id) && ( // don't open ghost element
|
|
193
|
+
item.isGroup || item.children.length > 0) && // only open groups
|
|
187
194
|
!restrictDragAndDrop) {
|
|
188
195
|
openFolderOnHoverTimeout.current = setTimeout(() => {
|
|
189
196
|
item.node.model.isExpanded = true;
|
|
@@ -2,13 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
5
6
|
var React = require('react');
|
|
6
7
|
var treeHelpers = require('./tree-helpers.js');
|
|
7
8
|
var groupExpandsHelpers = require('./group-expands-helpers.js');
|
|
8
9
|
|
|
9
|
-
const useInstanceRefActions = ({
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
const useInstanceRefActions = (_ref, ctx) => {
|
|
11
|
+
let {
|
|
12
|
+
actions
|
|
13
|
+
} = _ref;
|
|
12
14
|
const {
|
|
13
15
|
props: {
|
|
14
16
|
onItemFocus
|
|
@@ -43,19 +45,21 @@ const useInstanceRefActions = ({
|
|
|
43
45
|
setPromise(p);
|
|
44
46
|
return p;
|
|
45
47
|
}, [promises, treeRoot, triggerTreeRerender, setLatestToggledItem]);
|
|
46
|
-
actions.scrollTo = React.useCallback((indx
|
|
47
|
-
|
|
48
|
-
|
|
48
|
+
actions.scrollTo = React.useCallback(function (indx) {
|
|
49
|
+
let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
|
50
|
+
align: 'start'
|
|
51
|
+
};
|
|
49
52
|
if (scrollToIndex) scrollToIndex(indx, opts);
|
|
50
53
|
}, [scrollToIndex]);
|
|
51
54
|
actions.setSelectedItemByVirtualIndex = React.useCallback(index => {
|
|
52
55
|
const itemByIndex = visibleItems[index];
|
|
53
56
|
setSelectedItem(itemByIndex);
|
|
54
57
|
}, [visibleItems, setSelectedItem]);
|
|
55
|
-
actions.setFocusedItemByVirtualIndex = React.useCallback((index
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
58
|
+
actions.setFocusedItemByVirtualIndex = React.useCallback(function (index) {
|
|
59
|
+
let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
|
60
|
+
align: 'start',
|
|
61
|
+
withScroll: false
|
|
62
|
+
};
|
|
59
63
|
const itemByIndex = visibleItems[index];
|
|
60
64
|
const onItemFocusParams = {
|
|
61
65
|
itemIndex: itemByIndex.virtualIndex,
|
package/cjs/utils/useTree.js
CHANGED
|
@@ -3,6 +3,12 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
7
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
6
12
|
var React = require('react');
|
|
7
13
|
var TreeModel = require('tree-model');
|
|
8
14
|
var lodash = require('lodash');
|
|
@@ -15,14 +21,14 @@ var TreeModel__default = /*#__PURE__*/_interopDefaultLegacy(TreeModel);
|
|
|
15
21
|
|
|
16
22
|
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; }
|
|
17
23
|
|
|
18
|
-
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__default[
|
|
24
|
+
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__default["default"](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; }
|
|
19
25
|
const useTree = (data, props, states) => {
|
|
20
26
|
const {
|
|
21
27
|
setExpandedGroups
|
|
22
28
|
} = states;
|
|
23
29
|
const unfrozenData = React.useMemo(() => lodash.cloneDeep(data), [data]); // convert data into a TreeModel with extra isExpanded prop
|
|
24
30
|
|
|
25
|
-
const tree = React.useMemo(() => new TreeModel__default[
|
|
31
|
+
const tree = React.useMemo(() => new TreeModel__default["default"](), []);
|
|
26
32
|
const [treeData, setTreeData] = React.useState({
|
|
27
33
|
name: '__root',
|
|
28
34
|
isExpanded: true,
|
package/esm/TreeView.js
CHANGED
|
@@ -1,5 +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 _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
8
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
9
|
import { useRef, useState, useEffect } from 'react';
|
|
4
10
|
import { useVirtual } from 'react-virtual';
|
|
5
11
|
import { v4 } from 'uuid';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
const DSTreeViewPrefix = 'em-ds';
|
|
2
2
|
const treeItemBlockName = 'tree-item';
|
|
3
3
|
const treeListBlockName = 'tree-list';
|
|
4
|
-
const treeListNoItemsBn =
|
|
4
|
+
const treeListNoItemsBn = "".concat(treeListBlockName, "-no-items");
|
|
5
5
|
|
|
6
6
|
export { DSTreeViewPrefix, treeItemBlockName, treeListBlockName, treeListNoItemsBn };
|
|
@@ -1,6 +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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
8
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
9
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
4
10
|
import 'react';
|
|
5
11
|
import useDataList from '@elliemae/ds-shared/useDataList';
|
|
6
12
|
import { TreeRenderers } from './renderers.js';
|
|
@@ -48,7 +54,7 @@ function TreeView(_ref) {
|
|
|
48
54
|
return wrapComponentIfExists(Wrapper, /*#__PURE__*/jsx(ListComponent, _objectSpread(_objectSpread({
|
|
49
55
|
records: instance.records
|
|
50
56
|
}, getListProps()), {}, {
|
|
51
|
-
className:
|
|
57
|
+
className: "em-ds-tv-row-size-".concat(rowSize)
|
|
52
58
|
})));
|
|
53
59
|
}
|
|
54
60
|
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
3
|
import 'core-js/modules/esnext.map.delete-all.js';
|
|
4
|
+
import 'core-js/modules/esnext.map.emplace.js';
|
|
4
5
|
import 'core-js/modules/esnext.map.every.js';
|
|
5
6
|
import 'core-js/modules/esnext.map.filter.js';
|
|
6
7
|
import 'core-js/modules/esnext.map.find.js';
|
|
@@ -13,7 +14,13 @@ import 'core-js/modules/esnext.map.merge.js';
|
|
|
13
14
|
import 'core-js/modules/esnext.map.reduce.js';
|
|
14
15
|
import 'core-js/modules/esnext.map.some.js';
|
|
15
16
|
import 'core-js/modules/esnext.map.update.js';
|
|
17
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
18
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
19
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
20
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
16
21
|
import 'core-js/modules/es.string.replace.js';
|
|
22
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
23
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
17
24
|
import 'react';
|
|
18
25
|
import { render } from '@testing-library/react';
|
|
19
26
|
import { treeItemBlockName } from '../renderers.js';
|
|
@@ -40,7 +47,9 @@ const treeItemsToMap = items => {
|
|
|
40
47
|
* @param key
|
|
41
48
|
*/
|
|
42
49
|
|
|
43
|
-
function getTreeItemsFromRender(_ref
|
|
50
|
+
function getTreeItemsFromRender(_ref) {
|
|
51
|
+
let key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : treeItemBlockName;
|
|
52
|
+
|
|
44
53
|
let {
|
|
45
54
|
data,
|
|
46
55
|
plugins
|
|
@@ -1,6 +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';
|
|
7
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
2
8
|
import { useState, useCallback, useMemo } from 'react';
|
|
3
|
-
import { isEqual } from '@elliemae/ds-utilities
|
|
9
|
+
import { isEqual } from '@elliemae/ds-utilities';
|
|
4
10
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
5
11
|
import DraggableItem from './renderers/DraggableItem.js';
|
|
6
12
|
import DroppableList from './renderers/DroppableList.js';
|
|
@@ -21,12 +27,13 @@ const TreeDndPlugin = createInstancePlugin('tree-dnd', {
|
|
|
21
27
|
|
|
22
28
|
const [draggedRecord, setDraggedRecord] = useState(null); // eslint-disable-next-line react-hooks/rules-of-hooks
|
|
23
29
|
|
|
24
|
-
const changeRecordsPosition = useCallback(
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
+
const changeRecordsPosition = useCallback(_ref => {
|
|
31
|
+
let {
|
|
32
|
+
sourceRecord,
|
|
33
|
+
targetRecord,
|
|
34
|
+
combineWith,
|
|
35
|
+
down
|
|
36
|
+
} = _ref;
|
|
30
37
|
let nextTreeData;
|
|
31
38
|
const sourceTreePosition = getTreePosition(sourceRecord.path);
|
|
32
39
|
let targetTreePosition = {};
|
|
@@ -1,9 +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 _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
8
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
9
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
4
10
|
import 'react';
|
|
5
11
|
import { Draggable } from 'react-beautiful-dnd';
|
|
6
|
-
import GripperVertical from '@elliemae/ds-icons
|
|
12
|
+
import { GripperVertical } from '@elliemae/ds-icons';
|
|
7
13
|
import { getDraggableProps } from '../utils.js';
|
|
8
14
|
import { jsx } from 'react/jsx-runtime';
|
|
9
15
|
|
|
@@ -30,7 +36,7 @@ const DraggableItem = (renderers // , instance
|
|
|
30
36
|
isDragDisabled: isDragDisabled,
|
|
31
37
|
draggableId: String(record.id),
|
|
32
38
|
index: index
|
|
33
|
-
},
|
|
39
|
+
}, "".concat(record.id, "-draggable"), (provided, snapshot) => {
|
|
34
40
|
const _getDraggableProps = getDraggableProps(props, provided, snapshot),
|
|
35
41
|
{
|
|
36
42
|
key
|
|
@@ -44,7 +50,7 @@ const DraggableItem = (renderers // , instance
|
|
|
44
50
|
}, provided.dragHandleProps), {}, {
|
|
45
51
|
className: "drag-handle",
|
|
46
52
|
tabIndex: isItemFocused ? 0 : -1
|
|
47
|
-
}),
|
|
53
|
+
}), "".concat(record.id, "-drag-handle")), ...(props.leftAddons || [])],
|
|
48
54
|
children: props.children
|
|
49
55
|
}), key);
|
|
50
56
|
});
|
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
3
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
4
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
5
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
6
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
7
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
8
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
9
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
4
10
|
import { useContext, useState, useRef, useCallback, createElement } from 'react';
|
|
5
11
|
import { DragDropContext, Droppable } from 'react-beautiful-dnd';
|
|
6
|
-
import { cx } from '@elliemae/ds-utilities
|
|
7
|
-
import GripperVertical from '@elliemae/ds-icons
|
|
8
|
-
import { mergeRefs } from '@elliemae/ds-utilities/system';
|
|
12
|
+
import { cx, mergeRefs } from '@elliemae/ds-utilities';
|
|
13
|
+
import { GripperVertical } from '@elliemae/ds-icons';
|
|
9
14
|
import FocusGroupContext from '@elliemae/ds-shared/FocusGroup/FocusGroupContext';
|
|
10
15
|
import { findItemById, findItemOnDocument } from '../../tree/utils.js';
|
|
11
16
|
import { getDraggableProps } from '../utils.js';
|
|
@@ -64,9 +69,10 @@ const DroppableList = (renderers, instance) => _ref => {
|
|
|
64
69
|
|
|
65
70
|
currTargetRef.current = destination || currTargetRef.current;
|
|
66
71
|
}, [records]);
|
|
67
|
-
const onDragStart = useCallback(
|
|
68
|
-
|
|
69
|
-
|
|
72
|
+
const onDragStart = useCallback(_ref2 => {
|
|
73
|
+
let {
|
|
74
|
+
source
|
|
75
|
+
} = _ref2;
|
|
70
76
|
preDragFocusedNode.current = document.activeElement; // when we move the currently focused item, preDragFocusedNode is the body of the doc
|
|
71
77
|
|
|
72
78
|
setFocusedItemWasDragged(preDragFocusedNode.current.tagName === 'BODY');
|
|
@@ -81,13 +87,14 @@ const DroppableList = (renderers, instance) => _ref => {
|
|
|
81
87
|
}, [records]);
|
|
82
88
|
const onDragEnd = useCallback( // eslint-disable-next-line complexity
|
|
83
89
|
// eslint-disable-next-line max-statements
|
|
84
|
-
|
|
85
|
-
destination,
|
|
86
|
-
source,
|
|
87
|
-
combine
|
|
88
|
-
}) => {
|
|
90
|
+
_ref3 => {
|
|
89
91
|
var _sourceRecord$parentN, _targetRecord$parentN;
|
|
90
92
|
|
|
93
|
+
let {
|
|
94
|
+
destination,
|
|
95
|
+
source,
|
|
96
|
+
combine
|
|
97
|
+
} = _ref3;
|
|
91
98
|
clearTimeout(expandTimerRef.current);
|
|
92
99
|
const sourceIndex = source.index;
|
|
93
100
|
const destinationIndex = destination && destination.index;
|
|
@@ -1,6 +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
|
-
import
|
|
3
|
-
import { mergeRefs } from '@elliemae/ds-utilities
|
|
7
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
8
|
+
import { cx, mergeRefs, set, get, cloneDeep, arrayMove } from '@elliemae/ds-utilities';
|
|
4
9
|
|
|
5
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; }
|
|
6
11
|
|
|
@@ -55,7 +60,8 @@ const isSourceBeforeTarget = (sourcePath, targetPath) => {
|
|
|
55
60
|
|
|
56
61
|
return sourceIsBeforeTarget;
|
|
57
62
|
};
|
|
58
|
-
const updateTargetPath = (sourcePath, targetPath
|
|
63
|
+
const updateTargetPath = function (sourcePath, targetPath) {
|
|
64
|
+
let incr = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : -1;
|
|
59
65
|
const nextTargetPath = [...targetPath];
|
|
60
66
|
const posToUpdate = sourcePath.length ? sourcePath.length - 1 : 0;
|
|
61
67
|
nextTargetPath.splice(posToUpdate, 1, targetPath[posToUpdate] + incr);
|
|
@@ -67,24 +73,25 @@ const getTreePosition = recordPath => ({
|
|
|
67
73
|
parentPath: getParentPath(recordPath),
|
|
68
74
|
index: recordPath.slice(-1)[0]
|
|
69
75
|
});
|
|
70
|
-
const changePositionBetweenDifferentArrays =
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
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;
|
|
88
95
|
let nextTreeData = cloneDeep(data);
|
|
89
96
|
if (!sourceRecord || !sourceRecord.data) throw new Error('error while dragging, no dragged item received');
|
|
90
97
|
const sourceTreeChildren = getParentChildrenByPath(nextTreeData, sourceTreePosition.parentPath); // When moving an item we remove the item from it's former parent children array
|
|
@@ -114,12 +121,13 @@ const changePositionBetweenDifferentArrays = ({
|
|
|
114
121
|
return nextTreeData;
|
|
115
122
|
};
|
|
116
123
|
const combineWithTarget = () => {};
|
|
117
|
-
const changePositionSameArray =
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
124
|
+
const changePositionSameArray = _ref2 => {
|
|
125
|
+
let {
|
|
126
|
+
targetTreePosition,
|
|
127
|
+
sourceRecord,
|
|
128
|
+
targetRecord,
|
|
129
|
+
data
|
|
130
|
+
} = _ref2;
|
|
123
131
|
let nextTreeData = cloneDeep(data);
|
|
124
132
|
const targetTreeChildren = getParentChildrenByPath(nextTreeData, targetTreePosition.parentPath);
|
|
125
133
|
const nextChildren = arrayMove(targetTreeChildren, sourceRecord.index, targetRecord.index); // mutates the tree. That's the reason of the clone above
|
|
@@ -1,10 +1,16 @@
|
|
|
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';
|
|
9
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
4
10
|
import { useState, useMemo, useRef } from 'react';
|
|
5
11
|
import FocusGroupProvider from '@elliemae/ds-shared/FocusGroup/FocusGroupManager';
|
|
6
12
|
import useFocusGroupItem from '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
|
|
7
|
-
import { mergeRefs } from '@elliemae/ds-utilities
|
|
13
|
+
import { mergeRefs } from '@elliemae/ds-utilities';
|
|
8
14
|
import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
|
|
9
15
|
import { jsx } from 'react/jsx-runtime';
|
|
10
16
|
|
|
@@ -57,9 +63,13 @@ const TreeRovingPlugin = createInstancePlugin('tree-data', {
|
|
|
57
63
|
|
|
58
64
|
if (instance !== null && instance !== void 0 && (_instance$props = instance.props) !== null && _instance$props !== void 0 && _instance$props.onItemFocus) {
|
|
59
65
|
instance.props.onItemFocus({
|
|
60
|
-
scrollToItem: (
|
|
66
|
+
scrollToItem: function () {
|
|
61
67
|
var _props$listRef, _props$listRef$curren;
|
|
62
68
|
|
|
69
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
70
|
+
args[_key] = arguments[_key];
|
|
71
|
+
}
|
|
72
|
+
|
|
63
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);
|
|
64
74
|
},
|
|
65
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;
|