@mui/x-tree-view 8.21.0 → 8.23.0

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.useTreeViewExpansion = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _useAssertModelConsistency = require("@mui/x-internals/useAssertModelConsistency");
-var _useEventCallback = require("@base-ui-components/utils/useEventCallback");
-var _useIsoLayoutEffect = require("@base-ui-components/utils/useIsoLayoutEffect");
+var _useStableCallback = require("@base-ui/utils/useStableCallback");
+var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _useTreeViewExpansion = require("./useTreeViewExpansion.selectors");
 var _useTreeViewExpansion2 = require("./useTreeViewExpansion.utils");
 var _useTreeViewItems = require("../useTreeViewItems/useTreeViewItems.selectors");
@@ -44,10 +44,10 @@ const useTreeViewExpansion = ({
     }
     params.onExpandedItemsChange?.(event, value);
   };
-  const resetItemExpansion = (0, _useEventCallback.useEventCallback)(() => {
+  const resetItemExpansion = (0, _useStableCallback.useStableCallback)(() => {
     setExpandedItems(null, []);
   });
-  const applyItemExpansion = (0, _useEventCallback.useEventCallback)(({
+  const applyItemExpansion = (0, _useStableCallback.useStableCallback)(({
     itemId,
     event,
     shouldBeExpanded
@@ -64,7 +64,7 @@ const useTreeViewExpansion = ({
     }
     setExpandedItems(event, newExpanded);
   });
-  const setItemExpansion = (0, _useEventCallback.useEventCallback)(({
+  const setItemExpansion = (0, _useStableCallback.useStableCallback)(({
     itemId,
     event = null,
     shouldBeExpanded
@@ -90,7 +90,7 @@ const useTreeViewExpansion = ({
       shouldBeExpanded: cleanShouldBeExpanded
     });
   });
-  const isItemExpanded = (0, _useEventCallback.useEventCallback)(itemId => {
+  const isItemExpanded = (0, _useStableCallback.useStableCallback)(itemId => {
     return _useTreeViewExpansion.expansionSelectors.isItemExpanded(store.state, itemId);
   });
   const expandAllSiblings = (event, itemId) => {

package/internals/plugins/useTreeViewFocus/useTreeViewFocus.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useTreeViewFocus = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _useEventCallback = require("@base-ui-components/utils/useEventCallback");
+var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _store = require("@mui/x-internals/store");
 var _useTreeViewFocus = require("./useTreeViewFocus.selectors");
 var _useTreeViewExpansion = require("../useTreeViewExpansion/useTreeViewExpansion.selectors");
@@ -16,7 +16,7 @@ const useTreeViewFocus = ({
   params,
   store
 }) => {
-  const setFocusedItemId = (0, _useEventCallback.useEventCallback)(itemId => {
+  const setFocusedItemId = (0, _useStableCallback.useStableCallback)(itemId => {
     const focusedItemId = _useTreeViewFocus.focusSelectors.focusedItemId(store.state);
     if (focusedItemId === itemId) {
       return;
@@ -39,13 +39,13 @@ const useTreeViewFocus = ({
       params.onItemFocus(event, itemId);
     }
   };
-  const focusItem = (0, _useEventCallback.useEventCallback)((event, itemId) => {
+  const focusItem = (0, _useStableCallback.useStableCallback)((event, itemId) => {
     // If we receive an itemId, and it is visible, the focus will be set to it
     if (isItemVisible(itemId)) {
       innerFocusItem(event, itemId);
     }
   });
-  const removeFocusedItem = (0, _useEventCallback.useEventCallback)(() => {
+  const removeFocusedItem = (0, _useStableCallback.useStableCallback)(() => {
     const focusedItemId = _useTreeViewFocus.focusSelectors.focusedItemId(store.state);
     if (focusedItemId == null) {
       return;

package/internals/plugins/useTreeViewItems/useTreeViewItems.js

@@ -9,13 +9,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.useTreeViewItems = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _useEventCallback = require("@base-ui-components/utils/useEventCallback");
+var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _useTreeViewItems = require("./useTreeViewItems.utils");
 var _TreeViewItemDepthContext = require("../../TreeViewItemDepthContext");
 var _useTreeViewItems2 = require("./useTreeViewItems.selectors");
 var _useTreeViewId = require("../../corePlugins/useTreeViewId");
 var _useTreeViewId2 = require("../../corePlugins/useTreeViewId/useTreeViewId.utils");
 var _jsxRuntime = require("react/jsx-runtime");
+const defaultIsItemSelectionDisabled = item => item.disableSelection === true;
 const useTreeViewItems = ({
   instance,
   params,
@@ -23,16 +24,17 @@ const useTreeViewItems = ({
 }) => {
   const itemsConfig = React.useMemo(() => ({
     isItemDisabled: params.isItemDisabled,
+    isItemSelectionDisabled: params.isItemSelectionDisabled,
     getItemLabel: params.getItemLabel,
     getItemChildren: params.getItemChildren,
     getItemId: params.getItemId
-  }), [params.isItemDisabled, params.getItemLabel, params.getItemChildren, params.getItemId]);
+  }), [params.isItemDisabled, params.isItemSelectionDisabled, params.getItemLabel, params.getItemChildren, params.getItemId]);
   const getItem = React.useCallback(itemId => _useTreeViewItems2.itemsSelectors.itemModel(store.state, itemId), [store]);
   const getParentId = React.useCallback(itemId => {
     const itemMeta = _useTreeViewItems2.itemsSelectors.itemMeta(store.state, itemId);
     return itemMeta?.parentId || null;
   }, [store]);
-  const setIsItemDisabled = (0, _useEventCallback.useEventCallback)(({
+  const setIsItemDisabled = (0, _useStableCallback.useStableCallback)(({
     itemId,
     shouldBeDisabled
   }) => {
@@ -111,7 +113,7 @@ const useTreeViewItems = ({
     };
     store.set('items', (0, _extends2.default)({}, store.state.items, lookups));
   };
-  const removeChildren = (0, _useEventCallback.useEventCallback)(parentId => {
+  const removeChildren = (0, _useStableCallback.useStableCallback)(parentId => {
     const newMetaMap = Object.keys(store.state.items.itemMetaLookup).reduce((acc, key) => {
       const item = store.state.items.itemMetaLookup[key];
       if (item.parentId === parentId) {
@@ -132,7 +134,7 @@ const useTreeViewItems = ({
       itemChildrenIndexesLookup: newItemChildrenIndexesLookup
     }));
   });
-  const addExpandableItems = (0, _useEventCallback.useEventCallback)(items => {
+  const addExpandableItems = (0, _useStableCallback.useStableCallback)(items => {
     const newItemMetaLookup = (0, _extends2.default)({}, store.state.items.itemMetaLookup);
     for (const itemId of items) {
       newItemMetaLookup[itemId] = (0, _extends2.default)({}, newItemMetaLookup[itemId], {
@@ -155,8 +157,8 @@ const useTreeViewItems = ({
     store.set('items', (0, _extends2.default)({}, store.state.items, newState));
   }, [instance, store, params.items, params.disabledItemsFocusable, itemsConfig]);
 
-  // Wrap `props.onItemClick` with `useEventCallback` to prevent unneeded context updates.
-  const handleItemClick = (0, _useEventCallback.useEventCallback)((event, itemId) => {
+  // Wrap `props.onItemClick` with `useStableCallback` to prevent unneeded context updates.
+  const handleItemClick = (0, _useStableCallback.useStableCallback)((event, itemId) => {
     if (params.onItemClick) {
       params.onItemClick(event, itemId);
     }
@@ -193,6 +195,7 @@ useTreeViewItems.getInitialState = params => ({
     disabledItemsFocusable: params.disabledItemsFocusable,
     config: {
       isItemDisabled: params.isItemDisabled,
+      isItemSelectionDisabled: params.isItemSelectionDisabled,
       getItemId: params.getItemId,
       getItemLabel: params.getItemLabel,
       getItemChildren: params.getItemChildren
@@ -203,7 +206,8 @@ useTreeViewItems.applyDefaultValuesToParams = ({
   params
 }) => (0, _extends2.default)({}, params, {
   disabledItemsFocusable: params.disabledItemsFocusable ?? false,
-  itemChildrenIndentation: params.itemChildrenIndentation ?? '12px'
+  itemChildrenIndentation: params.itemChildrenIndentation ?? '12px',
+  isItemSelectionDisabled: params.isItemSelectionDisabled ?? defaultIsItemSelectionDisabled
 });
 useTreeViewItems.wrapRoot = ({
   children
@@ -218,6 +222,7 @@ useTreeViewItems.params = {
   disabledItemsFocusable: true,
   items: true,
   isItemDisabled: true,
+  isItemSelectionDisabled: true,
   getItemLabel: true,
   getItemChildren: true,
   getItemId: true,

package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts

@@ -53,4 +53,8 @@ export declare const itemsSelectors: {
    * Checks whether an item can be focused.
    */
   canItemBeFocused: (state: TreeViewState<[UseTreeViewItemsSignature]>, itemId: string) => boolean;
+  /**
+   * Checks whether an item is selectable based on the `isItemSelectionDisabled` prop.
+   */
+  isItemSelectable: (state: TreeViewState<[UseTreeViewItemsSignature]>, itemId: string) => boolean;
 };

package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js

@@ -62,5 +62,9 @@ const itemsSelectors = exports.itemsSelectors = {
   /**
    * Checks whether an item can be focused.
    */
-  canItemBeFocused: (0, _store.createSelector)((state, itemId) => state.items.disabledItemsFocusable || !(0, _useTreeViewItems.isItemDisabled)(state.items.itemMetaLookup, itemId))
+  canItemBeFocused: (0, _store.createSelector)((state, itemId) => state.items.disabledItemsFocusable || !(0, _useTreeViewItems.isItemDisabled)(state.items.itemMetaLookup, itemId)),
+  /**
+   * Checks whether an item is selectable based on the `isItemSelectionDisabled` prop.
+   */
+  isItemSelectable: (0, _store.createSelector)((state, itemId) => state.items.itemMetaLookup[itemId]?.selectable ?? true)
 };

package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts

@@ -100,6 +100,13 @@ export interface UseTreeViewItemsParameters<R extends {
    * @returns {boolean} `true` if the item should be disabled.
    */
   isItemDisabled?: (item: R) => boolean;
+  /**
+   * Used to determine if a given item should have selection disabled.
+   * @template R
+   * @param {R} item The item to check.
+   * @returns {boolean} `true` if the item should have selection disabled.
+   */
+  isItemSelectionDisabled?: (item: R) => boolean;
   /**
    * Used to determine the string label for a given item.
    *

package/internals/plugins/useTreeViewItems/useTreeViewItems.utils.d.ts

@@ -45,5 +45,5 @@ interface BuildItemsLookupsParameters {
     [itemId: string]: TreeViewItemMeta;
   };
 }
-export interface BuildItemsLookupConfig extends Pick<UseTreeViewItemsParametersWithDefaults<TreeViewBaseItem>, 'isItemDisabled' | 'getItemLabel' | 'getItemChildren' | 'getItemId'> {}
+export interface BuildItemsLookupConfig extends Pick<UseTreeViewItemsParametersWithDefaults<TreeViewBaseItem>, 'isItemDisabled' | 'isItemSelectionDisabled' | 'getItemLabel' | 'getItemChildren' | 'getItemId'> {}
 export {};

package/internals/plugins/useTreeViewItems/useTreeViewItems.utils.js

@@ -131,6 +131,7 @@ function buildItemsLookups(parameters) {
       idAttribute: undefined,
       expandable: isItemExpandable(item, children),
       disabled: config.isItemDisabled ? config.isItemDisabled(item) : false,
+      selectable: config.isItemSelectionDisabled ? !config.isItemSelectionDisabled(item) : true,
       depth
     };
     orderedChildrenIds.push(id);

package/internals/plugins/useTreeViewJSXItems/itemPlugin.js

@@ -8,8 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.useTreeViewJSXItemsItemPlugin = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _store = require("@mui/x-internals/store");
-var _useMergedRefs = require("@base-ui-components/utils/useMergedRefs");
-var _useIsoLayoutEffect = require("@base-ui-components/utils/useIsoLayoutEffect");
+var _useMergedRefs = require("@base-ui/utils/useMergedRefs");
+var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _TreeViewProvider = require("../../TreeViewProvider");
 var _TreeViewChildrenItemProvider = require("../../TreeViewProvider/TreeViewChildrenItemProvider");
 var _useTreeItemUtils = require("../../../hooks/useTreeItemUtils/useTreeItemUtils");
@@ -27,6 +27,7 @@ const useTreeViewJSXItemsItemPlugin = ({
   const {
     children,
     disabled = false,
+    disableSelection = false,
     label,
     itemId,
     id
@@ -64,9 +65,10 @@ const useTreeViewJSXItemsItemPlugin = ({
       idAttribute: id,
       parentId,
       expandable,
-      disabled
+      disabled,
+      selectable: !disableSelection
     });
-  }, [instance, parentId, itemId, expandable, disabled, id]);
+  }, [instance, parentId, itemId, expandable, disabled, disableSelection, id]);
   React.useEffect(() => {
     if (label) {
       return instance.mapLabelFromJSX(itemId, (pluginContentRef.current?.textContent ?? '').toLowerCase());

package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useTreeViewJSXItems = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _useEventCallback = require("@base-ui-components/utils/useEventCallback");
+var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _TreeViewChildrenItemProvider = require("../../TreeViewProvider/TreeViewChildrenItemProvider");
 var _useTreeViewItems = require("../useTreeViewItems/useTreeViewItems.utils");
 var _TreeViewItemDepthContext = require("../../TreeViewItemDepthContext");
@@ -20,7 +20,7 @@ const useTreeViewJSXItems = ({
   store
 }) => {
   instance.preventItemUpdates();
-  const insertJSXItem = (0, _useEventCallback.useEventCallback)(item => {
+  const insertJSXItem = (0, _useStableCallback.useStableCallback)(item => {
     if (store.state.items.itemMetaLookup[item.id] != null) {
       throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
     }
@@ -58,7 +58,7 @@ const useTreeViewJSXItems = ({
       })
     }));
   };
-  const mapLabelFromJSX = (0, _useEventCallback.useEventCallback)((itemId, label) => {
+  const mapLabelFromJSX = (0, _useStableCallback.useStableCallback)((itemId, label) => {
     instance.updateLabelMap(labelMap => {
       labelMap[itemId] = label;
       return labelMap;

package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js

@@ -9,8 +9,8 @@ exports.useTreeViewKeyboardNavigation = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _store = require("@mui/x-internals/store");
 var _RtlProvider = require("@mui/system/RtlProvider");
-var _useTimeout = require("@base-ui-components/utils/useTimeout");
-var _useEventCallback = require("@base-ui-components/utils/useEventCallback");
+var _useTimeout = require("@base-ui/utils/useTimeout");
+var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _tree = require("../../utils/tree");
 var _plugins = require("../../utils/plugins");
 var _useTreeViewLabel = require("../useTreeViewLabel");
@@ -31,7 +31,7 @@ const useTreeViewKeyboardNavigation = ({
   const labelMap = React.useRef({});
   const typeaheadQueryRef = React.useRef('');
   const typeaheadTimeout = (0, _useTimeout.useTimeout)();
-  const updateLabelMap = (0, _useEventCallback.useEventCallback)(callback => {
+  const updateLabelMap = (0, _useStableCallback.useStableCallback)(callback => {
     labelMap.current = callback(labelMap.current);
   });
   const itemMetaLookup = (0, _store.useStore)(store, _useTreeViewItems.itemsSelectors.itemMetaLookup);
@@ -91,7 +91,7 @@ const useTreeViewKeyboardNavigation = ({
     typeaheadQueryRef.current = '';
     return null;
   };
-  const canToggleItemSelection = itemId => _useTreeViewSelection.selectionSelectors.enabled(store.state) && !_useTreeViewItems.itemsSelectors.isItemDisabled(store.state, itemId);
+  const canToggleItemSelection = itemId => _useTreeViewSelection.selectionSelectors.canItemBeSelected(store.state, itemId);
   const canToggleItemExpansion = itemId => {
     return !_useTreeViewItems.itemsSelectors.isItemDisabled(store.state, itemId) && _useTreeViewExpansion.expansionSelectors.isItemExpandable(store.state, itemId);
   };

package/internals/plugins/useTreeViewLabel/useTreeViewLabel.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useTreeViewLabel = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _useIsoLayoutEffect = require("@base-ui-components/utils/useIsoLayoutEffect");
+var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _itemPlugin = require("./itemPlugin");
 var _useTreeViewLabel = require("./useTreeViewLabel.selectors");
 const useTreeViewLabel = ({

package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts

@@ -30,10 +30,10 @@ export interface UseTreeViewLazyLoadingPublicAPI {
    * Method used for updating an item's children.
    * Only relevant for lazy-loaded tree views.
    *
-   * @param {TreeViewItemId} itemId The The id of the item to update the children of.
+   * @param {TreeViewItemId | null} itemId The id of the item to update the children of. If null is passed, it will update the root's children.
    * @returns {Promise<void>} The promise resolved when the items are fetched.
    */
-  updateItemChildren: (itemId: TreeViewItemId) => Promise<void>;
+  updateItemChildren: (itemId: TreeViewItemId | null) => Promise<void>;
 }
 export interface UseTreeViewLazyLoadingInstance extends UseTreeViewLazyLoadingPublicAPI {
   /**

package/internals/plugins/useTreeViewSelection/itemPlugin.js

@@ -50,9 +50,9 @@ const useTreeViewSelectionItemPlugin = ({
     store
   } = (0, _TreeViewProvider.useTreeViewContext)();
   const isCheckboxSelectionEnabled = (0, _store.useStore)(store, _useTreeViewSelection.selectionSelectors.isCheckboxSelectionEnabled);
-  const isItemSelectionEnabled = (0, _store.useStore)(store, _useTreeViewSelection.selectionSelectors.canItemBeSelected, itemId);
+  const isFeatureEnabledForItem = (0, _store.useStore)(store, _useTreeViewSelection.selectionSelectors.isFeatureEnabledForItem, itemId);
+  const canItemBeSelected = (0, _store.useStore)(store, _useTreeViewSelection.selectionSelectors.canItemBeSelected, itemId);
   const selectionStatus = (0, _store.useStore)(store, selectorCheckboxSelectionStatus, itemId);
-  const isSelectionEnabledForItem = (0, _store.useStore)(store, _useTreeViewSelection.selectionSelectors.canItemBeSelected, itemId);
   return {
     propsEnhancers: {
       root: () => {
@@ -63,7 +63,7 @@ const useTreeViewSelectionItemPlugin = ({
           ariaChecked = true;
         } else if (selectionStatus === 'indeterminate') {
           ariaChecked = 'mixed';
-        } else if (!isSelectionEnabledForItem) {
+        } else if (!canItemBeSelected) {
           // - if the tree contains nodes that are not selectable, aria-checked is not present on those nodes.
           ariaChecked = undefined;
         } else {
@@ -91,8 +91,8 @@ const useTreeViewSelectionItemPlugin = ({
         return {
           tabIndex: -1,
           onChange: handleChange,
-          visible: isCheckboxSelectionEnabled,
-          disabled: !isItemSelectionEnabled,
+          visible: isCheckboxSelectionEnabled && isFeatureEnabledForItem,
+          disabled: !canItemBeSelected,
           checked: selectionStatus === 'checked',
           indeterminate: selectionStatus === 'indeterminate'
         };

package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js

@@ -9,10 +9,11 @@ exports.useTreeViewSelection = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _useAssertModelConsistency = require("@mui/x-internals/useAssertModelConsistency");
-var _useIsoLayoutEffect = require("@base-ui-components/utils/useIsoLayoutEffect");
+var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _tree = require("../../utils/tree");
 var _useTreeViewSelection = require("./useTreeViewSelection.utils");
 var _useTreeViewSelection2 = require("./useTreeViewSelection.selectors");
+var _useTreeViewItems = require("../useTreeViewItems/useTreeViewItems.selectors");
 var _itemPlugin = require("./itemPlugin");
 const useTreeViewSelection = ({
   store,
@@ -123,7 +124,7 @@ const useTreeViewSelection = ({
 
     // 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)(store.state, start, end);
+    const range = (0, _tree.getNonDisabledItemsInRange)(store.state, start, end).filter(id => _useTreeViewItems.itemsSelectors.isItemSelectable(store.state, id));
     const itemsToAddToModel = range.filter(id => !selectedItemsLookup[id]);
     newSelectedItems = newSelectedItems.concat(itemsToAddToModel);
     setSelectedItems(event, newSelectedItems);

package/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.d.ts

@@ -34,7 +34,12 @@ export declare const selectionSelectors: {
    */
   isItemSelected: (args_0: import("../../corePlugins/useTreeViewId/useTreeViewId.types.js").UseTreeViewIdState & import("./useTreeViewSelection.types.js").UseTreeViewSelectionState & Partial<{}>, itemId: string) => boolean;
   /**
-   * Checks whether an item can be selected (if selection is enabled and if the item is not disabled).
+   * Checks whether the selection feature is enabled for an item.
+   * Returns `true` when selection is enabled on the Tree View and the item is selectable (even if the item is disabled).
+   */
+  isFeatureEnabledForItem: (args_0: import("../../corePlugins/useTreeViewId/useTreeViewId.types.js").UseTreeViewIdState & import("./useTreeViewSelection.types.js").UseTreeViewSelectionState & Partial<{}>, _itemId: string) => boolean;
+  /**
+   * Checks whether an item can be selected (if selection is enabled, if the item is not disabled, and if the item is selectable).
    */
   canItemBeSelected: (args_0: import("../../corePlugins/useTreeViewId/useTreeViewId.types.js").UseTreeViewIdState & import("./useTreeViewSelection.types.js").UseTreeViewSelectionState & Partial<{}>, _itemId: string) => boolean;
 };

package/internals/plugins/useTreeViewSelection/useTreeViewSelection.selectors.js

@@ -56,7 +56,12 @@ const selectionSelectors = exports.selectionSelectors = {
    */
   isItemSelected: (0, _store.createSelector)(selectedItemsMapSelector, (selectedItemsMap, itemId) => selectedItemsMap.has(itemId)),
   /**
-   * Checks whether an item can be selected (if selection is enabled and if the item is not disabled).
+   * Checks whether the selection feature is enabled for an item.
+   * Returns `true` when selection is enabled on the Tree View and the item is selectable (even if the item is disabled).
    */
-  canItemBeSelected: (0, _store.createSelector)(_useTreeViewItems.itemsSelectors.isItemDisabled, state => state.selection.isEnabled, (isItemDisabled, isSelectionEnabled, _itemId) => isSelectionEnabled && !isItemDisabled)
+  isFeatureEnabledForItem: (0, _store.createSelector)(_useTreeViewItems.itemsSelectors.isItemSelectable, state => state.selection.isEnabled, (isItemSelectable, isSelectionEnabled, _itemId) => isSelectionEnabled && isItemSelectable),
+  /**
+   * Checks whether an item can be selected (if selection is enabled, if the item is not disabled, and if the item is selectable).
+   */
+  canItemBeSelected: (0, _store.createSelector)(_useTreeViewItems.itemsSelectors.isItemDisabled, _useTreeViewItems.itemsSelectors.isItemSelectable, state => state.selection.isEnabled, (isItemDisabled, isItemSelectable, isSelectionEnabled, _itemId) => isSelectionEnabled && !isItemDisabled && isItemSelectable)
 };

package/internals/useTreeView/useTreeView.js

@@ -9,9 +9,9 @@ exports.useTreeView = void 0;
 exports.useTreeViewApiInitialization = useTreeViewApiInitialization;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _useRefWithInit = require("@base-ui-components/utils/useRefWithInit");
+var _useRefWithInit = require("@base-ui/utils/useRefWithInit");
 var _store = require("@mui/x-internals/store");
-var _useMergedRefs = require("@base-ui-components/utils/useMergedRefs");
+var _useMergedRefs = require("@base-ui/utils/useMergedRefs");
 var _corePlugins = require("../corePlugins");
 var _useExtractPluginParamsFromProps = require("./useExtractPluginParamsFromProps");
 var _useTreeViewBuildContext = require("./useTreeViewBuildContext");

package/models/items.d.ts

@@ -4,9 +4,12 @@ export type TreeViewDefaultItemModelProperties = {
   label: string;
   children?: TreeViewDefaultItemModelProperties[];
 };
-export type TreeViewBaseItem<R extends {} = TreeViewDefaultItemModelProperties> = R & {
+export type TreeViewBaseItem<R extends object = TreeViewDefaultItemModelProperties> = R & {
   children?: TreeViewBaseItem<R>[];
 };
+export type TreeViewValidItem<R extends object> = {
+  children?: R[];
+};
 export type TreeViewItemsReorderingAction = 'reorder-above' | 'reorder-below' | 'make-child' | 'move-to-parent';
 export interface TreeViewSelectionPropagation {
   descendants?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-tree-view",
-  "version": "8.21.0",
+  "version": "8.23.0",
   "author": "MUI Team",
   "description": "The community edition of the MUI X Tree View components.",
   "license": "MIT",
@@ -32,13 +32,13 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.28.4",
-    "@base-ui-components/utils": "0.1.2",
+    "@base-ui/utils": "^0.2.3",
     "@mui/utils": "^7.3.5",
     "@types/react-transition-group": "^4.4.12",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
-    "@mui/x-internals": "8.21.0"
+    "@mui/x-internals": "8.23.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/useTreeItem/useTreeItem.js

@@ -11,7 +11,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _store = require("@mui/x-internals/store");
 var _extractEventHandlers = _interopRequireDefault(require("@mui/utils/extractEventHandlers"));
-var _useMergedRefs = require("@base-ui-components/utils/useMergedRefs");
+var _useMergedRefs = require("@base-ui/utils/useMergedRefs");
 var _TreeViewProvider = require("../internals/TreeViewProvider");
 var _useTreeItemUtils = require("../hooks/useTreeItemUtils");
 var _TreeViewItemDepthContext = require("../internals/TreeViewItemDepthContext");

package/useTreeItem/useTreeItem.types.d.ts

@@ -18,6 +18,11 @@ export interface UseTreeItemParameters {
    * @default false
    */
   disabled?: boolean;
+  /**
+   * If `true`, the item cannot be selected.
+   * @default false
+   */
+  disableSelection?: boolean;
   /**
    * The id of the item.
    * Must be unique.