@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.
Files changed (120) hide show
  1. package/CHANGELOG.md +131 -0
  2. package/RichTreeView/RichTreeView.js +24 -5
  3. package/SimpleTreeView/SimpleTreeView.js +8 -6
  4. package/TreeItem/TreeItem.d.ts +2 -0
  5. package/TreeItem/TreeItem.js +46 -5
  6. package/TreeItem/TreeItem.types.d.ts +14 -0
  7. package/TreeItemIcon/TreeItemIcon.js +2 -0
  8. package/esm/RichTreeView/RichTreeView.js +24 -5
  9. package/esm/SimpleTreeView/SimpleTreeView.js +8 -6
  10. package/esm/TreeItem/TreeItem.d.ts +2 -0
  11. package/esm/TreeItem/TreeItem.js +45 -4
  12. package/esm/TreeItem/TreeItem.types.d.ts +14 -0
  13. package/esm/TreeItemIcon/TreeItemIcon.js +2 -0
  14. package/esm/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  15. package/esm/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
  16. package/esm/hooks/useTreeViewApiRef.d.ts +1 -1
  17. package/esm/index.js +1 -1
  18. package/esm/internals/index.d.ts +6 -1
  19. package/esm/internals/index.js +4 -1
  20. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  21. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  22. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  23. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  24. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  25. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
  26. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  27. package/esm/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
  28. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  29. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  30. package/esm/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  31. package/esm/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
  32. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  33. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
  34. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  35. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
  36. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  37. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  38. package/esm/internals/utils/selectors.d.ts +7 -0
  39. package/esm/internals/utils/selectors.js +9 -0
  40. package/esm/useTreeItem/useTreeItem.d.ts +1 -1
  41. package/esm/useTreeItem/useTreeItem.js +13 -0
  42. package/esm/useTreeItem/useTreeItem.types.d.ts +21 -0
  43. package/esm/utils/cache.d.ts +38 -0
  44. package/esm/utils/cache.js +31 -0
  45. package/esm/utils/index.d.ts +1 -0
  46. package/esm/utils/index.js +1 -0
  47. package/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  48. package/hooks/useTreeItemUtils/useTreeItemUtils.js +22 -10
  49. package/hooks/useTreeViewApiRef.d.ts +1 -1
  50. package/index.js +1 -1
  51. package/internals/index.d.ts +6 -1
  52. package/internals/index.js +33 -0
  53. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  54. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  55. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  56. package/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  57. package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  58. package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +14 -1
  59. package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  60. package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +1 -1
  61. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  62. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  63. package/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  64. package/internals/plugins/useTreeViewLazyLoading/index.js +5 -0
  65. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  66. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +33 -0
  67. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  68. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +5 -0
  69. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  70. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  71. package/internals/utils/selectors.d.ts +7 -0
  72. package/internals/utils/selectors.js +9 -0
  73. package/modern/RichTreeView/RichTreeView.js +24 -5
  74. package/modern/SimpleTreeView/SimpleTreeView.js +8 -6
  75. package/modern/TreeItem/TreeItem.d.ts +2 -0
  76. package/modern/TreeItem/TreeItem.js +45 -4
  77. package/modern/TreeItem/TreeItem.types.d.ts +14 -0
  78. package/modern/TreeItemIcon/TreeItemIcon.js +2 -0
  79. package/modern/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  80. package/modern/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
  81. package/modern/hooks/useTreeViewApiRef.d.ts +1 -1
  82. package/modern/index.js +1 -1
  83. package/modern/internals/index.d.ts +6 -1
  84. package/modern/internals/index.js +4 -1
  85. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  86. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  87. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  88. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  89. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  90. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
  91. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  92. package/modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
  93. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  94. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  95. package/modern/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  96. package/modern/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
  97. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  98. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
  99. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  100. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
  101. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  102. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  103. package/modern/internals/utils/selectors.d.ts +7 -0
  104. package/modern/internals/utils/selectors.js +9 -0
  105. package/modern/useTreeItem/useTreeItem.d.ts +1 -1
  106. package/modern/useTreeItem/useTreeItem.js +13 -0
  107. package/modern/useTreeItem/useTreeItem.types.d.ts +21 -0
  108. package/modern/utils/cache.d.ts +38 -0
  109. package/modern/utils/cache.js +31 -0
  110. package/modern/utils/index.d.ts +1 -0
  111. package/modern/utils/index.js +1 -0
  112. package/package.json +1 -1
  113. package/tsconfig.build.tsbuildinfo +1 -1
  114. package/useTreeItem/useTreeItem.d.ts +1 -1
  115. package/useTreeItem/useTreeItem.js +13 -0
  116. package/useTreeItem/useTreeItem.types.d.ts +21 -0
  117. package/utils/cache.d.ts +38 -0
  118. package/utils/cache.js +38 -0
  119. package/utils/index.d.ts +1 -0
  120. package/utils/index.js +16 -0
@@ -0,0 +1,38 @@
1
+ import { TreeViewItemMeta } from "../internals/models/index.js";
2
+ type DataSourceCacheDefaultConfig = {
3
+ /**
4
+ * Time To Live for each cache entry in milliseconds.
5
+ * After this time the cache entry will become stale and the next query will result in cache miss.
6
+ * @default 300000 (5 minutes)
7
+ */
8
+ ttl?: number;
9
+ };
10
+ export interface DataSourceCache {
11
+ /**
12
+ * Set the cache entry for the given key.
13
+ * @param {string} key The key of type `string`
14
+ * @param {TreeViewItemMeta[]} value The value to be stored in the cache
15
+ */
16
+ set: (key: string, value: TreeViewItemMeta[]) => void;
17
+ /**
18
+ * Get the cache entry for the given key.
19
+ * @param {string} key The key of type `string`
20
+ * @returns {TreeViewItemMeta[]} The value stored in the cache
21
+ */
22
+ get: (key: string) => TreeViewItemMeta[] | undefined | -1;
23
+ /**
24
+ * Clear the cache.
25
+ */
26
+ clear: () => void;
27
+ }
28
+ export declare class DataSourceCacheDefault {
29
+ private cache;
30
+ private ttl;
31
+ constructor({
32
+ ttl
33
+ }: DataSourceCacheDefaultConfig);
34
+ set(key: string, value: TreeViewItemMeta[]): void;
35
+ get(key: string): TreeViewItemMeta[] | undefined | -1;
36
+ clear(): void;
37
+ }
38
+ export {};
@@ -0,0 +1,31 @@
1
+ export class DataSourceCacheDefault {
2
+ constructor({
3
+ ttl = 300000
4
+ }) {
5
+ this.cache = void 0;
6
+ this.ttl = void 0;
7
+ this.cache = {};
8
+ this.ttl = ttl;
9
+ }
10
+ set(key, value) {
11
+ const expiry = Date.now() + this.ttl;
12
+ this.cache[key] = {
13
+ value,
14
+ expiry
15
+ };
16
+ }
17
+ get(key) {
18
+ const entry = this.cache[key];
19
+ if (!entry) {
20
+ return undefined;
21
+ }
22
+ if (Date.now() > entry.expiry) {
23
+ delete this.cache[key];
24
+ return -1;
25
+ }
26
+ return entry.value;
27
+ }
28
+ clear() {
29
+ this.cache = {};
30
+ }
31
+ }
@@ -0,0 +1 @@
1
+ export * from "./cache.js";
@@ -0,0 +1 @@
1
+ export * from "./cache.js";
@@ -1,4 +1,5 @@
1
1
  import * as React from 'react';
2
+ import type { UseTreeViewLazyLoadingSignature } from '../../internals/plugins/useTreeViewLazyLoading';
2
3
  import type { UseTreeViewSelectionSignature } from '../../internals/plugins/useTreeViewSelection';
3
4
  import type { UseTreeViewExpansionSignature } from '../../internals/plugins/useTreeViewExpansion';
4
5
  import type { UseTreeViewItemsSignature } from '../../internals/plugins/useTreeViewItems';
@@ -21,7 +22,7 @@ type UseTreeItemUtilsMinimalPlugins = readonly [UseTreeViewSelectionSignature, U
21
22
  /**
22
23
  * Plugins that `useTreeItemUtils` can use if they are present, but are not required.
23
24
  */
24
- export type UseTreeItemUtilsOptionalPlugins = readonly [UseTreeViewLabelSignature];
25
+ export type UseTreeItemUtilsOptionalPlugins = readonly [UseTreeViewLabelSignature, UseTreeViewLazyLoadingSignature];
25
26
  interface UseTreeItemUtilsReturnValue<TSignatures extends UseTreeItemUtilsMinimalPlugins, TOptionalSignatures extends UseTreeItemUtilsOptionalPlugins> {
26
27
  interactions: UseTreeItemInteractions;
27
28
  status: UseTreeItemStatus;
@@ -30,7 +31,7 @@ interface UseTreeItemUtilsReturnValue<TSignatures extends UseTreeItemUtilsMinima
30
31
  */
31
32
  publicAPI: TreeViewPublicAPI<TSignatures, TOptionalSignatures>;
32
33
  }
33
- export declare const isItemExpandable: (reactChildren: React.ReactNode) => boolean;
34
+ export declare const itemHasChildren: (reactChildren: React.ReactNode) => boolean;
34
35
  export declare const useTreeItemUtils: <TSignatures extends UseTreeItemUtilsMinimalPlugins = UseTreeItemUtilsMinimalPlugins, TOptionalSignatures extends UseTreeItemUtilsOptionalPlugins = UseTreeItemUtilsOptionalPlugins>({
35
36
  itemId,
36
37
  children
@@ -4,7 +4,7 @@
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.useTreeItemUtils = exports.isItemExpandable = void 0;
7
+ exports.useTreeItemUtils = exports.itemHasChildren = void 0;
8
8
  var _TreeViewProvider = require("../../internals/TreeViewProvider");
9
9
  var _useTreeViewLabel = require("../../internals/plugins/useTreeViewLabel");
10
10
  var _plugins = require("../../internals/utils/plugins");
@@ -13,6 +13,7 @@ var _useTreeViewExpansion = require("../../internals/plugins/useTreeViewExpansio
13
13
  var _useTreeViewFocus = require("../../internals/plugins/useTreeViewFocus/useTreeViewFocus.selectors");
14
14
  var _useTreeViewItems = require("../../internals/plugins/useTreeViewItems/useTreeViewItems.selectors");
15
15
  var _useTreeViewSelection = require("../../internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors");
16
+ var _useTreeViewLazyLoading = require("../../internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors");
16
17
  var _useTreeViewLabel2 = require("../../internals/plugins/useTreeViewLabel/useTreeViewLabel.selectors");
17
18
  /**
18
19
  * Plugins that need to be present in the Tree View in order for `useTreeItemUtils` to work correctly.
@@ -22,13 +23,13 @@ var _useTreeViewLabel2 = require("../../internals/plugins/useTreeViewLabel/useTr
22
23
  * Plugins that `useTreeItemUtils` can use if they are present, but are not required.
23
24
  */
24
25
 
25
- const isItemExpandable = reactChildren => {
26
+ const itemHasChildren = reactChildren => {
26
27
  if (Array.isArray(reactChildren)) {
27
- return reactChildren.length > 0 && reactChildren.some(isItemExpandable);
28
+ return reactChildren.length > 0 && reactChildren.some(itemHasChildren);
28
29
  }
29
30
  return Boolean(reactChildren);
30
31
  };
31
- exports.isItemExpandable = isItemExpandable;
32
+ exports.itemHasChildren = itemHasChildren;
32
33
  const useTreeItemUtils = ({
33
34
  itemId,
34
35
  children
@@ -42,6 +43,11 @@ const useTreeItemUtils = ({
42
43
  },
43
44
  publicAPI
44
45
  } = (0, _TreeViewProvider.useTreeViewContext)();
46
+ const isItemExpandable = (0, _useSelector.useSelector)(store, _useTreeViewExpansion.selectorIsItemExpandable, itemId);
47
+ const isLazyLoadingEnabled = (0, _useSelector.useSelector)(store, _useTreeViewLazyLoading.selectorIsLazyLoadingEnabled);
48
+ const loading = (0, _useSelector.useSelector)(store, state => isLazyLoadingEnabled ? (0, _useTreeViewLazyLoading.selectorIsItemLoading)(state, itemId) : false);
49
+ const error = (0, _useSelector.useSelector)(store, state => isLazyLoadingEnabled ? Boolean((0, _useTreeViewLazyLoading.selectorGetTreeItemError)(state, itemId)) : false);
50
+ const isExpandable = itemHasChildren(children) || isItemExpandable;
45
51
  const isExpanded = (0, _useSelector.useSelector)(store, _useTreeViewExpansion.selectorIsItemExpanded, itemId);
46
52
  const isFocused = (0, _useSelector.useSelector)(store, _useTreeViewFocus.selectorIsItemFocused, itemId);
47
53
  const isSelected = (0, _useSelector.useSelector)(store, _useTreeViewSelection.selectorIsItemSelected, itemId);
@@ -52,13 +58,15 @@ const useTreeItemUtils = ({
52
58
  isItemEditable: label.isItemEditable
53
59
  }));
54
60
  const status = {
55
- expandable: isItemExpandable(children),
61
+ expandable: isExpandable,
56
62
  expanded: isExpanded,
57
63
  focused: isFocused,
58
64
  selected: isSelected,
59
65
  disabled: isDisabled,
60
66
  editing: isEditing,
61
- editable: isEditable
67
+ editable: isEditable,
68
+ loading,
69
+ error
62
70
  };
63
71
  const handleExpansion = event => {
64
72
  if (status.disabled) {
@@ -71,7 +79,11 @@ const useTreeItemUtils = ({
71
79
 
72
80
  // If already expanded and trying to toggle selection don't close
73
81
  if (status.expandable && !(multiple && (0, _useTreeViewExpansion.selectorIsItemExpanded)(store.value, itemId))) {
74
- instance.toggleItemExpansion(event, itemId);
82
+ // make sure the children selection is propagated again
83
+ instance.setItemExpansion({
84
+ event,
85
+ itemId
86
+ });
75
87
  }
76
88
  };
77
89
  const handleSelection = event => {
@@ -86,14 +98,14 @@ const useTreeItemUtils = ({
86
98
  if (event.shiftKey) {
87
99
  instance.expandSelectionRange(event, itemId);
88
100
  } else {
89
- instance.selectItem({
101
+ instance.setItemSelection({
90
102
  event,
91
103
  itemId,
92
104
  keepExistingSelection: true
93
105
  });
94
106
  }
95
107
  } else {
96
- instance.selectItem({
108
+ instance.setItemSelection({
97
109
  event,
98
110
  itemId,
99
111
  shouldBeSelected: true
@@ -105,7 +117,7 @@ const useTreeItemUtils = ({
105
117
  if (multiSelect && hasShift) {
106
118
  instance.expandSelectionRange(event, itemId);
107
119
  } else {
108
- instance.selectItem({
120
+ instance.setItemSelection({
109
121
  event,
110
122
  itemId,
111
123
  keepExistingSelection: multiSelect,
@@ -4,4 +4,4 @@ import { RichTreeViewPluginSignatures } from "../RichTreeView/RichTreeView.plugi
4
4
  /**
5
5
  * Hook that instantiates a [[TreeViewApiRef]].
6
6
  */
7
- export declare const useTreeViewApiRef: <TSignatures extends readonly TreeViewAnyPluginSignature[] = readonly [import("../internals").UseTreeViewItemsSignature, import("../internals").UseTreeViewExpansionSignature, import("../internals").UseTreeViewSelectionSignature, import("../internals").UseTreeViewFocusSignature, import("../internals").UseTreeViewKeyboardNavigationSignature, import("../internals").UseTreeViewIconsSignature, import("../internals").UseTreeViewLabelSignature]>() => React.RefObject<TreeViewPublicAPI<TSignatures> | undefined>;
7
+ export declare const useTreeViewApiRef: <TSignatures extends readonly TreeViewAnyPluginSignature[] = RichTreeViewPluginSignatures>() => React.RefObject<TreeViewPublicAPI<TSignatures> | undefined>;
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-tree-view v8.0.0-alpha.13
2
+ * @mui/x-tree-view v8.0.0-alpha.14
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -2,7 +2,7 @@ export { useTreeView } from "./useTreeView/index.js";
2
2
  export { TreeViewProvider, useTreeViewContext } from "./TreeViewProvider/index.js";
3
3
  export { RichTreeViewItems } from "./components/RichTreeViewItems.js";
4
4
  export type { RichTreeViewItemsSlots, RichTreeViewItemsSlotProps } from './components/RichTreeViewItems';
5
- export { unstable_resetCleanupTracking } from "./hooks/useInstanceEventHandler.js";
5
+ export { unstable_resetCleanupTracking, useInstanceEventHandler } from "./hooks/useInstanceEventHandler.js";
6
6
  export { useSelector } from "./hooks/useSelector.js";
7
7
  export type { TreeViewPlugin, TreeViewPluginSignature, ConvertPluginsIntoSignatures, MergeSignaturesProperty, TreeViewPublicAPI, TreeViewState, TreeViewExperimentalFeatures, TreeViewItemMeta, TreeViewInstance, TreeViewItemPlugin, TreeViewUsedStore } from './models';
8
8
  export type { TreeViewCorePluginParameters } from './corePlugins';
@@ -21,6 +21,11 @@ export { selectorItemMetaLookup, selectorItemMeta, selectorItemIndex, selectorIt
21
21
  export type { UseTreeViewItemsSignature, UseTreeViewItemsParameters, UseTreeViewItemsState } from './plugins/useTreeViewItems';
22
22
  export { useTreeViewLabel } from "./plugins/useTreeViewLabel/index.js";
23
23
  export type { UseTreeViewLabelSignature, UseTreeViewLabelParameters } from './plugins/useTreeViewLabel';
24
+ export { selectorIsItemExpanded } from "./plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.js";
25
+ export { selectorIsItemSelected } from "./plugins/useTreeViewSelection/useTreeViewSelection.selectors.js";
26
+ export { selectorDataSourceState, selectorGetTreeItemError } from "./plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js";
27
+ export type { UseTreeViewLazyLoadingSignature } from './plugins/useTreeViewLazyLoading';
28
+ export type { UseTreeViewLazyLoadingParameters } from './plugins/useTreeViewLazyLoading';
24
29
  export { useTreeViewJSXItems } from "./plugins/useTreeViewJSXItems/index.js";
25
30
  export type { UseTreeViewJSXItemsSignature, UseTreeViewJSXItemsParameters } from './plugins/useTreeViewJSXItems';
26
31
  export { createSelector } from "./utils/selectors.js";
@@ -45,6 +45,30 @@ Object.defineProperty(exports, "isTargetInDescendants", {
45
45
  return _tree.isTargetInDescendants;
46
46
  }
47
47
  });
48
+ Object.defineProperty(exports, "selectorDataSourceState", {
49
+ enumerable: true,
50
+ get: function () {
51
+ return _useTreeViewLazyLoading.selectorDataSourceState;
52
+ }
53
+ });
54
+ Object.defineProperty(exports, "selectorGetTreeItemError", {
55
+ enumerable: true,
56
+ get: function () {
57
+ return _useTreeViewLazyLoading.selectorGetTreeItemError;
58
+ }
59
+ });
60
+ Object.defineProperty(exports, "selectorIsItemExpanded", {
61
+ enumerable: true,
62
+ get: function () {
63
+ return _useTreeViewExpansion2.selectorIsItemExpanded;
64
+ }
65
+ });
66
+ Object.defineProperty(exports, "selectorIsItemSelected", {
67
+ enumerable: true,
68
+ get: function () {
69
+ return _useTreeViewSelection2.selectorIsItemSelected;
70
+ }
71
+ });
48
72
  Object.defineProperty(exports, "selectorItemIndex", {
49
73
  enumerable: true,
50
74
  get: function () {
@@ -75,6 +99,12 @@ Object.defineProperty(exports, "unstable_resetCleanupTracking", {
75
99
  return _useInstanceEventHandler.unstable_resetCleanupTracking;
76
100
  }
77
101
  });
102
+ Object.defineProperty(exports, "useInstanceEventHandler", {
103
+ enumerable: true,
104
+ get: function () {
105
+ return _useInstanceEventHandler.useInstanceEventHandler;
106
+ }
107
+ });
78
108
  Object.defineProperty(exports, "useSelector", {
79
109
  enumerable: true,
80
110
  get: function () {
@@ -154,6 +184,9 @@ var _useTreeViewIcons = require("./plugins/useTreeViewIcons");
154
184
  var _useTreeViewItems = require("./plugins/useTreeViewItems");
155
185
  var _useTreeViewItems2 = require("./plugins/useTreeViewItems/useTreeViewItems.selectors");
156
186
  var _useTreeViewLabel = require("./plugins/useTreeViewLabel");
187
+ var _useTreeViewExpansion2 = require("./plugins/useTreeViewExpansion/useTreeViewExpansion.selectors");
188
+ var _useTreeViewSelection2 = require("./plugins/useTreeViewSelection/useTreeViewSelection.selectors");
189
+ var _useTreeViewLazyLoading = require("./plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors");
157
190
  var _useTreeViewJSXItems = require("./plugins/useTreeViewJSXItems");
158
191
  var _selectors = require("./utils/selectors");
159
192
  var _tree = require("./utils/tree");
@@ -11,6 +11,7 @@ var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedE
11
11
  var _useTreeViewExpansion = require("./useTreeViewExpansion.selectors");
12
12
  var _useTreeViewExpansion2 = require("./useTreeViewExpansion.utils");
13
13
  var _useTreeViewItems = require("../useTreeViewItems/useTreeViewItems.selectors");
14
+ var _publishTreeViewEvent = require("../../utils/publishTreeViewEvent");
14
15
  const useTreeViewExpansion = ({
15
16
  instance,
16
17
  store,
@@ -44,26 +45,48 @@ const useTreeViewExpansion = ({
44
45
  params.onExpandedItemsChange?.(event, value);
45
46
  models.expandedItems.setControlledValue(value);
46
47
  };
47
- const toggleItemExpansion = (0, _useEventCallback.default)((event, itemId) => {
48
- const isExpandedBefore = (0, _useTreeViewExpansion.selectorIsItemExpanded)(store.value, itemId);
49
- instance.setItemExpansion(event, itemId, !isExpandedBefore);
50
- });
51
- const setItemExpansion = (0, _useEventCallback.default)((event, itemId, isExpanded) => {
52
- const isExpandedBefore = (0, _useTreeViewExpansion.selectorIsItemExpanded)(store.value, itemId);
53
- if (isExpandedBefore === isExpanded) {
54
- return;
55
- }
48
+ const applyItemExpansion = (0, _useEventCallback.default)(({
49
+ itemId,
50
+ event,
51
+ shouldBeExpanded
52
+ }) => {
56
53
  let newExpanded;
57
- if (isExpanded) {
54
+ if (shouldBeExpanded) {
58
55
  newExpanded = [itemId].concat(models.expandedItems.value);
59
56
  } else {
60
57
  newExpanded = models.expandedItems.value.filter(id => id !== itemId);
61
58
  }
62
59
  if (params.onItemExpansionToggle) {
63
- params.onItemExpansionToggle(event, itemId, isExpanded);
60
+ params.onItemExpansionToggle(event, itemId, shouldBeExpanded);
64
61
  }
65
62
  setExpandedItems(event, newExpanded);
66
63
  });
64
+ const setItemExpansion = (0, _useEventCallback.default)(({
65
+ itemId,
66
+ event = null,
67
+ shouldBeExpanded
68
+ }) => {
69
+ const isExpandedBefore = (0, _useTreeViewExpansion.selectorIsItemExpanded)(store.value, itemId);
70
+ const cleanShouldBeExpanded = shouldBeExpanded ?? !isExpandedBefore;
71
+ if (isExpandedBefore === cleanShouldBeExpanded) {
72
+ return;
73
+ }
74
+ const eventParameters = {
75
+ isExpansionPrevented: false,
76
+ shouldBeExpanded: cleanShouldBeExpanded,
77
+ event,
78
+ itemId
79
+ };
80
+ (0, _publishTreeViewEvent.publishTreeViewEvent)(instance, 'beforeItemToggleExpansion', eventParameters);
81
+ if (eventParameters.isExpansionPrevented) {
82
+ return;
83
+ }
84
+ instance.applyItemExpansion({
85
+ itemId,
86
+ event,
87
+ shouldBeExpanded: cleanShouldBeExpanded
88
+ });
89
+ });
67
90
  const expandAllSiblings = (event, itemId) => {
68
91
  const itemMeta = (0, _useTreeViewItems.selectorItemMeta)(store.value, itemId);
69
92
  if (itemMeta == null) {
@@ -87,7 +110,7 @@ const useTreeViewExpansion = ({
87
110
  },
88
111
  instance: {
89
112
  setItemExpansion,
90
- toggleItemExpansion,
113
+ applyItemExpansion,
91
114
  expandAllSiblings
92
115
  }
93
116
  };
@@ -90,6 +90,8 @@ export declare const selectorIsItemExpandable: ((state: any, itemId: string | nu
90
90
  [itemId: string]: number;
91
91
  };
92
92
  };
93
+ loading: boolean;
94
+ error: Error | null;
93
95
  }) => {
94
96
  [itemId: string]: import("../..").TreeViewItemMeta;
95
97
  };
@@ -109,6 +111,8 @@ export declare const selectorIsItemExpandable: ((state: any, itemId: string | nu
109
111
  [itemId: string]: number;
110
112
  };
111
113
  };
114
+ loading: boolean;
115
+ error: Error | null;
112
116
  }) => {
113
117
  [itemId: string]: import("../..").TreeViewItemMeta;
114
118
  }) & {
@@ -7,26 +7,38 @@ import { UseTreeViewLabelSignature } from "../useTreeViewLabel/index.js";
7
7
  export interface UseTreeViewExpansionPublicAPI {
8
8
  /**
9
9
  * Change the expansion status of a given item.
10
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
11
- * @param {string} itemId The id of the item to expand of collapse.
12
- * @param {boolean} isExpanded If `true` the item will be expanded. If `false` the item will be collapsed.
10
+ * @param {object} parameters The parameters of the method.
11
+ * @param {string} parameters.itemId The id of the item to expand of collapse.
12
+ * @param {React.SyntheticEvent} parameters.event The DOM event that triggered the change.
13
+ * @param {boolean} parameters.shouldBeExpanded If `true` the item will be expanded. If `false` the item will be collapsed. If not defined, the item's expansion status will be the toggled.
13
14
  */
14
- setItemExpansion: (event: React.SyntheticEvent, itemId: string, isExpanded: boolean) => void;
15
+ setItemExpansion: (parameters: {
16
+ itemId: string;
17
+ event?: React.SyntheticEvent;
18
+ shouldBeExpanded?: boolean;
19
+ }) => void;
15
20
  }
16
21
  export interface UseTreeViewExpansionInstance extends UseTreeViewExpansionPublicAPI {
17
- /**
18
- * Toggle the current expansion of an item.
19
- * If it is expanded, it will be collapsed, and vice versa.
20
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
21
- * @param {TreeViewItemId} itemId The id of the item to toggle.
22
- */
23
- toggleItemExpansion: (event: React.SyntheticEvent, itemId: TreeViewItemId) => void;
24
22
  /**
25
23
  * Expand all the siblings (i.e.: the items that have the same parent) of a given item.
26
24
  * @param {React.SyntheticEvent} event The DOM event that triggered the change.
27
25
  * @param {TreeViewItemId} itemId The id of the item whose siblings will be expanded.
28
26
  */
29
27
  expandAllSiblings: (event: React.KeyboardEvent, itemId: TreeViewItemId) => void;
28
+ /**
29
+ * APply the new expansion status of a given item.
30
+ * Is used by the `setItemExpansion` method and by the `useTreeViewLazyLoading` plugin.
31
+ * Unlike `setItemExpansion`, this method does not trigger the lazy loading.
32
+ * @param {object} parameters The parameters of the method.
33
+ * @param {string} parameters.itemId The id of the item to expand of collapse.
34
+ * @param {React.SyntheticEvent | null} parameters.event The DOM event that triggered the change.
35
+ * @param {boolean} parameters.shouldBeExpanded If `true` the item will be expanded. If `false` the item will be collapsed.
36
+ */
37
+ applyItemExpansion: (parameters: {
38
+ itemId: string;
39
+ event: React.SyntheticEvent | null;
40
+ shouldBeExpanded: boolean;
41
+ }) => void;
30
42
  }
31
43
  export interface UseTreeViewExpansionParameters {
32
44
  /**
@@ -42,17 +54,17 @@ export interface UseTreeViewExpansionParameters {
42
54
  defaultExpandedItems?: string[];
43
55
  /**
44
56
  * Callback fired when Tree Items are expanded/collapsed.
45
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
57
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
46
58
  * @param {array} itemIds The ids of the expanded items.
47
59
  */
48
- onExpandedItemsChange?: (event: React.SyntheticEvent, itemIds: string[]) => void;
60
+ onExpandedItemsChange?: (event: React.SyntheticEvent | null, itemIds: string[]) => void;
49
61
  /**
50
62
  * Callback fired when a Tree Item is expanded or collapsed.
51
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
63
+ * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
52
64
  * @param {array} itemId The itemId of the modified item.
53
65
  * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
54
66
  */
55
- onItemExpansionToggle?: (event: React.SyntheticEvent, itemId: string, isExpanded: boolean) => void;
67
+ onItemExpansionToggle?: (event: React.SyntheticEvent | null, itemId: string, isExpanded: boolean) => void;
56
68
  /**
57
69
  * The slot that triggers the item's expansion when clicked.
58
70
  * @default 'content'
@@ -66,6 +78,16 @@ export interface UseTreeViewExpansionState {
66
78
  expansionTrigger: 'content' | 'iconContainer';
67
79
  };
68
80
  }
81
+ interface UseTreeViewExpansionEventLookup {
82
+ beforeItemToggleExpansion: {
83
+ params: {
84
+ isExpansionPrevented: boolean;
85
+ shouldBeExpanded: boolean;
86
+ event: React.SyntheticEvent | null;
87
+ itemId: TreeViewItemId;
88
+ };
89
+ };
90
+ }
69
91
  export type UseTreeViewExpansionSignature = TreeViewPluginSignature<{
70
92
  params: UseTreeViewExpansionParameters;
71
93
  defaultizedParams: UseTreeViewExpansionDefaultizedParameters;
@@ -75,4 +97,6 @@ export type UseTreeViewExpansionSignature = TreeViewPluginSignature<{
75
97
  state: UseTreeViewExpansionState;
76
98
  dependencies: [UseTreeViewItemsSignature];
77
99
  optionalDependencies: [UseTreeViewLabelSignature];
78
- }>;
100
+ events: UseTreeViewExpansionEventLookup;
101
+ }>;
102
+ export {};