@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
|
@@ -1,138 +1,111 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
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 group_expands_helpers_exports = {};
|
|
29
|
-
__export(group_expands_helpers_exports, {
|
|
30
|
-
collapseAll: () => collapseAll,
|
|
31
|
-
collapseItemModel: () => collapseItemModel,
|
|
32
|
-
expandAll: () => expandAll,
|
|
33
|
-
expandItemModel: () => expandItemModel,
|
|
34
|
-
getToggleExpandShouldExpand: () => getToggleExpandShouldExpand,
|
|
35
|
-
toggleExpandAllHelper: () => toggleExpandAllHelper,
|
|
36
|
-
toggleItemExpand: () => toggleItemExpand,
|
|
37
|
-
updateExpandedState: () => updateExpandedState,
|
|
38
|
-
useNotifyExpandedChange: () => useNotifyExpandedChange
|
|
39
|
-
});
|
|
40
|
-
var React = __toESM(require("react"));
|
|
41
|
-
var import_react = require("react");
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
/* eslint-disable max-params */
|
|
42
8
|
const updateExpandedState = (treeRoot, onExpandChange) => {
|
|
43
9
|
const shouldContinueWalking = true;
|
|
44
|
-
const newExpandedHashMap = {
|
|
45
|
-
|
|
10
|
+
const newExpandedHashMap = {
|
|
11
|
+
__ds_tree_root: true
|
|
12
|
+
};
|
|
13
|
+
treeRoot.walk(node => {
|
|
46
14
|
if (!node.isRoot() && node.model.isGroup && node.model.isExpanded) {
|
|
47
15
|
newExpandedHashMap[node.model.id] = true;
|
|
48
16
|
}
|
|
17
|
+
|
|
49
18
|
return shouldContinueWalking;
|
|
50
19
|
});
|
|
51
|
-
if (onExpandChange)
|
|
52
|
-
onExpandChange(newExpandedHashMap, null);
|
|
20
|
+
if (onExpandChange) onExpandChange(newExpandedHashMap, null);
|
|
53
21
|
};
|
|
54
|
-
const toggleItemExpand = (itemToToggle, triggerTreeRerender, updateUserExpandedState
|
|
55
|
-
|
|
22
|
+
const toggleItemExpand = function (itemToToggle, triggerTreeRerender, updateUserExpandedState) {
|
|
23
|
+
let scrollTo = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : () => {};
|
|
56
24
|
const {
|
|
57
25
|
node: {
|
|
58
|
-
model: {
|
|
26
|
+
model: {
|
|
27
|
+
isExpanded
|
|
28
|
+
}
|
|
59
29
|
},
|
|
60
30
|
virtualIndex
|
|
61
31
|
} = itemToToggle;
|
|
32
|
+
|
|
62
33
|
if (itemToToggle.node.model.isGroup) {
|
|
63
34
|
itemToToggle.node.model.isExpanded = !isExpanded;
|
|
64
35
|
triggerTreeRerender();
|
|
65
36
|
updateUserExpandedState();
|
|
66
37
|
setTimeout(() => {
|
|
67
|
-
if (typeof virtualIndex ===
|
|
68
|
-
|
|
38
|
+
if (typeof virtualIndex === 'number') scrollTo(virtualIndex, {
|
|
39
|
+
align: 'start'
|
|
40
|
+
});
|
|
69
41
|
});
|
|
70
42
|
}
|
|
71
43
|
};
|
|
72
|
-
const expandItemModel =
|
|
73
|
-
if (modelToExpand.isGroup)
|
|
74
|
-
modelToExpand.isExpanded = true;
|
|
44
|
+
const expandItemModel = modelToExpand => {
|
|
45
|
+
if (modelToExpand.isGroup) modelToExpand.isExpanded = true;
|
|
75
46
|
};
|
|
76
|
-
const collapseItemModel =
|
|
77
|
-
if (modelToCollapse.isGroup)
|
|
78
|
-
modelToCollapse.isExpanded = false;
|
|
47
|
+
const collapseItemModel = modelToCollapse => {
|
|
48
|
+
if (modelToCollapse.isGroup) modelToCollapse.isExpanded = false;
|
|
79
49
|
};
|
|
80
50
|
const expandAll = (treeRoot, triggerTreeRerender) => {
|
|
81
51
|
const shouldContinueWalking = true;
|
|
82
|
-
treeRoot.walk(
|
|
83
|
-
if (!node.isRoot())
|
|
84
|
-
expandItemModel(node.model);
|
|
52
|
+
treeRoot.walk(node => {
|
|
53
|
+
if (!node.isRoot()) expandItemModel(node.model);
|
|
85
54
|
return shouldContinueWalking;
|
|
86
55
|
});
|
|
87
56
|
triggerTreeRerender();
|
|
88
57
|
};
|
|
89
58
|
const collapseAll = (treeRoot, triggerTreeRerender) => {
|
|
90
|
-
const shouldContinueWalking = true;
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
59
|
+
const shouldContinueWalking = true; // tree-model ask we return true if we want to continue walking
|
|
60
|
+
|
|
61
|
+
treeRoot.walk(node => {
|
|
62
|
+
if (!node.isRoot()) collapseItemModel(node.model);
|
|
94
63
|
return shouldContinueWalking;
|
|
95
64
|
});
|
|
96
65
|
triggerTreeRerender();
|
|
97
66
|
};
|
|
98
|
-
const getToggleExpandShouldExpand =
|
|
67
|
+
const getToggleExpandShouldExpand = treeRoot => {
|
|
99
68
|
let shouldExpand = false;
|
|
100
|
-
const shouldContinueWalking = true;
|
|
101
|
-
|
|
69
|
+
const shouldContinueWalking = true; // tree-model ask we return true if we want to continue walking
|
|
70
|
+
|
|
71
|
+
treeRoot.walk(node => {
|
|
102
72
|
if (!node.isRoot()) {
|
|
103
73
|
if (!node.model.isExpanded && node.model.isGroup) {
|
|
104
|
-
shouldExpand = true;
|
|
74
|
+
shouldExpand = true; // eslint-disable-next-line no-useless-return
|
|
75
|
+
|
|
105
76
|
return shouldContinueWalking;
|
|
106
77
|
}
|
|
107
78
|
}
|
|
79
|
+
|
|
108
80
|
return shouldContinueWalking;
|
|
109
81
|
});
|
|
110
82
|
return shouldExpand;
|
|
111
83
|
};
|
|
112
84
|
const toggleExpandAllHelper = (isExpand, treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState) => {
|
|
113
|
-
if (isExpand === true)
|
|
114
|
-
expandAll(treeRoot, triggerTreeRerender);
|
|
115
|
-
else if (isExpand === false)
|
|
116
|
-
collapseAll(treeRoot, triggerTreeRerender);
|
|
117
|
-
else {
|
|
85
|
+
if (isExpand === true) expandAll(treeRoot, triggerTreeRerender);else if (isExpand === false) collapseAll(treeRoot, triggerTreeRerender);else {
|
|
118
86
|
const shouldExpand = getToggleExpandShouldExpand(treeRoot);
|
|
119
|
-
if (shouldExpand === true)
|
|
120
|
-
expandAll(treeRoot, triggerTreeRerender);
|
|
121
|
-
else
|
|
122
|
-
collapseAll(treeRoot, triggerTreeRerender);
|
|
87
|
+
if (shouldExpand === true) expandAll(treeRoot, triggerTreeRerender);else collapseAll(treeRoot, triggerTreeRerender);
|
|
123
88
|
}
|
|
124
89
|
setLatestToggledItem(null);
|
|
125
90
|
updateUserExpandedState();
|
|
126
91
|
};
|
|
127
|
-
const useNotifyExpandedChange = (propsWithDefaults, {
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
(0
|
|
133
|
-
|
|
134
|
-
|
|
92
|
+
const useNotifyExpandedChange = (propsWithDefaults, _ref) => {
|
|
93
|
+
let {
|
|
94
|
+
latestToggledItem,
|
|
95
|
+
expandedGroups
|
|
96
|
+
} = _ref;
|
|
97
|
+
const notifyExpandedChange = React.useCallback(expandedGroupHashmap => propsWithDefaults === null || propsWithDefaults === void 0 ? void 0 : propsWithDefaults.onExpandChange(expandedGroupHashmap || {}, latestToggledItem), [propsWithDefaults, latestToggledItem]);
|
|
98
|
+
React.useEffect(() => {
|
|
99
|
+
if (!propsWithDefaults.expanded) notifyExpandedChange(expandedGroups);
|
|
135
100
|
}, [expandedGroups, notifyExpandedChange, propsWithDefaults.expanded]);
|
|
136
101
|
};
|
|
137
|
-
|
|
138
|
-
|
|
102
|
+
|
|
103
|
+
exports.collapseAll = collapseAll;
|
|
104
|
+
exports.collapseItemModel = collapseItemModel;
|
|
105
|
+
exports.expandAll = expandAll;
|
|
106
|
+
exports.expandItemModel = expandItemModel;
|
|
107
|
+
exports.getToggleExpandShouldExpand = getToggleExpandShouldExpand;
|
|
108
|
+
exports.toggleExpandAllHelper = toggleExpandAllHelper;
|
|
109
|
+
exports.toggleItemExpand = toggleItemExpand;
|
|
110
|
+
exports.updateExpandedState = updateExpandedState;
|
|
111
|
+
exports.useNotifyExpandedChange = useNotifyExpandedChange;
|
|
@@ -1,116 +1,127 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
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 keyboard_helpers_exports = {};
|
|
29
|
-
__export(keyboard_helpers_exports, {
|
|
30
|
-
useGlobalKeyboardListener: () => useGlobalKeyboardListener,
|
|
31
|
-
useGlobalToggleAllExpandShortcut: () => useGlobalToggleAllExpandShortcut,
|
|
32
|
-
useOnItemKeyDown: () => useOnItemKeyDown
|
|
33
|
-
});
|
|
34
|
-
var React = __toESM(require("react"));
|
|
35
|
-
var import_react = require("react");
|
|
36
|
-
var import_TreeViewContext = __toESM(require("../TreeViewContext"));
|
|
37
|
-
var import_tree_helpers = require("./tree-helpers");
|
|
38
|
-
var import_group_expands_helpers = require("./group-expands-helpers");
|
|
39
|
-
const useOnItemKeyDown = (item) => {
|
|
40
|
-
const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var TreeViewContext = require('../TreeViewContext.js');
|
|
7
|
+
var treeHelpers = require('./tree-helpers.js');
|
|
8
|
+
var groupExpandsHelpers = require('./group-expands-helpers.js');
|
|
9
|
+
|
|
10
|
+
/* eslint-disable max-params */
|
|
11
|
+
// 9 tab
|
|
12
|
+
// 13 enter
|
|
13
|
+
// 32 space
|
|
14
|
+
// 37 left arrow
|
|
15
|
+
// 38 up arrow
|
|
16
|
+
// 39 right arrow
|
|
17
|
+
// 40 down arrow
|
|
18
|
+
// 35 end
|
|
19
|
+
// 36 home
|
|
20
|
+
// 56 number 8
|
|
21
|
+
// 106 (NumPad) *
|
|
22
|
+
const useOnItemKeyDown = (item, draggableProps) => {
|
|
23
|
+
const ctx = React.useContext(TreeViewContext["default"]);
|
|
41
24
|
const {
|
|
42
|
-
props: {
|
|
25
|
+
props: {
|
|
26
|
+
onItemFocus
|
|
27
|
+
},
|
|
43
28
|
triggerTreeRerender,
|
|
44
|
-
isDragging,
|
|
45
29
|
visibleItems,
|
|
46
30
|
setFocusedItem,
|
|
47
31
|
setSelectedItem,
|
|
48
32
|
setLatestToggledItem,
|
|
49
33
|
updateUserExpandedState,
|
|
50
|
-
virtualListHelpers: {
|
|
34
|
+
virtualListHelpers: {
|
|
35
|
+
scrollToIndex
|
|
36
|
+
}
|
|
51
37
|
} = ctx;
|
|
52
|
-
const {
|
|
53
|
-
|
|
38
|
+
const {
|
|
39
|
+
isGroup,
|
|
40
|
+
isExpanded
|
|
41
|
+
} = item;
|
|
42
|
+
const onItemFocusCurry = React.useCallback(newFocusItem => onItemFocus({
|
|
54
43
|
itemIndex: newFocusItem.virtualIndex,
|
|
55
|
-
scrollToItem: (
|
|
44
|
+
scrollToItem: function () {
|
|
45
|
+
let opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
|
46
|
+
align: 'start'
|
|
47
|
+
};
|
|
48
|
+
return scrollToIndex(newFocusItem.virtualIndex, opts);
|
|
49
|
+
},
|
|
56
50
|
item: newFocusItem
|
|
57
51
|
}), [onItemFocus, scrollToIndex]);
|
|
58
|
-
const onItemKeyDown =
|
|
59
|
-
const {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
52
|
+
const onItemKeyDown = React.useCallback(e => {
|
|
53
|
+
const {
|
|
54
|
+
keyCode
|
|
55
|
+
} = e;
|
|
56
|
+
|
|
57
|
+
if (!(draggableProps && draggableProps.active)) {
|
|
58
|
+
if (keyCode !== 9) e.preventDefault(); // allow tab/shift+tab
|
|
59
|
+
|
|
60
|
+
if ((keyCode === 13 || keyCode === 32) && e.target.tagName === 'LI') {
|
|
64
61
|
setSelectedItem(item);
|
|
62
|
+
}
|
|
63
|
+
|
|
65
64
|
if (keyCode === 37) {
|
|
66
65
|
if (isGroup && isExpanded) {
|
|
67
|
-
|
|
66
|
+
groupExpandsHelpers.toggleItemExpand(item, triggerTreeRerender, updateUserExpandedState, scrollToIndex);
|
|
68
67
|
setLatestToggledItem(item);
|
|
69
68
|
}
|
|
70
69
|
}
|
|
70
|
+
|
|
71
71
|
if (keyCode === 39) {
|
|
72
72
|
if (isGroup && !isExpanded) {
|
|
73
|
-
|
|
73
|
+
groupExpandsHelpers.toggleItemExpand(item, triggerTreeRerender, updateUserExpandedState, scrollToIndex);
|
|
74
74
|
setLatestToggledItem(item);
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
|
-
|
|
78
|
-
|
|
77
|
+
|
|
78
|
+
const {
|
|
79
|
+
virtualIndex
|
|
80
|
+
} = item;
|
|
81
|
+
|
|
82
|
+
if (typeof virtualIndex === 'number') {
|
|
79
83
|
const lastItemIndex = visibleItems.length - 1;
|
|
84
|
+
|
|
80
85
|
if (keyCode === 38) {
|
|
81
86
|
const isLoopedFocus = virtualIndex === 0;
|
|
82
87
|
const newFocusIndex = isLoopedFocus ? lastItemIndex : virtualIndex - 1;
|
|
83
88
|
const newFocusItem = visibleItems[newFocusIndex];
|
|
84
89
|
scrollToIndex(newFocusIndex);
|
|
90
|
+
|
|
85
91
|
if (isLoopedFocus) {
|
|
92
|
+
// when looping the list from start to end we need to wait a bit before focusing
|
|
86
93
|
setTimeout(() => {
|
|
87
94
|
setFocusedItem(newFocusItem);
|
|
88
|
-
|
|
95
|
+
treeHelpers.focusItem(newFocusItem);
|
|
89
96
|
onItemFocusCurry(newFocusItem);
|
|
90
97
|
}, 300);
|
|
91
98
|
} else {
|
|
92
99
|
setFocusedItem(newFocusItem);
|
|
93
100
|
onItemFocusCurry(newFocusItem);
|
|
94
|
-
|
|
101
|
+
treeHelpers.focusItem(newFocusItem);
|
|
95
102
|
}
|
|
96
103
|
}
|
|
104
|
+
|
|
97
105
|
if (keyCode === 40) {
|
|
98
106
|
const isLoopedFocus = virtualIndex === lastItemIndex;
|
|
99
107
|
const newFocusIndex = isLoopedFocus ? 0 : virtualIndex + 1;
|
|
100
108
|
const newFocusItem = visibleItems[newFocusIndex];
|
|
101
109
|
scrollToIndex(newFocusIndex);
|
|
110
|
+
|
|
102
111
|
if (isLoopedFocus) {
|
|
112
|
+
// when looping the list from start to end we need to wait a bit before focusing
|
|
103
113
|
setTimeout(() => {
|
|
104
114
|
setFocusedItem(newFocusItem);
|
|
105
115
|
onItemFocusCurry(newFocusItem);
|
|
106
|
-
|
|
116
|
+
treeHelpers.focusItem(newFocusItem);
|
|
107
117
|
}, 300);
|
|
108
118
|
} else {
|
|
109
119
|
setFocusedItem(newFocusItem);
|
|
110
120
|
onItemFocusCurry(newFocusItem);
|
|
111
|
-
|
|
121
|
+
treeHelpers.focusItem(newFocusItem);
|
|
112
122
|
}
|
|
113
123
|
}
|
|
124
|
+
|
|
114
125
|
if (keyCode === 35) {
|
|
115
126
|
if (virtualIndex !== lastItemIndex) {
|
|
116
127
|
const newFocusItem = visibleItems[lastItemIndex];
|
|
@@ -118,10 +129,11 @@ const useOnItemKeyDown = (item) => {
|
|
|
118
129
|
setTimeout(() => {
|
|
119
130
|
setFocusedItem(newFocusItem);
|
|
120
131
|
onItemFocusCurry(newFocusItem);
|
|
121
|
-
|
|
132
|
+
treeHelpers.focusItem(newFocusItem);
|
|
122
133
|
}, 300);
|
|
123
134
|
}
|
|
124
135
|
}
|
|
136
|
+
|
|
125
137
|
if (keyCode === 36) {
|
|
126
138
|
if (virtualIndex !== 0) {
|
|
127
139
|
const newFocusItem = visibleItems[0];
|
|
@@ -129,42 +141,35 @@ const useOnItemKeyDown = (item) => {
|
|
|
129
141
|
setTimeout(() => {
|
|
130
142
|
setFocusedItem(newFocusItem);
|
|
131
143
|
onItemFocusCurry(newFocusItem);
|
|
132
|
-
|
|
144
|
+
treeHelpers.focusItem(newFocusItem);
|
|
133
145
|
}, 300);
|
|
134
146
|
}
|
|
135
147
|
}
|
|
136
148
|
}
|
|
137
149
|
}
|
|
138
|
-
}, [
|
|
139
|
-
isDragging,
|
|
140
|
-
setSelectedItem,
|
|
141
|
-
item,
|
|
142
|
-
isGroup,
|
|
143
|
-
isExpanded,
|
|
144
|
-
triggerTreeRerender,
|
|
145
|
-
scrollToIndex,
|
|
146
|
-
setLatestToggledItem,
|
|
147
|
-
visibleItems,
|
|
148
|
-
setFocusedItem,
|
|
149
|
-
onItemFocusCurry,
|
|
150
|
-
updateUserExpandedState
|
|
151
|
-
]);
|
|
150
|
+
}, [draggableProps, setSelectedItem, item, isGroup, isExpanded, triggerTreeRerender, updateUserExpandedState, scrollToIndex, setLatestToggledItem, visibleItems, setFocusedItem, onItemFocusCurry]);
|
|
152
151
|
return onItemKeyDown;
|
|
153
152
|
};
|
|
154
|
-
const useGlobalKeyboardListener =
|
|
155
|
-
|
|
156
|
-
document.addEventListener(
|
|
157
|
-
return () => document.removeEventListener(
|
|
153
|
+
const useGlobalKeyboardListener = func => {
|
|
154
|
+
React.useEffect(() => {
|
|
155
|
+
document.addEventListener('keydown', func);
|
|
156
|
+
return () => document.removeEventListener('keydown', func);
|
|
158
157
|
}, [func]);
|
|
159
158
|
};
|
|
160
159
|
const useGlobalToggleAllExpandShortcut = (treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState) => {
|
|
161
|
-
const memoizedToggleAllKeyboardShortcut =
|
|
162
|
-
const {
|
|
160
|
+
const memoizedToggleAllKeyboardShortcut = React.useCallback(e => {
|
|
161
|
+
const {
|
|
162
|
+
shiftKey,
|
|
163
|
+
keyCode
|
|
164
|
+
} = e;
|
|
165
|
+
|
|
163
166
|
if (shiftKey && keyCode === 56) {
|
|
164
|
-
|
|
167
|
+
groupExpandsHelpers.toggleExpandAllHelper('toggle', treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState);
|
|
165
168
|
}
|
|
166
169
|
}, [setLatestToggledItem, treeRoot, triggerTreeRerender, updateUserExpandedState]);
|
|
167
170
|
return useGlobalKeyboardListener(memoizedToggleAllKeyboardShortcut);
|
|
168
171
|
};
|
|
169
|
-
|
|
170
|
-
|
|
172
|
+
|
|
173
|
+
exports.useGlobalKeyboardListener = useGlobalKeyboardListener;
|
|
174
|
+
exports.useGlobalToggleAllExpandShortcut = useGlobalToggleAllExpandShortcut;
|
|
175
|
+
exports.useOnItemKeyDown = useOnItemKeyDown;
|
|
@@ -1,76 +1,69 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
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 object_helpers_exports = {};
|
|
29
|
-
__export(object_helpers_exports, {
|
|
30
|
-
filterObject: () => filterObject,
|
|
31
|
-
unfreeze: () => unfreeze
|
|
32
|
-
});
|
|
33
|
-
var React = __toESM(require("react"));
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
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/esnext.async-iterator.reduce.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.reduce.js');
|
|
10
|
+
|
|
11
|
+
/* eslint-disable no-sequences */
|
|
12
|
+
|
|
13
|
+
/* eslint-disable no-return-assign */
|
|
14
|
+
|
|
15
|
+
/* eslint-disable no-restricted-syntax */
|
|
16
|
+
|
|
17
|
+
/* eslint-disable guard-for-in */
|
|
34
18
|
function isObjectADate(o) {
|
|
35
|
-
|
|
19
|
+
var _o$constructor;
|
|
20
|
+
|
|
21
|
+
return (o === null || o === void 0 ? void 0 : (_o$constructor = o.constructor) === null || _o$constructor === void 0 ? void 0 : _o$constructor.name) === 'Date';
|
|
36
22
|
}
|
|
23
|
+
|
|
37
24
|
function isObjectAnArray(o) {
|
|
38
25
|
return Array.isArray(o);
|
|
39
26
|
}
|
|
27
|
+
|
|
40
28
|
function isObjectAString(o) {
|
|
41
|
-
return typeof o ===
|
|
29
|
+
return typeof o === 'object';
|
|
42
30
|
}
|
|
43
|
-
|
|
31
|
+
|
|
32
|
+
const unfreeze = o => {
|
|
44
33
|
let oo;
|
|
34
|
+
|
|
45
35
|
if (o === null) {
|
|
46
36
|
oo = null;
|
|
47
|
-
} else if (o ===
|
|
48
|
-
oo =
|
|
37
|
+
} else if (o === undefined) {
|
|
38
|
+
oo = undefined;
|
|
49
39
|
} else if (isObjectADate(o)) {
|
|
50
40
|
oo = new Date(o);
|
|
51
41
|
} else if (isObjectAnArray(o)) {
|
|
52
42
|
oo = [];
|
|
53
|
-
o.forEach(
|
|
43
|
+
o.forEach(v => {
|
|
54
44
|
oo.push(v);
|
|
55
45
|
});
|
|
56
46
|
} else if (isObjectAString(o)) {
|
|
57
47
|
oo = String(o);
|
|
58
48
|
} else if (isObjectAString(o)) {
|
|
59
49
|
oo = {};
|
|
50
|
+
|
|
60
51
|
for (const property in o) {
|
|
61
52
|
oo[property] = o[property];
|
|
62
53
|
}
|
|
63
54
|
} else {
|
|
64
55
|
oo = o;
|
|
65
56
|
}
|
|
57
|
+
|
|
66
58
|
return oo;
|
|
67
59
|
};
|
|
60
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
68
61
|
function filterObject(obj, predicate) {
|
|
69
62
|
return Object.keys(obj).reduce((res, key) => {
|
|
70
|
-
if (predicate(obj[key]))
|
|
71
|
-
res[key] = obj[key];
|
|
63
|
+
if (predicate(obj[key])) res[key] = obj[key];
|
|
72
64
|
return res;
|
|
73
65
|
}, {});
|
|
74
66
|
}
|
|
75
|
-
|
|
76
|
-
|
|
67
|
+
|
|
68
|
+
exports.filterObject = filterObject;
|
|
69
|
+
exports.unfreeze = unfreeze;
|
|
@@ -1,46 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
-
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
10
|
+
|
|
11
|
+
// allow multiple refs to be set to point to the same DOM element
|
|
12
|
+
const setMultipleRefs = function () {
|
|
13
|
+
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
14
|
+
refs[_key] = arguments[_key];
|
|
17
15
|
}
|
|
18
|
-
|
|
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 refs_helpers_exports = {};
|
|
29
|
-
__export(refs_helpers_exports, {
|
|
30
|
-
setMultipleRefs: () => setMultipleRefs
|
|
31
|
-
});
|
|
32
|
-
var React = __toESM(require("react"));
|
|
33
|
-
const setMultipleRefs = (...refs) => {
|
|
16
|
+
|
|
34
17
|
const filteredRefs = refs.filter(Boolean);
|
|
35
|
-
if (!filteredRefs.length)
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
};
|
|
41
|
-
return (newRef) => {
|
|
42
|
-
filteredRefs.forEach((refToBeUpdated) => {
|
|
43
|
-
if (typeof refToBeUpdated === "function") {
|
|
18
|
+
if (!filteredRefs.length) return () => {};
|
|
19
|
+
if (filteredRefs.length === 0) return () => {};
|
|
20
|
+
return newRef => {
|
|
21
|
+
filteredRefs.forEach(refToBeUpdated => {
|
|
22
|
+
if (typeof refToBeUpdated === 'function') {
|
|
44
23
|
refToBeUpdated(newRef);
|
|
45
24
|
} else if (refToBeUpdated) {
|
|
46
25
|
refToBeUpdated.current = newRef;
|
|
@@ -48,5 +27,5 @@ const setMultipleRefs = (...refs) => {
|
|
|
48
27
|
});
|
|
49
28
|
};
|
|
50
29
|
};
|
|
51
|
-
|
|
52
|
-
|
|
30
|
+
|
|
31
|
+
exports.setMultipleRefs = setMultipleRefs;
|