@mui/x-data-grid-premium/components/collapsible/Collapsible.js

The Premium plan edition of the MUI X Data Grid 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.Collapsible = Collapsible;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));
var _system = require("@mui/system");
var _internals = require("@mui/x-data-grid-pro/internals");
var _useId = _interopRequireDefault(require("@mui/utils/useId"));
var _xDataGridPro = require("@mui/x-data-grid-pro");
var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
var _clsx = _interopRequireDefault(require("clsx"));
var _CollapsibleContext = require("./CollapsibleContext");
var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["className", "children", "initiallyOpen"];
const useUtilityClasses = ownerState => {
  const {
    classes
  } = ownerState;
  const slots = {
    root: ['collapsible']
  };
  return (0, _composeClasses.default)(slots, _xDataGridPro.getDataGridUtilityClass, classes);
};
const CollapsibleRoot = (0, _system.styled)('div', {
  name: 'MuiDataGrid',
  slot: 'Collapsible'
})(({
  ownerState
}) => ({
  display: 'flex',
  flexDirection: 'column',
  flex: ownerState.open ? '1 0 auto' : '0 0 auto',
  borderRadius: _internals.vars.radius.base
}));
function Collapsible(props) {
  const {
      className,
      children,
      initiallyOpen = true
    } = props,
    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
  const [open, setOpen] = React.useState(initiallyOpen);
  const panelId = (0, _useId.default)();
  const rootProps = (0, _useGridRootProps.useGridRootProps)();
  const ownerState = {
    classes: rootProps.classes,
    open
  };
  const classes = useUtilityClasses(ownerState);
  const contextValue = React.useMemo(() => ({
    open,
    onOpenChange: setOpen,
    panelId
  }), [open, setOpen, panelId]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CollapsibleContext.CollapsibleContext.Provider, {
    value: contextValue,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(CollapsibleRoot, (0, _extends2.default)({
      ownerState: ownerState,
      className: (0, _clsx.default)(classes.root, className)
    }, other, {
      children: children
    }))
  });
}