@mui/x-tree-view-pro 8.11.0 → 8.11.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +169 -0
- package/RichTreeViewPro/RichTreeViewPro.js +14 -12
- package/RichTreeViewPro/RichTreeViewPro.types.d.ts +3 -2
- package/RichTreeViewPro/index.d.ts +2 -1
- package/esm/RichTreeViewPro/RichTreeViewPro.js +14 -12
- package/esm/RichTreeViewPro/RichTreeViewPro.types.d.ts +3 -2
- package/esm/RichTreeViewPro/index.d.ts +2 -1
- package/esm/index.js +1 -1
- package/esm/internals/plugins/useTreeViewItemsReordering/index.d.ts +2 -1
- package/esm/internals/plugins/useTreeViewItemsReordering/index.js +2 -1
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js +6 -5
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js +57 -71
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts +17 -433
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js +35 -50
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.utils.js +2 -2
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js +82 -78
- package/esm/internals/plugins/useTreeViewLazyLoading/utils.js +3 -1
- package/index.js +1 -1
- package/internals/plugins/useTreeViewItemsReordering/index.d.ts +2 -1
- package/internals/plugins/useTreeViewItemsReordering/index.js +8 -1
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js +4 -3
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js +55 -69
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts +17 -433
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js +35 -50
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.utils.js +1 -1
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js +81 -77
- package/internals/plugins/useTreeViewLazyLoading/utils.js +3 -1
- package/package.json +15 -14
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,175 @@
|
|
|
5
5
|
All notable changes to this project will be documented in this file.
|
|
6
6
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
7
7
|
|
|
8
|
+
## 8.11.2
|
|
9
|
+
|
|
10
|
+
_Sep 10, 2025_
|
|
11
|
+
|
|
12
|
+
We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
|
|
13
|
+
|
|
14
|
+
- 🐞 Bugfixes
|
|
15
|
+
- 📚 Documentation improvements
|
|
16
|
+
|
|
17
|
+
Special thanks go out to the community members for their valuable contributions:
|
|
18
|
+
@ludvigeriksson, @sai6855
|
|
19
|
+
|
|
20
|
+
The following are all team members who have contributed to this release:
|
|
21
|
+
@alexfauquette, @bernardobelchior, @brijeshb42, @flaviendelangle, @Janpot, @LukasTy, @MBilalShafi, @noraleonte, @rita-codes, @romgrk, @siriwatknp
|
|
22
|
+
|
|
23
|
+
### Data Grid
|
|
24
|
+
|
|
25
|
+
#### `@mui/x-data-grid@8.11.2`
|
|
26
|
+
|
|
27
|
+
- [DataGrid] Allow opting out of the exclude row selection model (#19423) @MBilalShafi
|
|
28
|
+
- [DataGrid] Fix column dropdown menu text alignment for the "Unpin" menu item (#19462) @MBilalShafi
|
|
29
|
+
- [DataGrid] Fix indeterminate state for "Select all" checkbox with exclude model (#19466) @MBilalShafi
|
|
30
|
+
- [DataGrid] Fix styled API arguments error (#19460) @MBilalShafi
|
|
31
|
+
- [DataGrid] Fix `stringify()` for theme objects (#19427) @romgrk
|
|
32
|
+
|
|
33
|
+
#### `@mui/x-data-grid-pro@8.11.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
34
|
+
|
|
35
|
+
Same changes as in `@mui/x-data-grid@8.11.2`.
|
|
36
|
+
|
|
37
|
+
#### `@mui/x-data-grid-premium@8.11.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
38
|
+
|
|
39
|
+
Same changes as in `@mui/x-data-grid-pro@8.11.2`, plus:
|
|
40
|
+
|
|
41
|
+
- [DataGridPremium] Fallback to the regular reorder method for plain data (#19467) @MBilalShafi
|
|
42
|
+
- [DataGridPremium] Fix showing `0` as total aggregation value when aggregation position is set to `null` for row groups (#19515) @cherniavskii
|
|
43
|
+
|
|
44
|
+
### Date and Time Pickers
|
|
45
|
+
|
|
46
|
+
#### `@mui/x-date-pickers@8.11.2`
|
|
47
|
+
|
|
48
|
+
- [pickers] Gracefully handle `textField.slotProps` (#18980) @LukasTy
|
|
49
|
+
- [pickers] Improve hour and minute placement in Date Time Picker (#19227) @MBilalShafi
|
|
50
|
+
- [pickers] Use `calendarState.currentMonth` in Month Calendar when available (#19073) @LukasTy
|
|
51
|
+
- [pickers] Improve invalid value pasting into a section (#19357) @sai6855
|
|
52
|
+
- [fields] Remove redundant `id` and `aria-labelledby` attributes from spinbuttons (#19523) @LukasTy
|
|
53
|
+
|
|
54
|
+
#### `@mui/x-date-pickers-pro@8.11.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
55
|
+
|
|
56
|
+
Same changes as in `@mui/x-date-pickers@8.11.2`.
|
|
57
|
+
|
|
58
|
+
### Charts
|
|
59
|
+
|
|
60
|
+
#### `@mui/x-charts@8.11.2`
|
|
61
|
+
|
|
62
|
+
- [charts] Fix highlight regression (#19486) @alexfauquette
|
|
63
|
+
- [charts] Improve code reuse in `ChartsXAxis` and `ChartsYAxis` (#19198) @bernardobelchior
|
|
64
|
+
- [charts] Simplify params in `getRange` and `createDateFormatter` (#19517) @bernardobelchior
|
|
65
|
+
- [charts] Handle domain edge cases with `filterMode: 'discard'` (#19199) @bernardobelchior
|
|
66
|
+
- [l10n] Add Swedish (sv-SE) locale (#19489) @ludvigeriksson
|
|
67
|
+
|
|
68
|
+
#### `@mui/x-charts-pro@8.11.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
69
|
+
|
|
70
|
+
Same changes as in `@mui/x-charts@8.11.2`.
|
|
71
|
+
|
|
72
|
+
### Tree View
|
|
73
|
+
|
|
74
|
+
#### `@mui/x-tree-view@8.11.2`
|
|
75
|
+
|
|
76
|
+
- [TreeView] Do not mutate `props.items` in the `getItemTree()` method (#19483) @flaviendelangle
|
|
77
|
+
- [TreeView] Expose a new hook to apply selection propagation on the selected items (#19402) @flaviendelangle
|
|
78
|
+
|
|
79
|
+
#### `@mui/x-tree-view-pro@8.11.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
80
|
+
|
|
81
|
+
Same changes as in `@mui/x-tree-view@8.11.2`.
|
|
82
|
+
|
|
83
|
+
### Codemod
|
|
84
|
+
|
|
85
|
+
#### `@mui/x-codemod@8.11.2`
|
|
86
|
+
|
|
87
|
+
Internal changes.
|
|
88
|
+
|
|
89
|
+
### Docs
|
|
90
|
+
|
|
91
|
+
- [docs] Add recipe for save and manage filters from the panel (#19361) @siriwatknp
|
|
92
|
+
|
|
93
|
+
### Core
|
|
94
|
+
|
|
95
|
+
- [code-infra] Remove log when restarting dev server (#19490) @bernardobelchior
|
|
96
|
+
- [code-infra] Store test results in CI (#19507) @Janpot
|
|
97
|
+
|
|
98
|
+
### Miscellaneous
|
|
99
|
+
|
|
100
|
+
- [infra] Set nodejs versions of various CIs to 22.18 (#19503) @brijeshb42
|
|
101
|
+
- [test] Split infinitive @romgrk
|
|
102
|
+
|
|
103
|
+
## 8.11.1
|
|
104
|
+
|
|
105
|
+
_Sep 4, 2025_
|
|
106
|
+
|
|
107
|
+
We'd like to extend a big thank you to the 6 contributors who made this release possible. Here are some highlights ✨:
|
|
108
|
+
|
|
109
|
+
Special thanks go out to the community members for their valuable contributions:
|
|
110
|
+
@sai6855
|
|
111
|
+
|
|
112
|
+
The following are all team members who have contributed to this release:
|
|
113
|
+
@brijeshb42, @flaviendelangle, @JCQuintas, @mapache-salvaje, @oliviertassinari
|
|
114
|
+
|
|
115
|
+
### Data Grid
|
|
116
|
+
|
|
117
|
+
#### `@mui/x-data-grid@8.11.1`
|
|
118
|
+
|
|
119
|
+
- [DataGrid] Refine types in `GridCell` component (#19384) @sai6855
|
|
120
|
+
|
|
121
|
+
#### `@mui/x-data-grid-pro@8.11.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
122
|
+
|
|
123
|
+
Same changes as in `@mui/x-data-grid@8.11.1`.
|
|
124
|
+
|
|
125
|
+
#### `@mui/x-data-grid-premium@8.11.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
126
|
+
|
|
127
|
+
Same changes as in `@mui/x-data-grid-pro@8.11.1`.
|
|
128
|
+
|
|
129
|
+
### Date and Time Pickers
|
|
130
|
+
|
|
131
|
+
#### `@mui/x-date-pickers@8.11.1`
|
|
132
|
+
|
|
133
|
+
- [pickers] Merge `slotProps` for input adornment in `PickerFieldUI` component (#19399) @sai6855
|
|
134
|
+
|
|
135
|
+
#### `@mui/x-date-pickers-pro@8.11.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
136
|
+
|
|
137
|
+
Same changes as in `@mui/x-date-pickers@8.11.1`.
|
|
138
|
+
|
|
139
|
+
### Charts
|
|
140
|
+
|
|
141
|
+
#### `@mui/x-charts@8.11.1`
|
|
142
|
+
|
|
143
|
+
- [charts] Prevent crash and warn user on incorrect `axisId` when composing (#19397) @JCQuintas
|
|
144
|
+
|
|
145
|
+
#### `@mui/x-charts-pro@8.11.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
146
|
+
|
|
147
|
+
Same changes as in `@mui/x-charts@8.11.1`.
|
|
148
|
+
|
|
149
|
+
### Tree View
|
|
150
|
+
|
|
151
|
+
#### `@mui/x-tree-view@8.11.1`
|
|
152
|
+
|
|
153
|
+
- [tree view] Expose the methods to manually refetch the children of an item (#19248) @flaviendelangle
|
|
154
|
+
- [tree view] Use the shared store implementation instead of the custom one (#19261) @flaviendelangle
|
|
155
|
+
|
|
156
|
+
#### `@mui/x-tree-view-pro@8.11.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
157
|
+
|
|
158
|
+
Same changes as in `@mui/x-tree-view@8.11.1`.
|
|
159
|
+
|
|
160
|
+
### Codemod
|
|
161
|
+
|
|
162
|
+
#### `@mui/x-codemod@8.11.1`
|
|
163
|
+
|
|
164
|
+
Internal changes.
|
|
165
|
+
|
|
166
|
+
### Docs
|
|
167
|
+
|
|
168
|
+
- [docs] Fix grammar and spelling mistakes on the Date and Time Pickers pages (#19300) @mapache-salvaje
|
|
169
|
+
- [docs] Remove wrong legend info (#19383) @JCQuintas
|
|
170
|
+
|
|
171
|
+
### Core
|
|
172
|
+
|
|
173
|
+
- [internal] Fix action alert (#19388) @oliviertassinari
|
|
174
|
+
- [internal] Fix pnpm valelint to have 0 errors @oliviertassinari
|
|
175
|
+
- [infra] Remove "main" fields from publishable packages (#19407) @brijeshb42
|
|
176
|
+
|
|
8
177
|
## 8.11.0
|
|
9
178
|
|
|
10
179
|
_Aug 29, 2025_
|
|
@@ -52,7 +52,7 @@ const RichTreeViewProRoot = exports.RichTreeViewProRoot = (0, _zeroStyled.styled
|
|
|
52
52
|
outline: 0,
|
|
53
53
|
position: 'relative'
|
|
54
54
|
});
|
|
55
|
-
const releaseInfo = "
|
|
55
|
+
const releaseInfo = "MTc1NzQ2MjQwMDAwMA==";
|
|
56
56
|
|
|
57
57
|
/**
|
|
58
58
|
*
|
|
@@ -124,17 +124,19 @@ process.env.NODE_ENV !== "production" ? RichTreeViewPro.propTypes = {
|
|
|
124
124
|
*/
|
|
125
125
|
apiRef: _propTypes.default.shape({
|
|
126
126
|
current: _propTypes.default.shape({
|
|
127
|
-
focusItem: _propTypes.default.func
|
|
128
|
-
getItem: _propTypes.default.func
|
|
129
|
-
getItemDOMElement: _propTypes.default.func
|
|
130
|
-
getItemOrderedChildrenIds: _propTypes.default.func
|
|
131
|
-
getItemTree: _propTypes.default.func
|
|
132
|
-
getParentId: _propTypes.default.func
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
127
|
+
focusItem: _propTypes.default.func,
|
|
128
|
+
getItem: _propTypes.default.func,
|
|
129
|
+
getItemDOMElement: _propTypes.default.func,
|
|
130
|
+
getItemOrderedChildrenIds: _propTypes.default.func,
|
|
131
|
+
getItemTree: _propTypes.default.func,
|
|
132
|
+
getParentId: _propTypes.default.func,
|
|
133
|
+
isItemExpanded: _propTypes.default.func,
|
|
134
|
+
setEditedItem: _propTypes.default.func,
|
|
135
|
+
setIsItemDisabled: _propTypes.default.func,
|
|
136
|
+
setItemExpansion: _propTypes.default.func,
|
|
137
|
+
setItemSelection: _propTypes.default.func,
|
|
138
|
+
updateItemChildren: _propTypes.default.func,
|
|
139
|
+
updateItemLabel: _propTypes.default.func
|
|
138
140
|
})
|
|
139
141
|
}),
|
|
140
142
|
/**
|
|
@@ -15,7 +15,7 @@ export interface RichTreeViewProSlots extends TreeViewSlots, RichTreeViewItemsSl
|
|
|
15
15
|
export interface RichTreeViewProSlotProps<R extends {}, Multiple extends boolean | undefined> extends TreeViewSlotProps, RichTreeViewItemsSlotProps {
|
|
16
16
|
root?: SlotComponentProps<'ul', {}, RichTreeViewProProps<R, Multiple>>;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
type RichTreeViewProApiRef = React.RefObject<Partial<TreeViewPublicAPI<RichTreeViewProPluginSignatures>> | undefined>;
|
|
19
19
|
export interface RichTreeViewProPropsBase extends React.HTMLAttributes<HTMLUListElement> {
|
|
20
20
|
className?: string;
|
|
21
21
|
/**
|
|
@@ -42,4 +42,5 @@ export interface RichTreeViewProProps<R extends {}, Multiple extends boolean | u
|
|
|
42
42
|
* The ref object that allows Tree View manipulation. Can be instantiated with `useTreeViewApiRef()`.
|
|
43
43
|
*/
|
|
44
44
|
apiRef?: RichTreeViewProApiRef;
|
|
45
|
-
}
|
|
45
|
+
}
|
|
46
|
+
export {};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export * from "./RichTreeViewPro.js";
|
|
2
2
|
export * from "./richTreeViewProClasses.js";
|
|
3
|
-
export type { RichTreeViewProProps, RichTreeViewProPropsBase, RichTreeViewProSlots, RichTreeViewProSlotProps } from "./RichTreeViewPro.types.js";
|
|
3
|
+
export type { RichTreeViewProProps, RichTreeViewProPropsBase, RichTreeViewProSlots, RichTreeViewProSlotProps } from "./RichTreeViewPro.types.js";
|
|
4
|
+
export type { RichTreeViewProPluginSignatures } from "./RichTreeViewPro.plugins.js";
|
|
@@ -45,7 +45,7 @@ export const RichTreeViewProRoot = styled('ul', {
|
|
|
45
45
|
outline: 0,
|
|
46
46
|
position: 'relative'
|
|
47
47
|
});
|
|
48
|
-
const releaseInfo = "
|
|
48
|
+
const releaseInfo = "MTc1NzQ2MjQwMDAwMA==";
|
|
49
49
|
|
|
50
50
|
/**
|
|
51
51
|
*
|
|
@@ -117,17 +117,19 @@ process.env.NODE_ENV !== "production" ? RichTreeViewPro.propTypes = {
|
|
|
117
117
|
*/
|
|
118
118
|
apiRef: PropTypes.shape({
|
|
119
119
|
current: PropTypes.shape({
|
|
120
|
-
focusItem: PropTypes.func
|
|
121
|
-
getItem: PropTypes.func
|
|
122
|
-
getItemDOMElement: PropTypes.func
|
|
123
|
-
getItemOrderedChildrenIds: PropTypes.func
|
|
124
|
-
getItemTree: PropTypes.func
|
|
125
|
-
getParentId: PropTypes.func
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
120
|
+
focusItem: PropTypes.func,
|
|
121
|
+
getItem: PropTypes.func,
|
|
122
|
+
getItemDOMElement: PropTypes.func,
|
|
123
|
+
getItemOrderedChildrenIds: PropTypes.func,
|
|
124
|
+
getItemTree: PropTypes.func,
|
|
125
|
+
getParentId: PropTypes.func,
|
|
126
|
+
isItemExpanded: PropTypes.func,
|
|
127
|
+
setEditedItem: PropTypes.func,
|
|
128
|
+
setIsItemDisabled: PropTypes.func,
|
|
129
|
+
setItemExpansion: PropTypes.func,
|
|
130
|
+
setItemSelection: PropTypes.func,
|
|
131
|
+
updateItemChildren: PropTypes.func,
|
|
132
|
+
updateItemLabel: PropTypes.func
|
|
131
133
|
})
|
|
132
134
|
}),
|
|
133
135
|
/**
|
|
@@ -15,7 +15,7 @@ export interface RichTreeViewProSlots extends TreeViewSlots, RichTreeViewItemsSl
|
|
|
15
15
|
export interface RichTreeViewProSlotProps<R extends {}, Multiple extends boolean | undefined> extends TreeViewSlotProps, RichTreeViewItemsSlotProps {
|
|
16
16
|
root?: SlotComponentProps<'ul', {}, RichTreeViewProProps<R, Multiple>>;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
type RichTreeViewProApiRef = React.RefObject<Partial<TreeViewPublicAPI<RichTreeViewProPluginSignatures>> | undefined>;
|
|
19
19
|
export interface RichTreeViewProPropsBase extends React.HTMLAttributes<HTMLUListElement> {
|
|
20
20
|
className?: string;
|
|
21
21
|
/**
|
|
@@ -42,4 +42,5 @@ export interface RichTreeViewProProps<R extends {}, Multiple extends boolean | u
|
|
|
42
42
|
* The ref object that allows Tree View manipulation. Can be instantiated with `useTreeViewApiRef()`.
|
|
43
43
|
*/
|
|
44
44
|
apiRef?: RichTreeViewProApiRef;
|
|
45
|
-
}
|
|
45
|
+
}
|
|
46
|
+
export {};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export * from "./RichTreeViewPro.js";
|
|
2
2
|
export * from "./richTreeViewProClasses.js";
|
|
3
|
-
export type { RichTreeViewProProps, RichTreeViewProPropsBase, RichTreeViewProSlots, RichTreeViewProSlotProps } from "./RichTreeViewPro.types.js";
|
|
3
|
+
export type { RichTreeViewProProps, RichTreeViewProPropsBase, RichTreeViewProSlots, RichTreeViewProSlotProps } from "./RichTreeViewPro.types.js";
|
|
4
|
+
export type { RichTreeViewProPluginSignatures } from "./RichTreeViewPro.plugins.js";
|
package/esm/index.js
CHANGED
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export { useTreeViewItemsReordering } from "./useTreeViewItemsReordering.js";
|
|
2
|
-
export type { UseTreeViewItemsReorderingSignature, UseTreeViewItemsReorderingParameters, UseTreeViewItemsReorderingParametersWithDefaults, TreeViewItemReorderPosition } from "./useTreeViewItemsReordering.types.js";
|
|
2
|
+
export type { UseTreeViewItemsReorderingSignature, UseTreeViewItemsReorderingParameters, UseTreeViewItemsReorderingParametersWithDefaults, TreeViewItemReorderPosition } from "./useTreeViewItemsReordering.types.js";
|
|
3
|
+
export { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { useTreeViewItemsReordering } from "./useTreeViewItemsReordering.js";
|
|
1
|
+
export { useTreeViewItemsReordering } from "./useTreeViewItemsReordering.js";
|
|
2
|
+
export { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";
|
package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { useStore } from '@mui/x-internals/store';
|
|
3
|
+
import { useTreeViewContext, isTargetInDescendants } from '@mui/x-tree-view/internals';
|
|
4
|
+
import { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";
|
|
4
5
|
export const isAndroid = () => navigator.userAgent.toLowerCase().includes('android');
|
|
5
6
|
export const useTreeViewItemsReorderingItemPlugin = ({
|
|
6
7
|
props
|
|
@@ -13,9 +14,9 @@ export const useTreeViewItemsReorderingItemPlugin = ({
|
|
|
13
14
|
itemId
|
|
14
15
|
} = props;
|
|
15
16
|
const validActionsRef = React.useRef(null);
|
|
16
|
-
const draggedItemProperties =
|
|
17
|
-
const canItemBeReordered =
|
|
18
|
-
const isValidTarget =
|
|
17
|
+
const draggedItemProperties = useStore(store, itemsReorderingSelectors.draggedItemProperties, itemId);
|
|
18
|
+
const canItemBeReordered = useStore(store, itemsReorderingSelectors.canItemBeReordered, itemId);
|
|
19
|
+
const isValidTarget = useStore(store, itemsReorderingSelectors.isItemValidDropTarget, itemId);
|
|
19
20
|
return {
|
|
20
21
|
propsEnhancers: {
|
|
21
22
|
root: ({
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
4
|
-
import {
|
|
4
|
+
import { itemsSelectors, labelSelectors } from '@mui/x-tree-view/internals';
|
|
5
5
|
import { chooseActionToApply, isAncestor, moveItemInTree } from "./useTreeViewItemsReordering.utils.js";
|
|
6
6
|
import { useTreeViewItemsReorderingItemPlugin } from "./useTreeViewItemsReordering.itemPlugin.js";
|
|
7
|
-
import {
|
|
7
|
+
import { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";
|
|
8
8
|
export const useTreeViewItemsReordering = ({
|
|
9
9
|
params,
|
|
10
10
|
store
|
|
@@ -20,7 +20,7 @@ export const useTreeViewItemsReordering = ({
|
|
|
20
20
|
return true;
|
|
21
21
|
}, [params.itemsReordering, params.isItemReorderable]);
|
|
22
22
|
const getDroppingTargetValidActions = React.useCallback(itemId => {
|
|
23
|
-
const currentReorder =
|
|
23
|
+
const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
|
|
24
24
|
if (!currentReorder) {
|
|
25
25
|
throw new Error('There is no ongoing reordering.');
|
|
26
26
|
}
|
|
@@ -28,11 +28,11 @@ export const useTreeViewItemsReordering = ({
|
|
|
28
28
|
return {};
|
|
29
29
|
}
|
|
30
30
|
const canMoveItemToNewPosition = params.canMoveItemToNewPosition;
|
|
31
|
-
const targetItemMeta =
|
|
32
|
-
const targetItemIndex =
|
|
33
|
-
const draggedItemMeta =
|
|
34
|
-
const draggedItemIndex =
|
|
35
|
-
const isTargetLastSibling = targetItemIndex ===
|
|
31
|
+
const targetItemMeta = itemsSelectors.itemMeta(store.state, itemId);
|
|
32
|
+
const targetItemIndex = itemsSelectors.itemIndex(store.state, targetItemMeta.id);
|
|
33
|
+
const draggedItemMeta = itemsSelectors.itemMeta(store.state, currentReorder.draggedItemId);
|
|
34
|
+
const draggedItemIndex = itemsSelectors.itemIndex(store.state, draggedItemMeta.id);
|
|
35
|
+
const isTargetLastSibling = targetItemIndex === itemsSelectors.itemOrderedChildrenIds(store.state, targetItemMeta.parentId).length - 1;
|
|
36
36
|
const oldPosition = {
|
|
37
37
|
parentId: draggedItemMeta.parentId,
|
|
38
38
|
index: draggedItemIndex
|
|
@@ -68,7 +68,7 @@ export const useTreeViewItemsReordering = ({
|
|
|
68
68
|
} : null,
|
|
69
69
|
'move-to-parent': targetItemMeta.parentId == null ? null : {
|
|
70
70
|
parentId: targetItemMeta.parentId,
|
|
71
|
-
index:
|
|
71
|
+
index: itemsSelectors.itemOrderedChildrenIds(store.state, targetItemMeta.parentId).length
|
|
72
72
|
}
|
|
73
73
|
};
|
|
74
74
|
const validActions = {};
|
|
@@ -81,64 +81,56 @@ export const useTreeViewItemsReordering = ({
|
|
|
81
81
|
return validActions;
|
|
82
82
|
}, [store, params.canMoveItemToNewPosition]);
|
|
83
83
|
const startDraggingItem = React.useCallback(itemId => {
|
|
84
|
-
store.
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
84
|
+
const isItemBeingEdited = labelSelectors.isItemBeingEdited(store.state, itemId);
|
|
85
|
+
if (isItemBeingEdited) {
|
|
86
|
+
return;
|
|
87
|
+
}
|
|
88
|
+
store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
|
|
89
|
+
currentReorder: {
|
|
90
|
+
targetItemId: itemId,
|
|
91
|
+
draggedItemId: itemId,
|
|
92
|
+
action: null,
|
|
93
|
+
newPosition: null
|
|
88
94
|
}
|
|
89
|
-
|
|
90
|
-
itemsReordering: _extends({}, prevState.itemsReordering, {
|
|
91
|
-
currentReorder: {
|
|
92
|
-
targetItemId: itemId,
|
|
93
|
-
draggedItemId: itemId,
|
|
94
|
-
action: null,
|
|
95
|
-
newPosition: null
|
|
96
|
-
}
|
|
97
|
-
})
|
|
98
|
-
});
|
|
99
|
-
});
|
|
95
|
+
}));
|
|
100
96
|
}, [store]);
|
|
101
97
|
const cancelDraggingItem = React.useCallback(() => {
|
|
102
|
-
const currentReorder =
|
|
98
|
+
const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
|
|
103
99
|
if (currentReorder == null) {
|
|
104
100
|
return;
|
|
105
101
|
}
|
|
106
|
-
store.
|
|
107
|
-
|
|
108
|
-
currentReorder: null
|
|
109
|
-
})
|
|
102
|
+
store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
|
|
103
|
+
currentReorder: null
|
|
110
104
|
}));
|
|
111
105
|
}, [store]);
|
|
112
106
|
const completeDraggingItem = React.useCallback(itemId => {
|
|
113
|
-
const currentReorder =
|
|
107
|
+
const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
|
|
114
108
|
if (currentReorder == null || currentReorder.draggedItemId !== itemId) {
|
|
115
109
|
return;
|
|
116
110
|
}
|
|
117
111
|
if (currentReorder.draggedItemId === currentReorder.targetItemId || currentReorder.action == null || currentReorder.newPosition == null) {
|
|
118
|
-
store.
|
|
119
|
-
|
|
120
|
-
currentReorder: null
|
|
121
|
-
})
|
|
112
|
+
store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
|
|
113
|
+
currentReorder: null
|
|
122
114
|
}));
|
|
123
115
|
return;
|
|
124
116
|
}
|
|
125
|
-
const draggedItemMeta =
|
|
117
|
+
const draggedItemMeta = itemsSelectors.itemMeta(store.state, currentReorder.draggedItemId);
|
|
126
118
|
const oldPosition = {
|
|
127
119
|
parentId: draggedItemMeta.parentId,
|
|
128
|
-
index:
|
|
120
|
+
index: itemsSelectors.itemIndex(store.state, draggedItemMeta.id)
|
|
129
121
|
};
|
|
130
122
|
const newPosition = currentReorder.newPosition;
|
|
131
|
-
store.update(
|
|
132
|
-
itemsReordering: _extends({},
|
|
123
|
+
store.update({
|
|
124
|
+
itemsReordering: _extends({}, store.state.itemsReordering, {
|
|
133
125
|
currentReorder: null
|
|
134
126
|
}),
|
|
135
127
|
items: moveItemInTree({
|
|
136
128
|
itemToMoveId: itemId,
|
|
137
129
|
newPosition,
|
|
138
130
|
oldPosition,
|
|
139
|
-
prevState:
|
|
131
|
+
prevState: store.state.items
|
|
140
132
|
})
|
|
141
|
-
})
|
|
133
|
+
});
|
|
142
134
|
const onItemPositionChange = params.onItemPositionChange;
|
|
143
135
|
onItemPositionChange?.({
|
|
144
136
|
itemId,
|
|
@@ -154,40 +146,34 @@ export const useTreeViewItemsReordering = ({
|
|
|
154
146
|
cursorX,
|
|
155
147
|
contentElement
|
|
156
148
|
}) => {
|
|
157
|
-
store.
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
contentElement
|
|
170
|
-
});
|
|
171
|
-
const newPosition = action == null ? null : validActions[action];
|
|
172
|
-
if (prevItemReorder.targetItemId === itemId && prevItemReorder.action === action && prevItemReorder.newPosition?.parentId === newPosition?.parentId && prevItemReorder.newPosition?.index === newPosition?.index) {
|
|
173
|
-
return prevState;
|
|
174
|
-
}
|
|
175
|
-
return _extends({}, prevState, {
|
|
176
|
-
itemsReordering: _extends({}, prevState.itemsReordering, {
|
|
177
|
-
currentReorder: _extends({}, prevItemReorder, {
|
|
178
|
-
targetItemId: itemId,
|
|
179
|
-
newPosition,
|
|
180
|
-
action
|
|
181
|
-
})
|
|
182
|
-
})
|
|
183
|
-
});
|
|
149
|
+
const prevItemReorder = store.state.itemsReordering.currentReorder;
|
|
150
|
+
if (prevItemReorder == null || isAncestor(store, itemId, prevItemReorder.draggedItemId)) {
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
const action = chooseActionToApply({
|
|
154
|
+
itemChildrenIndentation: params.itemChildrenIndentation,
|
|
155
|
+
validActions,
|
|
156
|
+
targetHeight,
|
|
157
|
+
targetDepth: store.state.items.itemMetaLookup[itemId].depth,
|
|
158
|
+
cursorY,
|
|
159
|
+
cursorX,
|
|
160
|
+
contentElement
|
|
184
161
|
});
|
|
162
|
+
const newPosition = action == null ? null : validActions[action];
|
|
163
|
+
if (prevItemReorder.targetItemId === itemId && prevItemReorder.action === action && prevItemReorder.newPosition?.parentId === newPosition?.parentId && prevItemReorder.newPosition?.index === newPosition?.index) {
|
|
164
|
+
return;
|
|
165
|
+
}
|
|
166
|
+
store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
|
|
167
|
+
currentReorder: _extends({}, prevItemReorder, {
|
|
168
|
+
targetItemId: itemId,
|
|
169
|
+
newPosition,
|
|
170
|
+
action
|
|
171
|
+
})
|
|
172
|
+
}));
|
|
185
173
|
}, [store, params.itemChildrenIndentation]);
|
|
186
174
|
useEnhancedEffect(() => {
|
|
187
|
-
store.
|
|
188
|
-
itemsReordering:
|
|
189
|
-
isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
|
|
190
|
-
})
|
|
175
|
+
store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
|
|
176
|
+
isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
|
|
191
177
|
}));
|
|
192
178
|
}, [store, params.itemsReordering, params.isItemReorderable]);
|
|
193
179
|
return {
|