@mui/x-tree-view 8.0.0-beta.0 → 8.0.0-beta.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.
Files changed (168) hide show
  1. package/CHANGELOG.md +171 -0
  2. package/RichTreeView/RichTreeView.js +17 -5
  3. package/RichTreeView/richTreeViewClasses.d.ts +2 -4
  4. package/RichTreeView/richTreeViewClasses.js +1 -1
  5. package/SimpleTreeView/SimpleTreeView.js +17 -5
  6. package/SimpleTreeView/simpleTreeViewClasses.d.ts +2 -4
  7. package/SimpleTreeView/simpleTreeViewClasses.js +1 -1
  8. package/TreeItem/TreeItem.d.ts +1 -1
  9. package/TreeItem/TreeItem.js +45 -49
  10. package/TreeItem/index.d.ts +2 -1
  11. package/TreeItem/index.js +13 -21
  12. package/TreeItem/treeItemClasses.d.ts +40 -18
  13. package/TreeItem/treeItemClasses.js +3 -1
  14. package/TreeItemLabelInput/TreeItemLabelInput.js +2 -2
  15. package/esm/RichTreeView/RichTreeView.js +17 -5
  16. package/esm/RichTreeView/richTreeViewClasses.d.ts +2 -4
  17. package/esm/RichTreeView/richTreeViewClasses.js +1 -1
  18. package/esm/SimpleTreeView/SimpleTreeView.js +17 -5
  19. package/esm/SimpleTreeView/simpleTreeViewClasses.d.ts +2 -4
  20. package/esm/SimpleTreeView/simpleTreeViewClasses.js +1 -1
  21. package/esm/TreeItem/TreeItem.d.ts +1 -1
  22. package/esm/TreeItem/TreeItem.js +45 -49
  23. package/esm/TreeItem/index.d.ts +2 -1
  24. package/esm/TreeItem/index.js +1 -1
  25. package/esm/TreeItem/treeItemClasses.d.ts +40 -18
  26. package/esm/TreeItem/treeItemClasses.js +3 -1
  27. package/esm/TreeItemLabelInput/TreeItemLabelInput.js +2 -2
  28. package/esm/hooks/useTreeItemUtils/useTreeItemUtils.js +8 -14
  29. package/esm/index.js +1 -1
  30. package/esm/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +1 -1
  31. package/esm/internals/TreeViewProvider/TreeViewContext.d.ts +3 -1
  32. package/esm/internals/TreeViewProvider/TreeViewContext.js +8 -1
  33. package/esm/internals/TreeViewProvider/TreeViewProvider.d.ts +1 -1
  34. package/esm/internals/TreeViewProvider/TreeViewProvider.js +17 -5
  35. package/esm/internals/TreeViewProvider/TreeViewProvider.types.d.ts +3 -1
  36. package/esm/internals/TreeViewProvider/TreeViewStyleContext.d.ts +33 -0
  37. package/esm/internals/TreeViewProvider/TreeViewStyleContext.js +13 -0
  38. package/esm/internals/TreeViewProvider/index.d.ts +1 -1
  39. package/esm/internals/TreeViewProvider/index.js +1 -1
  40. package/esm/internals/index.d.ts +2 -1
  41. package/esm/internals/models/itemPlugin.d.ts +3 -3
  42. package/esm/internals/plugins/useTreeViewItemCustomization/index.d.ts +2 -0
  43. package/esm/internals/plugins/useTreeViewItemCustomization/index.js +1 -0
  44. package/esm/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.d.ts +3 -0
  45. package/esm/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.js +24 -0
  46. package/esm/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.d.ts +42 -0
  47. package/esm/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.js +1 -0
  48. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.js +3 -8
  49. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +1 -4
  50. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +6 -6
  51. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +13 -15
  52. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +0 -3
  53. package/esm/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +9 -12
  54. package/esm/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +16 -11
  55. package/esm/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.d.ts +14 -20
  56. package/esm/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.js +5 -7
  57. package/esm/internals/plugins/useTreeViewLabel/useTreeViewLabel.types.d.ts +5 -4
  58. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +0 -2
  59. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +2 -3
  60. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.itemPlugin.js +16 -21
  61. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +43 -38
  62. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.d.ts +331 -0
  63. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.js +38 -1
  64. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +5 -4
  65. package/esm/internals/utils/selectors.d.ts +1 -1
  66. package/esm/useTreeItem/useTreeItem.js +16 -17
  67. package/esm/useTreeItem/useTreeItem.types.d.ts +9 -4
  68. package/hooks/useTreeItemUtils/useTreeItemUtils.js +7 -13
  69. package/index.js +1 -1
  70. package/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +2 -2
  71. package/internals/TreeViewProvider/TreeViewContext.d.ts +3 -1
  72. package/internals/TreeViewProvider/TreeViewContext.js +10 -2
  73. package/internals/TreeViewProvider/TreeViewProvider.d.ts +1 -1
  74. package/internals/TreeViewProvider/TreeViewProvider.js +17 -5
  75. package/internals/TreeViewProvider/TreeViewProvider.types.d.ts +3 -1
  76. package/internals/TreeViewProvider/TreeViewStyleContext.d.ts +33 -0
  77. package/internals/TreeViewProvider/TreeViewStyleContext.js +21 -0
  78. package/internals/TreeViewProvider/index.d.ts +1 -1
  79. package/internals/TreeViewProvider/index.js +2 -2
  80. package/internals/index.d.ts +2 -1
  81. package/internals/models/itemPlugin.d.ts +3 -3
  82. package/internals/plugins/useTreeViewItemCustomization/index.d.ts +2 -0
  83. package/internals/plugins/useTreeViewItemCustomization/index.js +12 -0
  84. package/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.d.ts +3 -0
  85. package/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.js +32 -0
  86. package/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.d.ts +42 -0
  87. package/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.js +5 -0
  88. package/internals/plugins/useTreeViewItems/useTreeViewItems.js +3 -8
  89. package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +1 -4
  90. package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +6 -6
  91. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +12 -14
  92. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +0 -3
  93. package/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +9 -12
  94. package/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +16 -12
  95. package/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.d.ts +14 -20
  96. package/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.js +5 -7
  97. package/internals/plugins/useTreeViewLabel/useTreeViewLabel.types.d.ts +5 -4
  98. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +0 -2
  99. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +2 -3
  100. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.itemPlugin.js +15 -20
  101. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +42 -37
  102. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.d.ts +331 -0
  103. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.js +39 -2
  104. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +5 -4
  105. package/internals/utils/selectors.d.ts +1 -1
  106. package/modern/RichTreeView/RichTreeView.js +17 -5
  107. package/modern/RichTreeView/richTreeViewClasses.d.ts +2 -4
  108. package/modern/RichTreeView/richTreeViewClasses.js +1 -1
  109. package/modern/SimpleTreeView/SimpleTreeView.js +17 -5
  110. package/modern/SimpleTreeView/simpleTreeViewClasses.d.ts +2 -4
  111. package/modern/SimpleTreeView/simpleTreeViewClasses.js +1 -1
  112. package/modern/TreeItem/TreeItem.d.ts +1 -1
  113. package/modern/TreeItem/TreeItem.js +45 -49
  114. package/modern/TreeItem/index.d.ts +2 -1
  115. package/modern/TreeItem/index.js +1 -1
  116. package/modern/TreeItem/treeItemClasses.d.ts +40 -18
  117. package/modern/TreeItem/treeItemClasses.js +3 -1
  118. package/modern/TreeItemLabelInput/TreeItemLabelInput.js +2 -2
  119. package/modern/hooks/useTreeItemUtils/useTreeItemUtils.js +8 -14
  120. package/modern/index.js +1 -1
  121. package/modern/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +1 -1
  122. package/modern/internals/TreeViewProvider/TreeViewContext.d.ts +3 -1
  123. package/modern/internals/TreeViewProvider/TreeViewContext.js +8 -1
  124. package/modern/internals/TreeViewProvider/TreeViewProvider.d.ts +1 -1
  125. package/modern/internals/TreeViewProvider/TreeViewProvider.js +17 -5
  126. package/modern/internals/TreeViewProvider/TreeViewProvider.types.d.ts +3 -1
  127. package/modern/internals/TreeViewProvider/TreeViewStyleContext.d.ts +33 -0
  128. package/modern/internals/TreeViewProvider/TreeViewStyleContext.js +13 -0
  129. package/modern/internals/TreeViewProvider/index.d.ts +1 -1
  130. package/modern/internals/TreeViewProvider/index.js +1 -1
  131. package/modern/internals/index.d.ts +2 -1
  132. package/modern/internals/models/itemPlugin.d.ts +3 -3
  133. package/modern/internals/plugins/useTreeViewItemCustomization/index.d.ts +2 -0
  134. package/modern/internals/plugins/useTreeViewItemCustomization/index.js +1 -0
  135. package/modern/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.d.ts +3 -0
  136. package/modern/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.js +24 -0
  137. package/modern/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.d.ts +42 -0
  138. package/modern/internals/plugins/useTreeViewItemCustomization/useTreeViewItemCustomization.types.js +1 -0
  139. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +3 -8
  140. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +1 -4
  141. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +6 -6
  142. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +13 -15
  143. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +0 -3
  144. package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +9 -12
  145. package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +16 -11
  146. package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.d.ts +14 -20
  147. package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors.js +5 -7
  148. package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.types.d.ts +5 -4
  149. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +0 -2
  150. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +2 -3
  151. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.itemPlugin.js +16 -21
  152. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +43 -38
  153. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.d.ts +331 -0
  154. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.js +38 -1
  155. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +5 -4
  156. package/modern/internals/utils/selectors.d.ts +1 -1
  157. package/modern/useTreeItem/useTreeItem.js +16 -17
  158. package/modern/useTreeItem/useTreeItem.types.d.ts +9 -4
  159. package/package.json +2 -2
  160. package/tsconfig.build.tsbuildinfo +1 -1
  161. package/useTreeItem/useTreeItem.js +16 -17
  162. package/useTreeItem/useTreeItem.types.d.ts +9 -4
  163. package/esm/internals/TreeViewProvider/useTreeViewContext.d.ts +0 -3
  164. package/esm/internals/TreeViewProvider/useTreeViewContext.js +0 -9
  165. package/internals/TreeViewProvider/useTreeViewContext.d.ts +0 -3
  166. package/internals/TreeViewProvider/useTreeViewContext.js +0 -17
  167. package/modern/internals/TreeViewProvider/useTreeViewContext.d.ts +0 -3
  168. package/modern/internals/TreeViewProvider/useTreeViewContext.js +0 -9
@@ -3,7 +3,7 @@ import * as React from 'react';
3
3
  import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
4
4
  import { findOrderInTremauxTree, getAllNavigableItems, getFirstNavigableItem, getLastNavigableItem, getNonDisabledItemsInRange } from "../../utils/tree.js";
5
5
  import { convertSelectedItemsToArray, propagateSelection, getAddedAndRemovedItems, getLookupFromArray, createSelectedItemsMap } from "./useTreeViewSelection.utils.js";
6
- import { selectorIsItemSelected } from "./useTreeViewSelection.selectors.js";
6
+ import { selectorIsItemSelected, selectorIsMultiSelectEnabled, selectorIsSelectionEnabled } from "./useTreeViewSelection.selectors.js";
7
7
  import { useTreeViewSelectionItemPlugin } from "./useTreeViewSelection.itemPlugin.js";
8
8
  export const useTreeViewSelection = ({
9
9
  store,
@@ -12,16 +12,10 @@ export const useTreeViewSelection = ({
12
12
  }) => {
13
13
  const lastSelectedItem = React.useRef(null);
14
14
  const lastSelectedRange = React.useRef({});
15
- useEnhancedEffect(() => {
16
- store.update(prevState => _extends({}, prevState, {
17
- selection: {
18
- selectedItemsMap: createSelectedItemsMap(models.selectedItems.value)
19
- }
20
- }));
21
- }, [store, models.selectedItems.value]);
22
15
  const setSelectedItems = (event, newModel, additionalItemsToPropagate) => {
23
16
  let cleanModel;
24
- if (params.multiSelect && (params.selectionPropagation.descendants || params.selectionPropagation.parents)) {
17
+ const isMultiSelectEnabled = selectorIsMultiSelectEnabled(store.value);
18
+ if (isMultiSelectEnabled && (params.selectionPropagation.descendants || params.selectionPropagation.parents)) {
25
19
  cleanModel = propagateSelection({
26
20
  store,
27
21
  selectionPropagation: params.selectionPropagation,
@@ -33,7 +27,7 @@ export const useTreeViewSelection = ({
33
27
  cleanModel = newModel;
34
28
  }
35
29
  if (params.onItemSelectionToggle) {
36
- if (params.multiSelect) {
30
+ if (isMultiSelectEnabled) {
37
31
  const changes = getAddedAndRemovedItems({
38
32
  store,
39
33
  newModel: cleanModel,
@@ -67,10 +61,11 @@ export const useTreeViewSelection = ({
67
61
  keepExistingSelection = false,
68
62
  shouldBeSelected
69
63
  }) => {
70
- if (params.disableSelection) {
64
+ if (!selectorIsSelectionEnabled(store.value)) {
71
65
  return;
72
66
  }
73
67
  let newSelected;
68
+ const isMultiSelectEnabled = selectorIsMultiSelectEnabled(store.value);
74
69
  if (keepExistingSelection) {
75
70
  const cleanSelectedItems = convertSelectedItemsToArray(models.selectedItems.value);
76
71
  const isSelectedBefore = selectorIsItemSelected(store.value, itemId);
@@ -84,9 +79,9 @@ export const useTreeViewSelection = ({
84
79
  } else {
85
80
  // eslint-disable-next-line no-lonely-if
86
81
  if (shouldBeSelected === false || shouldBeSelected == null && selectorIsItemSelected(store.value, itemId)) {
87
- newSelected = params.multiSelect ? [] : null;
82
+ newSelected = isMultiSelectEnabled ? [] : null;
88
83
  } else {
89
- newSelected = params.multiSelect ? [itemId] : itemId;
84
+ newSelected = isMultiSelectEnabled ? [itemId] : itemId;
90
85
  }
91
86
  }
92
87
  setSelectedItems(event, newSelected,
@@ -97,7 +92,8 @@ export const useTreeViewSelection = ({
97
92
  lastSelectedRange.current = {};
98
93
  };
99
94
  const selectRange = (event, [start, end]) => {
100
- if (params.disableSelection || !params.multiSelect) {
95
+ const isMultiSelectEnabled = selectorIsMultiSelectEnabled(store.value);
96
+ if (!isMultiSelectEnabled) {
101
97
  return;
102
98
  }
103
99
  let newSelectedItems = convertSelectedItemsToArray(models.selectedItems.value).slice();
@@ -129,7 +125,8 @@ export const useTreeViewSelection = ({
129
125
  selectRange(event, [itemId, getLastNavigableItem(store.value)]);
130
126
  };
131
127
  const selectAllNavigableItems = event => {
132
- if (params.disableSelection || !params.multiSelect) {
128
+ const isMultiSelectEnabled = selectorIsMultiSelectEnabled(store.value);
129
+ if (!isMultiSelectEnabled) {
133
130
  return;
134
131
  }
135
132
  const navigableItems = getAllNavigableItems(store.value);
@@ -137,7 +134,8 @@ export const useTreeViewSelection = ({
137
134
  lastSelectedRange.current = getLookupFromArray(navigableItems);
138
135
  };
139
136
  const selectItemFromArrowNavigation = (event, currentItem, nextItem) => {
140
- if (params.disableSelection || !params.multiSelect) {
137
+ const isMultiSelectEnabled = selectorIsMultiSelectEnabled(store.value);
138
+ if (!isMultiSelectEnabled) {
141
139
  return;
142
140
  }
143
141
  let newSelectedItems = convertSelectedItemsToArray(models.selectedItems.value).slice();
@@ -161,17 +159,22 @@ export const useTreeViewSelection = ({
161
159
  }
162
160
  setSelectedItems(event, newSelectedItems);
163
161
  };
164
- const pluginContextValue = React.useMemo(() => ({
165
- selection: {
166
- multiSelect: params.multiSelect,
167
- checkboxSelection: params.checkboxSelection,
168
- disableSelection: params.disableSelection,
169
- selectionPropagation: {
170
- descendants: params.selectionPropagation.descendants,
171
- parents: params.selectionPropagation.parents
162
+ useEnhancedEffect(() => {
163
+ store.update(prevState => _extends({}, prevState, {
164
+ selection: {
165
+ rawSelectedItems: models.selectedItems.value,
166
+ // Only re-compute the map when the model changes.
167
+ selectedItemsMap: prevState.selection.rawSelectedItems === models.selectedItems.value ? prevState.selection.selectedItemsMap : createSelectedItemsMap(models.selectedItems.value),
168
+ isEnabled: !params.disableSelection,
169
+ isMultiSelectEnabled: params.multiSelect,
170
+ isCheckboxSelectionEnabled: params.checkboxSelection,
171
+ selectionPropagation: {
172
+ descendants: params.selectionPropagation.descendants,
173
+ parents: params.selectionPropagation.parents
174
+ }
172
175
  }
173
- }
174
- }), [params.multiSelect, params.checkboxSelection, params.disableSelection, params.selectionPropagation.descendants, params.selectionPropagation.parents]);
176
+ }));
177
+ }, [store, models.selectedItems.value, params.multiSelect, params.checkboxSelection, params.disableSelection, params.selectionPropagation.descendants, params.selectionPropagation.parents]);
175
178
  return {
176
179
  getRootProps: () => ({
177
180
  'aria-multiselectable': params.multiSelect
@@ -186,8 +189,7 @@ export const useTreeViewSelection = ({
186
189
  selectRangeFromStartToItem,
187
190
  selectRangeFromItemToEnd,
188
191
  selectItemFromArrowNavigation
189
- },
190
- contextValue: pluginContextValue
192
+ }
191
193
  };
192
194
  };
193
195
  useTreeViewSelection.itemPlugin = useTreeViewSelectionItemPlugin;
@@ -207,16 +209,19 @@ useTreeViewSelection.getDefaultizedParams = ({
207
209
  defaultSelectedItems: params.defaultSelectedItems ?? (params.multiSelect ? DEFAULT_SELECTED_ITEMS : null),
208
210
  selectionPropagation: params.selectionPropagation ?? EMPTY_SELECTION_PROPAGATION
209
211
  });
210
- useTreeViewSelection.getInitialState = params => ({
211
- selection: {
212
- selectedItemsMap: createSelectedItemsMap(params.selectedItems === undefined ? params.defaultSelectedItems : params.selectedItems)
213
- }
214
- });
215
- useTreeViewSelection.getInitialState = params => ({
216
- selection: {
217
- selectedItemsMap: createSelectedItemsMap(params.selectedItems === undefined ? params.defaultSelectedItems : params.selectedItems)
218
- }
219
- });
212
+ useTreeViewSelection.getInitialState = params => {
213
+ const rawSelectedItems = params.selectedItems === undefined ? params.defaultSelectedItems : params.selectedItems;
214
+ return {
215
+ selection: {
216
+ rawSelectedItems,
217
+ selectedItemsMap: createSelectedItemsMap(rawSelectedItems),
218
+ isEnabled: !params.disableSelection,
219
+ isMultiSelectEnabled: params.multiSelect,
220
+ isCheckboxSelectionEnabled: params.checkboxSelection,
221
+ selectionPropagation: params.selectionPropagation
222
+ }
223
+ };
224
+ };
220
225
  useTreeViewSelection.params = {
221
226
  disableSelection: true,
222
227
  multiSelect: true,
@@ -11,10 +11,20 @@ export declare const selectorIsItemSelected: ((state: any, itemId: string) => bo
11
11
  resetResultsCount: () => void;
12
12
  } & {
13
13
  resultFunc: (resultFuncArgs_0: {
14
+ rawSelectedItems: string | string[] | null;
14
15
  selectedItemsMap: Map<string, true>;
16
+ isEnabled: boolean;
17
+ isMultiSelectEnabled: boolean;
18
+ isCheckboxSelectionEnabled: boolean;
19
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
15
20
  }, resultFuncArgs_1: string) => boolean;
16
21
  memoizedResultFunc: ((resultFuncArgs_0: {
22
+ rawSelectedItems: string | string[] | null;
17
23
  selectedItemsMap: Map<string, true>;
24
+ isEnabled: boolean;
25
+ isMultiSelectEnabled: boolean;
26
+ isCheckboxSelectionEnabled: boolean;
27
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
18
28
  }, resultFuncArgs_1: string) => boolean) & {
19
29
  clearCache: () => void;
20
30
  resultsCount: () => number;
@@ -29,4 +39,325 @@ export declare const selectorIsItemSelected: ((state: any, itemId: string) => bo
29
39
  } & {
30
40
  argsMemoize: typeof import("reselect").weakMapMemoize;
31
41
  memoize: typeof import("reselect").weakMapMemoize;
42
+ };
43
+ /**
44
+ * Check if multi selection is enabled.
45
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
46
+ * @returns {boolean} `true` if multi selection is enabled, `false` otherwise.
47
+ */
48
+ export declare const selectorIsMultiSelectEnabled: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewSelection.types").UseTreeViewSelectionState & Partial<{}> & {
49
+ cacheKey: import("../../models").TreeViewStateCacheKey;
50
+ }) => boolean) & {
51
+ clearCache: () => void;
52
+ resultsCount: () => number;
53
+ resetResultsCount: () => void;
54
+ } & {
55
+ resultFunc: (resultFuncArgs_0: {
56
+ rawSelectedItems: string | string[] | null;
57
+ selectedItemsMap: Map<string, true>;
58
+ isEnabled: boolean;
59
+ isMultiSelectEnabled: boolean;
60
+ isCheckboxSelectionEnabled: boolean;
61
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
62
+ }) => boolean;
63
+ memoizedResultFunc: ((resultFuncArgs_0: {
64
+ rawSelectedItems: string | string[] | null;
65
+ selectedItemsMap: Map<string, true>;
66
+ isEnabled: boolean;
67
+ isMultiSelectEnabled: boolean;
68
+ isCheckboxSelectionEnabled: boolean;
69
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
70
+ }) => boolean) & {
71
+ clearCache: () => void;
72
+ resultsCount: () => number;
73
+ resetResultsCount: () => void;
74
+ };
75
+ lastResult: () => boolean;
76
+ dependencies: [TreeViewRootSelector<UseTreeViewSelectionSignature>];
77
+ recomputations: () => number;
78
+ resetRecomputations: () => void;
79
+ dependencyRecomputations: () => number;
80
+ resetDependencyRecomputations: () => void;
81
+ } & {
82
+ argsMemoize: typeof import("reselect").weakMapMemoize;
83
+ memoize: typeof import("reselect").weakMapMemoize;
84
+ };
85
+ /**
86
+ * Check if selection is enabled.
87
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
88
+ * @returns {boolean} `true` if selection is enabled, `false` otherwise.
89
+ */
90
+ export declare const selectorIsSelectionEnabled: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewSelection.types").UseTreeViewSelectionState & Partial<{}> & {
91
+ cacheKey: import("../../models").TreeViewStateCacheKey;
92
+ }) => boolean) & {
93
+ clearCache: () => void;
94
+ resultsCount: () => number;
95
+ resetResultsCount: () => void;
96
+ } & {
97
+ resultFunc: (resultFuncArgs_0: {
98
+ rawSelectedItems: string | string[] | null;
99
+ selectedItemsMap: Map<string, true>;
100
+ isEnabled: boolean;
101
+ isMultiSelectEnabled: boolean;
102
+ isCheckboxSelectionEnabled: boolean;
103
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
104
+ }) => boolean;
105
+ memoizedResultFunc: ((resultFuncArgs_0: {
106
+ rawSelectedItems: string | string[] | null;
107
+ selectedItemsMap: Map<string, true>;
108
+ isEnabled: boolean;
109
+ isMultiSelectEnabled: boolean;
110
+ isCheckboxSelectionEnabled: boolean;
111
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
112
+ }) => boolean) & {
113
+ clearCache: () => void;
114
+ resultsCount: () => number;
115
+ resetResultsCount: () => void;
116
+ };
117
+ lastResult: () => boolean;
118
+ dependencies: [TreeViewRootSelector<UseTreeViewSelectionSignature>];
119
+ recomputations: () => number;
120
+ resetRecomputations: () => void;
121
+ dependencyRecomputations: () => number;
122
+ resetDependencyRecomputations: () => void;
123
+ } & {
124
+ argsMemoize: typeof import("reselect").weakMapMemoize;
125
+ memoize: typeof import("reselect").weakMapMemoize;
126
+ };
127
+ /**
128
+ * Check if checkbox selection is enabled.
129
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
130
+ * @returns {boolean} `true` if checkbox selection is enabled, `false` otherwise.
131
+ */
132
+ export declare const selectorIsCheckboxSelectionEnabled: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewSelection.types").UseTreeViewSelectionState & Partial<{}> & {
133
+ cacheKey: import("../../models").TreeViewStateCacheKey;
134
+ }) => boolean) & {
135
+ clearCache: () => void;
136
+ resultsCount: () => number;
137
+ resetResultsCount: () => void;
138
+ } & {
139
+ resultFunc: (resultFuncArgs_0: {
140
+ rawSelectedItems: string | string[] | null;
141
+ selectedItemsMap: Map<string, true>;
142
+ isEnabled: boolean;
143
+ isMultiSelectEnabled: boolean;
144
+ isCheckboxSelectionEnabled: boolean;
145
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
146
+ }) => boolean;
147
+ memoizedResultFunc: ((resultFuncArgs_0: {
148
+ rawSelectedItems: string | string[] | null;
149
+ selectedItemsMap: Map<string, true>;
150
+ isEnabled: boolean;
151
+ isMultiSelectEnabled: boolean;
152
+ isCheckboxSelectionEnabled: boolean;
153
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
154
+ }) => boolean) & {
155
+ clearCache: () => void;
156
+ resultsCount: () => number;
157
+ resetResultsCount: () => void;
158
+ };
159
+ lastResult: () => boolean;
160
+ dependencies: [TreeViewRootSelector<UseTreeViewSelectionSignature>];
161
+ recomputations: () => number;
162
+ resetRecomputations: () => void;
163
+ dependencyRecomputations: () => number;
164
+ resetDependencyRecomputations: () => void;
165
+ } & {
166
+ argsMemoize: typeof import("reselect").weakMapMemoize;
167
+ memoize: typeof import("reselect").weakMapMemoize;
168
+ };
169
+ /**
170
+ * Check if selection is enabled for an item (if selection is enabled and if the item is not disabled).
171
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
172
+ * @param {string} itemId The id of the item to check.
173
+ * @returns {boolean} `true` if selection is enabled for the item, `false` otherwise.
174
+ */
175
+ export declare const selectorIsItemSelectionEnabled: ((state: any, itemId: string) => boolean) & {
176
+ clearCache: () => void;
177
+ resultsCount: () => number;
178
+ resetResultsCount: () => void;
179
+ } & {
180
+ resultFunc: (resultFuncArgs_0: boolean, resultFuncArgs_1: boolean) => boolean;
181
+ memoizedResultFunc: ((resultFuncArgs_0: boolean, resultFuncArgs_1: boolean) => boolean) & {
182
+ clearCache: () => void;
183
+ resultsCount: () => number;
184
+ resetResultsCount: () => void;
185
+ };
186
+ lastResult: () => boolean;
187
+ dependencies: [((state: any, itemId: string) => boolean) & {
188
+ clearCache: () => void;
189
+ resultsCount: () => number;
190
+ resetResultsCount: () => void;
191
+ } & {
192
+ resultFunc: (resultFuncArgs_0: {
193
+ [itemId: string]: import("../..").TreeViewItemMeta;
194
+ }, resultFuncArgs_1: string) => boolean;
195
+ memoizedResultFunc: ((resultFuncArgs_0: {
196
+ [itemId: string]: import("../..").TreeViewItemMeta;
197
+ }, resultFuncArgs_1: string) => boolean) & {
198
+ clearCache: () => void;
199
+ resultsCount: () => number;
200
+ resetResultsCount: () => void;
201
+ };
202
+ lastResult: () => boolean;
203
+ dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("../useTreeViewItems").UseTreeViewItemsState<import("../../..").TreeViewDefaultItemModelProperties> & Partial<{}> & {
204
+ cacheKey: import("../../models").TreeViewStateCacheKey;
205
+ }) => {
206
+ [itemId: string]: import("../..").TreeViewItemMeta;
207
+ }) & {
208
+ clearCache: () => void;
209
+ resultsCount: () => number;
210
+ resetResultsCount: () => void;
211
+ } & {
212
+ resultFunc: (resultFuncArgs_0: {
213
+ disabledItemsFocusable: boolean;
214
+ itemModelLookup: {
215
+ [itemId: string]: import("../../..").TreeViewBaseItem<import("../../..").TreeViewDefaultItemModelProperties>;
216
+ };
217
+ itemMetaLookup: {
218
+ [itemId: string]: import("../..").TreeViewItemMeta;
219
+ };
220
+ itemOrderedChildrenIdsLookup: {
221
+ [parentItemId: string]: string[];
222
+ };
223
+ itemChildrenIndexesLookup: {
224
+ [parentItemId: string]: {
225
+ [itemId: string]: number;
226
+ };
227
+ };
228
+ loading: boolean;
229
+ error: Error | null;
230
+ }) => {
231
+ [itemId: string]: import("../..").TreeViewItemMeta;
232
+ };
233
+ memoizedResultFunc: ((resultFuncArgs_0: {
234
+ disabledItemsFocusable: boolean;
235
+ itemModelLookup: {
236
+ [itemId: string]: import("../../..").TreeViewBaseItem<import("../../..").TreeViewDefaultItemModelProperties>;
237
+ };
238
+ itemMetaLookup: {
239
+ [itemId: string]: import("../..").TreeViewItemMeta;
240
+ };
241
+ itemOrderedChildrenIdsLookup: {
242
+ [parentItemId: string]: string[];
243
+ };
244
+ itemChildrenIndexesLookup: {
245
+ [parentItemId: string]: {
246
+ [itemId: string]: number;
247
+ };
248
+ };
249
+ loading: boolean;
250
+ error: Error | null;
251
+ }) => {
252
+ [itemId: string]: import("../..").TreeViewItemMeta;
253
+ }) & {
254
+ clearCache: () => void;
255
+ resultsCount: () => number;
256
+ resetResultsCount: () => void;
257
+ };
258
+ lastResult: () => {
259
+ [itemId: string]: import("../..").TreeViewItemMeta;
260
+ };
261
+ dependencies: [TreeViewRootSelector<import("../useTreeViewItems").UseTreeViewItemsSignature>];
262
+ recomputations: () => number;
263
+ resetRecomputations: () => void;
264
+ dependencyRecomputations: () => number;
265
+ resetDependencyRecomputations: () => void;
266
+ } & {
267
+ argsMemoize: typeof import("reselect").weakMapMemoize;
268
+ memoize: typeof import("reselect").weakMapMemoize;
269
+ }, (_: any, itemId: string) => string];
270
+ recomputations: () => number;
271
+ resetRecomputations: () => void;
272
+ dependencyRecomputations: () => number;
273
+ resetDependencyRecomputations: () => void;
274
+ } & {
275
+ argsMemoize: typeof import("reselect").weakMapMemoize;
276
+ memoize: typeof import("reselect").weakMapMemoize;
277
+ }, ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewSelection.types").UseTreeViewSelectionState & Partial<{}> & {
278
+ cacheKey: import("../../models").TreeViewStateCacheKey;
279
+ }) => boolean) & {
280
+ clearCache: () => void;
281
+ resultsCount: () => number;
282
+ resetResultsCount: () => void;
283
+ } & {
284
+ resultFunc: (resultFuncArgs_0: {
285
+ rawSelectedItems: string | string[] | null;
286
+ selectedItemsMap: Map<string, true>;
287
+ isEnabled: boolean;
288
+ isMultiSelectEnabled: boolean;
289
+ isCheckboxSelectionEnabled: boolean;
290
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
291
+ }) => boolean;
292
+ memoizedResultFunc: ((resultFuncArgs_0: {
293
+ rawSelectedItems: string | string[] | null;
294
+ selectedItemsMap: Map<string, true>;
295
+ isEnabled: boolean;
296
+ isMultiSelectEnabled: boolean;
297
+ isCheckboxSelectionEnabled: boolean;
298
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
299
+ }) => boolean) & {
300
+ clearCache: () => void;
301
+ resultsCount: () => number;
302
+ resetResultsCount: () => void;
303
+ };
304
+ lastResult: () => boolean;
305
+ dependencies: [TreeViewRootSelector<UseTreeViewSelectionSignature>];
306
+ recomputations: () => number;
307
+ resetRecomputations: () => void;
308
+ dependencyRecomputations: () => number;
309
+ resetDependencyRecomputations: () => void;
310
+ } & {
311
+ argsMemoize: typeof import("reselect").weakMapMemoize;
312
+ memoize: typeof import("reselect").weakMapMemoize;
313
+ }];
314
+ recomputations: () => number;
315
+ resetRecomputations: () => void;
316
+ dependencyRecomputations: () => number;
317
+ resetDependencyRecomputations: () => void;
318
+ } & {
319
+ argsMemoize: typeof import("reselect").weakMapMemoize;
320
+ memoize: typeof import("reselect").weakMapMemoize;
321
+ };
322
+ /**
323
+ * Get the selection propagation rules.
324
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
325
+ * @returns {TreeViewSelectionPropagation} The selection propagation rules.
326
+ */
327
+ export declare const selectorSelectionPropagationRules: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewSelection.types").UseTreeViewSelectionState & Partial<{}> & {
328
+ cacheKey: import("../../models").TreeViewStateCacheKey;
329
+ }) => import("../../..").TreeViewSelectionPropagation) & {
330
+ clearCache: () => void;
331
+ resultsCount: () => number;
332
+ resetResultsCount: () => void;
333
+ } & {
334
+ resultFunc: (resultFuncArgs_0: {
335
+ rawSelectedItems: string | string[] | null;
336
+ selectedItemsMap: Map<string, true>;
337
+ isEnabled: boolean;
338
+ isMultiSelectEnabled: boolean;
339
+ isCheckboxSelectionEnabled: boolean;
340
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
341
+ }) => import("../../..").TreeViewSelectionPropagation;
342
+ memoizedResultFunc: ((resultFuncArgs_0: {
343
+ rawSelectedItems: string | string[] | null;
344
+ selectedItemsMap: Map<string, true>;
345
+ isEnabled: boolean;
346
+ isMultiSelectEnabled: boolean;
347
+ isCheckboxSelectionEnabled: boolean;
348
+ selectionPropagation: import("../../..").TreeViewSelectionPropagation;
349
+ }) => import("../../..").TreeViewSelectionPropagation) & {
350
+ clearCache: () => void;
351
+ resultsCount: () => number;
352
+ resetResultsCount: () => void;
353
+ };
354
+ lastResult: () => import("../../..").TreeViewSelectionPropagation;
355
+ dependencies: [TreeViewRootSelector<UseTreeViewSelectionSignature>];
356
+ recomputations: () => number;
357
+ resetRecomputations: () => void;
358
+ dependencyRecomputations: () => number;
359
+ resetDependencyRecomputations: () => void;
360
+ } & {
361
+ argsMemoize: typeof import("reselect").weakMapMemoize;
362
+ memoize: typeof import("reselect").weakMapMemoize;
32
363
  };
@@ -1,4 +1,5 @@
1
1
  import { createSelector } from "../../utils/selectors.js";
2
+ import { selectorIsItemDisabled } from "../useTreeViewItems/useTreeViewItems.selectors.js";
2
3
  const selectorTreeViewSelectionState = state => state.selection;
3
4
 
4
5
  /**
@@ -6,4 +7,40 @@ const selectorTreeViewSelectionState = state => state.selection;
6
7
  * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
7
8
  * @returns {boolean} `true` if the item is selected, `false` otherwise.
8
9
  */
9
- export const selectorIsItemSelected = createSelector([selectorTreeViewSelectionState, (_, itemId) => itemId], (selectionState, itemId) => selectionState.selectedItemsMap.has(itemId));
10
+ export const selectorIsItemSelected = createSelector([selectorTreeViewSelectionState, (_, itemId) => itemId], (selectionState, itemId) => selectionState.selectedItemsMap.has(itemId));
11
+
12
+ /**
13
+ * Check if multi selection is enabled.
14
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
15
+ * @returns {boolean} `true` if multi selection is enabled, `false` otherwise.
16
+ */
17
+ export const selectorIsMultiSelectEnabled = createSelector([selectorTreeViewSelectionState], selectionState => selectionState.isEnabled && selectionState.isMultiSelectEnabled);
18
+
19
+ /**
20
+ * Check if selection is enabled.
21
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
22
+ * @returns {boolean} `true` if selection is enabled, `false` otherwise.
23
+ */
24
+ export const selectorIsSelectionEnabled = createSelector([selectorTreeViewSelectionState], selectionState => selectionState.isEnabled);
25
+
26
+ /**
27
+ * Check if checkbox selection is enabled.
28
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
29
+ * @returns {boolean} `true` if checkbox selection is enabled, `false` otherwise.
30
+ */
31
+ export const selectorIsCheckboxSelectionEnabled = createSelector([selectorTreeViewSelectionState], selectionState => selectionState.isCheckboxSelectionEnabled);
32
+
33
+ /**
34
+ * Check if selection is enabled for an item (if selection is enabled and if the item is not disabled).
35
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
36
+ * @param {string} itemId The id of the item to check.
37
+ * @returns {boolean} `true` if selection is enabled for the item, `false` otherwise.
38
+ */
39
+ export const selectorIsItemSelectionEnabled = createSelector([selectorIsItemDisabled, selectorIsSelectionEnabled], (isItemDisabled, isSelectionEnabled) => isSelectionEnabled && !isItemDisabled);
40
+
41
+ /**
42
+ * Get the selection propagation rules.
43
+ * @param {TreeViewState<[UseTreeViewSelectionSignature]>} state The state of the tree view.
44
+ * @returns {TreeViewSelectionPropagation} The selection propagation rules.
45
+ */
46
+ export const selectorSelectionPropagationRules = createSelector([selectorTreeViewSelectionState], selectionState => selectionState.selectionPropagation);
@@ -115,18 +115,19 @@ export interface UseTreeViewSelectionParameters<Multiple extends boolean | undef
115
115
  export type UseTreeViewSelectionDefaultizedParameters<Multiple extends boolean> = DefaultizedProps<UseTreeViewSelectionParameters<Multiple>, 'disableSelection' | 'defaultSelectedItems' | 'multiSelect' | 'checkboxSelection' | 'selectionPropagation'>;
116
116
  export interface UseTreeViewSelectionState {
117
117
  selection: {
118
+ rawSelectedItems: TreeViewSelectionValue<boolean>;
118
119
  selectedItemsMap: Map<string, true>;
120
+ isEnabled: boolean;
121
+ isMultiSelectEnabled: boolean;
122
+ isCheckboxSelectionEnabled: boolean;
123
+ selectionPropagation: TreeViewSelectionPropagation;
119
124
  };
120
125
  }
121
- interface UseTreeViewSelectionContextValue {
122
- selection: Pick<UseTreeViewSelectionDefaultizedParameters<boolean>, 'multiSelect' | 'checkboxSelection' | 'disableSelection' | 'selectionPropagation'>;
123
- }
124
126
  export type UseTreeViewSelectionSignature = TreeViewPluginSignature<{
125
127
  params: UseTreeViewSelectionParameters<any>;
126
128
  defaultizedParams: UseTreeViewSelectionDefaultizedParameters<any>;
127
129
  instance: UseTreeViewSelectionInstance;
128
130
  publicAPI: UseTreeViewSelectionPublicAPI;
129
- contextValue: UseTreeViewSelectionContextValue;
130
131
  modelNames: 'selectedItems';
131
132
  state: UseTreeViewSelectionState;
132
133
  dependencies: [UseTreeViewItemsSignature, UseTreeViewExpansionSignature, UseTreeViewItemsSignature];
@@ -3,7 +3,7 @@ import { TreeViewAnyPluginSignature, TreeViewState } from "../models/index.js";
3
3
  /**
4
4
  * Type of a selector that take the whole tree view state as input and returns a value based on a required plugin.
5
5
  */
6
- export type TreeViewRootSelector<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [TSignature]>(state: TreeViewState<TSignatures>) => TSignature['state'][keyof TSignature['state']];
6
+ export type TreeViewRootSelector<TSignature extends TreeViewAnyPluginSignature, IsOptional extends boolean = false> = <TSignatures extends [TSignature]>(state: TreeViewState<TSignatures>) => IsOptional extends true ? TSignature['state'][keyof TSignature['state']] | undefined : TSignature['state'][keyof TSignature['state']];
7
7
  /**
8
8
  * Type of a selector that take the whole tree view state as input and returns a value based on an optional plugin.
9
9
  */