@mui/x-tree-view-pro 8.0.0-beta.0 → 8.0.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +171 -0
- package/RichTreeViewPro/RichTreeViewPro.js +19 -7
- package/RichTreeViewPro/richTreeViewProClasses.d.ts +2 -4
- package/RichTreeViewPro/richTreeViewProClasses.js +1 -1
- package/esm/RichTreeViewPro/RichTreeViewPro.js +19 -7
- package/esm/RichTreeViewPro/richTreeViewProClasses.d.ts +2 -4
- package/esm/RichTreeViewPro/richTreeViewProClasses.js +1 -1
- package/esm/index.js +1 -1
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js +6 -6
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js +51 -38
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts +244 -10
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js +23 -8
- package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.types.d.ts +8 -13
- package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js +1 -20
- package/esm/internals/utils/releaseInfo.js +1 -1
- package/index.js +1 -1
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js +5 -5
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js +50 -37
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts +244 -10
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js +23 -9
- package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.types.d.ts +8 -13
- package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js +1 -20
- package/internals/utils/releaseInfo.js +1 -1
- package/modern/RichTreeViewPro/RichTreeViewPro.js +19 -7
- package/modern/RichTreeViewPro/richTreeViewProClasses.d.ts +2 -4
- package/modern/RichTreeViewPro/richTreeViewProClasses.js +1 -1
- package/modern/index.js +1 -1
- package/modern/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.itemPlugin.js +6 -6
- package/modern/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js +51 -38
- package/modern/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts +244 -10
- package/modern/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js +23 -8
- package/modern/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.types.d.ts +8 -13
- package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js +1 -20
- package/modern/internals/utils/releaseInfo.js +1 -1
- package/package.json +4 -4
- package/tsconfig.build.tsbuildinfo +1 -1
|
@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.useTreeViewItemsReordering = void 0;
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
|
|
11
12
|
var _internals = require("@mui/x-tree-view/internals");
|
|
12
13
|
var _useTreeViewItemsReordering = require("./useTreeViewItemsReordering.utils");
|
|
13
14
|
var _useTreeViewItemsReordering2 = require("./useTreeViewItemsReordering.itemPlugin");
|
|
@@ -27,18 +28,19 @@ const useTreeViewItemsReordering = ({
|
|
|
27
28
|
return true;
|
|
28
29
|
}, [params.itemsReordering, params.isItemReorderable]);
|
|
29
30
|
const getDroppingTargetValidActions = React.useCallback(itemId => {
|
|
30
|
-
const
|
|
31
|
-
if (!
|
|
31
|
+
const currentReorder = (0, _useTreeViewItemsReordering3.selectorCurrentItemReordering)(store.value);
|
|
32
|
+
if (!currentReorder) {
|
|
32
33
|
throw new Error('There is no ongoing reordering.');
|
|
33
34
|
}
|
|
34
|
-
if (itemId ===
|
|
35
|
+
if (itemId === currentReorder.draggedItemId) {
|
|
35
36
|
return {};
|
|
36
37
|
}
|
|
37
38
|
const canMoveItemToNewPosition = params.canMoveItemToNewPosition;
|
|
38
39
|
const targetItemMeta = (0, _internals.selectorItemMeta)(store.value, itemId);
|
|
39
40
|
const targetItemIndex = (0, _internals.selectorItemIndex)(store.value, targetItemMeta.id);
|
|
40
|
-
const draggedItemMeta = (0, _internals.selectorItemMeta)(store.value,
|
|
41
|
+
const draggedItemMeta = (0, _internals.selectorItemMeta)(store.value, currentReorder.draggedItemId);
|
|
41
42
|
const draggedItemIndex = (0, _internals.selectorItemIndex)(store.value, draggedItemMeta.id);
|
|
43
|
+
const isTargetLastSibling = targetItemIndex === (0, _internals.selectorItemOrderedChildrenIds)(store.value, targetItemMeta.parentId).length - 1;
|
|
42
44
|
const oldPosition = {
|
|
43
45
|
parentId: draggedItemMeta.parentId,
|
|
44
46
|
index: draggedItemIndex
|
|
@@ -50,7 +52,7 @@ const useTreeViewItemsReordering = ({
|
|
|
50
52
|
isValid = false;
|
|
51
53
|
} else if (canMoveItemToNewPosition) {
|
|
52
54
|
isValid = canMoveItemToNewPosition({
|
|
53
|
-
itemId:
|
|
55
|
+
itemId: currentReorder.draggedItemId,
|
|
54
56
|
oldPosition,
|
|
55
57
|
newPosition: positionAfterAction
|
|
56
58
|
});
|
|
@@ -68,10 +70,10 @@ const useTreeViewItemsReordering = ({
|
|
|
68
70
|
parentId: targetItemMeta.parentId,
|
|
69
71
|
index: targetItemMeta.parentId === draggedItemMeta.parentId && targetItemIndex > draggedItemIndex ? targetItemIndex - 1 : targetItemIndex
|
|
70
72
|
},
|
|
71
|
-
'reorder-below': targetItemMeta.expandable
|
|
73
|
+
'reorder-below': !targetItemMeta.expandable || isTargetLastSibling ? {
|
|
72
74
|
parentId: targetItemMeta.parentId,
|
|
73
75
|
index: targetItemMeta.parentId === draggedItemMeta.parentId && targetItemIndex > draggedItemIndex ? targetItemIndex : targetItemIndex + 1
|
|
74
|
-
},
|
|
76
|
+
} : null,
|
|
75
77
|
'move-to-parent': targetItemMeta.parentId == null ? null : {
|
|
76
78
|
parentId: targetItemMeta.parentId,
|
|
77
79
|
index: (0, _internals.selectorItemOrderedChildrenIds)(store.value, targetItemMeta.parentId).length
|
|
@@ -88,33 +90,39 @@ const useTreeViewItemsReordering = ({
|
|
|
88
90
|
}, [store, params.canMoveItemToNewPosition]);
|
|
89
91
|
const startDraggingItem = React.useCallback(itemId => {
|
|
90
92
|
store.update(prevState => (0, _extends2.default)({}, prevState, {
|
|
91
|
-
itemsReordering: {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
93
|
+
itemsReordering: (0, _extends2.default)({}, prevState.itemsReordering, {
|
|
94
|
+
currentReorder: {
|
|
95
|
+
targetItemId: itemId,
|
|
96
|
+
draggedItemId: itemId,
|
|
97
|
+
action: null,
|
|
98
|
+
newPosition: null
|
|
99
|
+
}
|
|
100
|
+
})
|
|
97
101
|
}));
|
|
98
102
|
}, [store]);
|
|
99
103
|
const stopDraggingItem = React.useCallback(itemId => {
|
|
100
|
-
const
|
|
101
|
-
if (
|
|
104
|
+
const currentReorder = (0, _useTreeViewItemsReordering3.selectorCurrentItemReordering)(store.value);
|
|
105
|
+
if (currentReorder == null || currentReorder.draggedItemId !== itemId) {
|
|
102
106
|
return;
|
|
103
107
|
}
|
|
104
|
-
if (
|
|
108
|
+
if (currentReorder.draggedItemId === currentReorder.targetItemId || currentReorder.action == null || currentReorder.newPosition == null) {
|
|
105
109
|
store.update(prevState => (0, _extends2.default)({}, prevState, {
|
|
106
|
-
itemsReordering:
|
|
110
|
+
itemsReordering: (0, _extends2.default)({}, prevState.itemsReordering, {
|
|
111
|
+
currentReorder: null
|
|
112
|
+
})
|
|
107
113
|
}));
|
|
108
114
|
return;
|
|
109
115
|
}
|
|
110
|
-
const draggedItemMeta = (0, _internals.selectorItemMeta)(store.value,
|
|
116
|
+
const draggedItemMeta = (0, _internals.selectorItemMeta)(store.value, currentReorder.draggedItemId);
|
|
111
117
|
const oldPosition = {
|
|
112
118
|
parentId: draggedItemMeta.parentId,
|
|
113
119
|
index: (0, _internals.selectorItemIndex)(store.value, draggedItemMeta.id)
|
|
114
120
|
};
|
|
115
|
-
const newPosition =
|
|
121
|
+
const newPosition = currentReorder.newPosition;
|
|
116
122
|
store.update(prevState => (0, _extends2.default)({}, prevState, {
|
|
117
|
-
itemsReordering:
|
|
123
|
+
itemsReordering: (0, _extends2.default)({}, prevState.itemsReordering, {
|
|
124
|
+
currentReorder: null
|
|
125
|
+
}),
|
|
118
126
|
items: (0, _useTreeViewItemsReordering.moveItemInTree)({
|
|
119
127
|
itemToMoveId: itemId,
|
|
120
128
|
newPosition,
|
|
@@ -138,8 +146,8 @@ const useTreeViewItemsReordering = ({
|
|
|
138
146
|
contentElement
|
|
139
147
|
}) => {
|
|
140
148
|
store.update(prevState => {
|
|
141
|
-
const
|
|
142
|
-
if (
|
|
149
|
+
const prevItemReorder = prevState.itemsReordering.currentReorder;
|
|
150
|
+
if (prevItemReorder == null || (0, _useTreeViewItemsReordering.isAncestor)(store, itemId, prevItemReorder.draggedItemId)) {
|
|
143
151
|
return prevState;
|
|
144
152
|
}
|
|
145
153
|
const action = (0, _useTreeViewItemsReordering.chooseActionToApply)({
|
|
@@ -152,24 +160,27 @@ const useTreeViewItemsReordering = ({
|
|
|
152
160
|
contentElement
|
|
153
161
|
});
|
|
154
162
|
const newPosition = action == null ? null : validActions[action];
|
|
155
|
-
if (
|
|
163
|
+
if (prevItemReorder.targetItemId === itemId && prevItemReorder.action === action && prevItemReorder.newPosition?.parentId === newPosition?.parentId && prevItemReorder.newPosition?.index === newPosition?.index) {
|
|
156
164
|
return prevState;
|
|
157
165
|
}
|
|
158
166
|
return (0, _extends2.default)({}, prevState, {
|
|
159
|
-
itemsReordering: (0, _extends2.default)({},
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
167
|
+
itemsReordering: (0, _extends2.default)({}, prevState.itemsReordering, {
|
|
168
|
+
currentReorder: (0, _extends2.default)({}, prevItemReorder, {
|
|
169
|
+
targetItemId: itemId,
|
|
170
|
+
newPosition,
|
|
171
|
+
action
|
|
172
|
+
})
|
|
163
173
|
})
|
|
164
174
|
});
|
|
165
175
|
});
|
|
166
176
|
}, [store, params.itemChildrenIndentation]);
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
177
|
+
(0, _useEnhancedEffect.default)(() => {
|
|
178
|
+
store.update(prevState => (0, _extends2.default)({}, prevState, {
|
|
179
|
+
itemsReordering: (0, _extends2.default)({}, prevState.itemsReordering, {
|
|
180
|
+
isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
|
|
181
|
+
})
|
|
182
|
+
}));
|
|
183
|
+
}, [store, params.itemsReordering, params.isItemReorderable]);
|
|
173
184
|
return {
|
|
174
185
|
instance: {
|
|
175
186
|
canItemBeDragged,
|
|
@@ -177,8 +188,7 @@ const useTreeViewItemsReordering = ({
|
|
|
177
188
|
startDraggingItem,
|
|
178
189
|
stopDraggingItem,
|
|
179
190
|
setDragTargetItem
|
|
180
|
-
}
|
|
181
|
-
contextValue: pluginContextValue
|
|
191
|
+
}
|
|
182
192
|
};
|
|
183
193
|
};
|
|
184
194
|
exports.useTreeViewItemsReordering = useTreeViewItemsReordering;
|
|
@@ -188,8 +198,11 @@ useTreeViewItemsReordering.getDefaultizedParams = ({
|
|
|
188
198
|
}) => (0, _extends2.default)({}, params, {
|
|
189
199
|
itemsReordering: params.itemsReordering ?? false
|
|
190
200
|
});
|
|
191
|
-
useTreeViewItemsReordering.getInitialState =
|
|
192
|
-
itemsReordering:
|
|
201
|
+
useTreeViewItemsReordering.getInitialState = params => ({
|
|
202
|
+
itemsReordering: {
|
|
203
|
+
currentReorder: null,
|
|
204
|
+
isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
|
|
205
|
+
}
|
|
193
206
|
});
|
|
194
207
|
useTreeViewItemsReordering.params = {
|
|
195
208
|
itemsReordering: true,
|
package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts
CHANGED
|
@@ -1,23 +1,84 @@
|
|
|
1
1
|
import { TreeViewState } from '@mui/x-tree-view/internals';
|
|
2
2
|
import { UseTreeViewItemsReorderingSignature } from "./useTreeViewItemsReordering.types.js";
|
|
3
3
|
/**
|
|
4
|
-
* Get the
|
|
4
|
+
* Get the properties of the current reordering.
|
|
5
5
|
* @param {TreeViewState<[UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
6
|
-
* @returns {TreeViewItemsReorderingState
|
|
6
|
+
* @returns {TreeViewItemsReorderingState['currentReorder']} The properties of the current reordering.
|
|
7
7
|
*/
|
|
8
|
-
export declare const
|
|
8
|
+
export declare const selectorCurrentItemReordering: ((state: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewItemsReordering.types").UseTreeViewItemsReorderingState & Partial<{}> & {
|
|
9
|
+
cacheKey: import("@mui/x-tree-view/internals/models").TreeViewStateCacheKey;
|
|
10
|
+
}) => {
|
|
9
11
|
draggedItemId: string;
|
|
10
12
|
targetItemId: string;
|
|
11
13
|
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
12
14
|
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
13
|
-
} | null
|
|
15
|
+
} | null) & {
|
|
16
|
+
clearCache: () => void;
|
|
17
|
+
resultsCount: () => number;
|
|
18
|
+
resetResultsCount: () => void;
|
|
19
|
+
} & {
|
|
20
|
+
resultFunc: (resultFuncArgs_0: {
|
|
21
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
22
|
+
currentReorder: {
|
|
23
|
+
draggedItemId: string;
|
|
24
|
+
targetItemId: string;
|
|
25
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
26
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
27
|
+
} | null;
|
|
28
|
+
}) => {
|
|
29
|
+
draggedItemId: string;
|
|
30
|
+
targetItemId: string;
|
|
31
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
32
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
33
|
+
} | null;
|
|
34
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
35
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
36
|
+
currentReorder: {
|
|
37
|
+
draggedItemId: string;
|
|
38
|
+
targetItemId: string;
|
|
39
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
40
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
41
|
+
} | null;
|
|
42
|
+
}) => {
|
|
43
|
+
draggedItemId: string;
|
|
44
|
+
targetItemId: string;
|
|
45
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
46
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
47
|
+
} | null) & {
|
|
48
|
+
clearCache: () => void;
|
|
49
|
+
resultsCount: () => number;
|
|
50
|
+
resetResultsCount: () => void;
|
|
51
|
+
};
|
|
52
|
+
lastResult: () => {
|
|
53
|
+
draggedItemId: string;
|
|
54
|
+
targetItemId: string;
|
|
55
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
56
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
57
|
+
} | null;
|
|
58
|
+
dependencies: [(state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => {
|
|
59
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
60
|
+
currentReorder: {
|
|
61
|
+
draggedItemId: string;
|
|
62
|
+
targetItemId: string;
|
|
63
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
64
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
65
|
+
} | null;
|
|
66
|
+
}];
|
|
67
|
+
recomputations: () => number;
|
|
68
|
+
resetRecomputations: () => void;
|
|
69
|
+
dependencyRecomputations: () => number;
|
|
70
|
+
resetDependencyRecomputations: () => void;
|
|
71
|
+
} & {
|
|
72
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
73
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
74
|
+
};
|
|
14
75
|
/**
|
|
15
76
|
* Get the properties of the dragged item.
|
|
16
77
|
* @param {TreeViewState<[UseTreeViewItemsSignature, UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
17
78
|
* @param {string} itemId The id of the item.
|
|
18
79
|
* @returns {TreeViewItemDraggedItemProperties | null} The properties of the dragged item if the current item is being dragged, `null` otherwise.
|
|
19
80
|
*/
|
|
20
|
-
export declare const
|
|
81
|
+
export declare const selectorDraggedItemProperties: ((state: any, itemId: string) => {
|
|
21
82
|
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
22
83
|
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction;
|
|
23
84
|
targetDepth: number;
|
|
@@ -59,12 +120,73 @@ export declare const selectorItemsReorderingDraggedItemProperties: ((state: any,
|
|
|
59
120
|
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction;
|
|
60
121
|
targetDepth: number;
|
|
61
122
|
} | null;
|
|
62
|
-
dependencies: [(state:
|
|
123
|
+
dependencies: [((state: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewItemsReordering.types").UseTreeViewItemsReorderingState & Partial<{}> & {
|
|
124
|
+
cacheKey: import("@mui/x-tree-view/internals/models").TreeViewStateCacheKey;
|
|
125
|
+
}) => {
|
|
63
126
|
draggedItemId: string;
|
|
64
127
|
targetItemId: string;
|
|
65
128
|
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
66
129
|
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
67
|
-
} | null
|
|
130
|
+
} | null) & {
|
|
131
|
+
clearCache: () => void;
|
|
132
|
+
resultsCount: () => number;
|
|
133
|
+
resetResultsCount: () => void;
|
|
134
|
+
} & {
|
|
135
|
+
resultFunc: (resultFuncArgs_0: {
|
|
136
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
137
|
+
currentReorder: {
|
|
138
|
+
draggedItemId: string;
|
|
139
|
+
targetItemId: string;
|
|
140
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
141
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
142
|
+
} | null;
|
|
143
|
+
}) => {
|
|
144
|
+
draggedItemId: string;
|
|
145
|
+
targetItemId: string;
|
|
146
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
147
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
148
|
+
} | null;
|
|
149
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
150
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
151
|
+
currentReorder: {
|
|
152
|
+
draggedItemId: string;
|
|
153
|
+
targetItemId: string;
|
|
154
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
155
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
156
|
+
} | null;
|
|
157
|
+
}) => {
|
|
158
|
+
draggedItemId: string;
|
|
159
|
+
targetItemId: string;
|
|
160
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
161
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
162
|
+
} | null) & {
|
|
163
|
+
clearCache: () => void;
|
|
164
|
+
resultsCount: () => number;
|
|
165
|
+
resetResultsCount: () => void;
|
|
166
|
+
};
|
|
167
|
+
lastResult: () => {
|
|
168
|
+
draggedItemId: string;
|
|
169
|
+
targetItemId: string;
|
|
170
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
171
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
172
|
+
} | null;
|
|
173
|
+
dependencies: [(state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => {
|
|
174
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
175
|
+
currentReorder: {
|
|
176
|
+
draggedItemId: string;
|
|
177
|
+
targetItemId: string;
|
|
178
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
179
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
180
|
+
} | null;
|
|
181
|
+
}];
|
|
182
|
+
recomputations: () => number;
|
|
183
|
+
resetRecomputations: () => void;
|
|
184
|
+
dependencyRecomputations: () => number;
|
|
185
|
+
resetDependencyRecomputations: () => void;
|
|
186
|
+
} & {
|
|
187
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
188
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
189
|
+
}, ((state: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("@mui/x-tree-view/internals").UseTreeViewItemsState<import("@mui/x-tree-view").TreeViewDefaultItemModelProperties> & Partial<{}> & {
|
|
68
190
|
cacheKey: import("@mui/x-tree-view/internals/models").TreeViewStateCacheKey;
|
|
69
191
|
}) => {
|
|
70
192
|
[itemId: string]: import("@mui/x-tree-view/internals").TreeViewItemMeta;
|
|
@@ -145,7 +267,7 @@ export declare const selectorItemsReorderingDraggedItemProperties: ((state: any,
|
|
|
145
267
|
* @param {string} itemId The id of the item.
|
|
146
268
|
* @returns {boolean} `true` if the current item is a valid target for the dragged item, `false` otherwise.
|
|
147
269
|
*/
|
|
148
|
-
export declare const
|
|
270
|
+
export declare const selectorIsItemValidReorderingTarget: ((state: any, itemId: string) => boolean | null) & {
|
|
149
271
|
clearCache: () => void;
|
|
150
272
|
resultsCount: () => number;
|
|
151
273
|
resetResultsCount: () => void;
|
|
@@ -167,12 +289,124 @@ export declare const selectorItemsReorderingIsValidTarget: ((state: any, itemId:
|
|
|
167
289
|
resetResultsCount: () => void;
|
|
168
290
|
};
|
|
169
291
|
lastResult: () => boolean | null;
|
|
170
|
-
dependencies: [(state:
|
|
292
|
+
dependencies: [((state: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewItemsReordering.types").UseTreeViewItemsReorderingState & Partial<{}> & {
|
|
293
|
+
cacheKey: import("@mui/x-tree-view/internals/models").TreeViewStateCacheKey;
|
|
294
|
+
}) => {
|
|
171
295
|
draggedItemId: string;
|
|
172
296
|
targetItemId: string;
|
|
173
297
|
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
174
298
|
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
175
|
-
} | null
|
|
299
|
+
} | null) & {
|
|
300
|
+
clearCache: () => void;
|
|
301
|
+
resultsCount: () => number;
|
|
302
|
+
resetResultsCount: () => void;
|
|
303
|
+
} & {
|
|
304
|
+
resultFunc: (resultFuncArgs_0: {
|
|
305
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
306
|
+
currentReorder: {
|
|
307
|
+
draggedItemId: string;
|
|
308
|
+
targetItemId: string;
|
|
309
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
310
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
311
|
+
} | null;
|
|
312
|
+
}) => {
|
|
313
|
+
draggedItemId: string;
|
|
314
|
+
targetItemId: string;
|
|
315
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
316
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
317
|
+
} | null;
|
|
318
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
319
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
320
|
+
currentReorder: {
|
|
321
|
+
draggedItemId: string;
|
|
322
|
+
targetItemId: string;
|
|
323
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
324
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
325
|
+
} | null;
|
|
326
|
+
}) => {
|
|
327
|
+
draggedItemId: string;
|
|
328
|
+
targetItemId: string;
|
|
329
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
330
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
331
|
+
} | null) & {
|
|
332
|
+
clearCache: () => void;
|
|
333
|
+
resultsCount: () => number;
|
|
334
|
+
resetResultsCount: () => void;
|
|
335
|
+
};
|
|
336
|
+
lastResult: () => {
|
|
337
|
+
draggedItemId: string;
|
|
338
|
+
targetItemId: string;
|
|
339
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
340
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
341
|
+
} | null;
|
|
342
|
+
dependencies: [(state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => {
|
|
343
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
344
|
+
currentReorder: {
|
|
345
|
+
draggedItemId: string;
|
|
346
|
+
targetItemId: string;
|
|
347
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
348
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
349
|
+
} | null;
|
|
350
|
+
}];
|
|
351
|
+
recomputations: () => number;
|
|
352
|
+
resetRecomputations: () => void;
|
|
353
|
+
dependencyRecomputations: () => number;
|
|
354
|
+
resetDependencyRecomputations: () => void;
|
|
355
|
+
} & {
|
|
356
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
357
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
358
|
+
}, (_: any, itemId: string) => string];
|
|
359
|
+
recomputations: () => number;
|
|
360
|
+
resetRecomputations: () => void;
|
|
361
|
+
dependencyRecomputations: () => number;
|
|
362
|
+
resetDependencyRecomputations: () => void;
|
|
363
|
+
} & {
|
|
364
|
+
argsMemoize: typeof import("reselect").weakMapMemoize;
|
|
365
|
+
memoize: typeof import("reselect").weakMapMemoize;
|
|
366
|
+
};
|
|
367
|
+
/**
|
|
368
|
+
* Check if the items can be reordered.
|
|
369
|
+
* @param {TreeViewState<[UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
370
|
+
* @param {string} itemId The id of the item.
|
|
371
|
+
* @returns {boolean} `true` if the items can be reordered, `false` otherwise.
|
|
372
|
+
*/
|
|
373
|
+
export declare const selectorCanItemBeReordered: ((state: any, itemId: string) => boolean) & {
|
|
374
|
+
clearCache: () => void;
|
|
375
|
+
resultsCount: () => number;
|
|
376
|
+
resetResultsCount: () => void;
|
|
377
|
+
} & {
|
|
378
|
+
resultFunc: (resultFuncArgs_0: {
|
|
379
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
380
|
+
currentReorder: {
|
|
381
|
+
draggedItemId: string;
|
|
382
|
+
targetItemId: string;
|
|
383
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
384
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
385
|
+
} | null;
|
|
386
|
+
}, resultFuncArgs_1: string) => boolean;
|
|
387
|
+
memoizedResultFunc: ((resultFuncArgs_0: {
|
|
388
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
389
|
+
currentReorder: {
|
|
390
|
+
draggedItemId: string;
|
|
391
|
+
targetItemId: string;
|
|
392
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
393
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
394
|
+
} | null;
|
|
395
|
+
}, resultFuncArgs_1: string) => boolean) & {
|
|
396
|
+
clearCache: () => void;
|
|
397
|
+
resultsCount: () => number;
|
|
398
|
+
resetResultsCount: () => void;
|
|
399
|
+
};
|
|
400
|
+
lastResult: () => boolean;
|
|
401
|
+
dependencies: [(state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => {
|
|
402
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
403
|
+
currentReorder: {
|
|
404
|
+
draggedItemId: string;
|
|
405
|
+
targetItemId: string;
|
|
406
|
+
newPosition: import("./useTreeViewItemsReordering.types").TreeViewItemReorderPosition | null;
|
|
407
|
+
action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
|
|
408
|
+
} | null;
|
|
409
|
+
}, (_: any, itemId: string) => string];
|
|
176
410
|
recomputations: () => number;
|
|
177
411
|
resetRecomputations: () => void;
|
|
178
412
|
dependencyRecomputations: () => number;
|
package/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.js
CHANGED
|
@@ -3,32 +3,38 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.selectorIsItemValidReorderingTarget = exports.selectorDraggedItemProperties = exports.selectorCurrentItemReordering = exports.selectorCanItemBeReordered = void 0;
|
|
7
7
|
var _internals = require("@mui/x-tree-view/internals");
|
|
8
8
|
/**
|
|
9
9
|
* Get the items reordering state.
|
|
10
10
|
* @param {TreeViewState<[UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
11
|
-
* @returns {TreeViewItemsReorderingState
|
|
11
|
+
* @returns {TreeViewItemsReorderingState} The items reordering state.
|
|
12
12
|
*/
|
|
13
13
|
const selectorItemsReordering = state => state.itemsReordering;
|
|
14
14
|
|
|
15
|
+
/**
|
|
16
|
+
* Get the properties of the current reordering.
|
|
17
|
+
* @param {TreeViewState<[UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
18
|
+
* @returns {TreeViewItemsReorderingState['currentReorder']} The properties of the current reordering.
|
|
19
|
+
*/
|
|
20
|
+
const selectorCurrentItemReordering = exports.selectorCurrentItemReordering = (0, _internals.createSelector)([selectorItemsReordering], itemsReordering => itemsReordering.currentReorder);
|
|
21
|
+
|
|
15
22
|
/**
|
|
16
23
|
* Get the properties of the dragged item.
|
|
17
24
|
* @param {TreeViewState<[UseTreeViewItemsSignature, UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
18
25
|
* @param {string} itemId The id of the item.
|
|
19
26
|
* @returns {TreeViewItemDraggedItemProperties | null} The properties of the dragged item if the current item is being dragged, `null` otherwise.
|
|
20
27
|
*/
|
|
21
|
-
exports.
|
|
22
|
-
|
|
23
|
-
if (!itemsReordering || itemsReordering.targetItemId !== itemId || itemsReordering.action == null) {
|
|
28
|
+
const selectorDraggedItemProperties = exports.selectorDraggedItemProperties = (0, _internals.createSelector)([selectorCurrentItemReordering, _internals.selectorItemMetaLookup, (_, itemId) => itemId], (currentReorder, itemMetaLookup, itemId) => {
|
|
29
|
+
if (!currentReorder || currentReorder.targetItemId !== itemId || currentReorder.action == null) {
|
|
24
30
|
return null;
|
|
25
31
|
}
|
|
26
|
-
const targetDepth =
|
|
32
|
+
const targetDepth = currentReorder.newPosition?.parentId == null ? 0 :
|
|
27
33
|
// The depth is always defined because drag&drop is only usable with Rich Tree View components.
|
|
28
34
|
itemMetaLookup[itemId].depth + 1;
|
|
29
35
|
return {
|
|
30
|
-
newPosition:
|
|
31
|
-
action:
|
|
36
|
+
newPosition: currentReorder.newPosition,
|
|
37
|
+
action: currentReorder.action,
|
|
32
38
|
targetDepth
|
|
33
39
|
};
|
|
34
40
|
});
|
|
@@ -39,4 +45,12 @@ const selectorItemsReorderingDraggedItemProperties = exports.selectorItemsReorde
|
|
|
39
45
|
* @param {string} itemId The id of the item.
|
|
40
46
|
* @returns {boolean} `true` if the current item is a valid target for the dragged item, `false` otherwise.
|
|
41
47
|
*/
|
|
42
|
-
const
|
|
48
|
+
const selectorIsItemValidReorderingTarget = exports.selectorIsItemValidReorderingTarget = (0, _internals.createSelector)([selectorCurrentItemReordering, (_, itemId) => itemId], (currentReorder, itemId) => currentReorder && currentReorder.draggedItemId !== itemId);
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* Check if the items can be reordered.
|
|
52
|
+
* @param {TreeViewState<[UseTreeViewItemsReorderingSignature]>} state The state of the tree view.
|
|
53
|
+
* @param {string} itemId The id of the item.
|
|
54
|
+
* @returns {boolean} `true` if the items can be reordered, `false` otherwise.
|
|
55
|
+
*/
|
|
56
|
+
const selectorCanItemBeReordered = exports.selectorCanItemBeReordered = (0, _internals.createSelector)([selectorItemsReordering, (_, itemId) => itemId], (itemsReordering, itemId) => itemsReordering.isItemReorderable(itemId));
|
|
@@ -93,16 +93,13 @@ export interface UseTreeViewItemsReorderingParameters {
|
|
|
93
93
|
export type UseTreeViewItemsReorderingDefaultizedParameters = DefaultizedProps<UseTreeViewItemsReorderingParameters, 'itemsReordering'>;
|
|
94
94
|
export interface UseTreeViewItemsReorderingState {
|
|
95
95
|
itemsReordering: {
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
itemsReordering: {
|
|
104
|
-
enabled: boolean;
|
|
105
|
-
isItemReorderable: ((itemId: string) => boolean) | undefined;
|
|
96
|
+
isItemReorderable: (itemId: string) => boolean;
|
|
97
|
+
currentReorder: {
|
|
98
|
+
draggedItemId: string;
|
|
99
|
+
targetItemId: string;
|
|
100
|
+
newPosition: TreeViewItemReorderPosition | null;
|
|
101
|
+
action: TreeViewItemsReorderingAction | null;
|
|
102
|
+
} | null;
|
|
106
103
|
};
|
|
107
104
|
}
|
|
108
105
|
export type UseTreeViewItemsReorderingSignature = TreeViewPluginSignature<{
|
|
@@ -110,7 +107,6 @@ export type UseTreeViewItemsReorderingSignature = TreeViewPluginSignature<{
|
|
|
110
107
|
defaultizedParams: UseTreeViewItemsReorderingDefaultizedParameters;
|
|
111
108
|
instance: UseTreeViewItemsReorderingInstance;
|
|
112
109
|
state: UseTreeViewItemsReorderingState;
|
|
113
|
-
contextValue: UseTreeViewItemsReorderingContextValue;
|
|
114
110
|
dependencies: [UseTreeViewItemsSignature];
|
|
115
111
|
}>;
|
|
116
112
|
export interface UseTreeItemRootSlotPropsFromItemsReordering {
|
|
@@ -128,5 +124,4 @@ declare module '@mui/x-tree-view/useTreeItem' {
|
|
|
128
124
|
interface UseTreeItemRootSlotOwnProps extends UseTreeItemRootSlotPropsFromItemsReordering {}
|
|
129
125
|
interface UseTreeItemContentSlotOwnProps extends UseTreeItemContentSlotPropsFromItemsReordering {}
|
|
130
126
|
interface UseTreeItemDragAndDropOverlaySlotOwnProps extends UseTreeItemDragAndDropOverlaySlotPropsFromItemsReordering {}
|
|
131
|
-
}
|
|
132
|
-
export {};
|
|
127
|
+
}
|
|
@@ -9,7 +9,6 @@ exports.useTreeViewLazyLoading = void 0;
|
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var React = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _useLazyRef = _interopRequireDefault(require("@mui/utils/useLazyRef"));
|
|
12
|
-
var _warning = require("@mui/x-internals/warning");
|
|
13
12
|
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
14
13
|
var _internals = require("@mui/x-tree-view/internals");
|
|
15
14
|
var _utils = require("@mui/x-tree-view/utils");
|
|
@@ -34,7 +33,7 @@ const useTreeViewLazyLoading = ({
|
|
|
34
33
|
params,
|
|
35
34
|
store
|
|
36
35
|
}) => {
|
|
37
|
-
const isLazyLoadingEnabled = params.dataSource
|
|
36
|
+
const isLazyLoadingEnabled = !!params.dataSource;
|
|
38
37
|
const firstRenderRef = React.useRef(true);
|
|
39
38
|
const nestedDataManager = (0, _useLazyRef.default)(() => new _utils2.NestedDataManager(instance)).current;
|
|
40
39
|
const cacheRef = (0, _useLazyRef.default)(() => getCache(params.dataSourceCache));
|
|
@@ -267,24 +266,6 @@ const useTreeViewLazyLoading = ({
|
|
|
267
266
|
};
|
|
268
267
|
};
|
|
269
268
|
exports.useTreeViewLazyLoading = useTreeViewLazyLoading;
|
|
270
|
-
useTreeViewLazyLoading.getDefaultizedParams = ({
|
|
271
|
-
params,
|
|
272
|
-
experimentalFeatures
|
|
273
|
-
}) => {
|
|
274
|
-
const canUseFeature = experimentalFeatures?.lazyLoading;
|
|
275
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
276
|
-
if (params.dataSource && !canUseFeature) {
|
|
277
|
-
(0, _warning.warnOnce)(['MUI X: The label editing feature requires the `lazyLoading` experimental feature to be enabled.', 'You can do it by passing `experimentalFeatures={{ lazyLoading: true}}` to the Rich Tree View Pro component.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/rich-tree-view/lazy-loading/']);
|
|
278
|
-
}
|
|
279
|
-
}
|
|
280
|
-
const defaultDataSource = params?.dataSource ?? {
|
|
281
|
-
getChildrenCount: () => 0,
|
|
282
|
-
getTreeItems: () => Promise.resolve([])
|
|
283
|
-
};
|
|
284
|
-
return (0, _extends2.default)({}, params, {
|
|
285
|
-
dataSource: canUseFeature ? defaultDataSource : {}
|
|
286
|
-
});
|
|
287
|
-
};
|
|
288
269
|
useTreeViewLazyLoading.getInitialState = () => ({
|
|
289
270
|
lazyLoading: {
|
|
290
271
|
enabled: false,
|
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.getReleaseInfo = void 0;
|
|
8
8
|
var _ponyfillGlobal = _interopRequireDefault(require("@mui/utils/ponyfillGlobal"));
|
|
9
9
|
const getReleaseInfo = () => {
|
|
10
|
-
const releaseInfo = "
|
|
10
|
+
const releaseInfo = "MTc0MzExMjgwMDAwMA==";
|
|
11
11
|
if (process.env.NODE_ENV !== 'production') {
|
|
12
12
|
// A simple hack to set the value in the test environment (has no build step).
|
|
13
13
|
// eslint-disable-next-line no-useless-concat
|