@mui/x-tree-view 7.0.0-beta.4 → 7.0.0-beta.6

package/node/internals/plugins/useTreeViewNodes/useTreeViewNodes.js

@@ -12,13 +12,14 @@ var _useTreeView = require("../../useTreeView/useTreeView.utils");
 var _publishTreeViewEvent = require("../../utils/publishTreeViewEvent");
 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; }
-const updateState = ({
+const updateNodesState = ({
   items,
   isItemDisabled,
   getItemLabel,
   getItemId
 }) => {
   const nodeMap = {};
+  const itemMap = {};
   const processItem = (item, index, parentId) => {
     const id = getItemId ? getItemId(item) : item.id;
     if (id == null) {
@@ -36,10 +37,11 @@ const updateState = ({
       label,
       index,
       parentId,
-      idAttribute: id,
+      idAttribute: undefined,
       expandable: !!item.children?.length,
       disabled: isItemDisabled ? isItemDisabled(item) : false
     };
+    itemMap[id] = item;
     return {
       id,
       children: item.children?.map((child, childIndex) => processItem(child, childIndex, id))
@@ -48,16 +50,19 @@ const updateState = ({
   const nodeTree = items.map((item, itemIndex) => processItem(item, itemIndex, null));
   return {
     nodeMap,
-    nodeTree
+    nodeTree,
+    itemMap
   };
 };
 const useTreeViewNodes = ({
   instance,
+  publicAPI,
   params,
   state,
   setState
 }) => {
-  const getNode = React.useCallback(nodeId => state.nodeMap[nodeId], [state.nodeMap]);
+  const getNode = React.useCallback(nodeId => state.nodes.nodeMap[nodeId], [state.nodes.nodeMap]);
+  const getItem = React.useCallback(nodeId => state.nodes.itemMap[nodeId], [state.nodes.itemMap]);
   const isNodeDisabled = React.useCallback(nodeId => {
     if (nodeId == null) {
       return false;
@@ -79,7 +84,7 @@ const useTreeViewNodes = ({
     }
     return false;
   }, [instance]);
-  const getChildrenIds = (0, _useEventCallback.default)(nodeId => Object.values(state.nodeMap).filter(node => node.parentId === nodeId).sort((a, b) => a.index - b.index).map(child => child.id));
+  const getChildrenIds = (0, _useEventCallback.default)(nodeId => Object.values(state.nodes.nodeMap).filter(node => node.parentId === nodeId).sort((a, b) => a.index - b.index).map(child => child.id));
   const getNavigableChildrenIds = nodeId => {
     let childrenIds = instance.getChildrenIds(nodeId);
     if (!params.disabledItemsFocusable) {
@@ -89,20 +94,22 @@ const useTreeViewNodes = ({
   };
   React.useEffect(() => {
     setState(prevState => {
-      const newState = updateState({
+      const newState = updateNodesState({
         items: params.items,
         isItemDisabled: params.isItemDisabled,
         getItemId: params.getItemId,
         getItemLabel: params.getItemLabel
       });
-      Object.values(prevState.nodeMap).forEach(node => {
+      Object.values(prevState.nodes.nodeMap).forEach(node => {
         if (!newState.nodeMap[node.id]) {
           (0, _publishTreeViewEvent.publishTreeViewEvent)(instance, 'removeNode', {
             id: node.id
           });
         }
       });
-      return (0, _extends2.default)({}, prevState, newState);
+      return (0, _extends2.default)({}, prevState, {
+        nodes: newState
+      });
     });
   }, [instance, setState, params.items, params.isItemDisabled, params.getItemId, params.getItemLabel]);
   const getNodesToRender = (0, _useEventCallback.default)(() => {
@@ -110,7 +117,7 @@ const useTreeViewNodes = ({
       id,
       children
     }) => {
-      const node = state.nodeMap[id];
+      const node = state.nodes.nodeMap[id];
       return {
         label: node.label,
         nodeId: node.id,
@@ -118,15 +125,19 @@ const useTreeViewNodes = ({
         children: children?.map(getPropsFromNodeId)
       };
     };
-    return state.nodeTree.map(getPropsFromNodeId);
+    return state.nodes.nodeTree.map(getPropsFromNodeId);
   });
   (0, _useTreeView.populateInstance)(instance, {
     getNode,
+    getItem,
     getNodesToRender,
     getChildrenIds,
     getNavigableChildrenIds,
     isNodeDisabled
   });
+  (0, _useTreeView.populatePublicAPI)(publicAPI, {
+    getItem
+  });
   return {
     contextValue: {
       disabledItemsFocusable: params.disabledItemsFocusable
@@ -134,11 +145,13 @@ const useTreeViewNodes = ({
   };
 };
 exports.useTreeViewNodes = useTreeViewNodes;
-useTreeViewNodes.getInitialState = params => updateState({
-  items: params.items,
-  isItemDisabled: params.isItemDisabled,
-  getItemId: params.getItemId,
-  getItemLabel: params.getItemLabel
+useTreeViewNodes.getInitialState = params => ({
+  nodes: updateNodesState({
+    items: params.items,
+    isItemDisabled: params.isItemDisabled,
+    getItemId: params.getItemId,
+    getItemLabel: params.getItemLabel
+  })
 });
 useTreeViewNodes.getDefaultizedParams = params => (0, _extends2.default)({}, params, {
   disabledItemsFocusable: params.disabledItemsFocusable ?? false

package/node/internals/useTreeView/useTreeView.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useTreeView = void 0;
+exports.useTreeViewApiInitialization = useTreeViewApiInitialization;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
@@ -12,6 +13,16 @@ 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 useTreeViewApiInitialization(inputApiRef) {
+  const fallbackPublicApiRef = React.useRef({});
+  if (inputApiRef) {
+    if (inputApiRef.current == null) {
+      inputApiRef.current = {};
+    }
+    return inputApiRef.current;
+  }
+  return fallbackPublicApiRef.current;
+}
 const useTreeView = inParams => {
   const plugins = [..._corePlugins.TREE_VIEW_CORE_PLUGINS, ...inParams.plugins];
   const params = plugins.reduce((acc, plugin) => {
@@ -23,6 +34,7 @@ const useTreeView = inParams => {
   const models = (0, _useTreeViewModels.useTreeViewModels)(plugins, params);
   const instanceRef = React.useRef({});
   const instance = instanceRef.current;
+  const publicAPI = useTreeViewApiInitialization(inParams.apiRef);
   const innerRootRef = React.useRef(null);
   const handleRootRef = (0, _useForkRef.default)(innerRootRef, inParams.rootRef);
   const [state, setState] = React.useState(() => {
@@ -41,6 +53,7 @@ const useTreeView = inParams => {
   const runPlugin = plugin => {
     const pluginResponse = plugin({
       instance,
+      publicAPI,
       params,
       slots: params.slots,
       slotProps: params.slotProps,

package/node/internals/useTreeView/useTreeView.utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.populateInstance = exports.getPreviousNode = exports.getNextNode = exports.getLastNode = exports.getFirstNode = void 0;
+exports.populatePublicAPI = exports.populateInstance = exports.getPreviousNode = exports.getNextNode = exports.getLastNode = exports.getFirstNode = void 0;
 const getPreviousNode = (instance, nodeId) => {
   const node = instance.getNode(nodeId);
   const siblings = instance.getNavigableChildrenIds(node.parentId);
@@ -51,4 +51,8 @@ exports.getFirstNode = getFirstNode;
 const populateInstance = (instance, methods) => {
   Object.assign(instance, methods);
 };
-exports.populateInstance = populateInstance;
+exports.populateInstance = populateInstance;
+const populatePublicAPI = (publicAPI, methods) => {
+  Object.assign(publicAPI, methods);
+};
+exports.populatePublicAPI = populatePublicAPI;

package/node/internals/utils/extractPluginParamsFromProps.js

@@ -6,12 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.extractPluginParamsFromProps = void 0;
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-const _excluded = ["slots", "slotProps"];
+const _excluded = ["slots", "slotProps", "apiRef"];
 const extractPluginParamsFromProps = _ref => {
   let {
       props: {
         slots,
-        slotProps
+        slotProps,
+        apiRef
       },
       plugins,
       rootRef
@@ -25,7 +26,8 @@ const extractPluginParamsFromProps = _ref => {
     plugins,
     rootRef,
     slots: slots ?? {},
-    slotProps: slotProps ?? {}
+    slotProps: slotProps ?? {},
+    apiRef
   };
   const otherProps = {};
   Object.keys(props).forEach(propName => {

package/node/internals/utils/utils.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getActiveElement = void 0;
+const getActiveElement = (root = document) => {
+  const activeEl = root.activeElement;
+  if (!activeEl) {
+    return null;
+  }
+  if (activeEl.shadowRoot) {
+    return getActiveElement(activeEl.shadowRoot);
+  }
+  return activeEl;
+};
+exports.getActiveElement = getActiveElement;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-tree-view",
-  "version": "7.0.0-beta.4",
+  "version": "7.0.0-beta.6",
   "description": "The community edition of the tree view components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -32,7 +32,7 @@
     "directory": "packages/x-tree-view"
   },
   "dependencies": {
-    "@babel/runtime": "^7.23.9",
+    "@babel/runtime": "^7.24.0",
     "@mui/base": "^5.0.0-beta.36",
     "@mui/system": "^5.15.9",
     "@mui/utils": "^5.15.9",