@mui/x-tree-view/internals/TreeViewProvider/TreeViewChildrenItemProvider.js

The community edition of the MUI X Tree View components.

"use strict";
'use client';

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TreeViewChildrenItemContext = void 0;
exports.TreeViewChildrenItemProvider = TreeViewChildrenItemProvider;
var React = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _TreeViewContext = require("./TreeViewContext");
var _utils = require("../utils/utils");
var _useTreeViewItems = require("../plugins/useTreeViewItems/useTreeViewItems.selectors");
var _jsxRuntime = require("react/jsx-runtime");
const TreeViewChildrenItemContext = exports.TreeViewChildrenItemContext = /*#__PURE__*/React.createContext(null);
if (process.env.NODE_ENV !== "production") TreeViewChildrenItemContext.displayName = "TreeViewChildrenItemContext";
function TreeViewChildrenItemProvider(props) {
  const {
    children,
    itemId = null,
    idAttribute
  } = props;
  const {
    instance,
    store,
    rootRef
  } = (0, _TreeViewContext.useTreeViewContext)();
  const childrenIdAttrToIdRef = React.useRef(new Map());
  React.useEffect(() => {
    if (!rootRef.current) {
      return;
    }
    const previousChildrenIds = _useTreeViewItems.itemsSelectors.itemOrderedChildrenIds(store.state, itemId ?? null) ?? [];
    const escapedIdAttr = (0, _utils.escapeOperandAttributeSelector)(idAttribute ?? rootRef.current.id);

    // If collapsed, skip childrenIds update prevents clearing the parent's indeterminate state after opening a sibling.
    if (itemId != null) {
      const itemRoot = rootRef.current.querySelector(`*[id="${escapedIdAttr}"][role="treeitem"]`);
      if (itemRoot && itemRoot.getAttribute('aria-expanded') === 'false') {
        return;
      }
    }
    const childrenElements = rootRef.current.querySelectorAll(`${itemId == null ? '' : `*[id="${escapedIdAttr}"] `}[role="treeitem"]:not(*[id="${escapedIdAttr}"] [role="treeitem"] [role="treeitem"])`);
    const childrenIds = Array.from(childrenElements).map(child => childrenIdAttrToIdRef.current.get(child.id));
    const hasChanged = childrenIds.length !== previousChildrenIds.length || childrenIds.some((childId, index) => childId !== previousChildrenIds[index]);
    if (hasChanged) {
      instance.setJSXItemsOrderedChildrenIds(itemId ?? null, childrenIds);
    }
  });
  const value = React.useMemo(() => ({
    registerChild: (childIdAttribute, childItemId) => childrenIdAttrToIdRef.current.set(childIdAttribute, childItemId),
    unregisterChild: childIdAttribute => childrenIdAttrToIdRef.current.delete(childIdAttribute),
    parentId: itemId
  }), [itemId]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TreeViewChildrenItemContext.Provider, {
    value: value,
    children: children
  });
}
process.env.NODE_ENV !== "production" ? TreeViewChildrenItemProvider.propTypes = {
  children: _propTypes.default.node,
  id: _propTypes.default.string
} : void 0;