@mui/x-tree-view 6.0.0-alpha.3 → 6.0.0-alpha.4
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/CHANGELOG.md +83 -0
- package/TreeItem/TreeItem.js +18 -31
- package/TreeItem/useTreeItem.js +18 -27
- package/TreeView/TreeView.d.ts +4 -1
- package/TreeView/TreeView.js +65 -708
- package/TreeView/TreeView.types.d.ts +4 -147
- package/index.d.ts +1 -0
- package/index.js +3 -2
- package/{TreeView/descendants.d.ts → internals/TreeViewProvider/DescendantProvider.d.ts} +1 -5
- package/internals/TreeViewProvider/TreeViewContext.d.ts +7 -0
- package/{TreeView → internals/TreeViewProvider}/TreeViewContext.js +8 -18
- package/internals/TreeViewProvider/TreeViewProvider.d.ts +9 -0
- package/internals/TreeViewProvider/TreeViewProvider.js +21 -0
- package/internals/TreeViewProvider/TreeViewProvider.types.d.ts +18 -0
- package/internals/TreeViewProvider/index.d.ts +2 -0
- package/internals/TreeViewProvider/index.js +1 -0
- package/internals/TreeViewProvider/useTreeViewContext.d.ts +3 -0
- package/internals/TreeViewProvider/useTreeViewContext.js +3 -0
- package/internals/corePlugins/corePlugins.d.ts +7 -0
- package/internals/corePlugins/corePlugins.js +6 -0
- package/internals/corePlugins/index.d.ts +2 -0
- package/internals/corePlugins/index.js +1 -0
- package/internals/corePlugins/useTreeViewInstanceEvents/index.d.ts +2 -0
- package/internals/corePlugins/useTreeViewInstanceEvents/index.js +1 -0
- package/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.d.ts +8 -0
- package/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js +35 -0
- package/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.types.d.ts +21 -0
- package/internals/hooks/useInstanceEventHandler.d.ts +15 -0
- package/internals/hooks/useInstanceEventHandler.js +82 -0
- package/internals/models/events.d.ts +9 -0
- package/internals/models/helpers.d.ts +13 -0
- package/internals/models/helpers.js +1 -0
- package/internals/models/index.d.ts +3 -0
- package/internals/models/index.js +3 -0
- package/internals/models/plugin.d.ts +69 -0
- package/internals/models/plugin.js +1 -0
- package/internals/models/treeView.d.ts +23 -0
- package/internals/models/treeView.js +1 -0
- package/internals/plugins/defaultPlugins.d.ts +10 -0
- package/internals/plugins/defaultPlugins.js +9 -0
- package/internals/plugins/index.d.ts +2 -0
- package/internals/plugins/index.js +1 -0
- package/internals/plugins/useTreeViewContextValueBuilder/index.d.ts +2 -0
- package/internals/plugins/useTreeViewContextValueBuilder/index.js +1 -0
- package/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.d.ts +3 -0
- package/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.js +24 -0
- package/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.types.d.ts +34 -0
- package/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.types.js +1 -0
- package/internals/plugins/useTreeViewExpansion/index.d.ts +2 -0
- package/internals/plugins/useTreeViewExpansion/index.js +1 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.d.ts +3 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +63 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +32 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.js +1 -0
- package/internals/plugins/useTreeViewFocus/index.d.ts +2 -0
- package/internals/plugins/useTreeViewFocus/index.js +1 -0
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.d.ts +3 -0
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +77 -0
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.d.ts +25 -0
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.js +1 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/index.d.ts +2 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/index.js +1 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.d.ts +3 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +223 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +14 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.js +1 -0
- package/internals/plugins/useTreeViewNodes/index.d.ts +2 -0
- package/internals/plugins/useTreeViewNodes/index.js +1 -0
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.d.ts +3 -0
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.js +60 -0
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.d.ts +27 -0
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.js +1 -0
- package/internals/plugins/useTreeViewSelection/index.d.ts +2 -0
- package/internals/plugins/useTreeViewSelection/index.js +1 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.d.ts +3 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +172 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +49 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.js +1 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.d.ts +17 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +55 -0
- package/internals/useTreeView/index.d.ts +2 -0
- package/internals/useTreeView/index.js +1 -0
- package/internals/useTreeView/useTreeView.d.ts +3 -0
- package/internals/useTreeView/useTreeView.js +65 -0
- package/internals/useTreeView/useTreeView.types.d.ts +20 -0
- package/internals/useTreeView/useTreeView.types.js +1 -0
- package/internals/useTreeView/useTreeView.utils.d.ts +8 -0
- package/internals/useTreeView/useTreeView.utils.js +43 -0
- package/internals/useTreeView/useTreeViewModels.d.ts +6 -0
- package/internals/useTreeView/useTreeViewModels.js +63 -0
- package/internals/utils/EventManager.d.ts +29 -0
- package/internals/utils/EventManager.js +69 -0
- package/internals/utils/cleanupTracking/CleanupTracking.d.ts +9 -0
- package/internals/utils/cleanupTracking/CleanupTracking.js +1 -0
- package/internals/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.d.ts +7 -0
- package/internals/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js +18 -0
- package/internals/utils/cleanupTracking/TimerBasedCleanupTracking.d.ts +10 -0
- package/internals/utils/cleanupTracking/TimerBasedCleanupTracking.js +38 -0
- package/internals/utils/publishTreeViewEvent.d.ts +5 -0
- package/internals/utils/publishTreeViewEvent.js +3 -0
- package/legacy/TreeItem/TreeItem.js +21 -32
- package/legacy/TreeItem/useTreeItem.js +18 -27
- package/legacy/TreeView/TreeView.js +65 -766
- package/legacy/index.js +3 -2
- package/legacy/internals/TreeViewProvider/TreeViewContext.js +21 -0
- package/legacy/internals/TreeViewProvider/TreeViewProvider.js +19 -0
- package/legacy/internals/TreeViewProvider/TreeViewProvider.types.js +1 -0
- package/legacy/internals/TreeViewProvider/index.js +1 -0
- package/legacy/internals/TreeViewProvider/useTreeViewContext.js +5 -0
- package/legacy/internals/corePlugins/corePlugins.js +6 -0
- package/legacy/internals/corePlugins/index.js +1 -0
- package/legacy/internals/corePlugins/useTreeViewInstanceEvents/index.js +1 -0
- package/legacy/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js +45 -0
- package/legacy/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.types.js +1 -0
- package/legacy/internals/hooks/useInstanceEventHandler.js +87 -0
- package/legacy/internals/models/events.js +1 -0
- package/legacy/internals/models/helpers.js +1 -0
- package/legacy/internals/models/index.js +3 -0
- package/legacy/internals/models/plugin.js +1 -0
- package/legacy/internals/models/treeView.js +1 -0
- package/legacy/internals/plugins/defaultPlugins.js +9 -0
- package/legacy/internals/plugins/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewContextValueBuilder/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.js +25 -0
- package/legacy/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewExpansion/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +66 -0
- package/legacy/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewFocus/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +87 -0
- package/legacy/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewKeyboardNavigation/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +226 -0
- package/legacy/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewNodes/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewNodes/useTreeViewNodes.js +71 -0
- package/legacy/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewSelection/index.js +1 -0
- package/legacy/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +188 -0
- package/legacy/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.js +1 -0
- package/legacy/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +55 -0
- package/legacy/internals/useTreeView/index.js +1 -0
- package/legacy/internals/useTreeView/useTreeView.js +71 -0
- package/legacy/internals/useTreeView/useTreeView.types.js +1 -0
- package/legacy/internals/useTreeView/useTreeView.utils.js +46 -0
- package/legacy/internals/useTreeView/useTreeViewModels.js +76 -0
- package/legacy/internals/utils/EventManager.js +91 -0
- package/legacy/internals/utils/cleanupTracking/CleanupTracking.js +1 -0
- package/legacy/internals/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js +29 -0
- package/legacy/internals/utils/cleanupTracking/TimerBasedCleanupTracking.js +52 -0
- package/legacy/internals/utils/publishTreeViewEvent.js +3 -0
- package/modern/TreeItem/TreeItem.js +18 -31
- package/modern/TreeItem/useTreeItem.js +18 -27
- package/modern/TreeView/TreeView.js +65 -707
- package/modern/index.js +3 -2
- package/modern/{TreeView → internals/TreeViewProvider}/TreeViewContext.js +8 -18
- package/modern/internals/TreeViewProvider/TreeViewProvider.js +21 -0
- package/modern/internals/TreeViewProvider/TreeViewProvider.types.js +1 -0
- package/modern/internals/TreeViewProvider/index.js +1 -0
- package/modern/internals/TreeViewProvider/useTreeViewContext.js +3 -0
- package/modern/internals/corePlugins/corePlugins.js +6 -0
- package/modern/internals/corePlugins/index.js +1 -0
- package/modern/internals/corePlugins/useTreeViewInstanceEvents/index.js +1 -0
- package/modern/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js +35 -0
- package/modern/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.types.js +1 -0
- package/modern/internals/hooks/useInstanceEventHandler.js +77 -0
- package/modern/internals/models/events.js +1 -0
- package/modern/internals/models/helpers.js +1 -0
- package/modern/internals/models/index.js +3 -0
- package/modern/internals/models/plugin.js +1 -0
- package/modern/internals/models/treeView.js +1 -0
- package/modern/internals/plugins/defaultPlugins.js +9 -0
- package/modern/internals/plugins/index.js +1 -0
- package/modern/internals/plugins/useTreeViewContextValueBuilder/index.js +1 -0
- package/modern/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.js +24 -0
- package/modern/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.types.js +1 -0
- package/modern/internals/plugins/useTreeViewExpansion/index.js +1 -0
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +57 -0
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.js +1 -0
- package/modern/internals/plugins/useTreeViewFocus/index.js +1 -0
- package/modern/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +72 -0
- package/modern/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.js +1 -0
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/index.js +1 -0
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +222 -0
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.js +1 -0
- package/modern/internals/plugins/useTreeViewNodes/index.js +1 -0
- package/modern/internals/plugins/useTreeViewNodes/useTreeViewNodes.js +60 -0
- package/modern/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.js +1 -0
- package/modern/internals/plugins/useTreeViewSelection/index.js +1 -0
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +169 -0
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.js +1 -0
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +55 -0
- package/modern/internals/useTreeView/index.js +1 -0
- package/modern/internals/useTreeView/useTreeView.js +65 -0
- package/modern/internals/useTreeView/useTreeView.types.js +1 -0
- package/modern/internals/useTreeView/useTreeView.utils.js +43 -0
- package/modern/internals/useTreeView/useTreeViewModels.js +63 -0
- package/modern/internals/utils/EventManager.js +69 -0
- package/modern/internals/utils/cleanupTracking/CleanupTracking.js +1 -0
- package/modern/internals/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js +18 -0
- package/modern/internals/utils/cleanupTracking/TimerBasedCleanupTracking.js +38 -0
- package/modern/internals/utils/publishTreeViewEvent.js +3 -0
- package/node/TreeItem/TreeItem.js +20 -33
- package/node/TreeItem/useTreeItem.js +18 -29
- package/node/TreeView/TreeView.js +65 -707
- package/node/index.js +14 -2
- package/node/{TreeView → internals/TreeViewProvider}/TreeViewContext.js +10 -19
- package/node/internals/TreeViewProvider/TreeViewProvider.js +29 -0
- package/node/internals/TreeViewProvider/index.js +12 -0
- package/node/internals/TreeViewProvider/useTreeViewContext.js +12 -0
- package/node/internals/corePlugins/corePlugins.js +13 -0
- package/node/internals/corePlugins/index.js +12 -0
- package/node/internals/corePlugins/useTreeViewInstanceEvents/index.js +12 -0
- package/node/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js +44 -0
- package/node/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.types.js +5 -0
- package/node/internals/hooks/useInstanceEventHandler.js +88 -0
- package/node/internals/models/events.js +5 -0
- package/node/internals/models/helpers.js +5 -0
- package/node/internals/models/index.js +38 -0
- package/node/internals/models/plugin.js +5 -0
- package/node/internals/models/treeView.js +5 -0
- package/node/internals/plugins/defaultPlugins.js +16 -0
- package/node/internals/plugins/index.js +12 -0
- package/node/internals/plugins/useTreeViewContextValueBuilder/index.js +12 -0
- package/node/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.js +32 -0
- package/node/internals/plugins/useTreeViewContextValueBuilder/useTreeViewContextValueBuilder.types.js +5 -0
- package/node/internals/plugins/useTreeViewExpansion/index.js +12 -0
- package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +67 -0
- package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.js +5 -0
- package/node/internals/plugins/useTreeViewFocus/index.js +12 -0
- package/node/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +82 -0
- package/node/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.js +5 -0
- package/node/internals/plugins/useTreeViewKeyboardNavigation/index.js +12 -0
- package/node/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +232 -0
- package/node/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.js +5 -0
- package/node/internals/plugins/useTreeViewNodes/index.js +12 -0
- package/node/internals/plugins/useTreeViewNodes/useTreeViewNodes.js +70 -0
- package/node/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.js +5 -0
- package/node/internals/plugins/useTreeViewSelection/index.js +12 -0
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +179 -0
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.js +5 -0
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +62 -0
- package/node/internals/useTreeView/index.js +12 -0
- package/node/internals/useTreeView/useTreeView.js +75 -0
- package/node/internals/useTreeView/useTreeView.types.js +5 -0
- package/node/internals/useTreeView/useTreeView.utils.js +54 -0
- package/node/internals/useTreeView/useTreeViewModels.js +73 -0
- package/node/internals/utils/EventManager.js +76 -0
- package/node/internals/utils/cleanupTracking/CleanupTracking.js +5 -0
- package/node/internals/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js +25 -0
- package/node/internals/utils/cleanupTracking/TimerBasedCleanupTracking.js +45 -0
- package/node/internals/utils/publishTreeViewEvent.js +10 -0
- package/package.json +1 -1
- package/themeAugmentation/props.d.ts +1 -1
- package/TreeView/TreeViewContext.d.ts +0 -6
- package/internals/models.d.ts +0 -1
- package/legacy/TreeView/TreeViewContext.js +0 -41
- /package/{TreeView/descendants.js → internals/TreeViewProvider/DescendantProvider.js} +0 -0
- /package/internals/{models.js → TreeViewProvider/TreeViewProvider.types.js} +0 -0
- /package/{legacy/internals/models.js → internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.types.js} +0 -0
- /package/{modern/internals/models.js → internals/models/events.js} +0 -0
- /package/legacy/{TreeView/descendants.js → internals/TreeViewProvider/DescendantProvider.js} +0 -0
- /package/modern/{TreeView/descendants.js → internals/TreeViewProvider/DescendantProvider.js} +0 -0
- /package/node/{TreeView/descendants.js → internals/TreeViewProvider/DescendantProvider.js} +0 -0
- /package/node/internals/{models.js → TreeViewProvider/TreeViewProvider.types.js} +0 -0
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useTreeViewFocus = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
11
|
+
var _ownerDocument = _interopRequireDefault(require("@mui/utils/ownerDocument"));
|
|
12
|
+
var _useTreeView = require("../../useTreeView/useTreeView.utils");
|
|
13
|
+
var _useInstanceEventHandler = require("../../hooks/useInstanceEventHandler");
|
|
14
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
16
|
+
const useTreeViewFocus = ({
|
|
17
|
+
instance,
|
|
18
|
+
params,
|
|
19
|
+
state,
|
|
20
|
+
setState,
|
|
21
|
+
models,
|
|
22
|
+
rootRef
|
|
23
|
+
}) => {
|
|
24
|
+
const setFocusedNodeId = (0, _useEventCallback.default)(nodeId => {
|
|
25
|
+
const cleanNodeId = typeof nodeId === 'function' ? nodeId(state.focusedNodeId) : nodeId;
|
|
26
|
+
setState(prevState => (0, _extends2.default)({}, prevState, {
|
|
27
|
+
focusedNodeId: cleanNodeId
|
|
28
|
+
}));
|
|
29
|
+
});
|
|
30
|
+
const isNodeFocused = React.useCallback(nodeId => state.focusedNodeId === nodeId, [state.focusedNodeId]);
|
|
31
|
+
const focusNode = (0, _useEventCallback.default)((event, nodeId) => {
|
|
32
|
+
if (nodeId) {
|
|
33
|
+
setFocusedNodeId(nodeId);
|
|
34
|
+
if (params.onNodeFocus) {
|
|
35
|
+
params.onNodeFocus(event, nodeId);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
(0, _useTreeView.populateInstance)(instance, {
|
|
40
|
+
isNodeFocused,
|
|
41
|
+
focusNode
|
|
42
|
+
});
|
|
43
|
+
(0, _useInstanceEventHandler.useInstanceEventHandler)(instance, 'removeNode', ({
|
|
44
|
+
id
|
|
45
|
+
}) => {
|
|
46
|
+
setFocusedNodeId(oldFocusedNodeId => {
|
|
47
|
+
if (oldFocusedNodeId === id && rootRef.current === (0, _ownerDocument.default)(rootRef.current).activeElement) {
|
|
48
|
+
return instance.getChildrenIds(null)[0];
|
|
49
|
+
}
|
|
50
|
+
return oldFocusedNodeId;
|
|
51
|
+
});
|
|
52
|
+
});
|
|
53
|
+
const createHandleFocus = otherHandlers => event => {
|
|
54
|
+
otherHandlers.onFocus?.(event);
|
|
55
|
+
|
|
56
|
+
// if the event bubbled (which is React specific) we don't want to steal focus
|
|
57
|
+
if (event.target === event.currentTarget) {
|
|
58
|
+
const firstSelected = Array.isArray(models.selected.value) ? models.selected.value[0] : models.selected.value;
|
|
59
|
+
instance.focusNode(event, firstSelected || instance.getNavigableChildrenIds(null)[0]);
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
const createHandleBlur = otherHandlers => event => {
|
|
63
|
+
otherHandlers.onBlur?.(event);
|
|
64
|
+
setFocusedNodeId(null);
|
|
65
|
+
};
|
|
66
|
+
const focusedNode = instance.getNode(state.focusedNodeId);
|
|
67
|
+
const activeDescendant = focusedNode ? focusedNode.idAttribute : null;
|
|
68
|
+
return {
|
|
69
|
+
getRootProps: otherHandlers => ({
|
|
70
|
+
onFocus: createHandleFocus(otherHandlers),
|
|
71
|
+
onBlur: createHandleBlur(otherHandlers),
|
|
72
|
+
'aria-activedescendant': activeDescendant ?? undefined
|
|
73
|
+
})
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
exports.useTreeViewFocus = useTreeViewFocus;
|
|
77
|
+
useTreeViewFocus.getInitialState = () => ({
|
|
78
|
+
focusedNodeId: null
|
|
79
|
+
});
|
|
80
|
+
useTreeViewFocus.getDefaultizedParams = params => (0, _extends2.default)({}, params, {
|
|
81
|
+
disabledItemsFocusable: params.disabledItemsFocusable ?? false
|
|
82
|
+
});
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "useTreeViewKeyboardNavigation", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _useTreeViewKeyboardNavigation = require("./useTreeViewKeyboardNavigation");
|
|
@@ -0,0 +1,232 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useTreeViewKeyboardNavigation = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _styles = require("@mui/material/styles");
|
|
11
|
+
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
12
|
+
var _useTreeView = require("../../useTreeView/useTreeView.utils");
|
|
13
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
function isPrintableCharacter(string) {
|
|
16
|
+
return string && string.length === 1 && string.match(/\S/);
|
|
17
|
+
}
|
|
18
|
+
function findNextFirstChar(firstChars, startIndex, char) {
|
|
19
|
+
for (let i = startIndex; i < firstChars.length; i += 1) {
|
|
20
|
+
if (char === firstChars[i]) {
|
|
21
|
+
return i;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
return -1;
|
|
25
|
+
}
|
|
26
|
+
const useTreeViewKeyboardNavigation = ({
|
|
27
|
+
instance,
|
|
28
|
+
params,
|
|
29
|
+
state
|
|
30
|
+
}) => {
|
|
31
|
+
const theme = (0, _styles.useTheme)();
|
|
32
|
+
const isRtl = theme.direction === 'rtl';
|
|
33
|
+
const firstCharMap = React.useRef({});
|
|
34
|
+
const mapFirstChar = (0, _useEventCallback.default)((nodeId, firstChar) => {
|
|
35
|
+
firstCharMap.current[nodeId] = firstChar;
|
|
36
|
+
return () => {
|
|
37
|
+
const newMap = (0, _extends2.default)({}, firstCharMap.current);
|
|
38
|
+
delete newMap[nodeId];
|
|
39
|
+
firstCharMap.current = newMap;
|
|
40
|
+
};
|
|
41
|
+
});
|
|
42
|
+
(0, _useTreeView.populateInstance)(instance, {
|
|
43
|
+
mapFirstChar
|
|
44
|
+
});
|
|
45
|
+
const handleNextArrow = event => {
|
|
46
|
+
if (state.focusedNodeId != null && instance.isNodeExpandable(state.focusedNodeId)) {
|
|
47
|
+
if (instance.isNodeExpanded(state.focusedNodeId)) {
|
|
48
|
+
instance.focusNode(event, (0, _useTreeView.getNextNode)(instance, state.focusedNodeId));
|
|
49
|
+
} else if (!instance.isNodeDisabled(state.focusedNodeId)) {
|
|
50
|
+
instance.toggleNodeExpansion(event, state.focusedNodeId);
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
return true;
|
|
54
|
+
};
|
|
55
|
+
const handlePreviousArrow = event => {
|
|
56
|
+
if (state.focusedNodeId == null) {
|
|
57
|
+
return false;
|
|
58
|
+
}
|
|
59
|
+
if (instance.isNodeExpanded(state.focusedNodeId) && !instance.isNodeDisabled(state.focusedNodeId)) {
|
|
60
|
+
instance.toggleNodeExpansion(event, state.focusedNodeId);
|
|
61
|
+
return true;
|
|
62
|
+
}
|
|
63
|
+
const parent = instance.getNode(state.focusedNodeId).parentId;
|
|
64
|
+
if (parent) {
|
|
65
|
+
instance.focusNode(event, parent);
|
|
66
|
+
return true;
|
|
67
|
+
}
|
|
68
|
+
return false;
|
|
69
|
+
};
|
|
70
|
+
const focusByFirstCharacter = (event, nodeId, firstChar) => {
|
|
71
|
+
let start;
|
|
72
|
+
let index;
|
|
73
|
+
const lowercaseChar = firstChar.toLowerCase();
|
|
74
|
+
const firstCharIds = [];
|
|
75
|
+
const firstChars = [];
|
|
76
|
+
// This really only works since the ids are strings
|
|
77
|
+
Object.keys(firstCharMap.current).forEach(mapNodeId => {
|
|
78
|
+
const map = instance.getNode(mapNodeId);
|
|
79
|
+
const visible = map.parentId ? instance.isNodeExpanded(map.parentId) : true;
|
|
80
|
+
const shouldBeSkipped = params.disabledItemsFocusable ? false : instance.isNodeDisabled(mapNodeId);
|
|
81
|
+
if (visible && !shouldBeSkipped) {
|
|
82
|
+
firstCharIds.push(mapNodeId);
|
|
83
|
+
firstChars.push(firstCharMap.current[mapNodeId]);
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
|
|
87
|
+
// Get start index for search based on position of currentItem
|
|
88
|
+
start = firstCharIds.indexOf(nodeId) + 1;
|
|
89
|
+
if (start >= firstCharIds.length) {
|
|
90
|
+
start = 0;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
// Check remaining slots in the menu
|
|
94
|
+
index = findNextFirstChar(firstChars, start, lowercaseChar);
|
|
95
|
+
|
|
96
|
+
// If not found in remaining slots, check from beginning
|
|
97
|
+
if (index === -1) {
|
|
98
|
+
index = findNextFirstChar(firstChars, 0, lowercaseChar);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// If match was found...
|
|
102
|
+
if (index > -1) {
|
|
103
|
+
instance.focusNode(event, firstCharIds[index]);
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
const selectNextNode = (event, id) => {
|
|
107
|
+
if (!instance.isNodeDisabled((0, _useTreeView.getNextNode)(instance, id))) {
|
|
108
|
+
instance.selectRange(event, {
|
|
109
|
+
end: (0, _useTreeView.getNextNode)(instance, id),
|
|
110
|
+
current: id
|
|
111
|
+
}, true);
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
const selectPreviousNode = (event, nodeId) => {
|
|
115
|
+
if (!instance.isNodeDisabled((0, _useTreeView.getPreviousNode)(instance, nodeId))) {
|
|
116
|
+
instance.selectRange(event, {
|
|
117
|
+
end: (0, _useTreeView.getPreviousNode)(instance, nodeId),
|
|
118
|
+
current: nodeId
|
|
119
|
+
}, true);
|
|
120
|
+
}
|
|
121
|
+
};
|
|
122
|
+
const createHandleKeyDown = otherHandlers => event => {
|
|
123
|
+
otherHandlers.onKeyDown?.(event);
|
|
124
|
+
let flag = false;
|
|
125
|
+
const key = event.key;
|
|
126
|
+
|
|
127
|
+
// If the tree is empty there will be no focused node
|
|
128
|
+
if (event.altKey || event.currentTarget !== event.target || state.focusedNodeId == null) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
const ctrlPressed = event.ctrlKey || event.metaKey;
|
|
132
|
+
switch (key) {
|
|
133
|
+
case ' ':
|
|
134
|
+
if (!params.disableSelection && !instance.isNodeDisabled(state.focusedNodeId)) {
|
|
135
|
+
flag = true;
|
|
136
|
+
if (params.multiSelect && event.shiftKey) {
|
|
137
|
+
instance.selectRange(event, {
|
|
138
|
+
end: state.focusedNodeId
|
|
139
|
+
});
|
|
140
|
+
} else if (params.multiSelect) {
|
|
141
|
+
instance.selectNode(event, state.focusedNodeId, true);
|
|
142
|
+
} else {
|
|
143
|
+
instance.selectNode(event, state.focusedNodeId);
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
event.stopPropagation();
|
|
147
|
+
break;
|
|
148
|
+
case 'Enter':
|
|
149
|
+
if (!instance.isNodeDisabled(state.focusedNodeId)) {
|
|
150
|
+
if (instance.isNodeExpandable(state.focusedNodeId)) {
|
|
151
|
+
instance.toggleNodeExpansion(event, state.focusedNodeId);
|
|
152
|
+
flag = true;
|
|
153
|
+
} else if (!params.disableSelection) {
|
|
154
|
+
flag = true;
|
|
155
|
+
if (params.multiSelect) {
|
|
156
|
+
instance.selectNode(event, state.focusedNodeId, true);
|
|
157
|
+
} else {
|
|
158
|
+
instance.selectNode(event, state.focusedNodeId);
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
event.stopPropagation();
|
|
163
|
+
break;
|
|
164
|
+
case 'ArrowDown':
|
|
165
|
+
if (params.multiSelect && event.shiftKey && !params.disableSelection) {
|
|
166
|
+
selectNextNode(event, state.focusedNodeId);
|
|
167
|
+
}
|
|
168
|
+
instance.focusNode(event, (0, _useTreeView.getNextNode)(instance, state.focusedNodeId));
|
|
169
|
+
flag = true;
|
|
170
|
+
break;
|
|
171
|
+
case 'ArrowUp':
|
|
172
|
+
if (params.multiSelect && event.shiftKey && !params.disableSelection) {
|
|
173
|
+
selectPreviousNode(event, state.focusedNodeId);
|
|
174
|
+
}
|
|
175
|
+
instance.focusNode(event, (0, _useTreeView.getPreviousNode)(instance, state.focusedNodeId));
|
|
176
|
+
flag = true;
|
|
177
|
+
break;
|
|
178
|
+
case 'ArrowRight':
|
|
179
|
+
if (isRtl) {
|
|
180
|
+
flag = handlePreviousArrow(event);
|
|
181
|
+
} else {
|
|
182
|
+
flag = handleNextArrow(event);
|
|
183
|
+
}
|
|
184
|
+
break;
|
|
185
|
+
case 'ArrowLeft':
|
|
186
|
+
if (isRtl) {
|
|
187
|
+
flag = handleNextArrow(event);
|
|
188
|
+
} else {
|
|
189
|
+
flag = handlePreviousArrow(event);
|
|
190
|
+
}
|
|
191
|
+
break;
|
|
192
|
+
case 'Home':
|
|
193
|
+
if (params.multiSelect && ctrlPressed && event.shiftKey && !params.disableSelection && !instance.isNodeDisabled(state.focusedNodeId)) {
|
|
194
|
+
instance.rangeSelectToFirst(event, state.focusedNodeId);
|
|
195
|
+
}
|
|
196
|
+
instance.focusNode(event, (0, _useTreeView.getFirstNode)(instance));
|
|
197
|
+
flag = true;
|
|
198
|
+
break;
|
|
199
|
+
case 'End':
|
|
200
|
+
if (params.multiSelect && ctrlPressed && event.shiftKey && !params.disableSelection && !instance.isNodeDisabled(state.focusedNodeId)) {
|
|
201
|
+
instance.rangeSelectToLast(event, state.focusedNodeId);
|
|
202
|
+
}
|
|
203
|
+
instance.focusNode(event, (0, _useTreeView.getLastNode)(instance));
|
|
204
|
+
flag = true;
|
|
205
|
+
break;
|
|
206
|
+
default:
|
|
207
|
+
if (key === '*') {
|
|
208
|
+
instance.expandAllSiblings(event, state.focusedNodeId);
|
|
209
|
+
flag = true;
|
|
210
|
+
} else if (params.multiSelect && ctrlPressed && key.toLowerCase() === 'a' && !params.disableSelection) {
|
|
211
|
+
instance.selectRange(event, {
|
|
212
|
+
start: (0, _useTreeView.getFirstNode)(instance),
|
|
213
|
+
end: (0, _useTreeView.getLastNode)(instance)
|
|
214
|
+
});
|
|
215
|
+
flag = true;
|
|
216
|
+
} else if (!ctrlPressed && !event.shiftKey && isPrintableCharacter(key)) {
|
|
217
|
+
focusByFirstCharacter(event, state.focusedNodeId, key);
|
|
218
|
+
flag = true;
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
if (flag) {
|
|
222
|
+
event.preventDefault();
|
|
223
|
+
event.stopPropagation();
|
|
224
|
+
}
|
|
225
|
+
};
|
|
226
|
+
return {
|
|
227
|
+
getRootProps: otherHandlers => ({
|
|
228
|
+
onKeyDown: createHandleKeyDown(otherHandlers)
|
|
229
|
+
})
|
|
230
|
+
};
|
|
231
|
+
};
|
|
232
|
+
exports.useTreeViewKeyboardNavigation = useTreeViewKeyboardNavigation;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "useTreeViewNodes", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useTreeViewNodes.useTreeViewNodes;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _useTreeViewNodes = require("./useTreeViewNodes");
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useTreeViewNodes = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
11
|
+
var _useTreeView = require("../../useTreeView/useTreeView.utils");
|
|
12
|
+
var _publishTreeViewEvent = require("../../utils/publishTreeViewEvent");
|
|
13
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
const useTreeViewNodes = ({
|
|
16
|
+
instance,
|
|
17
|
+
params
|
|
18
|
+
}) => {
|
|
19
|
+
const nodeMap = React.useRef({});
|
|
20
|
+
const getNode = React.useCallback(nodeId => nodeMap.current[nodeId], []);
|
|
21
|
+
const insertNode = React.useCallback(node => {
|
|
22
|
+
nodeMap.current[node.id] = node;
|
|
23
|
+
}, []);
|
|
24
|
+
const removeNode = React.useCallback(nodeId => {
|
|
25
|
+
const newMap = (0, _extends2.default)({}, nodeMap.current);
|
|
26
|
+
delete newMap[nodeId];
|
|
27
|
+
nodeMap.current = newMap;
|
|
28
|
+
(0, _publishTreeViewEvent.publishTreeViewEvent)(instance, 'removeNode', {
|
|
29
|
+
id: nodeId
|
|
30
|
+
});
|
|
31
|
+
}, [instance]);
|
|
32
|
+
const isNodeDisabled = React.useCallback(nodeId => {
|
|
33
|
+
if (nodeId == null) {
|
|
34
|
+
return false;
|
|
35
|
+
}
|
|
36
|
+
let node = instance.getNode(nodeId);
|
|
37
|
+
|
|
38
|
+
// This can be called before the node has been added to the node map.
|
|
39
|
+
if (!node) {
|
|
40
|
+
return false;
|
|
41
|
+
}
|
|
42
|
+
if (node.disabled) {
|
|
43
|
+
return true;
|
|
44
|
+
}
|
|
45
|
+
while (node.parentId != null) {
|
|
46
|
+
node = instance.getNode(node.parentId);
|
|
47
|
+
if (node.disabled) {
|
|
48
|
+
return true;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
return false;
|
|
52
|
+
}, [instance]);
|
|
53
|
+
const getChildrenIds = (0, _useEventCallback.default)(nodeId => Object.values(nodeMap.current).filter(node => node.parentId === nodeId).sort((a, b) => a.index - b.index).map(child => child.id));
|
|
54
|
+
const getNavigableChildrenIds = nodeId => {
|
|
55
|
+
let childrenIds = instance.getChildrenIds(nodeId);
|
|
56
|
+
if (!params.disabledItemsFocusable) {
|
|
57
|
+
childrenIds = childrenIds.filter(node => !instance.isNodeDisabled(node));
|
|
58
|
+
}
|
|
59
|
+
return childrenIds;
|
|
60
|
+
};
|
|
61
|
+
(0, _useTreeView.populateInstance)(instance, {
|
|
62
|
+
getNode,
|
|
63
|
+
updateNode: insertNode,
|
|
64
|
+
removeNode,
|
|
65
|
+
getChildrenIds,
|
|
66
|
+
getNavigableChildrenIds,
|
|
67
|
+
isNodeDisabled
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
exports.useTreeViewNodes = useTreeViewNodes;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "useTreeViewSelection", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useTreeViewSelection.useTreeViewSelection;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _useTreeViewSelection = require("./useTreeViewSelection");
|
|
@@ -0,0 +1,179 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useTreeViewSelection = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _useTreeView = require("../../useTreeView/useTreeView.utils");
|
|
11
|
+
var _useTreeViewSelection = require("./useTreeViewSelection.utils");
|
|
12
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
+
const useTreeViewSelection = ({
|
|
15
|
+
instance,
|
|
16
|
+
params,
|
|
17
|
+
models
|
|
18
|
+
}) => {
|
|
19
|
+
const lastSelectedNode = React.useRef(null);
|
|
20
|
+
const lastSelectionWasRange = React.useRef(false);
|
|
21
|
+
const currentRangeSelection = React.useRef([]);
|
|
22
|
+
const isNodeSelected = nodeId => Array.isArray(models.selected.value) ? models.selected.value.indexOf(nodeId) !== -1 : models.selected.value === nodeId;
|
|
23
|
+
const selectNode = (event, nodeId, multiple = false) => {
|
|
24
|
+
if (params.disableSelection) {
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
if (multiple) {
|
|
28
|
+
if (Array.isArray(models.selected.value)) {
|
|
29
|
+
let newSelected;
|
|
30
|
+
if (models.selected.value.indexOf(nodeId) !== -1) {
|
|
31
|
+
newSelected = models.selected.value.filter(id => id !== nodeId);
|
|
32
|
+
} else {
|
|
33
|
+
newSelected = [nodeId].concat(models.selected.value);
|
|
34
|
+
}
|
|
35
|
+
if (params.onNodeSelect) {
|
|
36
|
+
params.onNodeSelect(event, newSelected);
|
|
37
|
+
}
|
|
38
|
+
models.selected.setValue(newSelected);
|
|
39
|
+
}
|
|
40
|
+
} else {
|
|
41
|
+
const newSelected = params.multiSelect ? [nodeId] : nodeId;
|
|
42
|
+
if (params.onNodeSelect) {
|
|
43
|
+
params.onNodeSelect(event, newSelected);
|
|
44
|
+
}
|
|
45
|
+
models.selected.setValue(newSelected);
|
|
46
|
+
}
|
|
47
|
+
lastSelectedNode.current = nodeId;
|
|
48
|
+
lastSelectionWasRange.current = false;
|
|
49
|
+
currentRangeSelection.current = [];
|
|
50
|
+
};
|
|
51
|
+
const getNodesInRange = (nodeAId, nodeBId) => {
|
|
52
|
+
const [first, last] = (0, _useTreeViewSelection.findOrderInTremauxTree)(instance, nodeAId, nodeBId);
|
|
53
|
+
const nodes = [first];
|
|
54
|
+
let current = first;
|
|
55
|
+
while (current !== last) {
|
|
56
|
+
current = (0, _useTreeView.getNextNode)(instance, current);
|
|
57
|
+
nodes.push(current);
|
|
58
|
+
}
|
|
59
|
+
return nodes;
|
|
60
|
+
};
|
|
61
|
+
const handleRangeArrowSelect = (event, nodes) => {
|
|
62
|
+
let base = models.selected.value.slice();
|
|
63
|
+
const {
|
|
64
|
+
start,
|
|
65
|
+
next,
|
|
66
|
+
current
|
|
67
|
+
} = nodes;
|
|
68
|
+
if (!next || !current) {
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
if (currentRangeSelection.current.indexOf(current) === -1) {
|
|
72
|
+
currentRangeSelection.current = [];
|
|
73
|
+
}
|
|
74
|
+
if (lastSelectionWasRange.current) {
|
|
75
|
+
if (currentRangeSelection.current.indexOf(next) !== -1) {
|
|
76
|
+
base = base.filter(id => id === start || id !== current);
|
|
77
|
+
currentRangeSelection.current = currentRangeSelection.current.filter(id => id === start || id !== current);
|
|
78
|
+
} else {
|
|
79
|
+
base.push(next);
|
|
80
|
+
currentRangeSelection.current.push(next);
|
|
81
|
+
}
|
|
82
|
+
} else {
|
|
83
|
+
base.push(next);
|
|
84
|
+
currentRangeSelection.current.push(current, next);
|
|
85
|
+
}
|
|
86
|
+
if (params.onNodeSelect) {
|
|
87
|
+
params.onNodeSelect(event, base);
|
|
88
|
+
}
|
|
89
|
+
models.selected.setValue(base);
|
|
90
|
+
};
|
|
91
|
+
const handleRangeSelect = (event, nodes) => {
|
|
92
|
+
let base = models.selected.value.slice();
|
|
93
|
+
const {
|
|
94
|
+
start,
|
|
95
|
+
end
|
|
96
|
+
} = nodes;
|
|
97
|
+
// If last selection was a range selection ignore nodes that were selected.
|
|
98
|
+
if (lastSelectionWasRange.current) {
|
|
99
|
+
base = base.filter(id => currentRangeSelection.current.indexOf(id) === -1);
|
|
100
|
+
}
|
|
101
|
+
let range = getNodesInRange(start, end);
|
|
102
|
+
range = range.filter(node => !instance.isNodeDisabled(node));
|
|
103
|
+
currentRangeSelection.current = range;
|
|
104
|
+
let newSelected = base.concat(range);
|
|
105
|
+
newSelected = newSelected.filter((id, i) => newSelected.indexOf(id) === i);
|
|
106
|
+
if (params.onNodeSelect) {
|
|
107
|
+
params.onNodeSelect(event, newSelected);
|
|
108
|
+
}
|
|
109
|
+
models.selected.setValue(newSelected);
|
|
110
|
+
};
|
|
111
|
+
const selectRange = (event, nodes, stacked = false) => {
|
|
112
|
+
if (params.disableSelection) {
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
const {
|
|
116
|
+
start = lastSelectedNode.current,
|
|
117
|
+
end,
|
|
118
|
+
current
|
|
119
|
+
} = nodes;
|
|
120
|
+
if (stacked) {
|
|
121
|
+
handleRangeArrowSelect(event, {
|
|
122
|
+
start,
|
|
123
|
+
next: end,
|
|
124
|
+
current
|
|
125
|
+
});
|
|
126
|
+
} else if (start != null && end != null) {
|
|
127
|
+
handleRangeSelect(event, {
|
|
128
|
+
start,
|
|
129
|
+
end
|
|
130
|
+
});
|
|
131
|
+
}
|
|
132
|
+
lastSelectionWasRange.current = true;
|
|
133
|
+
};
|
|
134
|
+
const rangeSelectToFirst = (event, nodeId) => {
|
|
135
|
+
if (!lastSelectedNode.current) {
|
|
136
|
+
lastSelectedNode.current = nodeId;
|
|
137
|
+
}
|
|
138
|
+
const start = lastSelectionWasRange.current ? lastSelectedNode.current : nodeId;
|
|
139
|
+
instance.selectRange(event, {
|
|
140
|
+
start,
|
|
141
|
+
end: (0, _useTreeView.getFirstNode)(instance)
|
|
142
|
+
});
|
|
143
|
+
};
|
|
144
|
+
const rangeSelectToLast = (event, nodeId) => {
|
|
145
|
+
if (!lastSelectedNode.current) {
|
|
146
|
+
lastSelectedNode.current = nodeId;
|
|
147
|
+
}
|
|
148
|
+
const start = lastSelectionWasRange.current ? lastSelectedNode.current : nodeId;
|
|
149
|
+
instance.selectRange(event, {
|
|
150
|
+
start,
|
|
151
|
+
end: (0, _useTreeView.getLastNode)(instance)
|
|
152
|
+
});
|
|
153
|
+
};
|
|
154
|
+
(0, _useTreeView.populateInstance)(instance, {
|
|
155
|
+
isNodeSelected,
|
|
156
|
+
selectNode,
|
|
157
|
+
selectRange,
|
|
158
|
+
rangeSelectToLast,
|
|
159
|
+
rangeSelectToFirst
|
|
160
|
+
});
|
|
161
|
+
return {
|
|
162
|
+
getRootProps: () => ({
|
|
163
|
+
'aria-multiselectable': params.multiSelect
|
|
164
|
+
})
|
|
165
|
+
};
|
|
166
|
+
};
|
|
167
|
+
exports.useTreeViewSelection = useTreeViewSelection;
|
|
168
|
+
useTreeViewSelection.models = {
|
|
169
|
+
selected: {
|
|
170
|
+
controlledProp: 'selected',
|
|
171
|
+
defaultProp: 'defaultSelected'
|
|
172
|
+
}
|
|
173
|
+
};
|
|
174
|
+
const DEFAULT_SELECTED = [];
|
|
175
|
+
useTreeViewSelection.getDefaultizedParams = params => (0, _extends2.default)({}, params, {
|
|
176
|
+
disableSelection: params.disableSelection ?? false,
|
|
177
|
+
multiSelect: params.multiSelect ?? false,
|
|
178
|
+
defaultSelected: params.defaultSelected ?? (params.multiSelect ? DEFAULT_SELECTED : null)
|
|
179
|
+
});
|