@mui/x-tree-view 9.12.0 → 9.13.0

package/TreeItemLoader/TreeItemLoader.d.mts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { TreeItemLoaderProps } from "./TreeItemLoader.types.mjs";
+export declare const TreeItemLoaderRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, Pick<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof React.ClassAttributes<HTMLLIElement> | keyof React.LiHTMLAttributes<HTMLLIElement>>, {}>;
+/**
+ * Semantic wrapper for one loading row of the Rich Tree View.
+ *
+ * It renders a `li` element with the `role`, `aria` attributes, indentation and
+ * height of a tree item, so custom loading UIs stay accessible and aligned.
+ * Without children, it renders the default skeleton placeholders.
+ *
+ * Demos:
+ *
+ * - [Tree View](https://mui.com/x/react-tree-view/)
+ *
+ * API:
+ *
+ * - [TreeItemLoader API](https://mui.com/x/api/tree-view/tree-item-loader/)
+ */
+declare const TreeItemLoader: React.ForwardRefExoticComponent<TreeItemLoaderProps & React.RefAttributes<HTMLLIElement>>;
+export { TreeItemLoader };

package/TreeItemLoader/TreeItemLoader.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { TreeItemLoaderProps } from "./TreeItemLoader.types.js";
+export declare const TreeItemLoaderRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, Pick<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof React.ClassAttributes<HTMLLIElement> | keyof React.LiHTMLAttributes<HTMLLIElement>>, {}>;
+/**
+ * Semantic wrapper for one loading row of the Rich Tree View.
+ *
+ * It renders a `li` element with the `role`, `aria` attributes, indentation and
+ * height of a tree item, so custom loading UIs stay accessible and aligned.
+ * Without children, it renders the default skeleton placeholders.
+ *
+ * Demos:
+ *
+ * - [Tree View](https://mui.com/x/react-tree-view/)
+ *
+ * API:
+ *
+ * - [TreeItemLoader API](https://mui.com/x/api/tree-view/tree-item-loader/)
+ */
+declare const TreeItemLoader: React.ForwardRefExoticComponent<TreeItemLoaderProps & React.RefAttributes<HTMLLIElement>>;
+export { TreeItemLoader };

package/TreeItemLoader/TreeItemLoader.js

@@ -0,0 +1,152 @@
+"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.TreeItemLoaderRoot = exports.TreeItemLoader = void 0;
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Skeleton = _interopRequireDefault(require("@mui/material/Skeleton"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _zeroStyled = require("../internals/zero-styled");
+var _constants = require("../internals/constants");
+var _treeItemLoaderClasses = require("./treeItemLoaderClasses");
+var _TreeItemLoaderContext = require("./TreeItemLoaderContext");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["children", "className", "classes", "style", "ownerState"];
+const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiTreeItemLoader');
+
+// Rotated with `nth-of-type` so consecutive rows render labels of different widths.
+const LABEL_WIDTHS = ['40%', '70%', '55%', '50%', '65%'];
+const TreeItemLoaderRoot = exports.TreeItemLoaderRoot = (0, _zeroStyled.styled)('li', {
+  name: 'MuiTreeItemLoader',
+  slot: 'Root'
+})(({
+  theme
+}) => (0, _extends2.default)({
+  listStyle: 'none',
+  margin: 0
+}, theme.typography.body1, {
+  padding: theme.spacing(0.5, 1),
+  // Same indentation formula as the tree item content.
+  paddingLeft: `calc(${theme.spacing(1)} + var(--TreeView-itemChildrenIndentation) * var(--TreeView-itemDepth, 0))`,
+  height: 'var(--TreeView-itemHeight, unset)',
+  boxSizing: 'border-box',
+  display: 'flex',
+  alignItems: 'center',
+  gap: theme.spacing(1),
+  [`& .${_treeItemLoaderClasses.treeItemLoaderClasses.iconContainer}`]: {
+    width: _constants.TREE_ITEM_ICON_CONTAINER_WIDTH_PX,
+    flexShrink: 0,
+    display: 'inline-block'
+  },
+  [`& .${_treeItemLoaderClasses.treeItemLoaderClasses.checkbox}`]: {
+    flexShrink: 0
+  }
+}, Object.fromEntries(LABEL_WIDTHS.map((width, index) => [`&:nth-of-type(5n + ${index + 1}) .${_treeItemLoaderClasses.treeItemLoaderClasses.label}`, {
+  width
+}]))));
+const useUtilityClasses = classes => {
+  const slots = {
+    root: ['root'],
+    iconContainer: ['iconContainer'],
+    checkbox: ['checkbox'],
+    label: ['label']
+  };
+  return (0, _composeClasses.default)(slots, _treeItemLoaderClasses.getTreeItemLoaderUtilityClass, classes);
+};
+
+/**
+ * Semantic wrapper for one loading row of the Rich Tree View.
+ *
+ * It renders a `li` element with the `role`, `aria` attributes, indentation and
+ * height of a tree item, so custom loading UIs stay accessible and aligned.
+ * Without children, it renders the default skeleton placeholders.
+ *
+ * Demos:
+ *
+ * - [Tree View](https://mui.com/x/react-tree-view/)
+ *
+ * API:
+ *
+ * - [TreeItemLoader API](https://mui.com/x/api/tree-view/tree-item-loader/)
+ */
+const TreeItemLoader = exports.TreeItemLoader = /*#__PURE__*/React.forwardRef(function TreeItemLoader(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTreeItemLoader'
+  });
+  const {
+      children,
+      className,
+      classes: classesProp,
+      style
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    itemDepth,
+    itemHeight,
+    isCheckboxSelectionEnabled
+  } = React.useContext(_TreeItemLoaderContext.TreeItemLoaderContext);
+  const classes = useUtilityClasses(classesProp);
+  const rootStyle = (0, _extends2.default)({
+    '--TreeView-itemDepth': itemDepth
+  }, itemHeight == null ? {} : {
+    '--TreeView-itemHeight': `${itemHeight}px`
+  }, style);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TreeItemLoaderRoot, (0, _extends2.default)({
+    role: "treeitem",
+    "aria-disabled": true
+  }, other, {
+    className: (0, _clsx.default)(classes.root, className),
+    style: rootStyle,
+    ref: ref,
+    children: children ?? /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: classes.iconContainer
+      }), isCheckboxSelectionEnabled &&
+      /*#__PURE__*/
+      // Same size as the checkbox rendered by the tree item, to keep the labels aligned.
+      (0, _jsxRuntime.jsx)(_Skeleton.default, {
+        variant: "circular",
+        width: 24,
+        height: 24,
+        className: classes.checkbox
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
+        className: classes.label
+      })]
+    })
+  }));
+});
+if (process.env.NODE_ENV !== "production") TreeItemLoader.displayName = "TreeItemLoader";
+process.env.NODE_ENV !== "production" ? TreeItemLoader.propTypes /* remove-proptypes */ = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the loading row.
+   * When not provided, the default skeleton placeholders are rendered.
+   */
+  children: _propTypes.default.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: _propTypes.default.object,
+  /**
+   * State of the loading row, forwarded by the `itemLoader` slot.
+   * The component does not render it.
+   */
+  ownerState: _propTypes.default.shape({
+    index: _propTypes.default.number.isRequired,
+    isCheckboxSelectionEnabled: _propTypes.default.bool.isRequired,
+    itemDepth: _propTypes.default.number.isRequired,
+    itemsCount: _propTypes.default.number.isRequired
+  })
+} : void 0;

package/TreeItemLoader/TreeItemLoader.mjs

@@ -0,0 +1,146 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "classes", "style", "ownerState"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import Skeleton from '@mui/material/Skeleton';
+import composeClasses from '@mui/utils/composeClasses';
+import { styled, createUseThemeProps } from "../internals/zero-styled/index.mjs";
+import { TREE_ITEM_ICON_CONTAINER_WIDTH_PX } from "../internals/constants.mjs";
+import { getTreeItemLoaderUtilityClass, treeItemLoaderClasses } from "./treeItemLoaderClasses.mjs";
+import { TreeItemLoaderContext } from "./TreeItemLoaderContext.mjs";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const useThemeProps = createUseThemeProps('MuiTreeItemLoader');
+
+// Rotated with `nth-of-type` so consecutive rows render labels of different widths.
+const LABEL_WIDTHS = ['40%', '70%', '55%', '50%', '65%'];
+export const TreeItemLoaderRoot = styled('li', {
+  name: 'MuiTreeItemLoader',
+  slot: 'Root'
+})(({
+  theme
+}) => _extends({
+  listStyle: 'none',
+  margin: 0
+}, theme.typography.body1, {
+  padding: theme.spacing(0.5, 1),
+  // Same indentation formula as the tree item content.
+  paddingLeft: `calc(${theme.spacing(1)} + var(--TreeView-itemChildrenIndentation) * var(--TreeView-itemDepth, 0))`,
+  height: 'var(--TreeView-itemHeight, unset)',
+  boxSizing: 'border-box',
+  display: 'flex',
+  alignItems: 'center',
+  gap: theme.spacing(1),
+  [`& .${treeItemLoaderClasses.iconContainer}`]: {
+    width: TREE_ITEM_ICON_CONTAINER_WIDTH_PX,
+    flexShrink: 0,
+    display: 'inline-block'
+  },
+  [`& .${treeItemLoaderClasses.checkbox}`]: {
+    flexShrink: 0
+  }
+}, Object.fromEntries(LABEL_WIDTHS.map((width, index) => [`&:nth-of-type(5n + ${index + 1}) .${treeItemLoaderClasses.label}`, {
+  width
+}]))));
+const useUtilityClasses = classes => {
+  const slots = {
+    root: ['root'],
+    iconContainer: ['iconContainer'],
+    checkbox: ['checkbox'],
+    label: ['label']
+  };
+  return composeClasses(slots, getTreeItemLoaderUtilityClass, classes);
+};
+
+/**
+ * Semantic wrapper for one loading row of the Rich Tree View.
+ *
+ * It renders a `li` element with the `role`, `aria` attributes, indentation and
+ * height of a tree item, so custom loading UIs stay accessible and aligned.
+ * Without children, it renders the default skeleton placeholders.
+ *
+ * Demos:
+ *
+ * - [Tree View](https://mui.com/x/react-tree-view/)
+ *
+ * API:
+ *
+ * - [TreeItemLoader API](https://mui.com/x/api/tree-view/tree-item-loader/)
+ */
+const TreeItemLoader = /*#__PURE__*/React.forwardRef(function TreeItemLoader(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTreeItemLoader'
+  });
+  const {
+      children,
+      className,
+      classes: classesProp,
+      style
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    itemDepth,
+    itemHeight,
+    isCheckboxSelectionEnabled
+  } = React.useContext(TreeItemLoaderContext);
+  const classes = useUtilityClasses(classesProp);
+  const rootStyle = _extends({
+    '--TreeView-itemDepth': itemDepth
+  }, itemHeight == null ? {} : {
+    '--TreeView-itemHeight': `${itemHeight}px`
+  }, style);
+  return /*#__PURE__*/_jsx(TreeItemLoaderRoot, _extends({
+    role: "treeitem",
+    "aria-disabled": true
+  }, other, {
+    className: clsx(classes.root, className),
+    style: rootStyle,
+    ref: ref,
+    children: children ?? /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [/*#__PURE__*/_jsx("span", {
+        className: classes.iconContainer
+      }), isCheckboxSelectionEnabled &&
+      /*#__PURE__*/
+      // Same size as the checkbox rendered by the tree item, to keep the labels aligned.
+      _jsx(Skeleton, {
+        variant: "circular",
+        width: 24,
+        height: 24,
+        className: classes.checkbox
+      }), /*#__PURE__*/_jsx(Skeleton, {
+        className: classes.label
+      })]
+    })
+  }));
+});
+if (process.env.NODE_ENV !== "production") TreeItemLoader.displayName = "TreeItemLoader";
+process.env.NODE_ENV !== "production" ? TreeItemLoader.propTypes /* remove-proptypes */ = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the loading row.
+   * When not provided, the default skeleton placeholders are rendered.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * State of the loading row, forwarded by the `itemLoader` slot.
+   * The component does not render it.
+   */
+  ownerState: PropTypes.shape({
+    index: PropTypes.number.isRequired,
+    isCheckboxSelectionEnabled: PropTypes.bool.isRequired,
+    itemDepth: PropTypes.number.isRequired,
+    itemsCount: PropTypes.number.isRequired
+  })
+} : void 0;
+export { TreeItemLoader };

package/TreeItemLoader/TreeItemLoader.types.d.mts

@@ -0,0 +1,36 @@
+import type * as React from 'react';
+import type { TreeItemLoaderClasses } from "./treeItemLoaderClasses.mjs";
+export interface TreeItemLoaderOwnerState {
+  /**
+   * Index of the loading row inside its group.
+   */
+  index: number;
+  /**
+   * Number of loading rows rendered in the group.
+   */
+  itemsCount: number;
+  /**
+   * Depth of the loading rows.
+   */
+  itemDepth: number;
+  /**
+   * Whether each row renders a checkbox placeholder.
+   */
+  isCheckboxSelectionEnabled: boolean;
+}
+export interface TreeItemLoaderProps extends React.HTMLAttributes<HTMLLIElement> {
+  /**
+   * The content of the loading row.
+   * When not provided, the default skeleton placeholders are rendered.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TreeItemLoaderClasses>;
+  /**
+   * State of the loading row, forwarded by the `itemLoader` slot.
+   * The component does not render it.
+   */
+  ownerState?: TreeItemLoaderOwnerState;
+}

package/TreeItemLoader/TreeItemLoader.types.d.ts

@@ -0,0 +1,36 @@
+import type * as React from 'react';
+import type { TreeItemLoaderClasses } from "./treeItemLoaderClasses.js";
+export interface TreeItemLoaderOwnerState {
+  /**
+   * Index of the loading row inside its group.
+   */
+  index: number;
+  /**
+   * Number of loading rows rendered in the group.
+   */
+  itemsCount: number;
+  /**
+   * Depth of the loading rows.
+   */
+  itemDepth: number;
+  /**
+   * Whether each row renders a checkbox placeholder.
+   */
+  isCheckboxSelectionEnabled: boolean;
+}
+export interface TreeItemLoaderProps extends React.HTMLAttributes<HTMLLIElement> {
+  /**
+   * The content of the loading row.
+   * When not provided, the default skeleton placeholders are rendered.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TreeItemLoaderClasses>;
+  /**
+   * State of the loading row, forwarded by the `itemLoader` slot.
+   * The component does not render it.
+   */
+  ownerState?: TreeItemLoaderOwnerState;
+}

package/TreeItemLoader/TreeItemLoader.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/TreeItemLoader/TreeItemLoader.types.mjs

@@ -0,0 +1 @@
+export {};

package/TreeItemLoader/TreeItemLoaderContext.d.mts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+export interface TreeItemLoaderContextValue {
+  /**
+   * Depth of the loading rows.
+   * `0` for the whole-tree loading UI, parent depth + 1 for the children of a lazily loading item.
+   */
+  itemDepth: number;
+  /**
+   * Fixed height of the rows, from the `itemHeight` prop of the tree.
+   */
+  itemHeight: number | null;
+  /**
+   * Whether each row renders a checkbox placeholder.
+   */
+  isCheckboxSelectionEnabled: boolean;
+}
+/**
+ * Provides the layout information of the surrounding tree to `TreeItemLoader`.
+ * The loading UI renders outside of the tree items, so the depth and height
+ * cannot be derived from an item.
+ *
+ * @ignore - internal context.
+ */
+export declare const TreeItemLoaderContext: React.Context<TreeItemLoaderContextValue>;

package/TreeItemLoader/TreeItemLoaderContext.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+export interface TreeItemLoaderContextValue {
+  /**
+   * Depth of the loading rows.
+   * `0` for the whole-tree loading UI, parent depth + 1 for the children of a lazily loading item.
+   */
+  itemDepth: number;
+  /**
+   * Fixed height of the rows, from the `itemHeight` prop of the tree.
+   */
+  itemHeight: number | null;
+  /**
+   * Whether each row renders a checkbox placeholder.
+   */
+  isCheckboxSelectionEnabled: boolean;
+}
+/**
+ * Provides the layout information of the surrounding tree to `TreeItemLoader`.
+ * The loading UI renders outside of the tree items, so the depth and height
+ * cannot be derived from an item.
+ *
+ * @ignore - internal context.
+ */
+export declare const TreeItemLoaderContext: React.Context<TreeItemLoaderContextValue>;

package/TreeItemLoader/TreeItemLoaderContext.js

@@ -0,0 +1,22 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TreeItemLoaderContext = void 0;
+var React = _interopRequireWildcard(require("react"));
+/**
+ * Provides the layout information of the surrounding tree to `TreeItemLoader`.
+ * The loading UI renders outside of the tree items, so the depth and height
+ * cannot be derived from an item.
+ *
+ * @ignore - internal context.
+ */
+const TreeItemLoaderContext = exports.TreeItemLoaderContext = /*#__PURE__*/React.createContext({
+  itemDepth: 0,
+  itemHeight: null,
+  isCheckboxSelectionEnabled: false
+});
+if (process.env.NODE_ENV !== "production") TreeItemLoaderContext.displayName = "TreeItemLoaderContext";

package/TreeItemLoader/TreeItemLoaderContext.mjs

@@ -0,0 +1,16 @@
+'use client';
+
+import * as React from 'react';
+/**
+ * Provides the layout information of the surrounding tree to `TreeItemLoader`.
+ * The loading UI renders outside of the tree items, so the depth and height
+ * cannot be derived from an item.
+ *
+ * @ignore - internal context.
+ */
+export const TreeItemLoaderContext = /*#__PURE__*/React.createContext({
+  itemDepth: 0,
+  itemHeight: null,
+  isCheckboxSelectionEnabled: false
+});
+if (process.env.NODE_ENV !== "production") TreeItemLoaderContext.displayName = "TreeItemLoaderContext";

package/TreeItemLoader/index.d.mts

@@ -0,0 +1,3 @@
+export { TreeItemLoader, TreeItemLoaderRoot } from "./TreeItemLoader.mjs";
+export type { TreeItemLoaderProps, TreeItemLoaderOwnerState } from "./TreeItemLoader.types.mjs";
+export * from "./treeItemLoaderClasses.mjs";

package/TreeItemLoader/index.d.ts

@@ -0,0 +1,3 @@
+export { TreeItemLoader, TreeItemLoaderRoot } from "./TreeItemLoader.js";
+export type { TreeItemLoaderProps, TreeItemLoaderOwnerState } from "./TreeItemLoader.types.js";
+export * from "./treeItemLoaderClasses.js";

package/TreeItemLoader/index.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  TreeItemLoader: true,
+  TreeItemLoaderRoot: true
+};
+Object.defineProperty(exports, "TreeItemLoader", {
+  enumerable: true,
+  get: function () {
+    return _TreeItemLoader.TreeItemLoader;
+  }
+});
+Object.defineProperty(exports, "TreeItemLoaderRoot", {
+  enumerable: true,
+  get: function () {
+    return _TreeItemLoader.TreeItemLoaderRoot;
+  }
+});
+var _TreeItemLoader = require("./TreeItemLoader");
+var _treeItemLoaderClasses = require("./treeItemLoaderClasses");
+Object.keys(_treeItemLoaderClasses).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _treeItemLoaderClasses[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _treeItemLoaderClasses[key];
+    }
+  });
+});

package/TreeItemLoader/index.mjs

@@ -0,0 +1,2 @@
+export { TreeItemLoader, TreeItemLoaderRoot } from "./TreeItemLoader.mjs";
+export * from "./treeItemLoaderClasses.mjs";

package/TreeItemLoader/treeItemLoaderClasses.d.mts

@@ -0,0 +1,13 @@
+export interface TreeItemLoaderClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the icon gutter element of the default content. */
+  iconContainer: string;
+  /** Styles applied to the checkbox placeholder element of the default content. */
+  checkbox: string;
+  /** Styles applied to the label placeholder element of the default content. */
+  label: string;
+}
+export type TreeItemLoaderClassKey = keyof TreeItemLoaderClasses;
+export declare function getTreeItemLoaderUtilityClass(slot: string): string;
+export declare const treeItemLoaderClasses: TreeItemLoaderClasses;

package/TreeItemLoader/treeItemLoaderClasses.d.ts

@@ -0,0 +1,13 @@
+export interface TreeItemLoaderClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the icon gutter element of the default content. */
+  iconContainer: string;
+  /** Styles applied to the checkbox placeholder element of the default content. */
+  checkbox: string;
+  /** Styles applied to the label placeholder element of the default content. */
+  label: string;
+}
+export type TreeItemLoaderClassKey = keyof TreeItemLoaderClasses;
+export declare function getTreeItemLoaderUtilityClass(slot: string): string;
+export declare const treeItemLoaderClasses: TreeItemLoaderClasses;

package/TreeItemLoader/treeItemLoaderClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getTreeItemLoaderUtilityClass = getTreeItemLoaderUtilityClass;
+exports.treeItemLoaderClasses = void 0;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getTreeItemLoaderUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiTreeItemLoader', slot);
+}
+const treeItemLoaderClasses = exports.treeItemLoaderClasses = (0, _generateUtilityClasses.default)('MuiTreeItemLoader', ['root', 'iconContainer', 'checkbox', 'label']);

package/TreeItemLoader/treeItemLoaderClasses.mjs

@@ -0,0 +1,6 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getTreeItemLoaderUtilityClass(slot) {
+  return generateUtilityClass('MuiTreeItemLoader', slot);
+}
+export const treeItemLoaderClasses = generateUtilityClasses('MuiTreeItemLoader', ['root', 'iconContainer', 'checkbox', 'label']);

package/index.d.mts

@@ -6,6 +6,7 @@ export * from "./TreeItemIcon/index.mjs";
 export * from "./TreeItemProvider/index.mjs";
 export * from "./TreeItemDragAndDropOverlay/index.mjs";
 export * from "./TreeItemLabelInput/index.mjs";
+export * from "./TreeItemLoader/index.mjs";
 export * from "./models/index.mjs";
 export * from "./icons/index.mjs";
 export * from "./hooks/index.mjs";

package/index.d.ts

@@ -6,6 +6,7 @@ export * from "./TreeItemIcon/index.js";
 export * from "./TreeItemProvider/index.js";
 export * from "./TreeItemDragAndDropOverlay/index.js";
 export * from "./TreeItemLabelInput/index.js";
+export * from "./TreeItemLoader/index.js";
 export * from "./models/index.js";
 export * from "./icons/index.js";
 export * from "./hooks/index.js";

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-tree-view v9.12.0
+ * @mui/x-tree-view v9.13.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -98,6 +98,17 @@ Object.keys(_TreeItemLabelInput).forEach(function (key) {
     }
   });
 });
+var _TreeItemLoader = require("./TreeItemLoader");
+Object.keys(_TreeItemLoader).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TreeItemLoader[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _TreeItemLoader[key];
+    }
+  });
+});
 var _models = require("./models");
 Object.keys(_models).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;