88 lines
4.0 KiB
JavaScript
88 lines
4.0 KiB
JavaScript
import * as React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
|
|
import { GridMainContainer } from '../containers/GridMainContainer';
|
|
import { GridAutoSizer } from '../GridAutoSizer';
|
|
import { GridOverlays } from './GridOverlays';
|
|
import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
|
|
import { useGridSelector } from '../../hooks/utils/useGridSelector';
|
|
import { gridDensityTotalHeaderHeightSelector } from '../../hooks/features/density/densitySelector';
|
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
|
function GridBody(props) {
|
|
const {
|
|
children,
|
|
VirtualScrollerComponent,
|
|
ColumnHeadersComponent
|
|
} = props;
|
|
const apiRef = useGridApiContext();
|
|
const rootProps = useGridRootProps();
|
|
const totalHeaderHeight = useGridSelector(apiRef, gridDensityTotalHeaderHeightSelector);
|
|
const [isVirtualizationDisabled, setIsVirtualizationDisabled] = React.useState(rootProps.disableVirtualization);
|
|
const disableVirtualization = React.useCallback(() => {
|
|
setIsVirtualizationDisabled(true);
|
|
}, []);
|
|
const enableVirtualization = React.useCallback(() => {
|
|
setIsVirtualizationDisabled(false);
|
|
}, []);
|
|
React.useEffect(() => {
|
|
setIsVirtualizationDisabled(rootProps.disableVirtualization);
|
|
}, [rootProps.disableVirtualization]); // The `useGridApiMethod` hook can't be used here, because it only installs the
|
|
// method if it doesn't exist yet. Once installed, it's never updated again.
|
|
// This break the methods above, since their closure comes from the first time
|
|
// they were installed. Which means that calling `setIsVirtualizationDisabled`
|
|
// will trigger a re-render, but it won't update the state. That can be solved
|
|
// by migrating the virtualization status to the global state.
|
|
|
|
apiRef.current.unstable_disableVirtualization = disableVirtualization;
|
|
apiRef.current.unstable_enableVirtualization = enableVirtualization;
|
|
const columnHeadersRef = React.useRef(null);
|
|
const columnsContainerRef = React.useRef(null);
|
|
const windowRef = React.useRef(null);
|
|
const renderingZoneRef = React.useRef(null);
|
|
apiRef.current.columnHeadersContainerElementRef = columnsContainerRef;
|
|
apiRef.current.columnHeadersElementRef = columnHeadersRef;
|
|
apiRef.current.windowRef = windowRef; // TODO rename, it's not attached to the window anymore
|
|
|
|
apiRef.current.renderingZoneRef = renderingZoneRef; // TODO remove, nobody should have access to internal parts of the virtualization
|
|
|
|
const handleResize = React.useCallback(size => {
|
|
apiRef.current.publishEvent('resize', size);
|
|
}, [apiRef]);
|
|
return /*#__PURE__*/_jsxs(GridMainContainer, {
|
|
children: [/*#__PURE__*/_jsx(GridOverlays, {}), /*#__PURE__*/_jsx(ColumnHeadersComponent, {
|
|
ref: columnsContainerRef,
|
|
innerRef: columnHeadersRef
|
|
}), /*#__PURE__*/_jsx(GridAutoSizer, {
|
|
nonce: rootProps.nonce,
|
|
disableHeight: rootProps.autoHeight,
|
|
onResize: handleResize,
|
|
children: size => {
|
|
const style = {
|
|
width: size.width,
|
|
// If `autoHeight` is on, there will be no height value.
|
|
// In this case, let the container to grow whatever it needs.
|
|
height: size.height ? size.height - totalHeaderHeight : 'auto',
|
|
marginTop: totalHeaderHeight
|
|
};
|
|
return /*#__PURE__*/_jsx(VirtualScrollerComponent, {
|
|
ref: windowRef,
|
|
style: style,
|
|
disableVirtualization: isVirtualizationDisabled
|
|
});
|
|
}
|
|
}), children]
|
|
});
|
|
}
|
|
|
|
process.env.NODE_ENV !== "production" ? GridBody.propTypes = {
|
|
// ----------------------------- Warning --------------------------------
|
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
// ----------------------------------------------------------------------
|
|
children: PropTypes.node,
|
|
ColumnHeadersComponent: PropTypes.elementType.isRequired,
|
|
VirtualScrollerComponent: PropTypes.elementType.isRequired
|
|
} : void 0;
|
|
export { GridBody }; |