@mui/x-tree-view 7.9.0 → 7.10.0
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 +74 -0
- package/RichTreeView/RichTreeView.js +2 -0
- package/SimpleTreeView/SimpleTreeView.js +2 -0
- package/TreeView/TreeView.js +2 -0
- package/index.js +1 -1
- package/internals/corePlugins/corePlugins.d.ts +1 -1
- package/internals/corePlugins/corePlugins.js +2 -1
- package/internals/corePlugins/useTreeViewOptionalPlugins/index.d.ts +2 -0
- package/internals/corePlugins/useTreeViewOptionalPlugins/index.js +1 -0
- package/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.d.ts +3 -0
- package/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.js +12 -0
- package/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.d.ts +8 -0
- package/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.js +1 -0
- package/internals/models/plugin.d.ts +1 -0
- package/internals/plugins/useTreeViewItems/useTreeViewItems.js +19 -3
- package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +13 -8
- package/internals/useTreeView/useTreeView.js +2 -1
- package/internals/utils/plugins.d.ts +2 -0
- package/internals/utils/plugins.js +4 -0
- package/modern/RichTreeView/RichTreeView.js +2 -0
- package/modern/SimpleTreeView/SimpleTreeView.js +2 -0
- package/modern/TreeView/TreeView.js +2 -0
- package/modern/index.js +1 -1
- package/modern/internals/corePlugins/corePlugins.js +2 -1
- package/modern/internals/corePlugins/useTreeViewOptionalPlugins/index.js +1 -0
- package/modern/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.js +12 -0
- package/modern/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.js +1 -0
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +19 -3
- package/modern/internals/useTreeView/useTreeView.js +2 -1
- package/modern/internals/utils/plugins.js +4 -0
- package/node/RichTreeView/RichTreeView.js +2 -0
- package/node/SimpleTreeView/SimpleTreeView.js +2 -0
- package/node/TreeView/TreeView.js +2 -0
- package/node/index.js +1 -1
- package/node/internals/corePlugins/corePlugins.js +2 -1
- package/node/internals/corePlugins/useTreeViewOptionalPlugins/index.js +12 -0
- package/node/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.js +19 -0
- package/node/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.js +5 -0
- package/node/internals/plugins/useTreeViewItems/useTreeViewItems.js +19 -3
- package/node/internals/useTreeView/useTreeView.js +2 -1
- package/node/internals/utils/plugins.js +11 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,80 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 7.10.0
|
|
7
|
+
|
|
8
|
+
_Jul 11, 2024_
|
|
9
|
+
|
|
10
|
+
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
|
|
11
|
+
|
|
12
|
+
- 🎁 Add selectors to support showing child row count in footer in the Data Grid
|
|
13
|
+
- ✨ New APIs for retrieving current item tree and item's children IDs in the Tree View
|
|
14
|
+
- 🌍 Improve Spanish (es-ES) locale on the Data Grid
|
|
15
|
+
- 🐞 Bugfixes
|
|
16
|
+
- 📚 Documentation improvements
|
|
17
|
+
|
|
18
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
19
|
+
|
|
20
|
+
### Data Grid
|
|
21
|
+
|
|
22
|
+
#### `@mui/x-data-grid@7.10.0`
|
|
23
|
+
|
|
24
|
+
- [DataGrid] Add selectors to support showing child row count in footer (#13725) @KenanYusuf
|
|
25
|
+
- [DataGrid] Fix incorrect panels position when using a toolbar (#13474) @oukunan
|
|
26
|
+
- [DataGrid] Set default variant to `'standard'` in `GridFilterInputMultipleValue` (#13129) @tarunrajput
|
|
27
|
+
- [DataGrid] Use `readonly` on more array props (#13331) @pcorpet
|
|
28
|
+
- [l10n] Improve Spanish (es-ES) locale (#13772) @joserealdev
|
|
29
|
+
|
|
30
|
+
#### `@mui/x-data-grid-pro@7.10.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
31
|
+
|
|
32
|
+
Same changes as in `@mui/x-data-grid@7.10.0`, plus:
|
|
33
|
+
|
|
34
|
+
- [DataGridPro] Keep bottom pinned row at the bottom (#13313) @romgrk
|
|
35
|
+
|
|
36
|
+
#### `@mui/x-data-grid-premium@7.10.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
37
|
+
|
|
38
|
+
Same changes as in `@mui/x-data-grid-pro@7.10.0`.
|
|
39
|
+
|
|
40
|
+
### Date and Time Pickers
|
|
41
|
+
|
|
42
|
+
#### `@mui/x-date-pickers@7.10.0`
|
|
43
|
+
|
|
44
|
+
- [fields] Prevent infinite recursion when ensuring selection (#13779) @LukasTy
|
|
45
|
+
- [fields] Unify fields behavior regardless of the `readOnly` flag (#13688) @LukasTy
|
|
46
|
+
|
|
47
|
+
#### `@mui/x-date-pickers-pro@7.10.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
48
|
+
|
|
49
|
+
Same changes as in `@mui/x-date-pickers@7.10.0`, plus:
|
|
50
|
+
|
|
51
|
+
- [DateRangePicker] Fix `calendarHeader` slot props propagation (#13780) @LukasTy
|
|
52
|
+
- [DateTimeRangePicker] Resolve `format` from given `views` (#13743) @LukasTy
|
|
53
|
+
|
|
54
|
+
### Charts
|
|
55
|
+
|
|
56
|
+
#### `@mui/x-charts@7.10.0`
|
|
57
|
+
|
|
58
|
+
- [charts] Fix displaying area of a `LineChart` when using the `log` scale (#13791) @alexfauquette
|
|
59
|
+
- [charts] Use correct click handler prop on pie chart `OnSeriesItemClick` documentation (#13761) @tonyhallett
|
|
60
|
+
|
|
61
|
+
### Tree View
|
|
62
|
+
|
|
63
|
+
#### `@mui/x-tree-view@7.10.0`
|
|
64
|
+
|
|
65
|
+
- [TreeView] Add `getItemTree` and `getItemOrderedChildrenIds` methods to the public API (#13804) @flaviendelangle
|
|
66
|
+
- [TreeView] Add utility function to check if an optional plugin is present (#13788) @flaviendelangle
|
|
67
|
+
|
|
68
|
+
### Docs
|
|
69
|
+
|
|
70
|
+
- [docs] Add missing default `loading` prop value (#13604) @oliviertassinari
|
|
71
|
+
- [docs] Add the `DateTimeRangePicker` to the "Commonly used components" demo (#13775) @flaviendelangle
|
|
72
|
+
- [docs] Fix Pickers customization playground overflow (#13742) @LukasTy
|
|
73
|
+
- [docs] Move Pickers dialog guidelines to accessibility page (#13778) @arthurbalduini
|
|
74
|
+
|
|
75
|
+
### Core
|
|
76
|
+
|
|
77
|
+
- [core] Sort `DATA_GRID_PROPS_DEFAULT_VALUES` alphabetically (#13783) @oliviertassinari
|
|
78
|
+
- [test] Fix split infinitive use in tests @oliviertassinari
|
|
79
|
+
|
|
6
80
|
## 7.9.0
|
|
7
81
|
|
|
8
82
|
_Jul 5, 2024_
|
|
@@ -138,6 +138,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
|
|
|
138
138
|
focusItem: PropTypes.func.isRequired,
|
|
139
139
|
getItem: PropTypes.func.isRequired,
|
|
140
140
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
141
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
142
|
+
getItemTree: PropTypes.func.isRequired,
|
|
141
143
|
selectItem: PropTypes.func.isRequired,
|
|
142
144
|
setItemExpansion: PropTypes.func.isRequired
|
|
143
145
|
})
|
|
@@ -96,6 +96,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
|
|
|
96
96
|
focusItem: PropTypes.func.isRequired,
|
|
97
97
|
getItem: PropTypes.func.isRequired,
|
|
98
98
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
99
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
100
|
+
getItemTree: PropTypes.func.isRequired,
|
|
99
101
|
selectItem: PropTypes.func.isRequired,
|
|
100
102
|
setItemExpansion: PropTypes.func.isRequired
|
|
101
103
|
})
|
package/TreeView/TreeView.js
CHANGED
|
@@ -73,6 +73,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
|
|
|
73
73
|
focusItem: PropTypes.func.isRequired,
|
|
74
74
|
getItem: PropTypes.func.isRequired,
|
|
75
75
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
76
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
77
|
+
getItemTree: PropTypes.func.isRequired,
|
|
76
78
|
selectItem: PropTypes.func.isRequired,
|
|
77
79
|
setItemExpansion: PropTypes.func.isRequired
|
|
78
80
|
})
|
package/index.js
CHANGED
|
@@ -4,7 +4,7 @@ import { ConvertPluginsIntoSignatures } from '../models';
|
|
|
4
4
|
* Internal plugins that create the tools used by the other plugins.
|
|
5
5
|
* These plugins are used by the tree view components.
|
|
6
6
|
*/
|
|
7
|
-
export declare const TREE_VIEW_CORE_PLUGINS: readonly [import("../models").TreeViewPlugin<import("./useTreeViewInstanceEvents").UseTreeViewInstanceEventsSignature>, import("../models").TreeViewPlugin<import("./useTreeViewId").UseTreeViewIdSignature>];
|
|
7
|
+
export declare const TREE_VIEW_CORE_PLUGINS: readonly [import("../models").TreeViewPlugin<import("./useTreeViewInstanceEvents").UseTreeViewInstanceEventsSignature>, import("../models").TreeViewPlugin<import("./useTreeViewOptionalPlugins").UseTreeViewOptionalPluginsSignature>, import("../models").TreeViewPlugin<import("./useTreeViewId").UseTreeViewIdSignature>];
|
|
8
8
|
export type TreeViewCorePluginSignatures = ConvertPluginsIntoSignatures<typeof TREE_VIEW_CORE_PLUGINS>;
|
|
9
9
|
export interface TreeViewCorePluginParameters extends UseTreeViewIdParameters {
|
|
10
10
|
}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useTreeViewInstanceEvents } from './useTreeViewInstanceEvents';
|
|
2
|
+
import { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
|
|
2
3
|
import { useTreeViewId } from './useTreeViewId';
|
|
3
4
|
/**
|
|
4
5
|
* Internal plugins that create the tools used by the other plugins.
|
|
5
6
|
* These plugins are used by the tree view components.
|
|
6
7
|
*/
|
|
7
|
-
export const TREE_VIEW_CORE_PLUGINS = [useTreeViewInstanceEvents, useTreeViewId];
|
|
8
|
+
export const TREE_VIEW_CORE_PLUGINS = [useTreeViewInstanceEvents, useTreeViewOptionalPlugins, useTreeViewId];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
|
package/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.d.ts
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { TreeViewPlugin, TreeViewAnyPluginSignature, TreeViewPluginSignature } from '../../models';
|
|
2
|
+
interface UseTreeViewOptionalPluginsInstance {
|
|
3
|
+
getAvailablePlugins: () => Set<TreeViewPlugin<TreeViewAnyPluginSignature>>;
|
|
4
|
+
}
|
|
5
|
+
export type UseTreeViewOptionalPluginsSignature = TreeViewPluginSignature<{
|
|
6
|
+
instance: UseTreeViewOptionalPluginsInstance;
|
|
7
|
+
}>;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -15,6 +15,7 @@ export interface TreeViewPluginOptions<TSignature extends TreeViewAnyPluginSigna
|
|
|
15
15
|
models: TreeViewUsedModels<TSignature>;
|
|
16
16
|
setState: React.Dispatch<React.SetStateAction<TreeViewUsedState<TSignature>>>;
|
|
17
17
|
rootRef: React.RefObject<HTMLUListElement>;
|
|
18
|
+
plugins: TreeViewPlugin<TreeViewAnyPluginSignature>[];
|
|
18
19
|
}
|
|
19
20
|
type TreeViewModelsInitializer<TSignature extends TreeViewAnyPluginSignature> = {
|
|
20
21
|
[TControlled in keyof TSignature['models']]: {
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
+
const _excluded = ["children"];
|
|
2
4
|
import * as React from 'react';
|
|
3
5
|
import { publishTreeViewEvent } from '../../utils/publishTreeViewEvent';
|
|
4
6
|
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from './useTreeViewItems.utils';
|
|
@@ -37,7 +39,6 @@ const updateItemsState = ({
|
|
|
37
39
|
depth
|
|
38
40
|
};
|
|
39
41
|
itemMap[id] = item;
|
|
40
|
-
itemOrderedChildrenIds[id] = [];
|
|
41
42
|
const parentIdWithDefault = parentId ?? TREE_VIEW_ROOT_PARENT_ID;
|
|
42
43
|
if (!itemOrderedChildrenIds[parentIdWithDefault]) {
|
|
43
44
|
itemOrderedChildrenIds[parentIdWithDefault] = [];
|
|
@@ -66,6 +67,18 @@ export const useTreeViewItems = ({
|
|
|
66
67
|
}) => {
|
|
67
68
|
const getItemMeta = React.useCallback(itemId => state.items.itemMetaMap[itemId], [state.items.itemMetaMap]);
|
|
68
69
|
const getItem = React.useCallback(itemId => state.items.itemMap[itemId], [state.items.itemMap]);
|
|
70
|
+
const getItemTree = React.useCallback(() => {
|
|
71
|
+
const getItemFromItemId = id => {
|
|
72
|
+
const _state$items$itemMap$ = state.items.itemMap[id],
|
|
73
|
+
item = _objectWithoutPropertiesLoose(_state$items$itemMap$, _excluded);
|
|
74
|
+
const newChildren = state.items.itemOrderedChildrenIds[id];
|
|
75
|
+
if (newChildren) {
|
|
76
|
+
item.children = newChildren.map(getItemFromItemId);
|
|
77
|
+
}
|
|
78
|
+
return item;
|
|
79
|
+
};
|
|
80
|
+
return state.items.itemOrderedChildrenIds[TREE_VIEW_ROOT_PARENT_ID].map(getItemFromItemId);
|
|
81
|
+
}, [state.items.itemMap, state.items.itemOrderedChildrenIds]);
|
|
69
82
|
const isItemDisabled = React.useCallback(itemId => {
|
|
70
83
|
if (itemId == null) {
|
|
71
84
|
return false;
|
|
@@ -140,7 +153,7 @@ export const useTreeViewItems = ({
|
|
|
140
153
|
label: item.label,
|
|
141
154
|
itemId: item.id,
|
|
142
155
|
id: item.idAttribute,
|
|
143
|
-
children: state.items.itemOrderedChildrenIds[id]
|
|
156
|
+
children: state.items.itemOrderedChildrenIds[id]?.map(getPropsFromItemId)
|
|
144
157
|
};
|
|
145
158
|
};
|
|
146
159
|
return state.items.itemOrderedChildrenIds[TREE_VIEW_ROOT_PARENT_ID].map(getPropsFromItemId);
|
|
@@ -153,11 +166,14 @@ export const useTreeViewItems = ({
|
|
|
153
166
|
}),
|
|
154
167
|
publicAPI: {
|
|
155
168
|
getItem,
|
|
156
|
-
getItemDOMElement
|
|
169
|
+
getItemDOMElement,
|
|
170
|
+
getItemTree,
|
|
171
|
+
getItemOrderedChildrenIds
|
|
157
172
|
},
|
|
158
173
|
instance: {
|
|
159
174
|
getItemMeta,
|
|
160
175
|
getItem,
|
|
176
|
+
getItemTree,
|
|
161
177
|
getItemsToRender,
|
|
162
178
|
getItemIndex,
|
|
163
179
|
getItemDOMElement,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TreeViewItemMeta, DefaultizedProps, TreeViewPluginSignature } from '../../models';
|
|
2
|
-
import { TreeViewItemId } from '../../../models';
|
|
2
|
+
import { TreeViewBaseItem, TreeViewItemId } from '../../../models';
|
|
3
3
|
interface TreeViewItemProps {
|
|
4
4
|
label: string;
|
|
5
5
|
itemId: string;
|
|
@@ -20,6 +20,18 @@ export interface UseTreeViewItemsPublicAPI<R extends {}> {
|
|
|
20
20
|
* @returns {HTMLElement | null} The DOM element of the item with the given id.
|
|
21
21
|
*/
|
|
22
22
|
getItemDOMElement: (itemId: TreeViewItemId) => HTMLElement | null;
|
|
23
|
+
/**
|
|
24
|
+
* Get the ids of a given item's children.
|
|
25
|
+
* Those ids are returned in the order they should be rendered.
|
|
26
|
+
* @param {TreeViewItemId | null} itemId The id of the item to get the children of.
|
|
27
|
+
* @returns {TreeViewItemId[]} The ids of the item's children.
|
|
28
|
+
*/
|
|
29
|
+
getItemOrderedChildrenIds: (itemId: TreeViewItemId | null) => TreeViewItemId[];
|
|
30
|
+
/**
|
|
31
|
+
* Get all the items in the same format as provided by `props.items`.
|
|
32
|
+
* @returns {TreeViewItemProps[]} The items in the tree.
|
|
33
|
+
*/
|
|
34
|
+
getItemTree: () => TreeViewBaseItem[];
|
|
23
35
|
}
|
|
24
36
|
export interface UseTreeViewItemsInstance<R extends {}> extends UseTreeViewItemsPublicAPI<R> {
|
|
25
37
|
/**
|
|
@@ -36,13 +48,6 @@ export interface UseTreeViewItemsInstance<R extends {}> extends UseTreeViewItems
|
|
|
36
48
|
* @returns {TreeViewItemProps[]} The items to render.
|
|
37
49
|
*/
|
|
38
50
|
getItemsToRender: () => TreeViewItemProps[];
|
|
39
|
-
/**
|
|
40
|
-
* Get the ids of a given item's children.
|
|
41
|
-
* Those ids are returned in the order they should be rendered.
|
|
42
|
-
* @param {TreeViewItemId | null} itemId The id of the item to get the children of.
|
|
43
|
-
* @returns {TreeViewItemId[]} The ids of the item's children.
|
|
44
|
-
*/
|
|
45
|
-
getItemOrderedChildrenIds: (itemId: TreeViewItemId | null) => TreeViewItemId[];
|
|
46
51
|
/**
|
|
47
52
|
* Check if a given item is disabled.
|
|
48
53
|
* An item is disabled if it was marked as disabled or if one of its ancestors is disabled.
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { TreeViewAnyPluginSignature, TreeViewInstance, TreeViewPlugin } from '../models';
|
|
2
|
+
export declare const hasPlugin: <TSignature extends TreeViewAnyPluginSignature, TInstance extends TreeViewInstance<[], [TSignature]>>(instance: TInstance, plugin: TreeViewPlugin<TSignature>) => instance is Omit<TInstance, keyof TSignature["instance"]> & TSignature["instance"];
|
|
@@ -138,6 +138,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
|
|
|
138
138
|
focusItem: PropTypes.func.isRequired,
|
|
139
139
|
getItem: PropTypes.func.isRequired,
|
|
140
140
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
141
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
142
|
+
getItemTree: PropTypes.func.isRequired,
|
|
141
143
|
selectItem: PropTypes.func.isRequired,
|
|
142
144
|
setItemExpansion: PropTypes.func.isRequired
|
|
143
145
|
})
|
|
@@ -96,6 +96,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
|
|
|
96
96
|
focusItem: PropTypes.func.isRequired,
|
|
97
97
|
getItem: PropTypes.func.isRequired,
|
|
98
98
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
99
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
100
|
+
getItemTree: PropTypes.func.isRequired,
|
|
99
101
|
selectItem: PropTypes.func.isRequired,
|
|
100
102
|
setItemExpansion: PropTypes.func.isRequired
|
|
101
103
|
})
|
|
@@ -73,6 +73,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
|
|
|
73
73
|
focusItem: PropTypes.func.isRequired,
|
|
74
74
|
getItem: PropTypes.func.isRequired,
|
|
75
75
|
getItemDOMElement: PropTypes.func.isRequired,
|
|
76
|
+
getItemOrderedChildrenIds: PropTypes.func.isRequired,
|
|
77
|
+
getItemTree: PropTypes.func.isRequired,
|
|
76
78
|
selectItem: PropTypes.func.isRequired,
|
|
77
79
|
setItemExpansion: PropTypes.func.isRequired
|
|
78
80
|
})
|
package/modern/index.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useTreeViewInstanceEvents } from './useTreeViewInstanceEvents';
|
|
2
|
+
import { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
|
|
2
3
|
import { useTreeViewId } from './useTreeViewId';
|
|
3
4
|
/**
|
|
4
5
|
* Internal plugins that create the tools used by the other plugins.
|
|
5
6
|
* These plugins are used by the tree view components.
|
|
6
7
|
*/
|
|
7
|
-
export const TREE_VIEW_CORE_PLUGINS = [useTreeViewInstanceEvents, useTreeViewId];
|
|
8
|
+
export const TREE_VIEW_CORE_PLUGINS = [useTreeViewInstanceEvents, useTreeViewOptionalPlugins, useTreeViewId];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
|
package/modern/internals/corePlugins/useTreeViewOptionalPlugins/useTreeViewOptionalPlugins.types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
+
const _excluded = ["children"];
|
|
2
4
|
import * as React from 'react';
|
|
3
5
|
import { publishTreeViewEvent } from '../../utils/publishTreeViewEvent';
|
|
4
6
|
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from './useTreeViewItems.utils';
|
|
@@ -37,7 +39,6 @@ const updateItemsState = ({
|
|
|
37
39
|
depth
|
|
38
40
|
};
|
|
39
41
|
itemMap[id] = item;
|
|
40
|
-
itemOrderedChildrenIds[id] = [];
|
|
41
42
|
const parentIdWithDefault = parentId ?? TREE_VIEW_ROOT_PARENT_ID;
|
|
42
43
|
if (!itemOrderedChildrenIds[parentIdWithDefault]) {
|
|
43
44
|
itemOrderedChildrenIds[parentIdWithDefault] = [];
|
|
@@ -66,6 +67,18 @@ export const useTreeViewItems = ({
|
|
|
66
67
|
}) => {
|
|
67
68
|
const getItemMeta = React.useCallback(itemId => state.items.itemMetaMap[itemId], [state.items.itemMetaMap]);
|
|
68
69
|
const getItem = React.useCallback(itemId => state.items.itemMap[itemId], [state.items.itemMap]);
|
|
70
|
+
const getItemTree = React.useCallback(() => {
|
|
71
|
+
const getItemFromItemId = id => {
|
|
72
|
+
const _state$items$itemMap$ = state.items.itemMap[id],
|
|
73
|
+
item = _objectWithoutPropertiesLoose(_state$items$itemMap$, _excluded);
|
|
74
|
+
const newChildren = state.items.itemOrderedChildrenIds[id];
|
|
75
|
+
if (newChildren) {
|
|
76
|
+
item.children = newChildren.map(getItemFromItemId);
|
|
77
|
+
}
|
|
78
|
+
return item;
|
|
79
|
+
};
|
|
80
|
+
return state.items.itemOrderedChildrenIds[TREE_VIEW_ROOT_PARENT_ID].map(getItemFromItemId);
|
|
81
|
+
}, [state.items.itemMap, state.items.itemOrderedChildrenIds]);
|
|
69
82
|
const isItemDisabled = React.useCallback(itemId => {
|
|
70
83
|
if (itemId == null) {
|
|
71
84
|
return false;
|
|
@@ -140,7 +153,7 @@ export const useTreeViewItems = ({
|
|
|
140
153
|
label: item.label,
|
|
141
154
|
itemId: item.id,
|
|
142
155
|
id: item.idAttribute,
|
|
143
|
-
children: state.items.itemOrderedChildrenIds[id]
|
|
156
|
+
children: state.items.itemOrderedChildrenIds[id]?.map(getPropsFromItemId)
|
|
144
157
|
};
|
|
145
158
|
};
|
|
146
159
|
return state.items.itemOrderedChildrenIds[TREE_VIEW_ROOT_PARENT_ID].map(getPropsFromItemId);
|
|
@@ -153,11 +166,14 @@ export const useTreeViewItems = ({
|
|
|
153
166
|
}),
|
|
154
167
|
publicAPI: {
|
|
155
168
|
getItem,
|
|
156
|
-
getItemDOMElement
|
|
169
|
+
getItemDOMElement,
|
|
170
|
+
getItemTree,
|
|
171
|
+
getItemOrderedChildrenIds
|
|
157
172
|
},
|
|
158
173
|
instance: {
|
|
159
174
|
getItemMeta,
|
|
160
175
|
getItem,
|
|
176
|
+
getItemTree,
|
|
161
177
|
getItemsToRender,
|
|
162
178
|
getItemIndex,
|
|
163
179
|
getItemDOMElement,
|
|
@@ -147,6 +147,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
|
|
|
147
147
|
focusItem: _propTypes.default.func.isRequired,
|
|
148
148
|
getItem: _propTypes.default.func.isRequired,
|
|
149
149
|
getItemDOMElement: _propTypes.default.func.isRequired,
|
|
150
|
+
getItemOrderedChildrenIds: _propTypes.default.func.isRequired,
|
|
151
|
+
getItemTree: _propTypes.default.func.isRequired,
|
|
150
152
|
selectItem: _propTypes.default.func.isRequired,
|
|
151
153
|
setItemExpansion: _propTypes.default.func.isRequired
|
|
152
154
|
})
|
|
@@ -105,6 +105,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
|
|
|
105
105
|
focusItem: _propTypes.default.func.isRequired,
|
|
106
106
|
getItem: _propTypes.default.func.isRequired,
|
|
107
107
|
getItemDOMElement: _propTypes.default.func.isRequired,
|
|
108
|
+
getItemOrderedChildrenIds: _propTypes.default.func.isRequired,
|
|
109
|
+
getItemTree: _propTypes.default.func.isRequired,
|
|
108
110
|
selectItem: _propTypes.default.func.isRequired,
|
|
109
111
|
setItemExpansion: _propTypes.default.func.isRequired
|
|
110
112
|
})
|
|
@@ -82,6 +82,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
|
|
|
82
82
|
focusItem: _propTypes.default.func.isRequired,
|
|
83
83
|
getItem: _propTypes.default.func.isRequired,
|
|
84
84
|
getItemDOMElement: _propTypes.default.func.isRequired,
|
|
85
|
+
getItemOrderedChildrenIds: _propTypes.default.func.isRequired,
|
|
86
|
+
getItemTree: _propTypes.default.func.isRequired,
|
|
85
87
|
selectItem: _propTypes.default.func.isRequired,
|
|
86
88
|
setItemExpansion: _propTypes.default.func.isRequired
|
|
87
89
|
})
|
package/node/index.js
CHANGED
|
@@ -5,9 +5,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.TREE_VIEW_CORE_PLUGINS = void 0;
|
|
7
7
|
var _useTreeViewInstanceEvents = require("./useTreeViewInstanceEvents");
|
|
8
|
+
var _useTreeViewOptionalPlugins = require("./useTreeViewOptionalPlugins");
|
|
8
9
|
var _useTreeViewId = require("./useTreeViewId");
|
|
9
10
|
/**
|
|
10
11
|
* Internal plugins that create the tools used by the other plugins.
|
|
11
12
|
* These plugins are used by the tree view components.
|
|
12
13
|
*/
|
|
13
|
-
const TREE_VIEW_CORE_PLUGINS = exports.TREE_VIEW_CORE_PLUGINS = [_useTreeViewInstanceEvents.useTreeViewInstanceEvents, _useTreeViewId.useTreeViewId];
|
|
14
|
+
const TREE_VIEW_CORE_PLUGINS = exports.TREE_VIEW_CORE_PLUGINS = [_useTreeViewInstanceEvents.useTreeViewInstanceEvents, _useTreeViewOptionalPlugins.useTreeViewOptionalPlugins, _useTreeViewId.useTreeViewId];
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "useTreeViewOptionalPlugins", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useTreeViewOptionalPlugins.useTreeViewOptionalPlugins;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _useTreeViewOptionalPlugins = require("./useTreeViewOptionalPlugins");
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useTreeViewOptionalPlugins = void 0;
|
|
7
|
+
const useTreeViewOptionalPlugins = ({
|
|
8
|
+
plugins
|
|
9
|
+
}) => {
|
|
10
|
+
const pluginSet = new Set(plugins);
|
|
11
|
+
const getAvailablePlugins = () => pluginSet;
|
|
12
|
+
return {
|
|
13
|
+
instance: {
|
|
14
|
+
getAvailablePlugins
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
exports.useTreeViewOptionalPlugins = useTreeViewOptionalPlugins;
|
|
19
|
+
useTreeViewOptionalPlugins.params = {};
|
|
@@ -6,11 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.useTreeViewItems = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
9
10
|
var React = _interopRequireWildcard(require("react"));
|
|
10
11
|
var _publishTreeViewEvent = require("../../utils/publishTreeViewEvent");
|
|
11
12
|
var _useTreeViewItems = require("./useTreeViewItems.utils");
|
|
12
13
|
var _TreeViewItemDepthContext = require("../../TreeViewItemDepthContext");
|
|
13
14
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
+
const _excluded = ["children"];
|
|
14
16
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
15
17
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
16
18
|
const updateItemsState = ({
|
|
@@ -46,7 +48,6 @@ const updateItemsState = ({
|
|
|
46
48
|
depth
|
|
47
49
|
};
|
|
48
50
|
itemMap[id] = item;
|
|
49
|
-
itemOrderedChildrenIds[id] = [];
|
|
50
51
|
const parentIdWithDefault = parentId ?? _useTreeViewItems.TREE_VIEW_ROOT_PARENT_ID;
|
|
51
52
|
if (!itemOrderedChildrenIds[parentIdWithDefault]) {
|
|
52
53
|
itemOrderedChildrenIds[parentIdWithDefault] = [];
|
|
@@ -75,6 +76,18 @@ const useTreeViewItems = ({
|
|
|
75
76
|
}) => {
|
|
76
77
|
const getItemMeta = React.useCallback(itemId => state.items.itemMetaMap[itemId], [state.items.itemMetaMap]);
|
|
77
78
|
const getItem = React.useCallback(itemId => state.items.itemMap[itemId], [state.items.itemMap]);
|
|
79
|
+
const getItemTree = React.useCallback(() => {
|
|
80
|
+
const getItemFromItemId = id => {
|
|
81
|
+
const _state$items$itemMap$ = state.items.itemMap[id],
|
|
82
|
+
item = (0, _objectWithoutPropertiesLoose2.default)(_state$items$itemMap$, _excluded);
|
|
83
|
+
const newChildren = state.items.itemOrderedChildrenIds[id];
|
|
84
|
+
if (newChildren) {
|
|
85
|
+
item.children = newChildren.map(getItemFromItemId);
|
|
86
|
+
}
|
|
87
|
+
return item;
|
|
88
|
+
};
|
|
89
|
+
return state.items.itemOrderedChildrenIds[_useTreeViewItems.TREE_VIEW_ROOT_PARENT_ID].map(getItemFromItemId);
|
|
90
|
+
}, [state.items.itemMap, state.items.itemOrderedChildrenIds]);
|
|
78
91
|
const isItemDisabled = React.useCallback(itemId => {
|
|
79
92
|
if (itemId == null) {
|
|
80
93
|
return false;
|
|
@@ -149,7 +162,7 @@ const useTreeViewItems = ({
|
|
|
149
162
|
label: item.label,
|
|
150
163
|
itemId: item.id,
|
|
151
164
|
id: item.idAttribute,
|
|
152
|
-
children: state.items.itemOrderedChildrenIds[id]
|
|
165
|
+
children: state.items.itemOrderedChildrenIds[id]?.map(getPropsFromItemId)
|
|
153
166
|
};
|
|
154
167
|
};
|
|
155
168
|
return state.items.itemOrderedChildrenIds[_useTreeViewItems.TREE_VIEW_ROOT_PARENT_ID].map(getPropsFromItemId);
|
|
@@ -162,11 +175,14 @@ const useTreeViewItems = ({
|
|
|
162
175
|
}),
|
|
163
176
|
publicAPI: {
|
|
164
177
|
getItem,
|
|
165
|
-
getItemDOMElement
|
|
178
|
+
getItemDOMElement,
|
|
179
|
+
getItemTree,
|
|
180
|
+
getItemOrderedChildrenIds
|
|
166
181
|
},
|
|
167
182
|
instance: {
|
|
168
183
|
getItemMeta,
|
|
169
184
|
getItem,
|
|
185
|
+
getItemTree,
|
|
170
186
|
getItemsToRender,
|
|
171
187
|
getItemIndex,
|
|
172
188
|
getItemDOMElement,
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.hasPlugin = void 0;
|
|
7
|
+
const hasPlugin = (instance, plugin) => {
|
|
8
|
+
const plugins = instance.getAvailablePlugins();
|
|
9
|
+
return plugins.has(plugin);
|
|
10
|
+
};
|
|
11
|
+
exports.hasPlugin = hasPlugin;
|