@mui/x-tree-view 7.15.0 → 7.17.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 +185 -1
- package/RichTreeView/RichTreeView.js +7 -7
- package/RichTreeView/RichTreeView.plugins.js +7 -7
- package/RichTreeView/index.js +3 -3
- package/SimpleTreeView/SimpleTreeView.js +6 -6
- package/SimpleTreeView/SimpleTreeView.plugins.js +7 -7
- package/SimpleTreeView/index.js +2 -2
- package/TreeItem/TreeItem.js +26 -24
- package/TreeItem/TreeItemContent.js +14 -29
- package/TreeItem/index.js +4 -4
- package/TreeItem/useTreeItemState.js +3 -3
- package/TreeItem2/TreeItem2.js +8 -8
- package/TreeItem2/index.js +1 -1
- package/TreeItem2DragAndDropOverlay/TreeItem2DragAndDropOverlay.js +1 -1
- package/TreeItem2DragAndDropOverlay/index.js +1 -1
- package/TreeItem2Icon/TreeItem2Icon.js +2 -2
- package/TreeItem2Icon/index.js +1 -1
- package/TreeItem2LabelInput/TreeItem2LabelInput.js +1 -1
- package/TreeItem2LabelInput/TreeItem2LabelInput.types.d.ts +8 -2
- package/TreeItem2LabelInput/index.js +1 -1
- package/TreeItem2Provider/TreeItem2Provider.js +1 -1
- package/TreeItem2Provider/index.js +1 -1
- package/TreeView/TreeView.js +3 -3
- package/TreeView/index.js +2 -2
- package/hooks/index.js +2 -2
- package/hooks/useTreeItem2Utils/index.js +1 -1
- package/hooks/useTreeItem2Utils/useTreeItem2Utils.d.ts +1 -1
- package/hooks/useTreeItem2Utils/useTreeItem2Utils.js +3 -3
- package/icons/icons.js +2 -2
- package/icons/index.js +1 -1
- package/index.js +13 -13
- package/internals/TreeViewItemDepthContext/index.js +1 -1
- package/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +2 -2
- package/internals/TreeViewProvider/TreeViewProvider.js +1 -1
- package/internals/TreeViewProvider/index.js +2 -2
- package/internals/TreeViewProvider/useTreeViewContext.js +1 -1
- package/internals/corePlugins/corePlugins.js +3 -3
- package/internals/corePlugins/index.js +1 -1
- package/internals/corePlugins/useTreeViewId/index.js +1 -1
- package/internals/corePlugins/useTreeViewInstanceEvents/index.js +1 -1
- package/internals/corePlugins/useTreeViewOptionalPlugins/index.js +1 -1
- package/internals/hooks/useInstanceEventHandler.js +2 -2
- package/internals/index.d.ts +0 -1
- package/internals/index.js +12 -13
- package/internals/models/index.js +5 -5
- package/internals/models/itemPlugin.d.ts +2 -0
- package/internals/plugins/useTreeViewExpansion/index.js +1 -1
- package/internals/plugins/useTreeViewFocus/index.js +1 -1
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +4 -4
- package/internals/plugins/useTreeViewIcons/index.js +1 -1
- package/internals/plugins/useTreeViewItems/index.js +2 -2
- package/internals/plugins/useTreeViewItems/useTreeViewItems.js +3 -3
- package/internals/plugins/useTreeViewJSXItems/index.js +1 -1
- package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +5 -5
- package/internals/plugins/useTreeViewKeyboardNavigation/index.js +1 -1
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +3 -3
- package/internals/plugins/useTreeViewLabel/index.js +1 -1
- package/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.d.ts +0 -1
- package/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +26 -3
- package/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +2 -2
- package/internals/plugins/useTreeViewLabel/useTreeViewLabel.types.d.ts +5 -1
- package/internals/plugins/useTreeViewSelection/index.js +1 -1
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +2 -2
- package/internals/useTreeView/index.js +1 -1
- package/internals/useTreeView/useTreeView.js +4 -4
- package/models/index.d.ts +1 -0
- package/models/index.js +4 -1
- package/modern/RichTreeView/RichTreeView.js +7 -7
- package/modern/RichTreeView/RichTreeView.plugins.js +7 -7
- package/modern/RichTreeView/index.js +3 -3
- package/modern/SimpleTreeView/SimpleTreeView.js +6 -6
- package/modern/SimpleTreeView/SimpleTreeView.plugins.js +7 -7
- package/modern/SimpleTreeView/index.js +2 -2
- package/modern/TreeItem/TreeItem.js +26 -24
- package/modern/TreeItem/TreeItemContent.js +14 -29
- package/modern/TreeItem/index.js +4 -4
- package/modern/TreeItem/useTreeItemState.js +3 -3
- package/modern/TreeItem2/TreeItem2.js +8 -8
- package/modern/TreeItem2/index.js +1 -1
- package/modern/TreeItem2DragAndDropOverlay/TreeItem2DragAndDropOverlay.js +1 -1
- package/modern/TreeItem2DragAndDropOverlay/index.js +1 -1
- package/modern/TreeItem2Icon/TreeItem2Icon.js +2 -2
- package/modern/TreeItem2Icon/index.js +1 -1
- package/modern/TreeItem2LabelInput/TreeItem2LabelInput.js +1 -1
- package/modern/TreeItem2LabelInput/index.js +1 -1
- package/modern/TreeItem2Provider/TreeItem2Provider.js +1 -1
- package/modern/TreeItem2Provider/index.js +1 -1
- package/modern/TreeView/TreeView.js +3 -3
- package/modern/TreeView/index.js +2 -2
- package/modern/hooks/index.js +2 -2
- package/modern/hooks/useTreeItem2Utils/index.js +1 -1
- package/modern/hooks/useTreeItem2Utils/useTreeItem2Utils.js +3 -3
- package/modern/icons/icons.js +2 -2
- package/modern/icons/index.js +1 -1
- package/modern/index.js +13 -13
- package/modern/internals/TreeViewItemDepthContext/index.js +1 -1
- package/modern/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +2 -2
- package/modern/internals/TreeViewProvider/TreeViewProvider.js +1 -1
- package/modern/internals/TreeViewProvider/index.js +2 -2
- package/modern/internals/TreeViewProvider/useTreeViewContext.js +1 -1
- package/modern/internals/corePlugins/corePlugins.js +3 -3
- package/modern/internals/corePlugins/index.js +1 -1
- package/modern/internals/corePlugins/useTreeViewId/index.js +1 -1
- package/modern/internals/corePlugins/useTreeViewInstanceEvents/index.js +1 -1
- package/modern/internals/corePlugins/useTreeViewOptionalPlugins/index.js +1 -1
- package/modern/internals/hooks/useInstanceEventHandler.js +2 -2
- package/modern/internals/index.js +12 -13
- package/modern/internals/models/index.js +5 -5
- package/modern/internals/plugins/useTreeViewExpansion/index.js +1 -1
- package/modern/internals/plugins/useTreeViewFocus/index.js +1 -1
- package/modern/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +4 -4
- package/modern/internals/plugins/useTreeViewIcons/index.js +1 -1
- package/modern/internals/plugins/useTreeViewItems/index.js +2 -2
- package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +3 -3
- package/modern/internals/plugins/useTreeViewJSXItems/index.js +1 -1
- package/modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +5 -5
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/index.js +1 -1
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +3 -3
- package/modern/internals/plugins/useTreeViewLabel/index.js +1 -1
- package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +26 -3
- package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +2 -2
- package/modern/internals/plugins/useTreeViewSelection/index.js +1 -1
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +2 -2
- package/modern/internals/useTreeView/index.js +1 -1
- package/modern/internals/useTreeView/useTreeView.js +4 -4
- package/modern/models/index.js +4 -1
- package/modern/themeAugmentation/index.js +0 -3
- package/modern/useTreeItem2/index.js +4 -1
- package/modern/useTreeItem2/useTreeItem2.js +20 -45
- package/node/RichTreeView/RichTreeView.js +3 -4
- package/node/RichTreeView/richTreeViewClasses.js +1 -1
- package/node/SimpleTreeView/SimpleTreeView.js +3 -4
- package/node/SimpleTreeView/simpleTreeViewClasses.js +1 -1
- package/node/TreeItem/TreeItem.js +19 -18
- package/node/TreeItem/TreeItemContent.js +13 -29
- package/node/TreeItem/treeItemClasses.js +1 -1
- package/node/TreeItem2/TreeItem2.js +4 -5
- package/node/TreeItem2DragAndDropOverlay/TreeItem2DragAndDropOverlay.js +2 -3
- package/node/TreeItem2Icon/TreeItem2Icon.js +2 -3
- package/node/TreeItem2LabelInput/TreeItem2LabelInput.js +1 -1
- package/node/TreeItem2Provider/TreeItem2Provider.js +1 -1
- package/node/TreeView/TreeView.js +2 -3
- package/node/TreeView/treeViewClasses.js +1 -1
- package/node/hooks/useTreeViewApiRef.js +1 -2
- package/node/icons/icons.js +3 -4
- package/node/index.js +1 -1
- package/node/internals/TreeViewItemDepthContext/TreeViewItemDepthContext.js +1 -2
- package/node/internals/TreeViewProvider/TreeViewChildrenItemProvider.js +2 -3
- package/node/internals/TreeViewProvider/TreeViewContext.js +1 -2
- package/node/internals/TreeViewProvider/TreeViewProvider.js +1 -2
- package/node/internals/TreeViewProvider/useTreeViewContext.js +1 -2
- package/node/internals/corePlugins/useTreeViewId/useTreeViewId.js +2 -3
- package/node/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js +1 -2
- package/node/internals/hooks/useInstanceEventHandler.js +1 -2
- package/node/internals/hooks/useLazyRef.js +1 -1
- package/node/internals/hooks/useOnMount.js +1 -1
- package/node/internals/hooks/useTimeout.js +1 -1
- package/node/internals/index.js +1 -8
- package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +2 -3
- package/node/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +2 -3
- package/node/internals/plugins/useTreeViewItems/useTreeViewItems.js +2 -3
- package/node/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -3
- package/node/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +2 -3
- package/node/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js +27 -6
- package/node/internals/plugins/useTreeViewLabel/useTreeViewLabel.js +3 -4
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +2 -3
- package/node/internals/useTreeView/extractPluginParamsFromProps.js +1 -1
- package/node/internals/useTreeView/useTreeView.js +2 -3
- package/node/internals/useTreeView/useTreeViewModels.js +2 -3
- package/node/themeAugmentation/index.js +1 -38
- package/node/useTreeItem2/index.js +5 -7
- package/node/useTreeItem2/useTreeItem2.js +18 -44
- package/package.json +3 -3
- package/themeAugmentation/index.d.ts +3 -3
- package/themeAugmentation/index.js +0 -3
- package/useTreeItem2/index.d.ts +2 -1
- package/useTreeItem2/index.js +4 -1
- package/useTreeItem2/useTreeItem2.js +20 -45
- package/useTreeItem2/useTreeItem2.types.d.ts +2 -4
- package/internals/utils/warning.d.ts +0 -2
- package/internals/utils/warning.js +0 -21
- package/modern/internals/utils/warning.js +0 -21
- package/node/internals/utils/warning.js +0 -28
|
@@ -5,9 +5,9 @@ import * as React from 'react';
|
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
import clsx from 'clsx';
|
|
7
7
|
import Checkbox from '@mui/material/Checkbox';
|
|
8
|
-
import { useTreeItemState } from
|
|
9
|
-
import { TreeItem2DragAndDropOverlay } from
|
|
10
|
-
import { TreeItem2LabelInput } from
|
|
8
|
+
import { useTreeItemState } from "./useTreeItemState.js";
|
|
9
|
+
import { TreeItem2DragAndDropOverlay } from "../TreeItem2DragAndDropOverlay/index.js";
|
|
10
|
+
import { TreeItem2LabelInput } from "../TreeItem2LabelInput/index.js";
|
|
11
11
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
12
|
/**
|
|
13
13
|
* @ignore - internal component.
|
|
@@ -42,9 +42,7 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
|
|
|
42
42
|
handleContentClick,
|
|
43
43
|
preventSelection,
|
|
44
44
|
expansionTrigger,
|
|
45
|
-
toggleItemEditing
|
|
46
|
-
handleSaveItemLabel,
|
|
47
|
-
handleCancelItemLabelEditing
|
|
45
|
+
toggleItemEditing
|
|
48
46
|
} = useTreeItemState(itemId);
|
|
49
47
|
const icon = iconProp || expansionIcon || displayIcon;
|
|
50
48
|
const checkboxRef = React.useRef(null);
|
|
@@ -75,25 +73,6 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
|
|
|
75
73
|
}
|
|
76
74
|
toggleItemEditing();
|
|
77
75
|
};
|
|
78
|
-
const handleLabelInputBlur = event => {
|
|
79
|
-
if (event.defaultMuiPrevented) {
|
|
80
|
-
return;
|
|
81
|
-
}
|
|
82
|
-
if (event.target.value) {
|
|
83
|
-
handleSaveItemLabel(event, event.target.value);
|
|
84
|
-
}
|
|
85
|
-
};
|
|
86
|
-
const handleLabelInputKeydown = event => {
|
|
87
|
-
if (event.defaultMuiPrevented) {
|
|
88
|
-
return;
|
|
89
|
-
}
|
|
90
|
-
const target = event.target;
|
|
91
|
-
if (event.key === 'Enter' && target.value) {
|
|
92
|
-
handleSaveItemLabel(event, target.value);
|
|
93
|
-
} else if (event.key === 'Escape') {
|
|
94
|
-
handleCancelItemLabelEditing(event);
|
|
95
|
-
}
|
|
96
|
-
};
|
|
97
76
|
return (
|
|
98
77
|
/*#__PURE__*/
|
|
99
78
|
/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions -- Key event is handled by the TreeView */
|
|
@@ -113,9 +92,7 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
|
|
|
113
92
|
ref: checkboxRef,
|
|
114
93
|
tabIndex: -1
|
|
115
94
|
}), editing ? /*#__PURE__*/_jsx(TreeItem2LabelInput, _extends({}, labelInputProps, {
|
|
116
|
-
className: classes.labelInput
|
|
117
|
-
onBlur: handleLabelInputBlur,
|
|
118
|
-
onKeyDown: handleLabelInputKeydown
|
|
95
|
+
className: classes.labelInput
|
|
119
96
|
})) : /*#__PURE__*/_jsx("div", _extends({
|
|
120
97
|
className: classes.label
|
|
121
98
|
}, editable && {
|
|
@@ -160,6 +137,14 @@ process.env.NODE_ENV !== "production" ? TreeItemContent.propTypes = {
|
|
|
160
137
|
* The tree item label.
|
|
161
138
|
*/
|
|
162
139
|
label: PropTypes.node,
|
|
163
|
-
labelInputProps: PropTypes.
|
|
140
|
+
labelInputProps: PropTypes.shape({
|
|
141
|
+
autoFocus: PropTypes.oneOf([true]),
|
|
142
|
+
'data-element': PropTypes.oneOf(['labelInput']),
|
|
143
|
+
onBlur: PropTypes.func,
|
|
144
|
+
onChange: PropTypes.func,
|
|
145
|
+
onKeyDown: PropTypes.func,
|
|
146
|
+
type: PropTypes.oneOf(['text']),
|
|
147
|
+
value: PropTypes.string
|
|
148
|
+
})
|
|
164
149
|
} : void 0;
|
|
165
150
|
export { TreeItemContent };
|
package/modern/TreeItem/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { TreeItem } from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
4
|
-
export { TreeItemContent } from
|
|
1
|
+
export { TreeItem } from "./TreeItem.js";
|
|
2
|
+
export * from "./treeItemClasses.js";
|
|
3
|
+
export * from "./useTreeItemState.js";
|
|
4
|
+
export { TreeItemContent } from "./TreeItemContent.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { useTreeViewContext } from
|
|
2
|
-
import { useTreeViewLabel } from
|
|
3
|
-
import { hasPlugin } from
|
|
1
|
+
import { useTreeViewContext } from "../internals/TreeViewProvider/index.js";
|
|
2
|
+
import { useTreeViewLabel } from "../internals/plugins/useTreeViewLabel/index.js";
|
|
3
|
+
import { hasPlugin } from "../internals/utils/plugins.js";
|
|
4
4
|
export function useTreeItemState(itemId) {
|
|
5
5
|
const {
|
|
6
6
|
instance,
|
|
@@ -12,13 +12,13 @@ import MuiCheckbox from '@mui/material/Checkbox';
|
|
|
12
12
|
import useSlotProps from '@mui/utils/useSlotProps';
|
|
13
13
|
import { shouldForwardProp } from '@mui/system/createStyled';
|
|
14
14
|
import composeClasses from '@mui/utils/composeClasses';
|
|
15
|
-
import { styled, createUseThemeProps } from
|
|
16
|
-
import {
|
|
17
|
-
import { getTreeItemUtilityClass } from
|
|
18
|
-
import { TreeItem2Icon } from
|
|
19
|
-
import { TreeItem2DragAndDropOverlay } from
|
|
20
|
-
import { TreeItem2Provider } from
|
|
21
|
-
import { TreeItem2LabelInput } from
|
|
15
|
+
import { styled, createUseThemeProps } from "../internals/zero-styled/index.js";
|
|
16
|
+
import { useTreeItem2 } from "../useTreeItem2/index.js";
|
|
17
|
+
import { getTreeItemUtilityClass } from "../TreeItem/index.js";
|
|
18
|
+
import { TreeItem2Icon } from "../TreeItem2Icon/index.js";
|
|
19
|
+
import { TreeItem2DragAndDropOverlay } from "../TreeItem2DragAndDropOverlay/index.js";
|
|
20
|
+
import { TreeItem2Provider } from "../TreeItem2Provider/index.js";
|
|
21
|
+
import { TreeItem2LabelInput } from "../TreeItem2LabelInput/index.js";
|
|
22
22
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
23
23
|
const useThemeProps = createUseThemeProps('MuiTreeItem2');
|
|
24
24
|
export const TreeItem2Root = styled('li', {
|
|
@@ -158,7 +158,7 @@ export const TreeItem2GroupTransition = styled(Collapse, {
|
|
|
158
158
|
}
|
|
159
159
|
}]
|
|
160
160
|
});
|
|
161
|
-
export const TreeItem2Checkbox = styled(
|
|
161
|
+
export const TreeItem2Checkbox = styled(/*#__PURE__*/React.forwardRef((props, ref) => {
|
|
162
162
|
const {
|
|
163
163
|
visible
|
|
164
164
|
} = props,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeItem2, TreeItem2Root, TreeItem2Content, TreeItem2IconContainer, TreeItem2GroupTransition, TreeItem2Checkbox, TreeItem2Label } from
|
|
1
|
+
export { TreeItem2, TreeItem2Root, TreeItem2Content, TreeItem2IconContainer, TreeItem2GroupTransition, TreeItem2Checkbox, TreeItem2Label } from "./TreeItem2.js";
|
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { alpha } from '@mui/material/styles';
|
|
4
4
|
import { shouldForwardProp } from '@mui/system';
|
|
5
|
-
import { styled } from
|
|
5
|
+
import { styled } from "../internals/zero-styled/index.js";
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
7
|
const TreeItem2DragAndDropOverlayRoot = styled('div', {
|
|
8
8
|
name: 'MuiTreeItem2DragAndDropOverlay',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeItem2DragAndDropOverlay } from
|
|
1
|
+
export { TreeItem2DragAndDropOverlay } from "./TreeItem2DragAndDropOverlay.js";
|
|
@@ -3,8 +3,8 @@ import * as React from 'react';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import resolveComponentProps from '@mui/utils/resolveComponentProps';
|
|
5
5
|
import useSlotProps from '@mui/utils/useSlotProps';
|
|
6
|
-
import { useTreeViewContext } from
|
|
7
|
-
import { TreeViewCollapseIcon, TreeViewExpandIcon } from
|
|
6
|
+
import { useTreeViewContext } from "../internals/TreeViewProvider/index.js";
|
|
7
|
+
import { TreeViewCollapseIcon, TreeViewExpandIcon } from "../icons/index.js";
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
function TreeItem2Icon(props) {
|
|
10
10
|
const {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeItem2Icon } from
|
|
1
|
+
export { TreeItem2Icon } from "./TreeItem2Icon.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeItem2LabelInput } from
|
|
1
|
+
export { TreeItem2LabelInput } from "./TreeItem2LabelInput.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeItem2Provider } from
|
|
1
|
+
export { TreeItem2Provider } from "./TreeItem2Provider.js";
|
|
@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import composeClasses from '@mui/utils/composeClasses';
|
|
5
|
-
import { styled, createUseThemeProps } from
|
|
6
|
-
import { getTreeViewUtilityClass } from
|
|
7
|
-
import { SimpleTreeView, SimpleTreeViewRoot } from
|
|
5
|
+
import { styled, createUseThemeProps } from "../internals/zero-styled/index.js";
|
|
6
|
+
import { getTreeViewUtilityClass } from "./treeViewClasses.js";
|
|
7
|
+
import { SimpleTreeView, SimpleTreeViewRoot } from "../SimpleTreeView/index.js";
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
const useThemeProps = createUseThemeProps('MuiTreeView');
|
|
10
10
|
const useUtilityClasses = ownerState => {
|
package/modern/TreeView/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
1
|
+
export * from "./TreeView.js";
|
|
2
|
+
export * from "./treeViewClasses.js";
|
|
3
3
|
export {};
|
package/modern/hooks/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { useTreeViewApiRef } from
|
|
2
|
-
export { useTreeItem2Utils } from
|
|
1
|
+
export { useTreeViewApiRef } from "./useTreeViewApiRef.js";
|
|
2
|
+
export { useTreeItem2Utils } from "./useTreeItem2Utils/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeItem2Utils } from
|
|
1
|
+
export { useTreeItem2Utils } from "./useTreeItem2Utils.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { useTreeViewContext } from
|
|
2
|
-
import { useTreeViewLabel } from
|
|
3
|
-
import { hasPlugin } from
|
|
1
|
+
import { useTreeViewContext } from "../../internals/TreeViewProvider/index.js";
|
|
2
|
+
import { useTreeViewLabel } from "../../internals/plugins/useTreeViewLabel/index.js";
|
|
3
|
+
import { hasPlugin } from "../../internals/utils/plugins.js";
|
|
4
4
|
const isItemExpandable = reactChildren => {
|
|
5
5
|
if (Array.isArray(reactChildren)) {
|
|
6
6
|
return reactChildren.length > 0 && reactChildren.some(isItemExpandable);
|
package/modern/icons/icons.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { createSvgIcon } from '@mui/material/utils';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
export const TreeViewExpandIcon = createSvgIcon(
|
|
4
|
+
export const TreeViewExpandIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
5
5
|
d: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
6
6
|
}), 'TreeViewExpandIcon');
|
|
7
|
-
export const TreeViewCollapseIcon = createSvgIcon(
|
|
7
|
+
export const TreeViewCollapseIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
8
8
|
d: "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
|
|
9
9
|
}), 'TreeViewCollapseIcon');
|
package/modern/icons/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from
|
|
1
|
+
export * from "./icons.js";
|
package/modern/index.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-tree-view v7.
|
|
2
|
+
* @mui/x-tree-view v7.17.0
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
7
|
*/
|
|
8
8
|
// Tree View
|
|
9
|
-
export * from
|
|
10
|
-
export * from
|
|
11
|
-
export * from
|
|
9
|
+
export * from "./TreeView/index.js";
|
|
10
|
+
export * from "./SimpleTreeView/index.js";
|
|
11
|
+
export * from "./RichTreeView/index.js";
|
|
12
12
|
|
|
13
13
|
// Tree Item
|
|
14
|
-
export * from
|
|
15
|
-
export * from
|
|
16
|
-
export * from
|
|
17
|
-
export * from
|
|
18
|
-
export * from
|
|
19
|
-
export { unstable_resetCleanupTracking } from
|
|
20
|
-
export * from
|
|
21
|
-
export * from
|
|
22
|
-
export * from
|
|
14
|
+
export * from "./TreeItem/index.js";
|
|
15
|
+
export * from "./TreeItem2/index.js";
|
|
16
|
+
export * from "./useTreeItem2/index.js";
|
|
17
|
+
export * from "./TreeItem2Icon/index.js";
|
|
18
|
+
export * from "./TreeItem2Provider/index.js";
|
|
19
|
+
export { unstable_resetCleanupTracking } from "./internals/hooks/useInstanceEventHandler.js";
|
|
20
|
+
export * from "./models/index.js";
|
|
21
|
+
export * from "./icons/index.js";
|
|
22
|
+
export * from "./hooks/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TreeViewItemDepthContext } from
|
|
1
|
+
export { TreeViewItemDepthContext } from "./TreeViewItemDepthContext.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
-
import { useTreeViewContext } from
|
|
4
|
-
import { escapeOperandAttributeSelector } from
|
|
3
|
+
import { useTreeViewContext } from "./useTreeViewContext.js";
|
|
4
|
+
import { escapeOperandAttributeSelector } from "../utils/utils.js";
|
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
6
|
export const TreeViewChildrenItemContext = /*#__PURE__*/React.createContext(null);
|
|
7
7
|
if (process.env.NODE_ENV !== 'production') {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { TreeViewProvider } from
|
|
2
|
-
export { useTreeViewContext } from
|
|
1
|
+
export { TreeViewProvider } from "./TreeViewProvider.js";
|
|
2
|
+
export { useTreeViewContext } from "./useTreeViewContext.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { useTreeViewInstanceEvents } from
|
|
2
|
-
import { useTreeViewOptionalPlugins } from
|
|
3
|
-
import { useTreeViewId } from
|
|
1
|
+
import { useTreeViewInstanceEvents } from "./useTreeViewInstanceEvents/index.js";
|
|
2
|
+
import { useTreeViewOptionalPlugins } from "./useTreeViewOptionalPlugins/index.js";
|
|
3
|
+
import { useTreeViewId } from "./useTreeViewId/index.js";
|
|
4
4
|
/**
|
|
5
5
|
* Internal plugins that create the tools used by the other plugins.
|
|
6
6
|
* These plugins are used by the tree view components.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { TREE_VIEW_CORE_PLUGINS } from
|
|
1
|
+
export { TREE_VIEW_CORE_PLUGINS } from "./corePlugins.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewId } from
|
|
1
|
+
export { useTreeViewId } from "./useTreeViewId.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewInstanceEvents } from
|
|
1
|
+
export { useTreeViewInstanceEvents } from "./useTreeViewInstanceEvents.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewOptionalPlugins } from
|
|
1
|
+
export { useTreeViewOptionalPlugins } from "./useTreeViewOptionalPlugins.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { TimerBasedCleanupTracking } from
|
|
3
|
-
import { FinalizationRegistryBasedCleanupTracking } from
|
|
2
|
+
import { TimerBasedCleanupTracking } from "../utils/cleanupTracking/TimerBasedCleanupTracking.js";
|
|
3
|
+
import { FinalizationRegistryBasedCleanupTracking } from "../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js";
|
|
4
4
|
// We use class to make it easier to detect in heap snapshots by name
|
|
5
5
|
class ObjectToBeRetainedByReact {}
|
|
6
6
|
|
|
@@ -1,17 +1,16 @@
|
|
|
1
|
-
export { useTreeView } from
|
|
2
|
-
export { TreeViewProvider, useTreeViewContext } from
|
|
3
|
-
export { unstable_resetCleanupTracking } from
|
|
1
|
+
export { useTreeView } from "./useTreeView/index.js";
|
|
2
|
+
export { TreeViewProvider, useTreeViewContext } from "./TreeViewProvider/index.js";
|
|
3
|
+
export { unstable_resetCleanupTracking } from "./hooks/useInstanceEventHandler.js";
|
|
4
4
|
|
|
5
5
|
// Core plugins
|
|
6
6
|
|
|
7
7
|
// Plugins
|
|
8
|
-
export { useTreeViewExpansion } from
|
|
9
|
-
export { useTreeViewSelection } from
|
|
10
|
-
export { useTreeViewFocus } from
|
|
11
|
-
export { useTreeViewKeyboardNavigation } from
|
|
12
|
-
export { useTreeViewIcons } from
|
|
13
|
-
export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from
|
|
14
|
-
export { useTreeViewLabel } from
|
|
15
|
-
export { useTreeViewJSXItems } from
|
|
16
|
-
export { isTargetInDescendants } from
|
|
17
|
-
export { warnOnce } from './utils/warning';
|
|
8
|
+
export { useTreeViewExpansion } from "./plugins/useTreeViewExpansion/index.js";
|
|
9
|
+
export { useTreeViewSelection } from "./plugins/useTreeViewSelection/index.js";
|
|
10
|
+
export { useTreeViewFocus } from "./plugins/useTreeViewFocus/index.js";
|
|
11
|
+
export { useTreeViewKeyboardNavigation } from "./plugins/useTreeViewKeyboardNavigation/index.js";
|
|
12
|
+
export { useTreeViewIcons } from "./plugins/useTreeViewIcons/index.js";
|
|
13
|
+
export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./plugins/useTreeViewItems/index.js";
|
|
14
|
+
export { useTreeViewLabel } from "./plugins/useTreeViewLabel/index.js";
|
|
15
|
+
export { useTreeViewJSXItems } from "./plugins/useTreeViewJSXItems/index.js";
|
|
16
|
+
export { isTargetInDescendants } from "./utils/tree.js";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
4
|
-
export * from
|
|
5
|
-
export * from
|
|
1
|
+
export * from "./helpers.js";
|
|
2
|
+
export * from "./plugin.js";
|
|
3
|
+
export * from "./itemPlugin.js";
|
|
4
|
+
export * from "./treeView.js";
|
|
5
|
+
export * from "./MuiCancellableEvent.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewExpansion } from
|
|
1
|
+
export { useTreeViewExpansion } from "./useTreeViewExpansion.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewFocus } from
|
|
1
|
+
export { useTreeViewFocus } from "./useTreeViewFocus.js";
|
|
@@ -2,10 +2,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import useEventCallback from '@mui/utils/useEventCallback';
|
|
4
4
|
import ownerDocument from '@mui/utils/ownerDocument';
|
|
5
|
-
import { useInstanceEventHandler } from
|
|
6
|
-
import { getActiveElement } from
|
|
7
|
-
import { getFirstNavigableItem } from
|
|
8
|
-
import { convertSelectedItemsToArray } from
|
|
5
|
+
import { useInstanceEventHandler } from "../../hooks/useInstanceEventHandler.js";
|
|
6
|
+
import { getActiveElement } from "../../utils/utils.js";
|
|
7
|
+
import { getFirstNavigableItem } from "../../utils/tree.js";
|
|
8
|
+
import { convertSelectedItemsToArray } from "../useTreeViewSelection/useTreeViewSelection.utils.js";
|
|
9
9
|
const useDefaultFocusableItemId = (instance, selectedItems) => {
|
|
10
10
|
let tabbableItemId = convertSelectedItemsToArray(selectedItems).find(itemId => {
|
|
11
11
|
if (!instance.isItemNavigable(itemId)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewIcons } from
|
|
1
|
+
export { useTreeViewIcons } from "./useTreeViewIcons.js";
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { useTreeViewItems } from
|
|
2
|
-
export { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from
|
|
1
|
+
export { useTreeViewItems } from "./useTreeViewItems.js";
|
|
2
|
+
export { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./useTreeViewItems.utils.js";
|
|
@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
3
|
const _excluded = ["children"];
|
|
4
4
|
import * as React from 'react';
|
|
5
|
-
import { publishTreeViewEvent } from
|
|
6
|
-
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from
|
|
7
|
-
import { TreeViewItemDepthContext } from
|
|
5
|
+
import { publishTreeViewEvent } from "../../utils/publishTreeViewEvent.js";
|
|
6
|
+
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./useTreeViewItems.utils.js";
|
|
7
|
+
import { TreeViewItemDepthContext } from "../../TreeViewItemDepthContext/index.js";
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
const updateItemsState = ({
|
|
10
10
|
items,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewJSXItems } from
|
|
1
|
+
export { useTreeViewJSXItems } from "./useTreeViewJSXItems.js";
|
|
@@ -3,11 +3,11 @@ import * as React from 'react';
|
|
|
3
3
|
import useEventCallback from '@mui/utils/useEventCallback';
|
|
4
4
|
import useForkRef from '@mui/utils/useForkRef';
|
|
5
5
|
import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
6
|
-
import { publishTreeViewEvent } from
|
|
7
|
-
import { useTreeViewContext } from
|
|
8
|
-
import { TreeViewChildrenItemContext, TreeViewChildrenItemProvider } from
|
|
9
|
-
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from
|
|
10
|
-
import { TreeViewItemDepthContext } from
|
|
6
|
+
import { publishTreeViewEvent } from "../../utils/publishTreeViewEvent.js";
|
|
7
|
+
import { useTreeViewContext } from "../../TreeViewProvider/index.js";
|
|
8
|
+
import { TreeViewChildrenItemContext, TreeViewChildrenItemProvider } from "../../TreeViewProvider/TreeViewChildrenItemProvider.js";
|
|
9
|
+
import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "../useTreeViewItems/useTreeViewItems.utils.js";
|
|
10
|
+
import { TreeViewItemDepthContext } from "../../TreeViewItemDepthContext/index.js";
|
|
11
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
12
|
export const useTreeViewJSXItems = ({
|
|
13
13
|
instance,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewKeyboardNavigation } from
|
|
1
|
+
export { useTreeViewKeyboardNavigation } from "./useTreeViewKeyboardNavigation.js";
|
package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useRtl } from '@mui/system/RtlProvider';
|
|
3
3
|
import useEventCallback from '@mui/utils/useEventCallback';
|
|
4
|
-
import { getFirstNavigableItem, getLastNavigableItem, getNextNavigableItem, getPreviousNavigableItem, isTargetInDescendants } from
|
|
5
|
-
import { hasPlugin } from
|
|
6
|
-
import { useTreeViewLabel } from
|
|
4
|
+
import { getFirstNavigableItem, getLastNavigableItem, getNextNavigableItem, getPreviousNavigableItem, isTargetInDescendants } from "../../utils/tree.js";
|
|
5
|
+
import { hasPlugin } from "../../utils/plugins.js";
|
|
6
|
+
import { useTreeViewLabel } from "../useTreeViewLabel/index.js";
|
|
7
7
|
function isPrintableCharacter(string) {
|
|
8
8
|
return !!string && string.length === 1 && !!string.match(/\S/);
|
|
9
9
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewLabel } from
|
|
1
|
+
export { useTreeViewLabel } from "./useTreeViewLabel.js";
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { useTreeViewContext } from
|
|
3
|
-
export const isAndroid = () => navigator.userAgent.toLowerCase().includes('android');
|
|
2
|
+
import { useTreeViewContext } from "../../TreeViewProvider/index.js";
|
|
4
3
|
export const useTreeViewLabelItemPlugin = ({
|
|
5
4
|
props
|
|
6
5
|
}) => {
|
|
@@ -21,12 +20,34 @@ export const useTreeViewLabelItemPlugin = ({
|
|
|
21
20
|
return {
|
|
22
21
|
propsEnhancers: {
|
|
23
22
|
labelInput: ({
|
|
24
|
-
externalEventHandlers
|
|
23
|
+
externalEventHandlers,
|
|
24
|
+
interactions
|
|
25
25
|
}) => {
|
|
26
26
|
const editable = instance.isItemEditable(itemId);
|
|
27
27
|
if (!editable) {
|
|
28
28
|
return {};
|
|
29
29
|
}
|
|
30
|
+
const handleKeydown = event => {
|
|
31
|
+
externalEventHandlers.onKeyDown?.(event);
|
|
32
|
+
if (event.defaultMuiPrevented) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
const target = event.target;
|
|
36
|
+
if (event.key === 'Enter' && target.value) {
|
|
37
|
+
interactions.handleSaveItemLabel(event, target.value);
|
|
38
|
+
} else if (event.key === 'Escape') {
|
|
39
|
+
interactions.handleCancelItemLabelEditing(event);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
const handleBlur = event => {
|
|
43
|
+
externalEventHandlers.onBlur?.(event);
|
|
44
|
+
if (event.defaultMuiPrevented) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
if (event.target.value) {
|
|
48
|
+
interactions.handleSaveItemLabel(event, event.target.value);
|
|
49
|
+
}
|
|
50
|
+
};
|
|
30
51
|
const handleInputChange = event => {
|
|
31
52
|
externalEventHandlers.onChange?.(event);
|
|
32
53
|
setLabelInputValue(event.target.value);
|
|
@@ -35,6 +56,8 @@ export const useTreeViewLabelItemPlugin = ({
|
|
|
35
56
|
value: labelInputValue ?? '',
|
|
36
57
|
'data-element': 'labelInput',
|
|
37
58
|
onChange: handleInputChange,
|
|
59
|
+
onKeyDown: handleKeydown,
|
|
60
|
+
onBlur: handleBlur,
|
|
38
61
|
autoFocus: true,
|
|
39
62
|
type: 'text'
|
|
40
63
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import { warnOnce } from '
|
|
4
|
-
import { useTreeViewLabelItemPlugin } from
|
|
3
|
+
import { warnOnce } from '@mui/x-internals/warning';
|
|
4
|
+
import { useTreeViewLabelItemPlugin } from "./useTreeViewLabel.itemPlugin.js";
|
|
5
5
|
export const useTreeViewLabel = ({
|
|
6
6
|
instance,
|
|
7
7
|
state,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeViewSelection } from
|
|
1
|
+
export { useTreeViewSelection } from "./useTreeViewSelection.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import { findOrderInTremauxTree, getAllNavigableItems, getFirstNavigableItem, getLastNavigableItem, getNonDisabledItemsInRange } from
|
|
4
|
-
import { convertSelectedItemsToArray, getLookupFromArray } from
|
|
3
|
+
import { findOrderInTremauxTree, getAllNavigableItems, getFirstNavigableItem, getLastNavigableItem, getNonDisabledItemsInRange } from "../../utils/tree.js";
|
|
4
|
+
import { convertSelectedItemsToArray, getLookupFromArray } from "./useTreeViewSelection.utils.js";
|
|
5
5
|
export const useTreeViewSelection = ({
|
|
6
6
|
instance,
|
|
7
7
|
params,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useTreeView } from
|
|
1
|
+
export { useTreeView } from "./useTreeView.js";
|