@mui/x-tree-view 7.2.0 → 7.3.1

package/node/internals/TreeViewProvider/useTreeViewContext.js

@@ -7,7 +7,7 @@ exports.useTreeViewContext = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _TreeViewContext = require("./TreeViewContext");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewContext = () => {
   const context = React.useContext(_TreeViewContext.TreeViewContext);
   if (context == null) {

package/node/internals/corePlugins/useTreeViewInstanceEvents/useTreeViewInstanceEvents.js

@@ -7,7 +7,7 @@ exports.useTreeViewInstanceEvents = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _EventManager = require("../../utils/EventManager");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const isSyntheticEvent = event => {
   return event.isPropagationStopped !== undefined;
 };

package/node/internals/hooks/useInstanceEventHandler.js

@@ -9,7 +9,7 @@ var React = _interopRequireWildcard(require("react"));
 var _TimerBasedCleanupTracking = require("../utils/cleanupTracking/TimerBasedCleanupTracking");
 var _FinalizationRegistryBasedCleanupTracking = require("../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 // We use class to make it easier to detect in heap snapshots by name
 class ObjectToBeRetainedByReact {}
 

package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -9,7 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewExpansion = ({
   instance,
   params,

package/node/internals/plugins/useTreeViewFocus/useTreeViewFocus.js

@@ -13,7 +13,7 @@ var _useInstanceEventHandler = require("../../hooks/useInstanceEventHandler");
 var _utils = require("../../utils/utils");
 var _tree = require("../../utils/tree");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTabbableItemId = (instance, selectedItems) => {
   const isItemVisible = itemId => {
     const itemMeta = instance.getItemMeta(itemId);
@@ -103,19 +103,20 @@ const useTreeViewFocus = ({
       instance.focusDefaultItem(null);
     }
   });
-  const createHandleFocus = otherHandlers => event => {
+  const createRootHandleFocus = otherHandlers => event => {
     otherHandlers.onFocus?.(event);
+    if (event.defaultMuiPrevented) {
+      return;
+    }
+
     // if the event bubbled (which is React specific) we don't want to steal focus
     if (event.target === event.currentTarget) {
       instance.focusDefaultItem(event);
     }
   };
-  const focusedItem = instance.getItemMeta(state.focusedItemId);
-  const activeDescendant = focusedItem ? instance.getTreeItemIdAttribute(focusedItem.id, focusedItem.idAttribute) : null;
   return {
     getRootProps: otherHandlers => ({
-      onFocus: createHandleFocus(otherHandlers),
-      'aria-activedescendant': activeDescendant ?? undefined
+      onFocus: createRootHandleFocus(otherHandlers)
     }),
     publicAPI: {
       focusItem

package/node/internals/plugins/useTreeViewId/useTreeViewId.js

@@ -8,7 +8,7 @@ exports.useTreeViewId = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewId = ({
   params
 }) => {

package/node/internals/plugins/useTreeViewItems/useTreeViewItems.js

@@ -10,7 +10,7 @@ var React = _interopRequireWildcard(require("react"));
 var _publishTreeViewEvent = require("../../utils/publishTreeViewEvent");
 var _useTreeViewItems = require("./useTreeViewItems.utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const updateItemsState = ({
   items,
   isItemDisabled,

package/node/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js

@@ -16,7 +16,7 @@ var _TreeViewChildrenItemProvider = require("../../TreeViewProvider/TreeViewChil
 var _useTreeViewItems = require("../useTreeViewItems/useTreeViewItems.utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewJSXItems = ({
   instance,
   setState
@@ -96,6 +96,12 @@ const useTreeViewJSXItems = ({
   };
 };
 exports.useTreeViewJSXItems = useTreeViewJSXItems;
+const isItemExpandable = reactChildren => {
+  if (Array.isArray(reactChildren)) {
+    return reactChildren.length > 0 && reactChildren.some(isItemExpandable);
+  }
+  return Boolean(reactChildren);
+};
 const useTreeViewJSXItemsItemPlugin = ({
   props,
   rootRef,
@@ -120,13 +126,7 @@ const useTreeViewJSXItemsItemPlugin = ({
     unregisterChild,
     parentId
   } = parentContext;
-  const isExpandable = reactChildren => {
-    if (Array.isArray(reactChildren)) {
-      return reactChildren.length > 0 && reactChildren.some(isExpandable);
-    }
-    return Boolean(reactChildren);
-  };
-  const expandable = isExpandable(children);
+  const expandable = isItemExpandable(children);
   const pluginContentRef = React.useRef(null);
   const handleContentRef = (0, _useForkRef.default)(pluginContentRef, contentRef);
 

package/node/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js

@@ -10,18 +10,10 @@ var _styles = require("@mui/material/styles");
 var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
 var _tree = require("../../utils/tree");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function isPrintableCharacter(string) {
   return !!string && string.length === 1 && !!string.match(/\S/);
 }
-function findNextFirstChar(firstChars, startIndex, char) {
-  for (let i = startIndex; i < firstChars.length; i += 1) {
-    if (char === firstChars[i]) {
-      return i;
-    }
-  }
-  return -1;
-}
 const useTreeViewKeyboardNavigation = ({
   instance,
   params,
@@ -44,42 +36,29 @@ const useTreeViewKeyboardNavigation = ({
     Object.values(state.items.itemMetaMap).forEach(processItem);
     firstCharMap.current = newFirstCharMap;
   }, [state.items.itemMetaMap, params.getItemId, instance]);
-  const getFirstMatchingItem = (itemId, firstChar) => {
-    let start;
-    let index;
-    const lowercaseChar = firstChar.toLowerCase();
-    const firstCharIds = [];
-    const firstChars = [];
-    // This really only works since the ids are strings
-    Object.keys(firstCharMap.current).forEach(mapItemId => {
-      const map = instance.getItemMeta(mapItemId);
-      const visible = map.parentId ? instance.isItemExpanded(map.parentId) : true;
-      const shouldBeSkipped = params.disabledItemsFocusable ? false : instance.isItemDisabled(mapItemId);
-      if (visible && !shouldBeSkipped) {
-        firstCharIds.push(mapItemId);
-        firstChars.push(firstCharMap.current[mapItemId]);
+  const getFirstMatchingItem = (itemId, query) => {
+    const cleanQuery = query.toLowerCase();
+    const getNextItem = itemIdToCheck => {
+      const nextItemId = (0, _tree.getNextNavigableItem)(instance, itemIdToCheck);
+      // We reached the end of the tree, check from the beginning
+      if (nextItemId === null) {
+        return (0, _tree.getFirstNavigableItem)(instance);
+      }
+      return nextItemId;
+    };
+    let matchingItemId = null;
+    let currentItemId = getNextItem(itemId);
+    const checkedItems = {};
+    // The "!checkedItems[currentItemId]" condition avoids an infinite loop when there is no matching item.
+    while (matchingItemId == null && !checkedItems[currentItemId]) {
+      if (firstCharMap.current[currentItemId] === cleanQuery) {
+        matchingItemId = currentItemId;
+      } else {
+        checkedItems[currentItemId] = true;
+        currentItemId = getNextItem(currentItemId);
       }
-    });
-
-    // Get start index for search based on position of currentItem
-    start = firstCharIds.indexOf(itemId) + 1;
-    if (start >= firstCharIds.length) {
-      start = 0;
-    }
-
-    // Check remaining slots in the menu
-    index = findNextFirstChar(firstChars, start, lowercaseChar);
-
-    // If not found in remaining slots, check from beginning
-    if (index === -1) {
-      index = findNextFirstChar(firstChars, 0, lowercaseChar);
-    }
-
-    // If a match was found...
-    if (index > -1) {
-      return firstCharIds[index];
     }
-    return null;
+    return matchingItemId;
   };
   const canToggleItemSelection = itemId => !params.disableSelection && !instance.isItemDisabled(itemId);
   const canToggleItemExpansion = itemId => {
@@ -104,9 +83,7 @@ const useTreeViewKeyboardNavigation = ({
         {
           event.preventDefault();
           if (params.multiSelect && event.shiftKey) {
-            instance.selectRange(event, {
-              end: itemId
-            });
+            instance.expandSelectionRange(event, itemId);
           } else if (params.multiSelect) {
             instance.selectItem(event, itemId, true);
           } else {
@@ -145,10 +122,7 @@ const useTreeViewKeyboardNavigation = ({
             // Multi select behavior when pressing Shift + ArrowDown
             // Toggles the selection state of the next item
             if (params.multiSelect && event.shiftKey && canToggleItemSelection(nextItem)) {
-              instance.selectRange(event, {
-                end: nextItem,
-                current: itemId
-              }, true);
+              instance.selectItemFromArrowNavigation(event, itemId, nextItem);
             }
           }
           break;
@@ -165,10 +139,7 @@ const useTreeViewKeyboardNavigation = ({
             // Multi select behavior when pressing Shift + ArrowUp
             // Toggles the selection state of the previous item
             if (params.multiSelect && event.shiftKey && canToggleItemSelection(previousItem)) {
-              instance.selectRange(event, {
-                end: previousItem,
-                current: itemId
-              }, true);
+              instance.selectItemFromArrowNavigation(event, itemId, previousItem);
             }
           }
           break;
@@ -211,12 +182,12 @@ const useTreeViewKeyboardNavigation = ({
       // Focuses the first item in the tree
       case key === 'Home':
         {
-          instance.focusItem(event, (0, _tree.getFirstNavigableItem)(instance));
-
           // Multi select behavior when pressing Ctrl + Shift + Home
           // Selects the focused item and all items up to the first item.
           if (canToggleItemSelection(itemId) && params.multiSelect && ctrlPressed && event.shiftKey) {
-            instance.rangeSelectToFirst(event, itemId);
+            instance.selectRangeFromStartToItem(event, itemId);
+          } else {
+            instance.focusItem(event, (0, _tree.getFirstNavigableItem)(instance));
           }
           event.preventDefault();
           break;
@@ -225,12 +196,12 @@ const useTreeViewKeyboardNavigation = ({
       // Focuses the last item in the tree
       case key === 'End':
         {
-          instance.focusItem(event, (0, _tree.getLastNavigableItem)(instance));
-
           // Multi select behavior when pressing Ctrl + Shirt + End
           // Selects the focused item and all the items down to the last item.
           if (canToggleItemSelection(itemId) && params.multiSelect && ctrlPressed && event.shiftKey) {
-            instance.rangeSelectToLast(event, itemId);
+            instance.selectRangeFromItemToEnd(event, itemId);
+          } else {
+            instance.focusItem(event, (0, _tree.getLastNavigableItem)(instance));
           }
           event.preventDefault();
           break;
@@ -248,10 +219,7 @@ const useTreeViewKeyboardNavigation = ({
       // Selects all the items
       case key === 'a' && ctrlPressed && params.multiSelect && !params.disableSelection:
         {
-          instance.selectRange(event, {
-            start: (0, _tree.getFirstNavigableItem)(instance),
-            end: (0, _tree.getLastNavigableItem)(instance)
-          });
+          instance.selectAllNavigableItems(event);
           event.preventDefault();
           break;
         }

package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.js

@@ -8,16 +8,27 @@ exports.useTreeViewSelection = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _tree = require("../../utils/tree");
+var _useTreeViewSelection = require("./useTreeViewSelection.utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewSelection = ({
   instance,
   params,
   models
 }) => {
   const lastSelectedItem = React.useRef(null);
-  const lastSelectionWasRange = React.useRef(false);
-  const currentRangeSelection = React.useRef([]);
+  const lastSelectedRange = React.useRef({});
+  const selectedItemsMap = React.useMemo(() => {
+    const temp = new Map();
+    if (Array.isArray(models.selectedItems.value)) {
+      models.selectedItems.value.forEach(id => {
+        temp.set(id, true);
+      });
+    } else if (models.selectedItems.value != null) {
+      temp.set(models.selectedItems.value, true);
+    }
+    return temp;
+  }, [models.selectedItems.value]);
   const setSelectedItems = (event, newSelectedItems) => {
     if (params.onItemSelectionToggle) {
       if (params.multiSelect) {
@@ -43,115 +54,90 @@ const useTreeViewSelection = ({
     }
     models.selectedItems.setControlledValue(newSelectedItems);
   };
-  const isItemSelected = itemId => Array.isArray(models.selectedItems.value) ? models.selectedItems.value.indexOf(itemId) !== -1 : models.selectedItems.value === itemId;
+  const isItemSelected = itemId => selectedItemsMap.has(itemId);
   const selectItem = (event, itemId, multiple = false) => {
     if (params.disableSelection) {
       return;
     }
+    let newSelected;
     if (multiple) {
-      if (Array.isArray(models.selectedItems.value)) {
-        let newSelected;
-        if (models.selectedItems.value.indexOf(itemId) !== -1) {
-          newSelected = models.selectedItems.value.filter(id => id !== itemId);
-        } else {
-          newSelected = [itemId].concat(models.selectedItems.value);
-        }
-        setSelectedItems(event, newSelected);
+      const cleanSelectedItems = (0, _useTreeViewSelection.convertSelectedItemsToArray)(models.selectedItems.value);
+      if (instance.isItemSelected(itemId)) {
+        newSelected = cleanSelectedItems.filter(id => id !== itemId);
+      } else {
+        newSelected = [itemId].concat(cleanSelectedItems);
       }
     } else {
-      const newSelected = params.multiSelect ? [itemId] : itemId;
-      setSelectedItems(event, newSelected);
+      newSelected = params.multiSelect ? [itemId] : itemId;
     }
+    setSelectedItems(event, newSelected);
     lastSelectedItem.current = itemId;
-    lastSelectionWasRange.current = false;
-    currentRangeSelection.current = [];
+    lastSelectedRange.current = {};
   };
-  const handleRangeArrowSelect = (event, items) => {
-    let base = models.selectedItems.value.slice();
-    const {
-      start,
-      next,
-      current
-    } = items;
-    if (!next || !current) {
+  const selectRange = (event, [start, end]) => {
+    if (params.disableSelection || !params.multiSelect) {
       return;
     }
-    if (currentRangeSelection.current.indexOf(current) === -1) {
-      currentRangeSelection.current = [];
-    }
-    if (lastSelectionWasRange.current) {
-      if (currentRangeSelection.current.indexOf(next) !== -1) {
-        base = base.filter(id => id === start || id !== current);
-        currentRangeSelection.current = currentRangeSelection.current.filter(id => id === start || id !== current);
-      } else {
-        base.push(next);
-        currentRangeSelection.current.push(next);
-      }
-    } else {
-      base.push(next);
-      currentRangeSelection.current.push(current, next);
+    let newSelectedItems = (0, _useTreeViewSelection.convertSelectedItemsToArray)(models.selectedItems.value).slice();
+
+    // If the last selection was a range selection,
+    // remove the items that were part of the last range from the model
+    if (Object.keys(lastSelectedRange.current).length > 0) {
+      newSelectedItems = newSelectedItems.filter(id => !lastSelectedRange.current[id]);
     }
-    setSelectedItems(event, base);
+
+    // Add to the model the items that are part of the new range and not already part of the model.
+    const selectedItemsLookup = (0, _useTreeViewSelection.getLookupFromArray)(newSelectedItems);
+    const range = (0, _tree.getNonDisabledItemsInRange)(instance, start, end);
+    const itemsToAddToModel = range.filter(id => !selectedItemsLookup[id]);
+    newSelectedItems = newSelectedItems.concat(itemsToAddToModel);
+    setSelectedItems(event, newSelectedItems);
+    lastSelectedRange.current = (0, _useTreeViewSelection.getLookupFromArray)(range);
   };
-  const handleRangeSelect = (event, items) => {
-    let base = models.selectedItems.value.slice();
-    const {
-      start,
-      end
-    } = items;
-    // If last selection was a range selection ignore items that were selected.
-    if (lastSelectionWasRange.current) {
-      base = base.filter(id => currentRangeSelection.current.indexOf(id) === -1);
+  const expandSelectionRange = (event, itemId) => {
+    if (lastSelectedItem.current != null) {
+      const [start, end] = (0, _tree.findOrderInTremauxTree)(instance, itemId, lastSelectedItem.current);
+      selectRange(event, [start, end]);
     }
-    let range = (0, _tree.getNavigableItemsInRange)(instance, start, end);
-    range = range.filter(item => !instance.isItemDisabled(item));
-    currentRangeSelection.current = range;
-    let newSelected = base.concat(range);
-    newSelected = newSelected.filter((id, i) => newSelected.indexOf(id) === i);
-    setSelectedItems(event, newSelected);
   };
-  const selectRange = (event, items, stacked = false) => {
-    if (params.disableSelection) {
+  const selectRangeFromStartToItem = (event, itemId) => {
+    selectRange(event, [(0, _tree.getFirstNavigableItem)(instance), itemId]);
+  };
+  const selectRangeFromItemToEnd = (event, itemId) => {
+    selectRange(event, [itemId, (0, _tree.getLastNavigableItem)(instance)]);
+  };
+  const selectAllNavigableItems = event => {
+    if (params.disableSelection || !params.multiSelect) {
       return;
     }
-    const {
-      start = lastSelectedItem.current,
-      end,
-      current
-    } = items;
-    if (stacked) {
-      handleRangeArrowSelect(event, {
-        start,
-        next: end,
-        current
-      });
-    } else if (start != null && end != null) {
-      handleRangeSelect(event, {
-        start,
-        end
-      });
-    }
-    lastSelectionWasRange.current = true;
+    const navigableItems = (0, _tree.getAllNavigableItems)(instance);
+    setSelectedItems(event, navigableItems);
+    lastSelectedRange.current = (0, _useTreeViewSelection.getLookupFromArray)(navigableItems);
   };
-  const rangeSelectToFirst = (event, itemId) => {
-    if (!lastSelectedItem.current) {
-      lastSelectedItem.current = itemId;
+  const selectItemFromArrowNavigation = (event, currentItem, nextItem) => {
+    if (params.disableSelection || !params.multiSelect) {
+      return;
     }
-    const start = lastSelectionWasRange.current ? lastSelectedItem.current : itemId;
-    instance.selectRange(event, {
-      start,
-      end: (0, _tree.getFirstNavigableItem)(instance)
-    });
-  };
-  const rangeSelectToLast = (event, itemId) => {
-    if (!lastSelectedItem.current) {
-      lastSelectedItem.current = itemId;
+    let newSelectedItems = (0, _useTreeViewSelection.convertSelectedItemsToArray)(models.selectedItems.value).slice();
+    if (Object.keys(lastSelectedRange.current).length === 0) {
+      newSelectedItems.push(nextItem);
+      lastSelectedRange.current = {
+        [currentItem]: true,
+        [nextItem]: true
+      };
+    } else {
+      if (!lastSelectedRange.current[currentItem]) {
+        lastSelectedRange.current = {};
+      }
+      if (lastSelectedRange.current[nextItem]) {
+        newSelectedItems = newSelectedItems.filter(id => id !== currentItem);
+        delete lastSelectedRange.current[currentItem];
+      } else {
+        newSelectedItems.push(nextItem);
+        lastSelectedRange.current[nextItem] = true;
+      }
     }
-    const start = lastSelectionWasRange.current ? lastSelectedItem.current : itemId;
-    instance.selectRange(event, {
-      start,
-      end: (0, _tree.getLastNavigableItem)(instance)
-    });
+    setSelectedItems(event, newSelectedItems);
   };
   return {
     getRootProps: () => ({
@@ -160,9 +146,11 @@ const useTreeViewSelection = ({
     instance: {
       isItemSelected,
       selectItem,
-      selectRange,
-      rangeSelectToLast,
-      rangeSelectToFirst
+      selectAllNavigableItems,
+      expandSelectionRange,
+      selectRangeFromStartToItem,
+      selectRangeFromItemToEnd,
+      selectItemFromArrowNavigation
     },
     contextValue: {
       selection: {

package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getLookupFromArray = exports.convertSelectedItemsToArray = void 0;
+/**
+ * Transform the `selectedItems` model to be an array if it was a string or null.
+ * @param {string[] | string | null} model The raw model.
+ * @returns {string[]} The converted model.
+ */
+const convertSelectedItemsToArray = model => {
+  if (Array.isArray(model)) {
+    return model;
+  }
+  if (model != null) {
+    return [model];
+  }
+  return [];
+};
+exports.convertSelectedItemsToArray = convertSelectedItemsToArray;
+const getLookupFromArray = array => {
+  const lookup = {};
+  array.forEach(itemId => {
+    lookup[itemId] = true;
+  });
+  return lookup;
+};
+exports.getLookupFromArray = getLookupFromArray;

package/node/internals/useTreeView/useTreeView.js

@@ -12,7 +12,7 @@ var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _useTreeViewModels = require("./useTreeViewModels");
 var _corePlugins = require("../corePlugins");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useTreeViewApiInitialization(inputApiRef) {
   const fallbackPublicApiRef = React.useRef({});
   if (inputApiRef) {

package/node/internals/useTreeView/useTreeViewModels.js

@@ -8,7 +8,7 @@ exports.useTreeViewModels = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * Implements the same behavior as `useControlled` but for several models.
  * The controlled models are never stored in the state and the state is only updated if the model is not controlled.