@mui/x-data-grid-premium/esm/components/GridPremiumToolbar.js

The Premium plan edition of the MUI X Data Grid Components.

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["excelOptions"];
import * as React from 'react';
import { GridToolbar, GridToolbarDivider, useGridSelector } from '@mui/x-data-grid-pro/internals';
import { ColumnsPanelTrigger, FilterPanelTrigger, ToolbarButton } from '@mui/x-data-grid-pro';
import { ExportExcel } from "./export/index.js";
import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
import { PivotPanelTrigger } from "./pivotPanel/PivotPanelTrigger.js";
import { AiAssistantPanelTrigger } from "./aiAssistantPanel/index.js";
import { ChartsPanelTrigger } from "./chartsPanel/ChartsPanelTrigger.js";
import { gridHistoryCanRedoSelector, gridHistoryCanUndoSelector, gridHistoryEnabledSelector } from "../hooks/features/history/index.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export function GridPremiumToolbar(props) {
  const rootProps = useGridRootProps();
  const apiRef = useGridApiContext();
  const other = _objectWithoutPropertiesLoose(props, _excluded);
  const historyEnabled = useGridSelector(apiRef, gridHistoryEnabledSelector);
  const showHistoryControls = rootProps.slotProps?.toolbar?.showHistoryControls !== false && historyEnabled;
  const canUndo = useGridSelector(apiRef, gridHistoryCanUndoSelector);
  const canRedo = useGridSelector(apiRef, gridHistoryCanRedoSelector);
  const mainControls = /*#__PURE__*/_jsxs(React.Fragment, {
    children: [showHistoryControls && /*#__PURE__*/_jsxs(React.Fragment, {
      children: [/*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
        title: apiRef.current.getLocaleText('toolbarUndo'),
        children: /*#__PURE__*/_jsx("div", {
          children: /*#__PURE__*/_jsx(ToolbarButton, {
            disabled: !canUndo,
            onClick: () => apiRef.current.history.undo(),
            children: /*#__PURE__*/_jsx(rootProps.slots.undoIcon, {
              fontSize: "small"
            })
          })
        })
      }), /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
        title: apiRef.current.getLocaleText('toolbarRedo'),
        children: /*#__PURE__*/_jsx("div", {
          children: /*#__PURE__*/_jsx(ToolbarButton, {
            disabled: !canRedo,
            onClick: () => apiRef.current.history.redo(),
            children: /*#__PURE__*/_jsx(rootProps.slots.redoIcon, {
              fontSize: "small"
            })
          })
        })
      })]
    }), showHistoryControls && /*#__PURE__*/_jsx(GridToolbarDivider, {}), !rootProps.disableColumnSelector && /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
      title: apiRef.current.getLocaleText('toolbarColumns'),
      children: /*#__PURE__*/_jsx(ColumnsPanelTrigger, {
        render: /*#__PURE__*/_jsx(ToolbarButton, {}),
        children: /*#__PURE__*/_jsx(rootProps.slots.columnSelectorIcon, {
          fontSize: "small"
        })
      })
    }), !rootProps.disableColumnFilter && /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
      title: apiRef.current.getLocaleText('toolbarFilters'),
      children: /*#__PURE__*/_jsx(FilterPanelTrigger, {
        render: (triggerProps, state) => /*#__PURE__*/_jsx(ToolbarButton, _extends({}, triggerProps, {
          color: state.filterCount > 0 ? 'primary' : 'default',
          children: /*#__PURE__*/_jsx(rootProps.slots.baseBadge, {
            badgeContent: state.filterCount,
            color: "primary",
            variant: "dot",
            children: /*#__PURE__*/_jsx(rootProps.slots.openFilterButtonIcon, {
              fontSize: "small"
            })
          })
        }))
      })
    }), !rootProps.disablePivoting && /*#__PURE__*/_jsx(PivotPanelTrigger, {
      render: (triggerProps, state) => /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
        title: apiRef.current.getLocaleText('toolbarPivot'),
        children: /*#__PURE__*/_jsx(ToolbarButton, _extends({}, triggerProps, {
          color: state.active ? 'primary' : 'default',
          children: /*#__PURE__*/_jsx(rootProps.slots.pivotIcon, {
            fontSize: "small"
          })
        }))
      })
    }), rootProps.experimentalFeatures?.charts && rootProps.chartsIntegration && /*#__PURE__*/_jsx(ChartsPanelTrigger, {
      render: triggerProps => /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
        title: apiRef.current.getLocaleText('toolbarCharts'),
        children: /*#__PURE__*/_jsx(ToolbarButton, _extends({}, triggerProps, {
          color: "default",
          children: /*#__PURE__*/_jsx(rootProps.slots.chartsIcon, {
            fontSize: "small"
          })
        }))
      })
    }), rootProps.aiAssistant && /*#__PURE__*/_jsx(AiAssistantPanelTrigger, {
      render: triggerProps => /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
        title: apiRef.current.getLocaleText('toolbarAssistant'),
        children: /*#__PURE__*/_jsx(ToolbarButton, _extends({}, triggerProps, {
          color: "default",
          children: /*#__PURE__*/_jsx(rootProps.slots.aiAssistantIcon, {
            fontSize: "small"
          })
        }))
      })
    })]
  });
  const additionalExportMenuItems = !props.excelOptions?.disableToolbarButton ? onMenuItemClick => /*#__PURE__*/_jsx(ExportExcel, {
    render: /*#__PURE__*/_jsx(rootProps.slots.baseMenuItem, _extends({}, rootProps.slotProps?.baseMenuItem)),
    options: props.excelOptions,
    onClick: onMenuItemClick,
    children: apiRef.current.getLocaleText('toolbarExportExcel')
  }) : undefined;
  return /*#__PURE__*/_jsx(GridToolbar, _extends({}, other, {
    mainControls: mainControls,
    additionalExportMenuItems: additionalExportMenuItems
  }));
}