@mui/x-tree-view 8.0.0-alpha.13 → 8.0.0-alpha.14
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 +131 -0
- package/RichTreeView/RichTreeView.js +24 -5
- package/SimpleTreeView/SimpleTreeView.js +8 -6
- package/TreeItem/TreeItem.d.ts +2 -0
- package/TreeItem/TreeItem.js +46 -5
- package/TreeItem/TreeItem.types.d.ts +14 -0
- package/TreeItemIcon/TreeItemIcon.js +2 -0
- package/esm/RichTreeView/RichTreeView.js +24 -5
- package/esm/SimpleTreeView/SimpleTreeView.js +8 -6
- package/esm/TreeItem/TreeItem.d.ts +2 -0
- package/esm/TreeItem/TreeItem.js +45 -4
- package/esm/TreeItem/TreeItem.types.d.ts +14 -0
- package/esm/TreeItemIcon/TreeItemIcon.js +2 -0
- package/esm/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
- package/esm/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
- package/esm/hooks/useTreeViewApiRef.d.ts +1 -1
- package/esm/index.js +1 -1
- package/esm/internals/index.d.ts +6 -1
- package/esm/internals/index.js +4 -1
- package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
- package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
- package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
- package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
- package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
- package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
- package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
- package/esm/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
- package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
- package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
- package/esm/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
- package/esm/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
- package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
- package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
- package/esm/internals/utils/selectors.d.ts +7 -0
- package/esm/internals/utils/selectors.js +9 -0
- package/esm/useTreeItem/useTreeItem.d.ts +1 -1
- package/esm/useTreeItem/useTreeItem.js +13 -0
- package/esm/useTreeItem/useTreeItem.types.d.ts +21 -0
- package/esm/utils/cache.d.ts +38 -0
- package/esm/utils/cache.js +31 -0
- package/esm/utils/index.d.ts +1 -0
- package/esm/utils/index.js +1 -0
- package/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
- package/hooks/useTreeItemUtils/useTreeItemUtils.js +22 -10
- package/hooks/useTreeViewApiRef.d.ts +1 -1
- package/index.js +1 -1
- package/internals/index.d.ts +6 -1
- package/internals/index.js +33 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
- package/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
- package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
- package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +14 -1
- package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
- package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +1 -1
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
- package/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
- package/internals/plugins/useTreeViewLazyLoading/index.js +5 -0
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +33 -0
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +5 -0
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
- package/internals/utils/selectors.d.ts +7 -0
- package/internals/utils/selectors.js +9 -0
- package/modern/RichTreeView/RichTreeView.js +24 -5
- package/modern/SimpleTreeView/SimpleTreeView.js +8 -6
- package/modern/TreeItem/TreeItem.d.ts +2 -0
- package/modern/TreeItem/TreeItem.js +45 -4
- package/modern/TreeItem/TreeItem.types.d.ts +14 -0
- package/modern/TreeItemIcon/TreeItemIcon.js +2 -0
- package/modern/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
- package/modern/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
- package/modern/hooks/useTreeViewApiRef.d.ts +1 -1
- package/modern/index.js +1 -1
- package/modern/internals/index.d.ts +6 -1
- package/modern/internals/index.js +4 -1
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
- package/modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
- package/modern/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
- package/modern/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
- package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
- package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
- package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
- package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
- package/modern/internals/utils/selectors.d.ts +7 -0
- package/modern/internals/utils/selectors.js +9 -0
- package/modern/useTreeItem/useTreeItem.d.ts +1 -1
- package/modern/useTreeItem/useTreeItem.js +13 -0
- package/modern/useTreeItem/useTreeItem.types.d.ts +21 -0
- package/modern/utils/cache.d.ts +38 -0
- package/modern/utils/cache.js +31 -0
- package/modern/utils/index.d.ts +1 -0
- package/modern/utils/index.js +1 -0
- package/package.json +1 -1
- package/tsconfig.build.tsbuildinfo +1 -1
- package/useTreeItem/useTreeItem.d.ts +1 -1
- package/useTreeItem/useTreeItem.js +13 -0
- package/useTreeItem/useTreeItem.types.d.ts +21 -0
- package/utils/cache.d.ts +38 -0
- package/utils/cache.js +38 -0
- package/utils/index.d.ts +1 -0
- package/utils/index.js +16 -0
|
@@ -72,7 +72,7 @@ const useTreeViewKeyboardNavigation = ({
|
|
|
72
72
|
};
|
|
73
73
|
|
|
74
74
|
// ARIA specification: https://www.w3.org/WAI/ARIA/apg/patterns/treeview/#keyboardinteraction
|
|
75
|
-
const handleItemKeyDown = (event, itemId) => {
|
|
75
|
+
const handleItemKeyDown = async (event, itemId) => {
|
|
76
76
|
if (event.defaultMuiPrevented) {
|
|
77
77
|
return;
|
|
78
78
|
}
|
|
@@ -91,7 +91,7 @@ const useTreeViewKeyboardNavigation = ({
|
|
|
91
91
|
if (params.multiSelect && event.shiftKey) {
|
|
92
92
|
instance.expandSelectionRange(event, itemId);
|
|
93
93
|
} else {
|
|
94
|
-
instance.
|
|
94
|
+
instance.setItemSelection({
|
|
95
95
|
event,
|
|
96
96
|
itemId,
|
|
97
97
|
keepExistingSelection: params.multiSelect,
|
|
@@ -111,18 +111,21 @@ const useTreeViewKeyboardNavigation = ({
|
|
|
111
111
|
}) && !(0, _useTreeViewLabel2.selectorIsItemBeingEdited)(store.value, itemId)) {
|
|
112
112
|
instance.setEditedItemId(itemId);
|
|
113
113
|
} else if (canToggleItemExpansion(itemId)) {
|
|
114
|
-
instance.
|
|
114
|
+
instance.setItemExpansion({
|
|
115
|
+
event,
|
|
116
|
+
itemId
|
|
117
|
+
});
|
|
115
118
|
event.preventDefault();
|
|
116
119
|
} else if (canToggleItemSelection(itemId)) {
|
|
117
120
|
if (params.multiSelect) {
|
|
118
121
|
event.preventDefault();
|
|
119
|
-
instance.
|
|
122
|
+
instance.setItemSelection({
|
|
120
123
|
event,
|
|
121
124
|
itemId,
|
|
122
125
|
keepExistingSelection: true
|
|
123
126
|
});
|
|
124
127
|
} else if (!(0, _useTreeViewSelection.selectorIsItemSelected)(store.value, itemId)) {
|
|
125
|
-
instance.
|
|
128
|
+
instance.setItemSelection({
|
|
126
129
|
event,
|
|
127
130
|
itemId
|
|
128
131
|
});
|
|
@@ -180,7 +183,10 @@ const useTreeViewKeyboardNavigation = ({
|
|
|
180
183
|
event.preventDefault();
|
|
181
184
|
}
|
|
182
185
|
} else if (canToggleItemExpansion(itemId)) {
|
|
183
|
-
instance.
|
|
186
|
+
instance.setItemExpansion({
|
|
187
|
+
event,
|
|
188
|
+
itemId
|
|
189
|
+
});
|
|
184
190
|
event.preventDefault();
|
|
185
191
|
}
|
|
186
192
|
break;
|
|
@@ -194,7 +200,10 @@ const useTreeViewKeyboardNavigation = ({
|
|
|
194
200
|
return;
|
|
195
201
|
}
|
|
196
202
|
if (canToggleItemExpansion(itemId) && (0, _useTreeViewExpansion.selectorIsItemExpanded)(store.value, itemId)) {
|
|
197
|
-
instance.
|
|
203
|
+
instance.setItemExpansion({
|
|
204
|
+
event,
|
|
205
|
+
itemId
|
|
206
|
+
});
|
|
198
207
|
event.preventDefault();
|
|
199
208
|
} else {
|
|
200
209
|
const parent = (0, _useTreeViewItems.selectorItemParentId)(store.value, itemId);
|
package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ import { UseTreeViewFocusSignature } from "../useTreeViewFocus/index.js";
|
|
|
6
6
|
import { UseTreeViewExpansionSignature } from "../useTreeViewExpansion/index.js";
|
|
7
7
|
import { TreeViewItemId, TreeViewCancellableEvent } from "../../../models/index.js";
|
|
8
8
|
import { UseTreeViewLabelSignature } from "../useTreeViewLabel/index.js";
|
|
9
|
+
import { UseTreeViewLazyLoadingSignature } from "../useTreeViewLazyLoading/index.js";
|
|
9
10
|
export interface UseTreeViewKeyboardNavigationInstance {
|
|
10
11
|
/**
|
|
11
12
|
* Updates the `firstCharMap` to add/remove the first character of some item's labels.
|
|
@@ -25,7 +26,7 @@ export interface UseTreeViewKeyboardNavigationInstance {
|
|
|
25
26
|
export type UseTreeViewKeyboardNavigationSignature = TreeViewPluginSignature<{
|
|
26
27
|
instance: UseTreeViewKeyboardNavigationInstance;
|
|
27
28
|
dependencies: [UseTreeViewItemsSignature, UseTreeViewSelectionSignature, UseTreeViewFocusSignature, UseTreeViewExpansionSignature];
|
|
28
|
-
optionalDependencies: [UseTreeViewLabelSignature];
|
|
29
|
+
optionalDependencies: [UseTreeViewLabelSignature, UseTreeViewLazyLoadingSignature];
|
|
29
30
|
}>;
|
|
30
31
|
export type TreeViewFirstCharMap = {
|
|
31
32
|
[itemId: string]: string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type { UseTreeViewLazyLoadingSignature, UseTreeViewLazyLoadingParameters } from './useTreeViewLazyLoading.types';
|
|
@@ -0,0 +1,249 @@
|
|
|
1
|
+
import { TreeViewAnyPluginSignature, TreeViewState } from "../../models/index.js";
|
|
2
|
+
import { TreeViewRootSelector, TreeViewRootSelectorForOptionalPlugin } from "../../utils/selectors.js";
|
|
3
|
+
import { UseTreeViewLazyLoadingSignature } from "./useTreeViewLazyLoading.types.js";
|
|
4
|
+
export type Temp<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [], TOptionalSignatures extends [TSignature]>(state: TreeViewState<TSignatures, TOptionalSignatures>) => TSignature['state'][keyof TSignature['state']];
|
|
5
|
+
export declare const selectorDataSourceState: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
|
|
6
|
+
cacheKey: import("../../models").TreeViewStateCacheKey;
|
|
7
|
+
}) => {
|
|
8
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
9
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
10
|
+
}) & {
|
|
11
|
+
clearCache: () => void;
|
|
12
|
+
resultsCount: () => number;
|
|
13
|
+
resetResultsCount: () => void;
|
|
14
|
+
} & {
|
|
15
|
+
resultFunc: (resultFuncArgs_0: {
|
|
16
|
+
enabled: boolean;
|
|
17
|
+
dataSource: {
|
|
18
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
19
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
20
|
+
};
|
|
21
|
+
}) => {
|
|
22
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
23
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
24
|
+
};
|
|
25
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
26
|
+
enabled: boolean;
|
|
27
|
+
dataSource: {
|
|
28
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
29
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
30
|
+
};
|
|
31
|
+
}) => {
|
|
32
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
33
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
34
|
+
}) & {
|
|
35
|
+
clearCache: () => void;
|
|
36
|
+
resultsCount: () => number;
|
|
37
|
+
resetResultsCount: () => void;
|
|
38
|
+
};
|
|
39
|
+
lastResult: () => {
|
|
40
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
41
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
42
|
+
};
|
|
43
|
+
dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
|
|
44
|
+
recomputations: () => number;
|
|
45
|
+
resetRecomputations: () => void;
|
|
46
|
+
dependencyRecomputations: () => number;
|
|
47
|
+
resetDependencyRecomputations: () => void;
|
|
48
|
+
} & {
|
|
49
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
50
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
51
|
+
};
|
|
52
|
+
/**
|
|
53
|
+
* Check if lazy loading is enabled.
|
|
54
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
55
|
+
* @returns {boolean} True if lazy loading is enabled, false if it isn't.
|
|
56
|
+
*/
|
|
57
|
+
export declare const selectorIsLazyLoadingEnabled: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & Partial<import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState> & {
|
|
58
|
+
cacheKey: import("../../models").TreeViewStateCacheKey;
|
|
59
|
+
}) => boolean) & {
|
|
60
|
+
clearCache: () => void;
|
|
61
|
+
resultsCount: () => number;
|
|
62
|
+
resetResultsCount: () => void;
|
|
63
|
+
} & {
|
|
64
|
+
resultFunc: (resultFuncArgs_0: {
|
|
65
|
+
enabled: boolean;
|
|
66
|
+
dataSource: {
|
|
67
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
68
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
69
|
+
};
|
|
70
|
+
} | undefined) => boolean;
|
|
71
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
72
|
+
enabled: boolean;
|
|
73
|
+
dataSource: {
|
|
74
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
75
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
76
|
+
};
|
|
77
|
+
} | undefined) => boolean) & {
|
|
78
|
+
clearCache: () => void;
|
|
79
|
+
resultsCount: () => number;
|
|
80
|
+
resetResultsCount: () => void;
|
|
81
|
+
};
|
|
82
|
+
lastResult: () => boolean;
|
|
83
|
+
dependencies: [TreeViewRootSelectorForOptionalPlugin<UseTreeViewLazyLoadingSignature>];
|
|
84
|
+
recomputations: () => number;
|
|
85
|
+
resetRecomputations: () => void;
|
|
86
|
+
dependencyRecomputations: () => number;
|
|
87
|
+
resetDependencyRecomputations: () => void;
|
|
88
|
+
} & {
|
|
89
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
90
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
91
|
+
};
|
|
92
|
+
/**
|
|
93
|
+
* Get the loading state for a tree item.
|
|
94
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
95
|
+
* @param {TreeViewItemId} itemId The id of the item to get the loading state of.
|
|
96
|
+
* @returns {boolean} The loading state for the Tree Item.
|
|
97
|
+
*/
|
|
98
|
+
export declare const selectorIsItemLoading: ((state: any, itemId: string) => boolean) & {
|
|
99
|
+
clearCache: () => void;
|
|
100
|
+
resultsCount: () => number;
|
|
101
|
+
resetResultsCount: () => void;
|
|
102
|
+
} & {
|
|
103
|
+
resultFunc: (resultFuncArgs_0: {
|
|
104
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
105
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
106
|
+
}, resultFuncArgs_1: string) => boolean;
|
|
107
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
108
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
109
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
110
|
+
}, resultFuncArgs_1: string) => boolean) & {
|
|
111
|
+
clearCache: () => void;
|
|
112
|
+
resultsCount: () => number;
|
|
113
|
+
resetResultsCount: () => void;
|
|
114
|
+
};
|
|
115
|
+
lastResult: () => boolean;
|
|
116
|
+
dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
|
|
117
|
+
cacheKey: import("../../models").TreeViewStateCacheKey;
|
|
118
|
+
}) => {
|
|
119
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
120
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
121
|
+
}) & {
|
|
122
|
+
clearCache: () => void;
|
|
123
|
+
resultsCount: () => number;
|
|
124
|
+
resetResultsCount: () => void;
|
|
125
|
+
} & {
|
|
126
|
+
resultFunc: (resultFuncArgs_0: {
|
|
127
|
+
enabled: boolean;
|
|
128
|
+
dataSource: {
|
|
129
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
130
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
131
|
+
};
|
|
132
|
+
}) => {
|
|
133
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
134
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
135
|
+
};
|
|
136
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
137
|
+
enabled: boolean;
|
|
138
|
+
dataSource: {
|
|
139
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
140
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
141
|
+
};
|
|
142
|
+
}) => {
|
|
143
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
144
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
145
|
+
}) & {
|
|
146
|
+
clearCache: () => void;
|
|
147
|
+
resultsCount: () => number;
|
|
148
|
+
resetResultsCount: () => void;
|
|
149
|
+
};
|
|
150
|
+
lastResult: () => {
|
|
151
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
152
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
153
|
+
};
|
|
154
|
+
dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
|
|
155
|
+
recomputations: () => number;
|
|
156
|
+
resetRecomputations: () => void;
|
|
157
|
+
dependencyRecomputations: () => number;
|
|
158
|
+
resetDependencyRecomputations: () => void;
|
|
159
|
+
} & {
|
|
160
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
161
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
162
|
+
}, (_: any, itemId: string) => string];
|
|
163
|
+
recomputations: () => number;
|
|
164
|
+
resetRecomputations: () => void;
|
|
165
|
+
dependencyRecomputations: () => number;
|
|
166
|
+
resetDependencyRecomputations: () => void;
|
|
167
|
+
} & {
|
|
168
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
169
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
170
|
+
};
|
|
171
|
+
/**
|
|
172
|
+
* Get the error for a tree item.
|
|
173
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
174
|
+
* @param {TreeViewItemId} itemId The id of the item to get the error for.
|
|
175
|
+
* @returns {boolean} The error for the Tree Item.
|
|
176
|
+
*/
|
|
177
|
+
export declare const selectorGetTreeItemError: ((state: any, itemId: string) => Error | null) & {
|
|
178
|
+
clearCache: () => void;
|
|
179
|
+
resultsCount: () => number;
|
|
180
|
+
resetResultsCount: () => void;
|
|
181
|
+
} & {
|
|
182
|
+
resultFunc: (resultFuncArgs_0: {
|
|
183
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
184
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
185
|
+
}, resultFuncArgs_1: string) => Error | null;
|
|
186
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
187
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
188
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
189
|
+
}, resultFuncArgs_1: string) => Error | null) & {
|
|
190
|
+
clearCache: () => void;
|
|
191
|
+
resultsCount: () => number;
|
|
192
|
+
resetResultsCount: () => void;
|
|
193
|
+
};
|
|
194
|
+
lastResult: () => Error | null;
|
|
195
|
+
dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
|
|
196
|
+
cacheKey: import("../../models").TreeViewStateCacheKey;
|
|
197
|
+
}) => {
|
|
198
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
199
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
200
|
+
}) & {
|
|
201
|
+
clearCache: () => void;
|
|
202
|
+
resultsCount: () => number;
|
|
203
|
+
resetResultsCount: () => void;
|
|
204
|
+
} & {
|
|
205
|
+
resultFunc: (resultFuncArgs_0: {
|
|
206
|
+
enabled: boolean;
|
|
207
|
+
dataSource: {
|
|
208
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
209
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
210
|
+
};
|
|
211
|
+
}) => {
|
|
212
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
213
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
214
|
+
};
|
|
215
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
216
|
+
enabled: boolean;
|
|
217
|
+
dataSource: {
|
|
218
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
219
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
220
|
+
};
|
|
221
|
+
}) => {
|
|
222
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
223
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
224
|
+
}) & {
|
|
225
|
+
clearCache: () => void;
|
|
226
|
+
resultsCount: () => number;
|
|
227
|
+
resetResultsCount: () => void;
|
|
228
|
+
};
|
|
229
|
+
lastResult: () => {
|
|
230
|
+
loading: Record<import("../../..").TreeViewItemId, boolean>;
|
|
231
|
+
errors: Record<import("../../..").TreeViewItemId, Error | null>;
|
|
232
|
+
};
|
|
233
|
+
dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
|
|
234
|
+
recomputations: () => number;
|
|
235
|
+
resetRecomputations: () => void;
|
|
236
|
+
dependencyRecomputations: () => number;
|
|
237
|
+
resetDependencyRecomputations: () => void;
|
|
238
|
+
} & {
|
|
239
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
240
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
241
|
+
}, (_: any, itemId: string) => string];
|
|
242
|
+
recomputations: () => number;
|
|
243
|
+
resetRecomputations: () => void;
|
|
244
|
+
dependencyRecomputations: () => number;
|
|
245
|
+
resetDependencyRecomputations: () => void;
|
|
246
|
+
} & {
|
|
247
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
248
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
249
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.selectorIsLazyLoadingEnabled = exports.selectorIsItemLoading = exports.selectorGetTreeItemError = exports.selectorDataSourceState = void 0;
|
|
7
|
+
var _selectors = require("../../utils/selectors");
|
|
8
|
+
const selectorLazyLoading = state => state.lazyLoading;
|
|
9
|
+
const selectorLazyLoadingOptional = state => state.lazyLoading;
|
|
10
|
+
const selectorDataSourceState = exports.selectorDataSourceState = (0, _selectors.createSelector)([selectorLazyLoading], lazyLoading => lazyLoading.dataSource);
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Check if lazy loading is enabled.
|
|
14
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
15
|
+
* @returns {boolean} True if lazy loading is enabled, false if it isn't.
|
|
16
|
+
*/
|
|
17
|
+
const selectorIsLazyLoadingEnabled = exports.selectorIsLazyLoadingEnabled = (0, _selectors.createSelector)([selectorLazyLoadingOptional], lazyLoading => !!lazyLoading?.enabled);
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Get the loading state for a tree item.
|
|
21
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
22
|
+
* @param {TreeViewItemId} itemId The id of the item to get the loading state of.
|
|
23
|
+
* @returns {boolean} The loading state for the Tree Item.
|
|
24
|
+
*/
|
|
25
|
+
const selectorIsItemLoading = exports.selectorIsItemLoading = (0, _selectors.createSelector)([selectorDataSourceState, (_, itemId) => itemId], (dataSourceState, itemId) => dataSourceState.loading[itemId] || false);
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Get the error for a tree item.
|
|
29
|
+
* @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
|
|
30
|
+
* @param {TreeViewItemId} itemId The id of the item to get the error for.
|
|
31
|
+
* @returns {boolean} The error for the Tree Item.
|
|
32
|
+
*/
|
|
33
|
+
const selectorGetTreeItemError = exports.selectorGetTreeItemError = (0, _selectors.createSelector)([selectorDataSourceState, (_, itemId) => itemId], (dataSourceState, itemId) => dataSourceState.errors[itemId] || null);
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { DefaultizedProps } from '@mui/x-internals/types';
|
|
2
|
+
import { TreeViewPluginSignature } from "../../models/index.js";
|
|
3
|
+
import { DataSourceCache } from "../../../utils/index.js";
|
|
4
|
+
import { TreeViewItemId } from "../../../models/index.js";
|
|
5
|
+
import { UseTreeViewItemsSignature } from "../useTreeViewItems/index.js";
|
|
6
|
+
import { UseTreeViewExpansionSignature } from "../useTreeViewExpansion/index.js";
|
|
7
|
+
import { UseTreeViewSelectionSignature } from "../useTreeViewSelection/index.js";
|
|
8
|
+
type DataSource<R extends {}> = {
|
|
9
|
+
/**
|
|
10
|
+
* Used to determine the number of children the item has.
|
|
11
|
+
* Only relevant for lazy-loaded trees.
|
|
12
|
+
*
|
|
13
|
+
* @template R
|
|
14
|
+
* @param {R} item The item to check.
|
|
15
|
+
* @returns {number} The number of children.
|
|
16
|
+
* @default (item) => number
|
|
17
|
+
*/
|
|
18
|
+
getChildrenCount?: (item: R) => number;
|
|
19
|
+
/**
|
|
20
|
+
* Method used for fetching the items.
|
|
21
|
+
* Only relevant for lazy-loaded tree views.
|
|
22
|
+
*
|
|
23
|
+
* @template R
|
|
24
|
+
* @param {TreeViewItemId} parentId The id of the item the children belong to.
|
|
25
|
+
* @returns { Promise<R[]>} The children of the item.
|
|
26
|
+
*/
|
|
27
|
+
getTreeItems?: (parentId?: TreeViewItemId) => Promise<R[]>;
|
|
28
|
+
};
|
|
29
|
+
export interface UseTreeViewLazyLoadingPublicAPI {}
|
|
30
|
+
export interface UseTreeViewLazyLoadingInstance extends UseTreeViewLazyLoadingPublicAPI {
|
|
31
|
+
/**
|
|
32
|
+
* Method used for fetching multiple items concurrently.
|
|
33
|
+
* Only relevant for lazy-loaded tree views.
|
|
34
|
+
*
|
|
35
|
+
* @param {TreeViewItemId[]} parentIds The ids of the items to fetch the children of.
|
|
36
|
+
* @returns { Promise<void>} The children of the items.
|
|
37
|
+
*/
|
|
38
|
+
fetchItems: (parentIds?: TreeViewItemId[]) => Promise<void>;
|
|
39
|
+
/**
|
|
40
|
+
* Method used for fetching and item's children.
|
|
41
|
+
* Only relevant for lazy-loaded tree views.
|
|
42
|
+
*
|
|
43
|
+
* @param {TreeViewItemId} itemId The The id of the item to fetch the children of.
|
|
44
|
+
* @returns { Promise<void>} The children of the item.
|
|
45
|
+
*/
|
|
46
|
+
fetchItemChildren: (itemId: TreeViewItemId) => Promise<void>;
|
|
47
|
+
/**
|
|
48
|
+
* Set the loading state of an item.
|
|
49
|
+
* @param {TreeViewItemId} itemId The id of the item to set the loading state of.
|
|
50
|
+
* @param {boolean} isLoading True if the item is loading.
|
|
51
|
+
*/
|
|
52
|
+
setDataSourceLoading: (itemId: TreeViewItemId, isLoading: boolean) => void;
|
|
53
|
+
/**
|
|
54
|
+
* Set the error state of an item.
|
|
55
|
+
* @param {TreeViewItemId} itemId The id of the item to set the error state of.
|
|
56
|
+
* @param {Error | null} error The error caught on the item.
|
|
57
|
+
*/
|
|
58
|
+
setDataSourceError: (itemId: TreeViewItemId, error: Error | null) => void;
|
|
59
|
+
}
|
|
60
|
+
export interface UseTreeViewLazyLoadingParameters<R extends {}> {
|
|
61
|
+
dataSource?: DataSource<R>;
|
|
62
|
+
dataSourceCache?: DataSourceCache;
|
|
63
|
+
}
|
|
64
|
+
export type UseTreeViewLazyLoadingDefaultizedParameters<R extends {}> = DefaultizedProps<UseTreeViewLazyLoadingParameters<R>, 'dataSource'>;
|
|
65
|
+
export interface UseTreeViewLazyLoadingState {
|
|
66
|
+
lazyLoading: {
|
|
67
|
+
enabled: boolean;
|
|
68
|
+
dataSource: {
|
|
69
|
+
loading: Record<TreeViewItemId, boolean>;
|
|
70
|
+
errors: Record<TreeViewItemId, Error | null>;
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
}
|
|
74
|
+
export type UseTreeViewLazyLoadingSignature = TreeViewPluginSignature<{
|
|
75
|
+
params: UseTreeViewLazyLoadingParameters<any>;
|
|
76
|
+
defaultizedParams: UseTreeViewLazyLoadingDefaultizedParameters<any>;
|
|
77
|
+
publicAPI: UseTreeViewLazyLoadingPublicAPI;
|
|
78
|
+
instance: UseTreeViewLazyLoadingInstance;
|
|
79
|
+
state: UseTreeViewLazyLoadingState;
|
|
80
|
+
experimentalFeatures: 'lazyLoading';
|
|
81
|
+
dependencies: [UseTreeViewItemsSignature, UseTreeViewExpansionSignature, UseTreeViewSelectionSignature];
|
|
82
|
+
}>;
|
|
83
|
+
export {};
|
|
@@ -69,9 +69,9 @@ const useTreeViewSelection = ({
|
|
|
69
69
|
}
|
|
70
70
|
models.selectedItems.setControlledValue(cleanModel);
|
|
71
71
|
};
|
|
72
|
-
const
|
|
73
|
-
event,
|
|
72
|
+
const setItemSelection = ({
|
|
74
73
|
itemId,
|
|
74
|
+
event = null,
|
|
75
75
|
keepExistingSelection = false,
|
|
76
76
|
shouldBeSelected
|
|
77
77
|
}) => {
|
|
@@ -185,10 +185,10 @@ const useTreeViewSelection = ({
|
|
|
185
185
|
'aria-multiselectable': params.multiSelect
|
|
186
186
|
}),
|
|
187
187
|
publicAPI: {
|
|
188
|
-
|
|
188
|
+
setItemSelection
|
|
189
189
|
},
|
|
190
190
|
instance: {
|
|
191
|
-
|
|
191
|
+
setItemSelection,
|
|
192
192
|
selectAllNavigableItems,
|
|
193
193
|
expandSelectionRange,
|
|
194
194
|
selectRangeFromStartToItem,
|
|
@@ -7,17 +7,17 @@ import { TreeViewSelectionPropagation, TreeViewCancellableEventHandler } from ".
|
|
|
7
7
|
export interface UseTreeViewSelectionPublicAPI {
|
|
8
8
|
/**
|
|
9
9
|
* Select or deselect an item.
|
|
10
|
-
* @param {object}
|
|
11
|
-
* @param {
|
|
12
|
-
* @param {
|
|
13
|
-
* @param {boolean}
|
|
14
|
-
* @param {boolean | undefined}
|
|
10
|
+
* @param {object} parameters The parameters of the method.
|
|
11
|
+
* @param {string} parameters.itemId The id of the item to select or deselect.
|
|
12
|
+
* @param {React.SyntheticEvent} parameters.event The DOM event that triggered the change.
|
|
13
|
+
* @param {boolean} parameters.keepExistingSelection If `true`, the other already selected items will remain selected, otherwise, they will be deselected. This parameter is only relevant when `multiSelect` is `true`
|
|
14
|
+
* @param {boolean | undefined} parameters.shouldBeSelected If `true` the item will be selected. If `false` the item will be deselected. If not defined, the item's selection status will be toggled.
|
|
15
15
|
*/
|
|
16
|
-
|
|
17
|
-
event: React.SyntheticEvent;
|
|
16
|
+
setItemSelection: (parameters: {
|
|
18
17
|
itemId: string;
|
|
19
|
-
|
|
18
|
+
event?: React.SyntheticEvent;
|
|
20
19
|
shouldBeSelected?: boolean;
|
|
20
|
+
keepExistingSelection?: boolean;
|
|
21
21
|
}) => void;
|
|
22
22
|
}
|
|
23
23
|
export interface UseTreeViewSelectionInstance extends UseTreeViewSelectionPublicAPI {
|
|
@@ -99,18 +99,18 @@ export interface UseTreeViewSelectionParameters<Multiple extends boolean | undef
|
|
|
99
99
|
selectionPropagation?: TreeViewSelectionPropagation;
|
|
100
100
|
/**
|
|
101
101
|
* Callback fired when Tree Items are selected/deselected.
|
|
102
|
-
* @param {React.SyntheticEvent} event The DOM event that triggered the change.
|
|
102
|
+
* @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
|
|
103
103
|
* @param {string[] | string} itemIds The ids of the selected items.
|
|
104
104
|
* When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
|
|
105
105
|
*/
|
|
106
|
-
onSelectedItemsChange?: (event: React.SyntheticEvent, itemIds: TreeViewSelectionValue<Multiple>) => void;
|
|
106
|
+
onSelectedItemsChange?: (event: React.SyntheticEvent | null, itemIds: TreeViewSelectionValue<Multiple>) => void;
|
|
107
107
|
/**
|
|
108
108
|
* Callback fired when a Tree Item is selected or deselected.
|
|
109
|
-
* @param {React.SyntheticEvent} event The DOM event that triggered the change.
|
|
109
|
+
* @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
|
|
110
110
|
* @param {array} itemId The itemId of the modified item.
|
|
111
111
|
* @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
|
|
112
112
|
*/
|
|
113
|
-
onItemSelectionToggle?: (event: React.SyntheticEvent, itemId: string, isSelected: boolean) => void;
|
|
113
|
+
onItemSelectionToggle?: (event: React.SyntheticEvent | null, itemId: string, isSelected: boolean) => void;
|
|
114
114
|
}
|
|
115
115
|
export type UseTreeViewSelectionDefaultizedParameters<Multiple extends boolean> = DefaultizedProps<UseTreeViewSelectionParameters<Multiple>, 'disableSelection' | 'defaultSelectedItems' | 'multiSelect' | 'checkboxSelection' | 'selectionPropagation'>;
|
|
116
116
|
export interface UseTreeViewSelectionState {
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import { CreateSelectorFunction } from 'reselect';
|
|
2
2
|
import { TreeViewAnyPluginSignature, TreeViewState } from "../models/index.js";
|
|
3
|
+
/**
|
|
4
|
+
* Type of a selector that take the whole tree view state as input and returns a value based on a required plugin.
|
|
5
|
+
*/
|
|
3
6
|
export type TreeViewRootSelector<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [TSignature]>(state: TreeViewState<TSignatures>) => TSignature['state'][keyof TSignature['state']];
|
|
7
|
+
/**
|
|
8
|
+
* Type of a selector that take the whole tree view state as input and returns a value based on an optional plugin.
|
|
9
|
+
*/
|
|
10
|
+
export type TreeViewRootSelectorForOptionalPlugin<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [], TOptionalSignatures extends [TSignature]>(state: TreeViewState<TSignatures, TOptionalSignatures>) => TSignature['state'][keyof TSignature['state']] | undefined;
|
|
4
11
|
export type TreeViewSelector<TState, TArgs, TResult> = (state: TState, args: TArgs) => TResult;
|
|
5
12
|
/**
|
|
6
13
|
* Method wrapping reselect's createSelector to provide caching for tree view instances.
|
|
@@ -13,6 +13,15 @@ const reselectCreateSelector = (0, _reselect.createSelectorCreator)({
|
|
|
13
13
|
}
|
|
14
14
|
});
|
|
15
15
|
const cache = new WeakMap();
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Type of a selector that take the whole tree view state as input and returns a value based on a required plugin.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* Type of a selector that take the whole tree view state as input and returns a value based on an optional plugin.
|
|
23
|
+
*/
|
|
24
|
+
|
|
16
25
|
/**
|
|
17
26
|
* Method wrapping reselect's createSelector to provide caching for tree view instances.
|
|
18
27
|
*
|