@elliemae/ds-treeview 2.2.0-alpha.4 → 3.0.0-next.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 +27 -49
- package/cjs/TreeViewContext.js +37 -61
- package/cjs/config/cssClassesConstants.js +13 -41
- package/cjs/config/useTreeview.js +78 -116
- package/cjs/hoc/DnDTreeContext.js +18 -0
- package/cjs/hoc/SortableItemContext.js +21 -0
- package/cjs/hoc/WithConditionalDnDContext.js +138 -0
- package/cjs/hoc/WithDnDSortableItemContext.js +70 -0
- package/cjs/index.js +26 -37
- package/cjs/parts/CheckboxSelectable.js +59 -70
- package/cjs/parts/ChildrenCountDisplayer.js +28 -45
- package/cjs/parts/DnDHandle.js +46 -0
- package/cjs/parts/DropIndicator.js +75 -0
- package/cjs/parts/ExpandCaret.js +83 -85
- package/cjs/parts/Icon.js +31 -46
- package/cjs/parts/NestingSpace.js +35 -43
- package/cjs/parts/RadioSelectable.js +37 -52
- package/cjs/parts/TreeItem.js +141 -147
- package/cjs/parts/TreeItemText.js +95 -88
- package/cjs/parts/TreeList.js +130 -119
- package/cjs/plugins/dnd/TreeDndPlugin.js +7 -59
- package/cjs/plugins/dnd/index.js +9 -28
- package/cjs/plugins/index.js +21 -34
- package/cjs/plugins/roving/TreeRovingPlugin.js +7 -35
- package/cjs/plugins/roving/index.js +9 -28
- package/cjs/plugins/searchable/SearchableTreePlugin.js +7 -35
- package/cjs/plugins/searchable/index.js +9 -28
- package/cjs/plugins/selectable/SelectablePluginTree.js +7 -35
- package/cjs/plugins/selectable/index.js +9 -28
- package/cjs/plugins/toolbar/TreeToolbarPlugin.js +7 -35
- package/cjs/plugins/toolbar/index.js +9 -28
- package/cjs/plugins/tree/TreeDataPlugin.js +7 -35
- package/cjs/plugins/tree/index.js +9 -28
- package/cjs/plugins/virtualization/TreeVirtualizationPlugin.js +7 -35
- package/cjs/plugins/virtualization/index.js +9 -28
- package/cjs/react-desc-prop-types.js +54 -82
- package/cjs/related-components/TreeViewSearchBar.js +40 -42
- package/cjs/sharedTypes.js +2 -27
- package/cjs/utils/array-helpers.js +11 -35
- package/cjs/utils/group-expands-helpers.js +59 -86
- package/cjs/utils/keyboard-helpers.js +90 -85
- package/cjs/utils/object-helpers.js +36 -43
- package/cjs/utils/refs-helpers.js +22 -43
- package/cjs/utils/selectable-helper.js +53 -61
- package/cjs/utils/string-helpers.js +7 -35
- package/cjs/utils/tree-helpers.js +161 -105
- package/cjs/utils/useInstanceRefActions.js +43 -54
- package/cjs/utils/useTree.js +80 -76
- package/esm/TreeView.js +16 -18
- package/esm/TreeViewContext.js +31 -32
- package/esm/config/cssClassesConstants.js +6 -12
- package/esm/config/useTreeview.js +56 -73
- package/esm/hoc/DnDTreeContext.js +14 -0
- package/esm/hoc/SortableItemContext.js +17 -0
- package/esm/hoc/WithConditionalDnDContext.js +128 -0
- package/esm/hoc/WithDnDSortableItemContext.js +61 -0
- package/esm/index.js +9 -8
- package/esm/parts/CheckboxSelectable.js +46 -36
- package/esm/parts/ChildrenCountDisplayer.js +20 -16
- package/esm/parts/DnDHandle.js +38 -0
- package/esm/parts/DropIndicator.js +68 -0
- package/esm/parts/ExpandCaret.js +72 -54
- package/esm/parts/Icon.js +22 -16
- package/esm/parts/NestingSpace.js +27 -14
- package/esm/parts/RadioSelectable.js +28 -20
- package/esm/parts/TreeItem.js +125 -114
- package/esm/parts/TreeItemText.js +85 -58
- package/esm/parts/TreeList.js +119 -91
- package/esm/plugins/dnd/TreeDndPlugin.js +3 -30
- package/esm/plugins/dnd/index.js +1 -3
- package/esm/plugins/index.js +7 -9
- package/esm/plugins/roving/TreeRovingPlugin.js +3 -6
- package/esm/plugins/roving/index.js +1 -3
- package/esm/plugins/searchable/SearchableTreePlugin.js +3 -6
- package/esm/plugins/searchable/index.js +1 -3
- package/esm/plugins/selectable/SelectablePluginTree.js +3 -6
- package/esm/plugins/selectable/index.js +1 -3
- package/esm/plugins/toolbar/TreeToolbarPlugin.js +3 -6
- package/esm/plugins/toolbar/index.js +1 -3
- package/esm/plugins/tree/TreeDataPlugin.js +3 -6
- package/esm/plugins/tree/index.js +1 -3
- package/esm/plugins/virtualization/TreeVirtualizationPlugin.js +3 -6
- package/esm/plugins/virtualization/index.js +1 -3
- package/esm/react-desc-prop-types.js +44 -47
- package/esm/related-components/TreeViewSearchBar.js +32 -13
- package/esm/sharedTypes.js +1 -2
- package/esm/utils/array-helpers.js +6 -6
- package/esm/utils/group-expands-helpers.js +46 -56
- package/esm/utils/keyboard-helpers.js +74 -46
- package/esm/utils/object-helpers.js +31 -14
- package/esm/utils/refs-helpers.js +19 -15
- package/esm/utils/selectable-helper.js +43 -32
- package/esm/utils/string-helpers.js +3 -6
- package/esm/utils/tree-helpers.js +143 -73
- package/esm/utils/useInstanceRefActions.js +35 -21
- package/esm/utils/useTree.js +59 -35
- package/package.json +35 -19
- package/types/hoc/DnDTreeContext.d.ts +14 -0
- package/types/hoc/SortableItemContext.d.ts +19 -0
- package/types/hoc/WithConditionalDnDContext.d.ts +4 -0
- package/types/hoc/WithDnDSortableItemContext.d.ts +4 -0
- package/types/parts/DnDHandle.d.ts +6 -0
- package/types/parts/DropIndicator.d.ts +10 -0
- package/types/parts/TreeItem.d.ts +4 -11
- package/types/parts/TreeList.d.ts +0 -4
- package/types/plugins/dnd/TreeDndPlugin.d.ts +0 -2
- package/types/react-desc-prop-types.d.ts +17 -3
- package/types/sharedTypes.d.ts +1 -8
- package/types/utils/keyboard-helpers.d.ts +2 -1
- package/types/utils/refs-helpers.d.ts +1 -1
- package/types/utils/tree-helpers.d.ts +4 -1
- package/types/utils/useTree.d.ts +1 -0
- package/cjs/TreeView.js.map +0 -7
- package/cjs/TreeViewContext.js.map +0 -7
- package/cjs/config/cssClassesConstants.js.map +0 -7
- package/cjs/config/useTreeview.js.map +0 -7
- package/cjs/index.js.map +0 -7
- package/cjs/parts/CheckboxSelectable.js.map +0 -7
- package/cjs/parts/ChildrenCountDisplayer.js.map +0 -7
- package/cjs/parts/ExpandCaret.js.map +0 -7
- package/cjs/parts/Icon.js.map +0 -7
- package/cjs/parts/NestingSpace.js.map +0 -7
- package/cjs/parts/RadioSelectable.js.map +0 -7
- package/cjs/parts/TreeItem.js.map +0 -7
- package/cjs/parts/TreeItemText.js.map +0 -7
- package/cjs/parts/TreeList.js.map +0 -7
- package/cjs/plugins/dnd/TreeDndPlugin.js.map +0 -7
- package/cjs/plugins/dnd/index.js.map +0 -7
- package/cjs/plugins/index.js.map +0 -7
- package/cjs/plugins/roving/TreeRovingPlugin.js.map +0 -7
- package/cjs/plugins/roving/index.js.map +0 -7
- package/cjs/plugins/searchable/SearchableTreePlugin.js.map +0 -7
- package/cjs/plugins/searchable/index.js.map +0 -7
- package/cjs/plugins/selectable/SelectablePluginTree.js.map +0 -7
- package/cjs/plugins/selectable/index.js.map +0 -7
- package/cjs/plugins/toolbar/TreeToolbarPlugin.js.map +0 -7
- package/cjs/plugins/toolbar/index.js.map +0 -7
- package/cjs/plugins/tree/TreeDataPlugin.js.map +0 -7
- package/cjs/plugins/tree/index.js.map +0 -7
- package/cjs/plugins/virtualization/TreeVirtualizationPlugin.js.map +0 -7
- package/cjs/plugins/virtualization/index.js.map +0 -7
- package/cjs/react-desc-prop-types.js.map +0 -7
- package/cjs/related-components/TreeViewSearchBar.js.map +0 -7
- package/cjs/sharedTypes.js.map +0 -7
- package/cjs/utils/array-helpers.js.map +0 -7
- package/cjs/utils/dnd-helpers.js +0 -146
- package/cjs/utils/dnd-helpers.js.map +0 -7
- package/cjs/utils/group-expands-helpers.js.map +0 -7
- package/cjs/utils/keyboard-helpers.js.map +0 -7
- package/cjs/utils/object-helpers.js.map +0 -7
- package/cjs/utils/refs-helpers.js.map +0 -7
- package/cjs/utils/selectable-helper.js.map +0 -7
- package/cjs/utils/string-helpers.js.map +0 -7
- package/cjs/utils/tree-helpers.js.map +0 -7
- package/cjs/utils/useDnDHelpers.js +0 -199
- package/cjs/utils/useDnDHelpers.js.map +0 -7
- package/cjs/utils/useInstanceRefActions.js.map +0 -7
- package/cjs/utils/useTree.js.map +0 -7
- package/esm/TreeView.js.map +0 -7
- package/esm/TreeViewContext.js.map +0 -7
- package/esm/config/cssClassesConstants.js.map +0 -7
- package/esm/config/useTreeview.js.map +0 -7
- package/esm/index.js.map +0 -7
- package/esm/parts/CheckboxSelectable.js.map +0 -7
- package/esm/parts/ChildrenCountDisplayer.js.map +0 -7
- package/esm/parts/ExpandCaret.js.map +0 -7
- package/esm/parts/Icon.js.map +0 -7
- package/esm/parts/NestingSpace.js.map +0 -7
- package/esm/parts/RadioSelectable.js.map +0 -7
- package/esm/parts/TreeItem.js.map +0 -7
- package/esm/parts/TreeItemText.js.map +0 -7
- package/esm/parts/TreeList.js.map +0 -7
- package/esm/plugins/dnd/TreeDndPlugin.js.map +0 -7
- package/esm/plugins/dnd/index.js.map +0 -7
- package/esm/plugins/index.js.map +0 -7
- package/esm/plugins/roving/TreeRovingPlugin.js.map +0 -7
- package/esm/plugins/roving/index.js.map +0 -7
- package/esm/plugins/searchable/SearchableTreePlugin.js.map +0 -7
- package/esm/plugins/searchable/index.js.map +0 -7
- package/esm/plugins/selectable/SelectablePluginTree.js.map +0 -7
- package/esm/plugins/selectable/index.js.map +0 -7
- package/esm/plugins/toolbar/TreeToolbarPlugin.js.map +0 -7
- package/esm/plugins/toolbar/index.js.map +0 -7
- package/esm/plugins/tree/TreeDataPlugin.js.map +0 -7
- package/esm/plugins/tree/index.js.map +0 -7
- package/esm/plugins/virtualization/TreeVirtualizationPlugin.js.map +0 -7
- package/esm/plugins/virtualization/index.js.map +0 -7
- package/esm/react-desc-prop-types.js.map +0 -7
- package/esm/related-components/TreeViewSearchBar.js.map +0 -7
- package/esm/sharedTypes.js.map +0 -7
- package/esm/utils/array-helpers.js.map +0 -7
- package/esm/utils/dnd-helpers.js +0 -117
- package/esm/utils/dnd-helpers.js.map +0 -7
- package/esm/utils/group-expands-helpers.js.map +0 -7
- package/esm/utils/keyboard-helpers.js.map +0 -7
- package/esm/utils/object-helpers.js.map +0 -7
- package/esm/utils/refs-helpers.js.map +0 -7
- package/esm/utils/selectable-helper.js.map +0 -7
- package/esm/utils/string-helpers.js.map +0 -7
- package/esm/utils/tree-helpers.js.map +0 -7
- package/esm/utils/useDnDHelpers.js +0 -170
- package/esm/utils/useDnDHelpers.js.map +0 -7
- package/esm/utils/useInstanceRefActions.js.map +0 -7
- package/esm/utils/useTree.js.map +0 -7
- package/types/utils/dnd-helpers.d.ts +0 -39
- package/types/utils/useDnDHelpers.d.ts +0 -26
package/cjs/TreeView.js
CHANGED
|
@@ -1,52 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
return target;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (module2, isNodeMode) => {
|
|
21
|
-
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
-
};
|
|
23
|
-
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
-
return (module2, temp) => {
|
|
25
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
-
};
|
|
27
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
-
var TreeView_exports = {};
|
|
29
|
-
__export(TreeView_exports, {
|
|
30
|
-
TreeView: () => TreeView,
|
|
31
|
-
TreeViewWithSchema: () => TreeViewWithSchema
|
|
32
|
-
});
|
|
33
|
-
var React = __toESM(require("react"));
|
|
34
|
-
var import_react = __toESM(require("react"));
|
|
35
|
-
var import_react_desc = require("react-desc");
|
|
36
|
-
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
37
|
-
var import_TreeViewContext = __toESM(require("./TreeViewContext"));
|
|
38
|
-
var import_dnd = require("./plugins/dnd");
|
|
39
|
-
var import_useTreeview = require("./config/useTreeview");
|
|
40
|
-
var import_TreeList = require("./parts/TreeList");
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
|
+
require('react');
|
|
7
|
+
var reactDesc = require('react-desc');
|
|
8
|
+
var reactDescPropTypes = require('./react-desc-prop-types.js');
|
|
9
|
+
var TreeViewContext = require('./TreeViewContext.js');
|
|
10
|
+
var useTreeview = require('./config/useTreeview.js');
|
|
11
|
+
var TreeList = require('./parts/TreeList.js');
|
|
12
|
+
|
|
13
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
|
+
|
|
15
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
16
|
+
|
|
17
|
+
var _TreeList;
|
|
41
18
|
function TreeView(props) {
|
|
42
|
-
const {
|
|
43
|
-
|
|
44
|
-
|
|
19
|
+
const {
|
|
20
|
+
ctx
|
|
21
|
+
} = useTreeview.useTreeview(props);
|
|
22
|
+
return /*#__PURE__*/_jsx__default["default"](TreeViewContext["default"].Provider, {
|
|
45
23
|
value: ctx
|
|
46
|
-
},
|
|
24
|
+
}, void 0, _TreeList || (_TreeList = /*#__PURE__*/_jsx__default["default"](TreeList.TreeList, {})));
|
|
47
25
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
26
|
+
const TreeViewWithSchema = reactDesc.describe(TreeView);
|
|
27
|
+
TreeViewWithSchema.propTypes = reactDescPropTypes.TreeViewPropTypes;
|
|
28
|
+
|
|
29
|
+
exports.TreeView = TreeView;
|
|
30
|
+
exports.TreeViewWithSchema = TreeViewWithSchema;
|
package/cjs/TreeViewContext.js
CHANGED
|
@@ -1,49 +1,24 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
-
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(module2))
|
|
15
|
-
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
-
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return target;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (module2, isNodeMode) => {
|
|
21
|
-
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
-
};
|
|
23
|
-
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
-
return (module2, temp) => {
|
|
25
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
-
};
|
|
27
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
-
var TreeViewContext_exports = {};
|
|
29
|
-
__export(TreeViewContext_exports, {
|
|
30
|
-
default: () => TreeViewContext_default,
|
|
31
|
-
defaultProps: () => defaultProps,
|
|
32
|
-
defaultRelativeMouseCoord: () => defaultRelativeMouseCoord
|
|
33
|
-
});
|
|
34
|
-
var React = __toESM(require("react"));
|
|
35
|
-
var import_react = require("react");
|
|
36
|
-
function noop(..._args) {
|
|
37
|
-
}
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
/* eslint-disable no-unused-vars */
|
|
8
|
+
|
|
9
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
10
|
+
function noop() {}
|
|
11
|
+
|
|
38
12
|
const defaultProps = {
|
|
39
13
|
plugins: [],
|
|
40
14
|
selection: {},
|
|
41
|
-
instanceRef:
|
|
15
|
+
instanceRef: /*#__PURE__*/React.createRef(),
|
|
42
16
|
isItemDisabled: () => false,
|
|
43
17
|
disableIcons: false,
|
|
44
18
|
fluid: false,
|
|
45
19
|
isMultiSelect: false,
|
|
46
20
|
isSingleSelect: false,
|
|
21
|
+
getIsDropValid: () => true,
|
|
47
22
|
restrictDragAndDrop: false,
|
|
48
23
|
showChildrenAmount: false,
|
|
49
24
|
sortable: false,
|
|
@@ -56,15 +31,20 @@ const defaultProps = {
|
|
|
56
31
|
onSelectionChange: noop,
|
|
57
32
|
onExpandChange: noop,
|
|
58
33
|
onInstanceRefInitialized: noop,
|
|
59
|
-
rowSize:
|
|
60
|
-
labelOverflow:
|
|
61
|
-
noItemsPlaceholder:
|
|
62
|
-
nameKey:
|
|
63
|
-
width:
|
|
64
|
-
height:
|
|
34
|
+
rowSize: 'normal',
|
|
35
|
+
labelOverflow: 'wrap',
|
|
36
|
+
noItemsPlaceholder: 'No items found',
|
|
37
|
+
nameKey: 'name',
|
|
38
|
+
width: '100%',
|
|
39
|
+
height: '100%',
|
|
65
40
|
groupIcon: null,
|
|
66
41
|
itemIcon: null,
|
|
67
|
-
searchQuery:
|
|
42
|
+
searchQuery: '' // workaround on the typings over the fact that
|
|
43
|
+
// when we instantiate the context we can't have all the props
|
|
44
|
+
// we only have a part of them but the final typings will include missing props
|
|
45
|
+
// this is safe to do because
|
|
46
|
+
// we will "mergeWithDefaults" + "validatePropTypes" when we do instantiate the context
|
|
47
|
+
|
|
68
48
|
};
|
|
69
49
|
const defaultRelativeMouseCoord = {
|
|
70
50
|
isBefore: false,
|
|
@@ -79,28 +59,21 @@ const defaultRelativeMouseCoord = {
|
|
|
79
59
|
const defaultContext = {
|
|
80
60
|
props: defaultProps,
|
|
81
61
|
visibleItems: [],
|
|
62
|
+
flattenedItems: [],
|
|
82
63
|
withRadioChecks: false,
|
|
83
64
|
withCheckboxChecks: false,
|
|
84
65
|
withDragAndDrop: false,
|
|
85
|
-
relativeMouseCord: defaultRelativeMouseCoord,
|
|
86
|
-
setRelativeMouseCord: noop,
|
|
87
66
|
triggerTreeRerender: noop,
|
|
88
|
-
tree:
|
|
89
|
-
treeRoot:
|
|
67
|
+
tree: undefined,
|
|
68
|
+
treeRoot: undefined,
|
|
90
69
|
virtualListHelpers: {
|
|
91
70
|
virtualItems: [],
|
|
92
71
|
totalSize: 0,
|
|
93
72
|
scrollToOffset: noop,
|
|
94
73
|
scrollToIndex: noop
|
|
95
74
|
},
|
|
96
|
-
virtualListRef:
|
|
97
|
-
|
|
98
|
-
setIsDragging: noop,
|
|
99
|
-
isKeyboardDragging: false,
|
|
100
|
-
setIsKeyboardDragging: noop,
|
|
101
|
-
draggedItem: null,
|
|
102
|
-
setDraggedItem: noop,
|
|
103
|
-
uniqueTreeViewUUID: "",
|
|
75
|
+
virtualListRef: undefined,
|
|
76
|
+
uniqueTreeViewUUID: '',
|
|
104
77
|
selectedItem: null,
|
|
105
78
|
setSelectedItem: noop,
|
|
106
79
|
focusedItem: null,
|
|
@@ -116,7 +89,10 @@ const defaultContext = {
|
|
|
116
89
|
handleExpandGroup: noop,
|
|
117
90
|
updateUserExpandedState: noop
|
|
118
91
|
};
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
92
|
+
/** Context for cross component communication */
|
|
93
|
+
|
|
94
|
+
const TreeViewContext = /*#__PURE__*/React.createContext(defaultContext);
|
|
95
|
+
|
|
96
|
+
exports["default"] = TreeViewContext;
|
|
97
|
+
exports.defaultProps = defaultProps;
|
|
98
|
+
exports.defaultRelativeMouseCoord = defaultRelativeMouseCoord;
|
|
@@ -1,41 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
for (let key of __getOwnPropNames(module2))
|
|
15
|
-
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
-
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return target;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (module2, isNodeMode) => {
|
|
21
|
-
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
-
};
|
|
23
|
-
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
-
return (module2, temp) => {
|
|
25
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
-
};
|
|
27
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
-
var cssClassesConstants_exports = {};
|
|
29
|
-
__export(cssClassesConstants_exports, {
|
|
30
|
-
DSTreeViewPrefix: () => DSTreeViewPrefix,
|
|
31
|
-
treeItemBlockName: () => treeItemBlockName,
|
|
32
|
-
treeListBlockName: () => treeListBlockName,
|
|
33
|
-
treeListNoItemsBn: () => treeListNoItemsBn
|
|
34
|
-
});
|
|
35
|
-
var React = __toESM(require("react"));
|
|
36
|
-
const DSTreeViewPrefix = "em-ds";
|
|
37
|
-
const treeItemBlockName = "tree-item";
|
|
38
|
-
const treeListBlockName = "tree-list";
|
|
39
|
-
const treeListNoItemsBn = `${treeListBlockName}-no-items`;
|
|
40
|
-
module.exports = __toCommonJS(cssClassesConstants_exports);
|
|
41
|
-
//# sourceMappingURL=cssClassesConstants.js.map
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const DSTreeViewPrefix = 'em-ds';
|
|
6
|
+
const treeItemBlockName = 'tree-item';
|
|
7
|
+
const treeListBlockName = 'tree-list';
|
|
8
|
+
const treeListNoItemsBn = "".concat(treeListBlockName, "-no-items");
|
|
9
|
+
|
|
10
|
+
exports.DSTreeViewPrefix = DSTreeViewPrefix;
|
|
11
|
+
exports.treeItemBlockName = treeItemBlockName;
|
|
12
|
+
exports.treeListBlockName = treeListBlockName;
|
|
13
|
+
exports.treeListNoItemsBn = treeListNoItemsBn;
|
|
@@ -1,62 +1,45 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var import_react_virtual = require("react-virtual");
|
|
35
|
-
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
36
|
-
var import_uuid = require("uuid");
|
|
37
|
-
var import_react_desc_prop_types = require("../react-desc-prop-types");
|
|
38
|
-
var import_TreeViewContext = require("../TreeViewContext");
|
|
39
|
-
var import_dnd = require("../plugins/dnd");
|
|
40
|
-
var import_useTree = require("../utils/useTree");
|
|
41
|
-
var import_group_expands_helpers = require("../utils/group-expands-helpers");
|
|
42
|
-
var import_useInstanceRefActions = require("../utils/useInstanceRefActions");
|
|
43
|
-
var import_keyboard_helpers = require("../utils/keyboard-helpers");
|
|
44
|
-
const useTreeview = (props) => {
|
|
45
|
-
const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_TreeViewContext.defaultProps);
|
|
46
|
-
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.TreeViewPropTypes);
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
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');
|
|
12
|
+
var React = require('react');
|
|
13
|
+
var reactVirtual = require('react-virtual');
|
|
14
|
+
var dsPropsHelpers = require('@elliemae/ds-props-helpers');
|
|
15
|
+
var uuid = require('uuid');
|
|
16
|
+
var reactDescPropTypes = require('../react-desc-prop-types.js');
|
|
17
|
+
var TreeViewContext = require('../TreeViewContext.js');
|
|
18
|
+
var TreeDndPlugin = require('../plugins/dnd/TreeDndPlugin.js');
|
|
19
|
+
var useTree = require('../utils/useTree.js');
|
|
20
|
+
var groupExpandsHelpers = require('../utils/group-expands-helpers.js');
|
|
21
|
+
var useInstanceRefActions = require('../utils/useInstanceRefActions.js');
|
|
22
|
+
var keyboardHelpers = require('../utils/keyboard-helpers.js');
|
|
23
|
+
|
|
24
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
|
+
|
|
26
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
27
|
+
|
|
28
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
29
|
+
|
|
30
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
31
|
+
const useTreeview = props => {
|
|
32
|
+
const propsWithDefault = dsPropsHelpers.useMemoMergePropsWithDefault(props, TreeViewContext.defaultProps);
|
|
33
|
+
dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefault, reactDescPropTypes.TreeViewPropTypes);
|
|
47
34
|
const defaultActions = {
|
|
48
35
|
actions: {
|
|
49
|
-
toggleExpandAll: () => {
|
|
50
|
-
},
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
setSelectedItemByVirtualIndex: () => {
|
|
54
|
-
},
|
|
55
|
-
setFocusedItemByVirtualIndex: () => {
|
|
56
|
-
}
|
|
36
|
+
toggleExpandAll: () => {},
|
|
37
|
+
scrollTo: () => {},
|
|
38
|
+
setSelectedItemByVirtualIndex: () => {},
|
|
39
|
+
setFocusedItemByVirtualIndex: () => {}
|
|
57
40
|
}
|
|
58
41
|
};
|
|
59
|
-
const treeRef =
|
|
42
|
+
const treeRef = React.useRef(defaultActions);
|
|
60
43
|
const {
|
|
61
44
|
data,
|
|
62
45
|
plugins,
|
|
@@ -67,48 +50,44 @@ const useTreeview = (props) => {
|
|
|
67
50
|
selection,
|
|
68
51
|
onInstanceRefInitialized
|
|
69
52
|
} = propsWithDefault;
|
|
70
|
-
const [
|
|
71
|
-
const [
|
|
72
|
-
const [
|
|
73
|
-
const [
|
|
74
|
-
const [
|
|
75
|
-
const [
|
|
76
|
-
const [
|
|
77
|
-
const
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
53
|
+
const [uniqueTreeViewUUID] = React.useState(uuid.v4());
|
|
54
|
+
const [hoverItem, setHoverItem] = React.useState(null);
|
|
55
|
+
const [latestToggledItem, setLatestToggledItem] = React.useState(null);
|
|
56
|
+
const [selectedItem, setSelectedItem] = React.useState(null);
|
|
57
|
+
const [focusedItem, setFocusedItem] = React.useState(null);
|
|
58
|
+
const [selectedCheckboxes, setSelectedCheckboxes] = React.useState(_objectSpread({}, selection));
|
|
59
|
+
const [expandedGroups, setExpandedGroups] = React.useState({});
|
|
60
|
+
const {
|
|
61
|
+
visibleItems,
|
|
62
|
+
flattenedItems,
|
|
63
|
+
tree,
|
|
64
|
+
treeRoot,
|
|
65
|
+
triggerTreeRerender,
|
|
66
|
+
updateUserExpandedState
|
|
67
|
+
} = useTree.useTree(data, propsWithDefault, {
|
|
84
68
|
setExpandedGroups
|
|
85
69
|
});
|
|
86
|
-
const virtualListRef =
|
|
87
|
-
|
|
70
|
+
const virtualListRef = React.useRef(); // estimateSize should not be really required given what was stated on
|
|
71
|
+
// https://github.com/tannerlinsley/react-virtual/issues/23
|
|
72
|
+
|
|
73
|
+
const virtualListHelpers = reactVirtual.useVirtual({
|
|
88
74
|
size: visibleItems.length,
|
|
89
75
|
parentRef: virtualListRef,
|
|
90
76
|
overscan: 15
|
|
91
77
|
});
|
|
92
|
-
const withDragAndDrop = !!(plugins
|
|
78
|
+
const withDragAndDrop = !!(plugins !== null && plugins !== void 0 && plugins.includes(TreeDndPlugin.TreeDndPlugin) && onOrderChange);
|
|
93
79
|
const withRadioChecks = isSingleSelect && !isMultiSelect;
|
|
94
80
|
const withCheckboxChecks = !isSingleSelect && isMultiSelect;
|
|
95
|
-
const handleExpandGroup =
|
|
96
|
-
const ctx =
|
|
81
|
+
const handleExpandGroup = React.useCallback(groupExpandsHelpers.toggleItemExpand, []);
|
|
82
|
+
const ctx = React.useMemo(() => ({
|
|
97
83
|
props: propsWithDefault,
|
|
98
|
-
setRelativeMouseCord,
|
|
99
|
-
relativeMouseCord,
|
|
100
84
|
virtualListHelpers,
|
|
101
85
|
virtualListRef,
|
|
102
86
|
tree,
|
|
103
87
|
treeRoot,
|
|
104
88
|
visibleItems,
|
|
89
|
+
flattenedItems,
|
|
105
90
|
triggerTreeRerender,
|
|
106
|
-
isDragging,
|
|
107
|
-
setIsDragging,
|
|
108
|
-
isKeyboardDragging,
|
|
109
|
-
setIsKeyboardDragging,
|
|
110
|
-
draggedItem,
|
|
111
|
-
setDraggedItem,
|
|
112
91
|
withRadioChecks,
|
|
113
92
|
withCheckboxChecks,
|
|
114
93
|
withDragAndDrop,
|
|
@@ -127,39 +106,22 @@ const useTreeview = (props) => {
|
|
|
127
106
|
setHoverItem,
|
|
128
107
|
handleExpandGroup,
|
|
129
108
|
updateUserExpandedState
|
|
130
|
-
}), [
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
selectedItem,
|
|
143
|
-
tree,
|
|
144
|
-
treeRoot,
|
|
145
|
-
triggerTreeRerender,
|
|
146
|
-
uniqueTreeViewUUID,
|
|
147
|
-
virtualListHelpers,
|
|
148
|
-
visibleItems,
|
|
149
|
-
withCheckboxChecks,
|
|
150
|
-
withDragAndDrop,
|
|
151
|
-
withRadioChecks,
|
|
152
|
-
updateUserExpandedState
|
|
153
|
-
]);
|
|
154
|
-
if (instanceRef)
|
|
155
|
-
instanceRef.current = treeRef.current;
|
|
156
|
-
(0, import_useInstanceRefActions.useInstanceRefActions)(treeRef.current, ctx);
|
|
157
|
-
(0, import_keyboard_helpers.useGlobalToggleAllExpandShortcut)(treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState);
|
|
158
|
-
(0, import_group_expands_helpers.useNotifyExpandedChange)(propsWithDefault, ctx);
|
|
159
|
-
(0, import_react.useEffect)(() => {
|
|
160
|
-
setTimeout(() => onInstanceRefInitialized(treeRef), 100);
|
|
109
|
+
}), [propsWithDefault, virtualListHelpers, tree, treeRoot, visibleItems, flattenedItems, triggerTreeRerender, withRadioChecks, withCheckboxChecks, withDragAndDrop, uniqueTreeViewUUID, selectedCheckboxes, selectedItem, expandedGroups, latestToggledItem, focusedItem, hoverItem, handleExpandGroup, updateUserExpandedState]); // this hooks can't use the context because the context provider doesn't wrap this
|
|
110
|
+
// as such we manually pass the second parameter as fit
|
|
111
|
+
|
|
112
|
+
if (instanceRef) instanceRef.current = treeRef.current;
|
|
113
|
+
useInstanceRefActions.useInstanceRefActions(treeRef.current, ctx);
|
|
114
|
+
keyboardHelpers.useGlobalToggleAllExpandShortcut(treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState);
|
|
115
|
+
groupExpandsHelpers.useNotifyExpandedChange(propsWithDefault, ctx); // this is an horrible hack.
|
|
116
|
+
// this is required because there is no "on rendered" react-way to check if every children has finished rendering
|
|
117
|
+
// this should be working for now, in the future we may want to review this for a better solution
|
|
118
|
+
|
|
119
|
+
React.useEffect(() => {
|
|
120
|
+
setTimeout(() => onInstanceRefInitialized(treeRef), 100); // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
161
121
|
}, []);
|
|
162
|
-
return
|
|
122
|
+
return React.useMemo(() => ({
|
|
123
|
+
ctx
|
|
124
|
+
}), [ctx]);
|
|
163
125
|
};
|
|
164
|
-
|
|
165
|
-
|
|
126
|
+
|
|
127
|
+
exports.useTreeview = useTreeview;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var SortableItemContext = require('./SortableItemContext.js');
|
|
7
|
+
|
|
8
|
+
const DnDTreeContext = /*#__PURE__*/React.createContext({
|
|
9
|
+
depth: undefined,
|
|
10
|
+
activeIndex: undefined,
|
|
11
|
+
visibleItems: undefined,
|
|
12
|
+
dropIndicatorPosition: SortableItemContext.DropIndicatorPosition.None,
|
|
13
|
+
lastActiveId: undefined,
|
|
14
|
+
setLastActiveId: undefined,
|
|
15
|
+
isDropValid: false
|
|
16
|
+
});
|
|
17
|
+
|
|
18
|
+
exports.DnDTreeContext = DnDTreeContext;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
exports.DropIndicatorPosition = void 0;
|
|
8
|
+
|
|
9
|
+
(function (DropIndicatorPosition) {
|
|
10
|
+
DropIndicatorPosition[DropIndicatorPosition["None"] = 0] = "None";
|
|
11
|
+
DropIndicatorPosition[DropIndicatorPosition["Before"] = 1] = "Before";
|
|
12
|
+
DropIndicatorPosition[DropIndicatorPosition["After"] = 2] = "After";
|
|
13
|
+
DropIndicatorPosition[DropIndicatorPosition["Inside"] = 3] = "Inside";
|
|
14
|
+
})(exports.DropIndicatorPosition || (exports.DropIndicatorPosition = {}));
|
|
15
|
+
|
|
16
|
+
/** Context for cross component communication */
|
|
17
|
+
const SortableItemContext = /*#__PURE__*/React.createContext({
|
|
18
|
+
draggableProps: false
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
exports.SortableItemContext = SortableItemContext;
|