@mui/x-tree-view/internals/components/RichTreeViewItems.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.RichTreeViewItems = RichTreeViewItems;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));
var _useSlotProps2 = _interopRequireDefault(require("@mui/utils/useSlotProps"));
var _fastObjectShallowCompare = require("@mui/x-internals/fastObjectShallowCompare");
var _TreeItem = require("../../TreeItem");
var _useSelector = require("../hooks/useSelector");
var _useTreeViewItems = require("../plugins/useTreeViewItems/useTreeViewItems.selectors");
var _TreeViewProvider = require("../TreeViewProvider");
var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["ownerState"];
const RichTreeViewItemsContext = /*#__PURE__*/React.createContext(null);
if (process.env.NODE_ENV !== "production") RichTreeViewItemsContext.displayName = "RichTreeViewItemsContext";
const WrappedTreeItem = /*#__PURE__*/React.memo(function WrappedTreeItem({
  itemSlot,
  itemSlotProps,
  itemId
}) {
  const renderItemForRichTreeView = React.useContext(RichTreeViewItemsContext);
  const {
    store
  } = (0, _TreeViewProvider.useTreeViewContext)();
  const itemMeta = (0, _useSelector.useSelector)(store, _useTreeViewItems.selectorItemMeta, itemId);
  const children = (0, _useSelector.useSelector)(store, _useTreeViewItems.selectorItemOrderedChildrenIds, itemId);
  const Item = itemSlot ?? _TreeItem.TreeItem;
  const _useSlotProps = (0, _useSlotProps2.default)({
      elementType: Item,
      externalSlotProps: itemSlotProps,
      additionalProps: {
        label: itemMeta?.label,
        id: itemMeta?.idAttribute,
        itemId
      },
      ownerState: {
        itemId,
        label: itemMeta?.label
      }
    }),
    itemProps = (0, _objectWithoutPropertiesLoose2.default)(_useSlotProps, _excluded);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, (0, _extends2.default)({}, itemProps, {
    children: children?.map(renderItemForRichTreeView)
  }));
}, _fastObjectShallowCompare.fastObjectShallowCompare);
if (process.env.NODE_ENV !== "production") WrappedTreeItem.displayName = "WrappedTreeItem";
function RichTreeViewItems(props) {
  const {
    slots,
    slotProps
  } = props;
  const {
    store
  } = (0, _TreeViewProvider.useTreeViewContext)();
  const itemSlot = slots?.item;
  const itemSlotProps = slotProps?.item;
  const items = (0, _useSelector.useSelector)(store, _useTreeViewItems.selectorItemOrderedChildrenIds, null);
  const renderItem = React.useCallback(itemId => {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedTreeItem, {
      itemSlot: itemSlot,
      itemSlotProps: itemSlotProps,
      itemId: itemId
    }, itemId);
  }, [itemSlot, itemSlotProps]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(RichTreeViewItemsContext.Provider, {
    value: renderItem,
    children: items.map(renderItem)
  });
}