@mui/x-data-grid/hooks/features/virtualization/useGridVirtualization.js

The Community plan edition of the MUI X Data Grid components.

"use strict";
'use client';

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useGridVirtualization = useGridVirtualization;
exports.virtualizationStateInitializer = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));
var _xVirtualizer = require("@mui/x-virtualizer");
var _isJSDOM = require("../../../utils/isJSDOM");
var _useGridApiMethod = require("../../utils/useGridApiMethod");
var _utils = require("../../utils");
const HAS_LAYOUT = !_isJSDOM.isJSDOM;

// HACK: Typescript doesn't use the alias name ("GridVirtualizationState") and changes
// the autogenerated docs result, but this would otherwise be just:
//   export type GridVirtualizationState = VirtualizationState;

// XXX: We want to use the virtualizer as the source of truth for its state, but this needs to
// stay because some parts of the grid require the `virtualization` state during initialization.
const virtualizationStateInitializer = (state, props) => {
  const {
    disableVirtualization,
    autoHeight
  } = props;
  const virtualization = {
    enabled: !disableVirtualization && HAS_LAYOUT,
    enabledForColumns: !disableVirtualization && HAS_LAYOUT,
    enabledForRows: !disableVirtualization && !autoHeight && HAS_LAYOUT,
    renderContext: _xVirtualizer.EMPTY_RENDER_CONTEXT
  };
  return (0, _extends2.default)({}, state, {
    virtualization
  });
};
exports.virtualizationStateInitializer = virtualizationStateInitializer;
function useGridVirtualization(apiRef, rootProps) {
  const {
    virtualizer
  } = apiRef.current;
  const {
    autoHeight,
    disableVirtualization
  } = rootProps;

  /*
   * API METHODS
   */

  const setVirtualization = enabled => {
    enabled && (enabled = HAS_LAYOUT);
    virtualizer.store.set('virtualization', (0, _extends2.default)({}, virtualizer.store.state.virtualization, {
      enabled,
      enabledForColumns: enabled,
      enabledForRows: enabled && !autoHeight
    }));
  };
  const setColumnVirtualization = enabled => {
    enabled && (enabled = HAS_LAYOUT);
    virtualizer.store.set('virtualization', (0, _extends2.default)({}, virtualizer.store.state.virtualization, {
      enabledForColumns: enabled
    }));
  };
  const api = {
    unstable_setVirtualization: setVirtualization,
    unstable_setColumnVirtualization: setColumnVirtualization
  };
  (0, _useGridApiMethod.useGridApiMethod)(apiRef, api, 'public');
  const forceUpdateRenderContext = virtualizer.api.forceUpdateRenderContext;
  apiRef.current.register('private', {
    updateRenderContext: forceUpdateRenderContext
  });

  /*
   * EFFECTS
   */

  (0, _utils.useGridEventPriority)(apiRef, 'sortedRowsSet', forceUpdateRenderContext);
  (0, _utils.useGridEventPriority)(apiRef, 'paginationModelChange', forceUpdateRenderContext);
  (0, _utils.useGridEventPriority)(apiRef, 'columnsChange', forceUpdateRenderContext);

  /* eslint-disable react-hooks/exhaustive-deps */
  React.useEffect(() => {
    setVirtualization(!rootProps.disableVirtualization);
  }, [disableVirtualization, autoHeight]);
  /* eslint-enable react-hooks/exhaustive-deps */
}