@comet/admin 8.17.1 → 9.0.0-beta.0

package/lib/dataGrid/DataGridPanel.js

@@ -1,17 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DataGridPanel = void 0;
-var _adminIcons = require("@comet/admin-icons");
-var _material = require("@mui/material");
-var _xDataGrid = require("@mui/x-data-grid");
-var _react = require("react");
-var _reactIntl = require("react-intl");
-var _Button = require("../common/buttons/Button");
-var _createComponentSlot = require("../helpers/createComponentSlot");
-var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
@@ -26,20 +12,30 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var panelTypeTitle = _defineProperty(_defineProperty({}, _xDataGrid.GridPreferencePanelsValue.filters, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+import { Add, Check, Close, Reset } from "@comet/admin-icons";
+import { css,
+// eslint-disable-next-line no-restricted-imports
+Dialog, DialogContent, Divider, Typography, useMediaQuery, useTheme, useThemeProps } from "@mui/material";
+import { gridColumnVisibilityModelSelector, gridFilterableColumnDefinitionsSelector, gridFilterModelSelector, GridPanel, gridPreferencePanelStateSelector, GridPreferencePanelsValue, useGridApiContext, useGridRootProps, useGridSelector } from "@mui/x-data-grid";
+import { useCallback, useMemo } from "react";
+import { FormattedMessage } from "react-intl";
+import { Button } from "../common/buttons/Button";
+import { createComponentSlot } from "../helpers/createComponentSlot";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+var panelTypeTitle = _defineProperty(_defineProperty({}, GridPreferencePanelsValue.filters, /*#__PURE__*/_jsx(FormattedMessage, {
   id: "dataGrid.panel.filters",
   defaultMessage: "Filters"
-})), _xDataGrid.GridPreferencePanelsValue.columns, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+})), GridPreferencePanelsValue.columns, /*#__PURE__*/_jsx(FormattedMessage, {
   id: "dataGrid.panel.columns",
   defaultMessage: "Columns"
 }));
-var addFilterText = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+var addFilterText = /*#__PURE__*/_jsx(FormattedMessage, {
   id: "dataGrid.panel.addFilter",
   defaultMessage: "Add filter"
 });
 var lastAddedFilterItemId = 0;
-var DataGridPanel = exports.DataGridPanel = function DataGridPanel(inProps) {
-  var _useThemeProps = (0, _material.useThemeProps)({
+export var DataGridPanel = function DataGridPanel(inProps) {
+  var _useThemeProps = useThemeProps({
       props: inProps,
       name: "CometAdminDataGridPanel"
     }),
@@ -48,26 +44,26 @@ var DataGridPanel = exports.DataGridPanel = function DataGridPanel(inProps) {
     slotProps = _useThemeProps.slotProps,
     _useThemeProps$iconMa = _useThemeProps.iconMapping,
     iconMapping = _useThemeProps$iconMa === void 0 ? {} : _useThemeProps$iconMa;
-  var apiRef = (0, _xDataGrid.useGridApiContext)();
-  var filterModel = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridFilterModelSelector);
-  var filterableColumns = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridFilterableColumnDefinitionsSelector);
-  var _useGridSelector = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridPreferencePanelStateSelector),
+  var apiRef = useGridApiContext();
+  var filterModel = useGridSelector(apiRef, gridFilterModelSelector);
+  var filterableColumns = useGridSelector(apiRef, gridFilterableColumnDefinitionsSelector);
+  var _useGridSelector = useGridSelector(apiRef, gridPreferencePanelStateSelector),
     openedPanelValue = _useGridSelector.openedPanelValue;
-  var initialColumnVisibilityModel = (0, _react.useMemo)(function () {
-    return (0, _xDataGrid.gridColumnVisibilityModelSelector)(apiRef);
+  var initialColumnVisibilityModel = useMemo(function () {
+    return gridColumnVisibilityModelSelector(apiRef);
   }, [apiRef]);
-  var rootProps = (0, _xDataGrid.useGridRootProps)();
+  var rootProps = useGridRootProps();
   var _iconMapping$closeDia = iconMapping.closeDialog,
-    closeDialogIcon = _iconMapping$closeDia === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Close, {}) : _iconMapping$closeDia,
+    closeDialogIcon = _iconMapping$closeDia === void 0 ? /*#__PURE__*/_jsx(Close, {}) : _iconMapping$closeDia,
     _iconMapping$addFilte = iconMapping.addFilter,
-    addFilterIcon = _iconMapping$addFilte === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Add, {}) : _iconMapping$addFilte,
+    addFilterIcon = _iconMapping$addFilte === void 0 ? /*#__PURE__*/_jsx(Add, {}) : _iconMapping$addFilte,
     _iconMapping$resetFil = iconMapping.resetFilters,
-    resetFiltersIcon = _iconMapping$resetFil === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Reset, {}) : _iconMapping$resetFil,
+    resetFiltersIcon = _iconMapping$resetFil === void 0 ? /*#__PURE__*/_jsx(Reset, {}) : _iconMapping$resetFil,
     _iconMapping$resetCol = iconMapping.resetColumns,
-    resetColumnsIcon = _iconMapping$resetCol === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Reset, {}) : _iconMapping$resetCol,
+    resetColumnsIcon = _iconMapping$resetCol === void 0 ? /*#__PURE__*/_jsx(Reset, {}) : _iconMapping$resetCol,
     _iconMapping$apply = iconMapping.apply,
-    applyIcon = _iconMapping$apply === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Check, {}) : _iconMapping$apply;
-  var geNewFilterItem = (0, _react.useCallback)(function () {
+    applyIcon = _iconMapping$apply === void 0 ? /*#__PURE__*/_jsx(Check, {}) : _iconMapping$apply;
+  var geNewFilterItem = useCallback(function () {
     var _firstColumnWithOpera;
     var firstColumnWithOperator = filterableColumns.find(function (colDef) {
       var _colDef$filterOperato;
@@ -82,7 +78,7 @@ var DataGridPanel = exports.DataGridPanel = function DataGridPanel(inProps) {
       id: lastAddedFilterItemId++
     };
   }, [filterableColumns]);
-  var filterItems = (0, _react.useMemo)(function () {
+  var filterItems = useMemo(function () {
     if (filterModel.items.length) {
       return filterModel.items;
     }
@@ -92,189 +88,189 @@ var DataGridPanel = exports.DataGridPanel = function DataGridPanel(inProps) {
     }
     return [];
   }, [filterModel.items, geNewFilterItem]);
-  var addNewFilter = (0, _react.useCallback)(function () {
+  var addNewFilter = useCallback(function () {
     var newFilterItem = geNewFilterItem();
     if (newFilterItem) {
       apiRef.current.upsertFilterItems([].concat(_toConsumableArray(filterItems), [newFilterItem]));
     }
   }, [apiRef, filterItems, geNewFilterItem]);
-  var resetFilters = (0, _react.useCallback)(function () {
+  var resetFilters = useCallback(function () {
     apiRef.current.setFilterModel({
       items: []
     });
   }, [apiRef]);
-  var resetColumns = (0, _react.useCallback)(function () {
+  var resetColumns = useCallback(function () {
     apiRef.current.setColumnVisibilityModel(initialColumnVisibilityModel);
   }, [apiRef, initialColumnVisibilityModel]);
-  var closeDialog = (0, _react.useCallback)(function () {
-    if (openedPanelValue === _xDataGrid.GridPreferencePanelsValue.filters) {
+  var closeDialog = useCallback(function () {
+    if (openedPanelValue === GridPreferencePanelsValue.filters) {
       apiRef.current.hideFilterPanel();
     } else {
       apiRef.current.hidePreferences();
     }
   }, [apiRef, openedPanelValue]);
-  var theme = (0, _material.useTheme)();
-  var renderFullScreen = (0, _material.useMediaQuery)(theme.breakpoints.down("md"));
-  var resetFiltersButton = /*#__PURE__*/(0, _jsxRuntime.jsx)(ResetFiltersButton, _objectSpread(_objectSpread({
+  var theme = useTheme();
+  var renderFullScreen = useMediaQuery(theme.breakpoints.down("md"));
+  var resetFiltersButton = /*#__PURE__*/_jsx(ResetFiltersButton, _objectSpread(_objectSpread({
     variant: "outlined",
     startIcon: resetFiltersIcon,
     onClick: resetFilters
   }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.resetFiltersButton), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+    children: /*#__PURE__*/_jsx(FormattedMessage, {
       id: "dataGrid.panel.resetFilters",
       defaultMessage: "Reset filters"
     })
   }));
-  var resetColumnsButton = /*#__PURE__*/(0, _jsxRuntime.jsx)(ResetColumnsButton, _objectSpread(_objectSpread({
+  var resetColumnsButton = /*#__PURE__*/_jsx(ResetColumnsButton, _objectSpread(_objectSpread({
     variant: "outlined",
     startIcon: resetColumnsIcon,
     onClick: resetColumns
   }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.resetColumnsButton), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+    children: /*#__PURE__*/_jsx(FormattedMessage, {
       id: "dataGrid.panel.resetColumns",
       defaultMessage: "Reset columns"
     })
   }));
-  var applyButton = /*#__PURE__*/(0, _jsxRuntime.jsx)(ApplyButton, _objectSpread(_objectSpread({
+  var applyButton = /*#__PURE__*/_jsx(ApplyButton, _objectSpread(_objectSpread({
     startIcon: applyIcon,
     onClick: closeDialog
   }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.applyButton), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+    children: /*#__PURE__*/_jsx(FormattedMessage, {
       id: "dataGrid.panel.apply",
       defaultMessage: "Apply"
     })
   }));
   if (renderFullScreen) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileDialog, _objectSpread(_objectSpread({
+    return /*#__PURE__*/_jsxs(MobileDialog, _objectSpread(_objectSpread({
       open: open,
       onClose: closeDialog,
       fullScreen: true
     }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialog), {}, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileDialogHeader, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogHeader), {}, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MobileDialogTitle, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogTitle), {}, {
+      children: [/*#__PURE__*/_jsxs(MobileDialogHeader, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogHeader), {}, {
+        children: [/*#__PURE__*/_jsx(MobileDialogTitle, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogTitle), {}, {
           children: !!openedPanelValue && panelTypeTitle[openedPanelValue]
-        })), /*#__PURE__*/(0, _jsxRuntime.jsx)(MobileDialogCloseButton, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogCloseButton), {}, {
+        })), /*#__PURE__*/_jsx(MobileDialogCloseButton, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogCloseButton), {}, {
           variant: "textDark",
           onClick: closeDialog,
           children: closeDialogIcon
         }))]
-      })), /*#__PURE__*/(0, _jsxRuntime.jsx)(MobileDialogContent, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogContent), {}, {
+      })), /*#__PURE__*/_jsx(MobileDialogContent, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogContent), {}, {
         children: children
-      })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileDialogFooter, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogFooter), {}, {
-        children: [openedPanelValue === _xDataGrid.GridPreferencePanelsValue.filters && !rootProps.disableMultipleColumnsFiltering && /*#__PURE__*/(0, _jsxRuntime.jsx)(MobileAddFilterButtonWrapper, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileAddFilterButtonWrapper), {}, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MobileAddFilterButton, _objectSpread(_objectSpread({
+      })), /*#__PURE__*/_jsxs(MobileDialogFooter, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogFooter), {}, {
+        children: [openedPanelValue === GridPreferencePanelsValue.filters && !rootProps.disableMultipleColumnsFiltering && /*#__PURE__*/_jsx(MobileAddFilterButtonWrapper, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileAddFilterButtonWrapper), {}, {
+          children: /*#__PURE__*/_jsx(MobileAddFilterButton, _objectSpread(_objectSpread({
             variant: "textDark",
             startIcon: addFilterIcon,
             onClick: addNewFilter
           }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileAddFilterButton), {}, {
             children: addFilterText
           }))
-        })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(MobileDialogFooterActions, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogFooterActions), {}, {
-          children: [openedPanelValue === _xDataGrid.GridPreferencePanelsValue.filters && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        })), /*#__PURE__*/_jsxs(MobileDialogFooterActions, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.mobileDialogFooterActions), {}, {
+          children: [openedPanelValue === GridPreferencePanelsValue.filters && /*#__PURE__*/_jsxs(_Fragment, {
             children: [resetFiltersButton, applyButton]
-          }), openedPanelValue === _xDataGrid.GridPreferencePanelsValue.columns && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          }), openedPanelValue === GridPreferencePanelsValue.columns && /*#__PURE__*/_jsxs(_Fragment, {
             children: [resetColumnsButton, applyButton]
           })]
         }))]
       }))]
     }));
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(DesktopGridPanel, _objectSpread(_objectSpread({
+  return /*#__PURE__*/_jsxs(DesktopGridPanel, _objectSpread(_objectSpread({
     ownerState: rootProps,
     open: open
   }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.desktopGridPanel), {}, {
-    children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)(DesktopPanelFooterDivider, _objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.desktopPanelFooterDivider)), /*#__PURE__*/(0, _jsxRuntime.jsxs)(DesktopPanelFooter, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.desktopPanelFooter), {}, {
-      children: [openedPanelValue === _xDataGrid.GridPreferencePanelsValue.filters && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          children: !rootProps.disableMultipleColumnsFiltering && /*#__PURE__*/(0, _jsxRuntime.jsx)(DesktopAddFilterButton, {
+    children: [children, /*#__PURE__*/_jsx(DesktopPanelFooterDivider, _objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.desktopPanelFooterDivider)), /*#__PURE__*/_jsxs(DesktopPanelFooter, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.desktopPanelFooter), {}, {
+      children: [openedPanelValue === GridPreferencePanelsValue.filters && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx("div", {
+          children: !rootProps.disableMultipleColumnsFiltering && /*#__PURE__*/_jsx(DesktopAddFilterButton, {
             variant: "outlined",
             startIcon: addFilterIcon,
             onClick: addNewFilter,
             children: addFilterText
           })
         }), resetFiltersButton]
-      }), openedPanelValue === _xDataGrid.GridPreferencePanelsValue.columns && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      }), openedPanelValue === GridPreferencePanelsValue.columns && /*#__PURE__*/_jsxs(_Fragment, {
         children: [resetColumnsButton, applyButton]
       })]
     }))]
   }));
 };
-var DesktopGridPanel = (0, _createComponentSlot.createComponentSlot)(_xDataGrid.GridPanel)({
+var DesktopGridPanel = createComponentSlot(GridPanel)({
   componentName: "DataGridPanel",
   slotName: "desktopGridPanel"
-})((0, _material.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    .MuiDataGrid-panelHeader,\n    .MuiDataGrid-columnsManagementHeader,\n    .MuiDataGrid-panelFooter,\n    .MuiDataGrid-columnsManagementFooter {\n        // Hide MUIs header and footer so we can add our own with a better structure for styling\n        display: none;\n    }\n"]))));
-var DesktopPanelFooterDivider = (0, _createComponentSlot.createComponentSlot)(_material.Divider)({
+})(css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    .MuiDataGrid-panelHeader,\n    .MuiDataGrid-columnsManagementHeader,\n    .MuiDataGrid-panelFooter,\n    .MuiDataGrid-columnsManagementFooter {\n        // Hide MUIs header and footer so we can add our own with a better structure for styling\n        display: none;\n    }\n"]))));
+var DesktopPanelFooterDivider = createComponentSlot(Divider)({
   componentName: "DataGridPanel",
   slotName: "desktopPanelFooterDivider"
 })();
-var DesktopPanelFooter = (0, _createComponentSlot.createComponentSlot)("div")({
+var DesktopPanelFooter = createComponentSlot("div")({
   componentName: "DataGridPanel",
   slotName: "desktopPanelFooter"
 })(function (_ref) {
   var theme = _ref.theme;
-  return (0, _material.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        display: flex;\n        justify-content: space-between;\n        padding: ", ";\n    "])), theme.spacing(4));
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        display: flex;\n        justify-content: space-between;\n        padding: ", ";\n    "])), theme.spacing(4));
 });
-var DesktopAddFilterButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var DesktopAddFilterButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "desktopAddFilterButton"
 })();
-var MobileDialog = (0, _createComponentSlot.createComponentSlot)(_material.Dialog)({
+var MobileDialog = createComponentSlot(Dialog)({
   componentName: "DataGridPanel",
   slotName: "mobileDialog"
-})((0, _material.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    .MuiDataGrid-panelContent,\n    .MuiDataGrid-columnsManagement {\n        max-height: none;\n    }\n\n    .MuiDataGrid-panelHeader,\n    .MuiDataGrid-columnsManagementHeader,\n    .MuiDataGrid-panelFooter,\n    .MuiDataGrid-columnsManagementFooter {\n        // Hide MUIs header and footer so we can add our own with a better structure for styling\n        display: none;\n    }\n"]))));
-var MobileDialogHeader = (0, _createComponentSlot.createComponentSlot)("div")({
+})(css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    .MuiDataGrid-panelContent,\n    .MuiDataGrid-columnsManagement {\n        max-height: none;\n    }\n\n    .MuiDataGrid-panelHeader,\n    .MuiDataGrid-columnsManagementHeader,\n    .MuiDataGrid-panelFooter,\n    .MuiDataGrid-columnsManagementFooter {\n        // Hide MUIs header and footer so we can add our own with a better structure for styling\n        display: none;\n    }\n"]))));
+var MobileDialogHeader = createComponentSlot("div")({
   componentName: "DataGridPanel",
   slotName: "mobileDialogHeader"
 })(function (_ref2) {
   var theme = _ref2.theme;
-  return (0, _material.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        position: relative;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: ", ";\n        padding-left: ", ";\n        box-shadow: ", ";\n    "])), theme.spacing(2), theme.spacing(4), theme.shadows[4]);
+  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        position: relative;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: ", ";\n        padding-left: ", ";\n        box-shadow: ", ";\n    "])), theme.spacing(2), theme.spacing(4), theme.shadows[4]);
 });
-var MobileDialogTitle = (0, _createComponentSlot.createComponentSlot)(_material.Typography)({
+var MobileDialogTitle = createComponentSlot(Typography)({
   componentName: "DataGridPanel",
   slotName: "mobileDialogTitle"
 })();
-var MobileDialogCloseButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var MobileDialogCloseButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "mobileDialogCloseButton"
-})((0, _material.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    min-width: 0; // TODO: Should this be done in the theme?\n"]))));
-var MobileDialogContent = (0, _createComponentSlot.createComponentSlot)(_material.DialogContent)({
+})(css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    min-width: 0; // TODO: Should this be done in the theme?\n"]))));
+var MobileDialogContent = createComponentSlot(DialogContent)({
   componentName: "DataGridPanel",
   slotName: "mobileDialogContent"
 })(function (_ref3) {
   var theme = _ref3.theme;
-  return (0, _material.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        padding: 0;\n        background-color: white;\n\n        ", " {\n            padding: 0;\n        }\n    "])), theme.breakpoints.up("sm"));
+  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        padding: 0;\n        background-color: white;\n\n        ", " {\n            padding: 0;\n        }\n    "])), theme.breakpoints.up("sm"));
 });
-var MobileDialogFooter = (0, _createComponentSlot.createComponentSlot)("div")({
+var MobileDialogFooter = createComponentSlot("div")({
   componentName: "DataGridPanel",
   slotName: "mobileDialogFooter"
 })();
-var MobileAddFilterButtonWrapper = (0, _createComponentSlot.createComponentSlot)("div")({
+var MobileAddFilterButtonWrapper = createComponentSlot("div")({
   componentName: "DataGridPanel",
   slotName: "mobileAddFilterButtonWrapper"
 })(function (_ref4) {
   var theme = _ref4.theme;
-  return (0, _material.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        position: relative;\n        display: flex;\n        justify-content: center;\n        padding: ", " ", ";\n        box-shadow: ", ";\n        border-bottom: 1px solid ", ";\n    "])), theme.spacing(2), theme.spacing(4), theme.shadows[4], theme.palette.divider);
+  return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        position: relative;\n        display: flex;\n        justify-content: center;\n        padding: ", " ", ";\n        box-shadow: ", ";\n        border-bottom: 1px solid ", ";\n    "])), theme.spacing(2), theme.spacing(4), theme.shadows[4], theme.palette.divider);
 });
-var MobileAddFilterButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var MobileAddFilterButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "mobileAddFilterButton"
 })();
-var MobileDialogFooterActions = (0, _createComponentSlot.createComponentSlot)("div")({
+var MobileDialogFooterActions = createComponentSlot("div")({
   componentName: "DataGridPanel",
   slotName: "mobileDialogFooterActions"
 })(function (_ref5) {
   var theme = _ref5.theme;
-  return (0, _material.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        display: flex;\n        justify-content: space-between;\n        padding: ", ";\n        box-shadow: ", ";\n    "])), theme.spacing(4), theme.shadows[4]);
+  return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        display: flex;\n        justify-content: space-between;\n        padding: ", ";\n        box-shadow: ", ";\n    "])), theme.spacing(4), theme.shadows[4]);
 });
-var ResetFiltersButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var ResetFiltersButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "resetFiltersButton"
 })();
-var ResetColumnsButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var ResetColumnsButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "resetColumnsButton"
 })();
-var ApplyButton = (0, _createComponentSlot.createComponentSlot)(_Button.Button)({
+var ApplyButton = createComponentSlot(Button)({
   componentName: "DataGridPanel",
   slotName: "applyButton"
 })();

package/lib/dataGrid/GridCellContent.js

@@ -1,13 +1,4 @@
-"use strict";
-
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridCellContent = void 0;
-var _material = require("@mui/material");
-var _createComponentSlot = require("../helpers/createComponentSlot");
-var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 var _excluded = ["children", "primaryText", "secondaryText", "slotProps", "icon"];
 function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
@@ -18,8 +9,11 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-var GridCellContent = exports.GridCellContent = function GridCellContent(inProps) {
-  var _useThemeProps = (0, _material.useThemeProps)({
+import { css, Typography, useThemeProps } from "@mui/material";
+import { createComponentSlot } from "../helpers/createComponentSlot";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var GridCellContent = function GridCellContent(inProps) {
+  var _useThemeProps = useThemeProps({
       props: inProps,
       name: "CometAdminGridCellContent"
     }),
@@ -32,23 +26,23 @@ var GridCellContent = exports.GridCellContent = function GridCellContent(inProps
   var ownerState = {
     hasSecondaryText: Boolean(secondaryText)
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, _objectSpread(_objectSpread(_objectSpread({
+  return /*#__PURE__*/_jsxs(Root, _objectSpread(_objectSpread(_objectSpread({
     ownerState: ownerState
   }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.root), restProps), {}, {
-    children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconContainer, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.iconContainer), {}, {
+    children: [icon && /*#__PURE__*/_jsx(IconContainer, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.iconContainer), {}, {
       children: icon
-    })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(TextContainer, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(PrimaryText, _objectSpread(_objectSpread({
+    })), /*#__PURE__*/_jsxs(TextContainer, {
+      children: [/*#__PURE__*/_jsx(PrimaryText, _objectSpread(_objectSpread({
         ownerState: ownerState
       }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.primaryText), {}, {
         children: primaryText ? primaryText : children
-      })), ownerState.hasSecondaryText && /*#__PURE__*/(0, _jsxRuntime.jsx)(SecondaryText, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.secondaryText), {}, {
+      })), ownerState.hasSecondaryText && /*#__PURE__*/_jsx(SecondaryText, _objectSpread(_objectSpread({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.secondaryText), {}, {
         children: secondaryText
       }))]
     })]
   }));
 };
-var Root = (0, _createComponentSlot.createComponentSlot)("div")({
+var Root = createComponentSlot("div")({
   componentName: "GridCellContent",
   slotName: "root",
   classesResolver: function classesResolver(ownerState) {
@@ -56,29 +50,29 @@ var Root = (0, _createComponentSlot.createComponentSlot)("div")({
   }
 })(function (_ref) {
   var theme = _ref.theme;
-  return (0, _material.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        display: flex;\n        align-items: center;\n        gap: ", ";\n        overflow: hidden;\n        line-height: 0;\n        height: 100%;\n    "])), theme.spacing(2));
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        display: flex;\n        align-items: center;\n        gap: ", ";\n        overflow: hidden;\n        line-height: 0;\n        height: 100%;\n    "])), theme.spacing(2));
 });
-var TextContainer = (0, _createComponentSlot.createComponentSlot)("div")({
+var TextContainer = createComponentSlot("div")({
   componentName: "GridCellContent",
   slotName: "textContainer"
-})((0, _material.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    overflow: hidden;\n"]))));
-var IconContainer = (0, _createComponentSlot.createComponentSlot)("div")({
+})(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    overflow: hidden;\n"]))));
+var IconContainer = createComponentSlot("div")({
   componentName: "GridCellContent",
   slotName: "iconContainer"
-})((0, _material.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    flex-shrink: 0;\n"]))));
-var ellipsisStyles = (0, _material.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n"])));
-var PrimaryText = (0, _createComponentSlot.createComponentSlot)(_material.Typography)({
+})(css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    flex-shrink: 0;\n"]))));
+var ellipsisStyles = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n"])));
+var PrimaryText = createComponentSlot(Typography)({
   componentName: "GridCellContent",
   slotName: "primaryText"
 })(function (_ref2) {
   var theme = _ref2.theme,
     ownerState = _ref2.ownerState;
-  return (0, _material.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        color: ", ";\n        font-size: 12px;\n        font-weight: ", ";\n        line-height: 16px;\n        ", "\n\n        ", " {\n            font-size: 14px;\n            line-height: 20px;\n        }\n    "])), theme.palette.grey[800], ownerState.hasSecondaryText ? 400 : 300, ellipsisStyles, theme.breakpoints.up("md"));
+  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        color: ", ";\n        font-size: 12px;\n        font-weight: ", ";\n        line-height: 16px;\n        ", "\n\n        ", " {\n            font-size: 14px;\n            line-height: 20px;\n        }\n    "])), theme.palette.grey[800], ownerState.hasSecondaryText ? 400 : 300, ellipsisStyles, theme.breakpoints.up("md"));
 });
-var SecondaryText = (0, _createComponentSlot.createComponentSlot)(_material.Typography)({
+var SecondaryText = createComponentSlot(Typography)({
   componentName: "GridCellContent",
   slotName: "secondaryText"
 })(function (_ref3) {
   var theme = _ref3.theme;
-  return (0, _material.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        color: ", ";\n        font-size: 10px;\n        font-weight: 400;\n        line-height: 16px;\n        ", "\n\n        ", " {\n            font-size: 12px;\n        }\n    "])), theme.palette.grey[300], ellipsisStyles, theme.breakpoints.up("md"));
+  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        color: ", ";\n        font-size: 10px;\n        font-weight: 400;\n        line-height: 16px;\n        ", "\n\n        ", " {\n            font-size: 12px;\n        }\n    "])), theme.palette.grey[300], ellipsisStyles, theme.breakpoints.up("md"));
 });

package/lib/dataGrid/GridColDef.js

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

package/lib/dataGrid/GridColumnsButton.js

@@ -1,33 +1,27 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridColumnsButton = GridColumnsButton;
-var _adminIcons = require("@comet/admin-icons");
-var _xDataGrid = require("@mui/x-data-grid");
-var _react = require("react");
-var _reactIntl = require("react-intl");
-var _Button = require("../common/buttons/Button");
-var _messages = require("../messages");
-var _jsxRuntime = require("react/jsx-runtime");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function GridColumnsButton(props) {
-  var apiRef = (0, _xDataGrid.useGridApiContext)();
-  var handleFilterClick = (0, _react.useCallback)(function () {
-    apiRef.current.showPreferences(_xDataGrid.GridPreferencePanelsValue.columns);
+import { Columns4 } from "@comet/admin-icons";
+import { GridPreferencePanelsValue, useGridApiContext } from "@mui/x-data-grid";
+import { useCallback } from "react";
+import { FormattedMessage } from "react-intl";
+import { Button } from "../common/buttons/Button";
+import { messages } from "../messages";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function GridColumnsButton(props) {
+  var apiRef = useGridApiContext();
+  var handleFilterClick = useCallback(function () {
+    apiRef.current.showPreferences(GridPreferencePanelsValue.columns);
   }, [apiRef]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, _objectSpread(_objectSpread({
+  return /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
     responsive: true,
-    startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Columns4, {}),
+    startIcon: /*#__PURE__*/_jsx(Columns4, {}),
     variant: "outlined",
     onClick: handleFilterClick
   }, props), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, _objectSpread({}, _messages.messages.columns))
+    children: /*#__PURE__*/_jsx(FormattedMessage, _objectSpread({}, messages.columns))
   }));
 }

package/lib/dataGrid/GridFilterButton.js

@@ -1,36 +1,30 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridFilterButton = GridFilterButton;
-var _adminIcons = require("@comet/admin-icons");
-var _material = require("@mui/material");
-var _xDataGrid = require("@mui/x-data-grid");
-var _react = require("react");
-var _reactIntl = require("react-intl");
-var _Button = require("../common/buttons/Button");
-var _messages = require("../messages");
-var _jsxRuntime = require("react/jsx-runtime");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function GridFilterButton(props) {
-  var apiRef = (0, _xDataGrid.useGridApiContext)();
-  var filterModel = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridFilterModelSelector);
+import { Filter } from "@comet/admin-icons";
+import { Chip } from "@mui/material";
+import { gridFilterModelSelector, useGridApiContext, useGridSelector } from "@mui/x-data-grid";
+import { useCallback } from "react";
+import { FormattedMessage } from "react-intl";
+import { Button } from "../common/buttons/Button";
+import { messages } from "../messages";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function GridFilterButton(props) {
+  var apiRef = useGridApiContext();
+  var filterModel = useGridSelector(apiRef, gridFilterModelSelector);
   var filterCount = filterModel.items.length;
-  var handleFilterClick = (0, _react.useCallback)(function () {
+  var handleFilterClick = useCallback(function () {
     apiRef.current.showFilterPanel();
   }, [apiRef]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, _objectSpread(_objectSpread({
+  return /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
     responsive: true,
-    startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Filter, {}),
+    startIcon: /*#__PURE__*/_jsx(Filter, {}),
     variant: "outlined",
     onClick: handleFilterClick,
-    endIcon: filterCount > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
+    endIcon: filterCount > 0 ? /*#__PURE__*/_jsx(Chip, {
       label: "".concat(filterCount),
       size: "small"
     }) : null,
@@ -38,6 +32,6 @@ function GridFilterButton(props) {
       maxHeight: "40px"
     }
   }, props), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, _objectSpread({}, _messages.messages.filter))
+    children: /*#__PURE__*/_jsx(FormattedMessage, _objectSpread({}, messages.filter))
   }));
 }