wip:milestone 0 fixes

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/DataGrid.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { DataGridProps } from '../models/props/DataGridProps';
+import { GridValidRowModel } from '../models/gridRows';
+interface DataGridComponent {
+    <R extends GridValidRowModel = any>(props: DataGridProps<R> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+    propTypes?: any;
+}
+/**
+ * Demos:
+ * - [DataGrid](https://mui.com/x/react-data-grid/demo/)
+ *
+ * API:
+ * - [DataGrid API](https://mui.com/x/api/data-grid/data-grid/)
+ */
+export declare const DataGrid: DataGridComponent;
+/**
+ * Remove at v7
+ * @deprecated
+ */
+export declare const SUBMIT_FILTER_STROKE_TIME: number;
+/**
+ * Remove at v7
+ * @deprecated
+ */
+export declare const SUBMIT_FILTER_DATE_STROKE_TIME: number;
+export {};

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/DataGrid.js

@@ -0,0 +1,687 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { chainPropTypes } from '@mui/utils';
+import { GridBody, GridFooterPlaceholder, GridHeader, GridRoot } from '../components';
+import { GridContextProvider } from '../context/GridContextProvider';
+import { useDataGridComponent } from './useDataGridComponent';
+import { useDataGridProps, DATA_GRID_PROPS_DEFAULT_VALUES } from './useDataGridProps';
+import { DataGridVirtualScroller } from '../components/DataGridVirtualScroller';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const DataGridRaw = /*#__PURE__*/React.forwardRef(function DataGrid(inProps, ref) {
+  const props = useDataGridProps(inProps);
+  const privateApiRef = useDataGridComponent(props.apiRef, props);
+  return /*#__PURE__*/_jsx(GridContextProvider, {
+    privateApiRef: privateApiRef,
+    props: props,
+    children: /*#__PURE__*/_jsxs(GridRoot, _extends({
+      className: props.className,
+      style: props.style,
+      sx: props.sx,
+      ref: ref
+    }, props.forwardedProps, {
+      children: [/*#__PURE__*/_jsx(GridHeader, {}), /*#__PURE__*/_jsx(GridBody, {
+        VirtualScrollerComponent: DataGridVirtualScroller
+      }), /*#__PURE__*/_jsx(GridFooterPlaceholder, {})]
+    }))
+  });
+});
+/**
+ * Demos:
+ * - [DataGrid](https://mui.com/x/react-data-grid/demo/)
+ *
+ * API:
+ * - [DataGrid API](https://mui.com/x/api/data-grid/data-grid/)
+ */
+export const DataGrid = /*#__PURE__*/React.memo(DataGridRaw);
+
+/**
+ * Remove at v7
+ * @deprecated
+ */
+export const SUBMIT_FILTER_STROKE_TIME = DATA_GRID_PROPS_DEFAULT_VALUES.filterDebounceMs;
+
+/**
+ * Remove at v7
+ * @deprecated
+ */
+export const SUBMIT_FILTER_DATE_STROKE_TIME = DATA_GRID_PROPS_DEFAULT_VALUES.filterDebounceMs;
+DataGridRaw.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * The ref object that allows Data Grid manipulation. Can be instantiated with `useGridApiRef()`.
+   */
+  apiRef: PropTypes.shape({
+    current: PropTypes.object.isRequired
+  }),
+  /**
+   * The label of the Data Grid.
+   */
+  'aria-label': PropTypes.string,
+  /**
+   * The id of the element containing a label for the Data Grid.
+   */
+  'aria-labelledby': PropTypes.string,
+  /**
+   * If `true`, the Data Grid height is dynamic and follow the number of rows in the Data Grid.
+   * @default false
+   */
+  autoHeight: PropTypes.bool,
+  /**
+   * If `true`, the pageSize is calculated according to the container size and the max number of rows to avoid rendering a vertical scroll bar.
+   * @default false
+   */
+  autoPageSize: PropTypes.bool,
+  /**
+   * Controls the modes of the cells.
+   */
+  cellModesModel: PropTypes.object,
+  /**
+   * If `true`, the Data Grid will display an extra column with checkboxes for selecting rows.
+   * @default false
+   */
+  checkboxSelection: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The character used to separate cell values when copying to the clipboard.
+   * @default '\t'
+   */
+  clipboardCopyCellDelimiter: PropTypes.string,
+  /**
+   * Number of extra columns to be rendered before/after the visible slice.
+   * @default 3
+   */
+  columnBuffer: PropTypes.number,
+  columnGroupingModel: PropTypes.arrayOf(PropTypes.object),
+  /**
+   * Sets the height in pixel of the column headers in the Data Grid.
+   * @default 56
+   */
+  columnHeaderHeight: PropTypes.number,
+  /**
+   * Set of columns of type [[GridColDef[]]].
+   */
+  columns: chainPropTypes(PropTypes.array.isRequired, props => {
+    // @ts-ignore because otherwise `build:api` doesn't work
+    if (props.columns && props.columns.some(column => column.resizable)) {
+      return new Error([`MUI: \`column.resizable = true\` is not a valid prop.`, 'Column resizing is not available in the MIT version.', '', 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));
+    }
+    return null;
+  }),
+  /**
+   * Number of rows from the `columnBuffer` that can be visible before a new slice is rendered.
+   * @default 3
+   */
+  columnThreshold: PropTypes.number,
+  /**
+   * Set the column visibility model of the Data Grid.
+   * If defined, the Data Grid will ignore the `hide` property in [[GridColDef]].
+   */
+  columnVisibilityModel: PropTypes.object,
+  /**
+   * Overridable components.
+   * @deprecated Use `slots` instead.
+   */
+  components: PropTypes.object,
+  /**
+   * Overridable components props dynamically passed to the component at rendering.
+   * @deprecated Use the `slotProps` prop instead.
+   */
+  componentsProps: PropTypes.object,
+  /**
+   * Set the density of the Data Grid.
+   * @default "standard"
+   */
+  density: PropTypes.oneOf(['comfortable', 'compact', 'standard']),
+  /**
+   * If `true`, column filters are disabled.
+   * @default false
+   */
+  disableColumnFilter: PropTypes.bool,
+  /**
+   * If `true`, the column menu is disabled.
+   * @default false
+   */
+  disableColumnMenu: PropTypes.bool,
+  /**
+   * If `true`, hiding/showing columns is disabled.
+   * @default false
+   */
+  disableColumnSelector: PropTypes.bool,
+  /**
+   * If `true`, the density selector is disabled.
+   * @default false
+   */
+  disableDensitySelector: PropTypes.bool,
+  /**
+   * If `true`, `eval()` is not used for performance optimization.
+   * @default false
+   */
+  disableEval: PropTypes.bool,
+  /**
+   * If `true`, the selection on click on a row or cell is disabled.
+   * @default false
+   */
+  disableRowSelectionOnClick: PropTypes.bool,
+  /**
+   * If `true`, the virtualization is disabled.
+   * @default false
+   */
+  disableVirtualization: PropTypes.bool,
+  /**
+   * Controls whether to use the cell or row editing.
+   * @default "cell"
+   */
+  editMode: PropTypes.oneOf(['cell', 'row']),
+  /**
+   * Unstable features, breaking changes might be introduced.
+   * For each feature, if the flag is not explicitly set to `true`, the feature will be fully disabled and any property / method call will not have any effect.
+   */
+  experimentalFeatures: PropTypes.shape({
+    ariaV7: PropTypes.bool,
+    columnGrouping: PropTypes.bool,
+    warnIfFocusStateIsNotSynced: PropTypes.bool
+  }),
+  /**
+   * The milliseconds delay to wait after a keystroke before triggering filtering.
+   * @default 150
+   */
+  filterDebounceMs: PropTypes.number,
+  /**
+   * Filtering can be processed on the server or client-side.
+   * Set it to 'server' if you would like to handle filtering on the server-side.
+   * @default "client"
+   */
+  filterMode: PropTypes.oneOf(['client', 'server']),
+  /**
+   * Set the filter model of the Data Grid.
+   */
+  filterModel: PropTypes.shape({
+    items: PropTypes.arrayOf(PropTypes.shape({
+      field: PropTypes.string.isRequired,
+      id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+      operator: PropTypes.string.isRequired,
+      value: PropTypes.any
+    })).isRequired,
+    logicOperator: PropTypes.oneOf(['and', 'or']),
+    quickFilterExcludeHiddenColumns: PropTypes.bool,
+    quickFilterLogicOperator: PropTypes.oneOf(['and', 'or']),
+    quickFilterValues: PropTypes.array
+  }),
+  /**
+   * Forwarded props for the Data Grid root element.
+   * @ignore - do not document.
+   */
+  forwardedProps: PropTypes.object,
+  /**
+   * Function that applies CSS classes dynamically on cells.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @returns {string} The CSS class to apply to the cell.
+   */
+  getCellClassName: PropTypes.func,
+  /**
+   * Function that returns the element to render in row detail.
+   * @param {GridRowParams} params With all properties from [[GridRowParams]].
+   * @returns {React.JSX.Element} The row detail element.
+   */
+  getDetailPanelContent: PropTypes.func,
+  /**
+   * Function that returns the estimated height for a row.
+   * Only works if dynamic row height is used.
+   * Once the row height is measured this value is discarded.
+   * @param {GridRowHeightParams} params With all properties from [[GridRowHeightParams]].
+   * @returns {number | null} The estimated row height value. If `null` or `undefined` then the default row height, based on the density, is applied.
+   */
+  getEstimatedRowHeight: PropTypes.func,
+  /**
+   * Function that applies CSS classes dynamically on rows.
+   * @param {GridRowClassNameParams} params With all properties from [[GridRowClassNameParams]].
+   * @returns {string} The CSS class to apply to the row.
+   */
+  getRowClassName: PropTypes.func,
+  /**
+   * Function that sets the row height per row.
+   * @param {GridRowHeightParams} params With all properties from [[GridRowHeightParams]].
+   * @returns {GridRowHeightReturnValue} The row height value. If `null` or `undefined` then the default row height is applied. If "auto" then the row height is calculated based on the content.
+   */
+  getRowHeight: PropTypes.func,
+  /**
+   * Return the id of a given [[GridRowModel]].
+   */
+  getRowId: PropTypes.func,
+  /**
+   * Function that allows to specify the spacing between rows.
+   * @param {GridRowSpacingParams} params With all properties from [[GridRowSpacingParams]].
+   * @returns {GridRowSpacing} The row spacing values.
+   */
+  getRowSpacing: PropTypes.func,
+  /**
+   * If `true`, the footer component is hidden.
+   * @default false
+   */
+  hideFooter: PropTypes.bool,
+  /**
+   * If `true`, the pagination component in the footer is hidden.
+   * @default false
+   */
+  hideFooterPagination: PropTypes.bool,
+  /**
+   * If `true`, the selected row count in the footer is hidden.
+   * @default false
+   */
+  hideFooterSelectedRowCount: PropTypes.bool,
+  /**
+   * If `true`, the diacritics (accents) are ignored when filtering or quick filtering.
+   * E.g. when filter value is `cafe`, the rows with `café` will be visible.
+   * @default false
+   */
+  ignoreDiacritics: PropTypes.bool,
+  /**
+   * The initial state of the DataGrid.
+   * The data in it will be set in the state on initialization but will not be controlled.
+   * If one of the data in `initialState` is also being controlled, then the control state wins.
+   */
+  initialState: PropTypes.object,
+  /**
+   * Callback fired when a cell is rendered, returns true if the cell is editable.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @returns {boolean} A boolean indicating if the cell is editable.
+   */
+  isCellEditable: PropTypes.func,
+  /**
+   * Determines if a row can be selected.
+   * @param {GridRowParams} params With all properties from [[GridRowParams]].
+   * @returns {boolean} A boolean indicating if the cell is selectable.
+   */
+  isRowSelectable: PropTypes.func,
+  /**
+   * If `true`, the selection model will retain selected rows that do not exist.
+   * Useful when using server side pagination and row selections need to be retained
+   * when changing pages.
+   * @default false
+   */
+  keepNonExistentRowsSelected: PropTypes.bool,
+  /**
+   * If `true`, a  loading overlay is displayed.
+   */
+  loading: PropTypes.bool,
+  /**
+   * Set the locale text of the Data Grid.
+   * You can find all the translation keys supported in [the source](https://github.com/mui/mui-x/blob/v6.19.4/packages/grid/x-data-grid/src/constants/localeTextConstants.ts) in the GitHub repository.
+   */
+  localeText: PropTypes.object,
+  /**
+   * Pass a custom logger in the components that implements the [[Logger]] interface.
+   * @default console
+   */
+  logger: PropTypes.shape({
+    debug: PropTypes.func.isRequired,
+    error: PropTypes.func.isRequired,
+    info: PropTypes.func.isRequired,
+    warn: PropTypes.func.isRequired
+  }),
+  /**
+   * Allows to pass the logging level or false to turn off logging.
+   * @default "error" ("warn" in dev mode)
+   */
+  logLevel: PropTypes.oneOf(['debug', 'error', 'info', 'warn', false]),
+  /**
+   * Nonce of the inline styles for [Content Security Policy](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute).
+   */
+  nonce: PropTypes.string,
+  /**
+   * Callback fired when any cell is clicked.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onCellClick: PropTypes.func,
+  /**
+   * Callback fired when a double click event comes from a cell element.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onCellDoubleClick: PropTypes.func,
+  /**
+   * Callback fired when the cell turns to edit mode.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @param {MuiEvent<React.KeyboardEvent | React.MouseEvent>} event The event that caused this prop to be called.
+   */
+  onCellEditStart: PropTypes.func,
+  /**
+   * Callback fired when the cell turns to view mode.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @param {MuiEvent<MuiBaseEvent>} event The event that caused this prop to be called.
+   */
+  onCellEditStop: PropTypes.func,
+  /**
+   * Callback fired when a keydown event comes from a cell element.
+   * @param {GridCellParams} params With all properties from [[GridCellParams]].
+   * @param {MuiEvent<React.KeyboardEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onCellKeyDown: PropTypes.func,
+  /**
+   * Callback fired when the `cellModesModel` prop changes.
+   * @param {GridCellModesModel} cellModesModel Object containing which cells are in "edit" mode.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onCellModesModelChange: PropTypes.func,
+  /**
+   * Callback called when the data is copied to the clipboard.
+   * @param {string} data The data copied to the clipboard.
+   */
+  onClipboardCopy: PropTypes.func,
+  /**
+   * Callback fired when a click event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderClick: PropTypes.func,
+  /**
+   * Callback fired when a double click event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderDoubleClick: PropTypes.func,
+  /**
+   * Callback fired when a mouse enter event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderEnter: PropTypes.func,
+  /**
+   * Callback fired when a mouse leave event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderLeave: PropTypes.func,
+  /**
+   * Callback fired when a mouseout event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderOut: PropTypes.func,
+  /**
+   * Callback fired when a mouseover event comes from a column header element.
+   * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnHeaderOver: PropTypes.func,
+  /**
+   * Callback fired when a column is reordered.
+   * @param {GridColumnOrderChangeParams} params With all properties from [[GridColumnOrderChangeParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnOrderChange: PropTypes.func,
+  /**
+   * Callback fired when the column visibility model changes.
+   * @param {GridColumnVisibilityModel} model The new model.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onColumnVisibilityModelChange: PropTypes.func,
+  /**
+   * Callback fired when the Filter model changes before the filters are applied.
+   * @param {GridFilterModel} model With all properties from [[GridFilterModel]].
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onFilterModelChange: PropTypes.func,
+  /**
+   * Callback fired when the menu is closed.
+   * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onMenuClose: PropTypes.func,
+  /**
+   * Callback fired when the menu is opened.
+   * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onMenuOpen: PropTypes.func,
+  /**
+   * Callback fired when the pagination model has changed.
+   * @param {GridPaginationModel} model Updated pagination model.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onPaginationModelChange: PropTypes.func,
+  /**
+   * Callback fired when the preferences panel is closed.
+   * @param {GridPreferencePanelParams} params With all properties from [[GridPreferencePanelParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onPreferencePanelClose: PropTypes.func,
+  /**
+   * Callback fired when the preferences panel is opened.
+   * @param {GridPreferencePanelParams} params With all properties from [[GridPreferencePanelParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onPreferencePanelOpen: PropTypes.func,
+  /**
+   * Callback called when `processRowUpdate` throws an error or rejects.
+   * @param {any} error The error thrown.
+   */
+  onProcessRowUpdateError: PropTypes.func,
+  /**
+   * Callback fired when the Data Grid is resized.
+   * @param {ElementSize} containerSize With all properties from [[ElementSize]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onResize: PropTypes.func,
+  /**
+   * Callback fired when a row is clicked.
+   * Not called if the target clicked is an interactive element added by the built-in columns.
+   * @param {GridRowParams} params With all properties from [[GridRowParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onRowClick: PropTypes.func,
+  /**
+   * Callback fired when the row count has changed.
+   * @param {number} count Updated row count.
+   */
+  onRowCountChange: PropTypes.func,
+  /**
+   * Callback fired when a double click event comes from a row container element.
+   * @param {GridRowParams} params With all properties from [[RowParams]].
+   * @param {MuiEvent<React.MouseEvent>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onRowDoubleClick: PropTypes.func,
+  /**
+   * Callback fired when the row turns to edit mode.
+   * @param {GridRowParams} params With all properties from [[GridRowParams]].
+   * @param {MuiEvent<React.KeyboardEvent | React.MouseEvent>} event The event that caused this prop to be called.
+   */
+  onRowEditStart: PropTypes.func,
+  /**
+   * Callback fired when the row turns to view mode.
+   * @param {GridRowParams} params With all properties from [[GridRowParams]].
+   * @param {MuiEvent<MuiBaseEvent>} event The event that caused this prop to be called.
+   */
+  onRowEditStop: PropTypes.func,
+  /**
+   * Callback fired when the `rowModesModel` prop changes.
+   * @param {GridRowModesModel} rowModesModel Object containing which rows are in "edit" mode.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onRowModesModelChange: PropTypes.func,
+  /**
+   * Callback fired when the selection state of one or multiple rows changes.
+   * @param {GridRowSelectionModel} rowSelectionModel With all the row ids [[GridSelectionModel]].
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onRowSelectionModelChange: PropTypes.func,
+  /**
+   * Callback fired when the sort model changes before a column is sorted.
+   * @param {GridSortModel} model With all properties from [[GridSortModel]].
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onSortModelChange: PropTypes.func,
+  /**
+   * Callback fired when the state of the Data Grid is updated.
+   * @param {GridState} state The new state.
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   * @ignore - do not document.
+   */
+  onStateChange: PropTypes.func,
+  /**
+   * Select the pageSize dynamically using the component UI.
+   * @default [25, 50, 100]
+   */
+  pageSizeOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+    label: PropTypes.string.isRequired,
+    value: PropTypes.number.isRequired
+  })]).isRequired),
+  pagination: props => {
+    if (props.pagination === false) {
+      return new Error(['MUI: `<DataGrid pagination={false} />` is not a valid prop.', 'Infinite scrolling is not available in the MIT version.', '', 'You need to upgrade to DataGridPro or DataGridPremium component to disable the pagination.'].join('\n'));
+    }
+    return null;
+  },
+  /**
+   * Pagination can be processed on the server or client-side.
+   * Set it to 'client' if you would like to handle the pagination on the client-side.
+   * Set it to 'server' if you would like to handle the pagination on the server-side.
+   * @default "client"
+   */
+  paginationMode: PropTypes.oneOf(['client', 'server']),
+  /**
+   * The pagination model of type [[GridPaginationModel]] which refers to current `page` and `pageSize`.
+   */
+  paginationModel: PropTypes.shape({
+    page: PropTypes.number.isRequired,
+    pageSize: PropTypes.number.isRequired
+  }),
+  /**
+   * Callback called before updating a row with new values in the row and cell editing.
+   * @template R
+   * @param {R} newRow Row object with the new values.
+   * @param {R} oldRow Row object with the old values.
+   * @returns {Promise<R> | R} The final values to update the row.
+   */
+  processRowUpdate: PropTypes.func,
+  /**
+   * Number of extra rows to be rendered before/after the visible slice.
+   * @default 3
+   */
+  rowBuffer: PropTypes.number,
+  /**
+   * Set the total number of rows, if it is different from the length of the value `rows` prop.
+   * If some rows have children (for instance in the tree data), this number represents the amount of top level rows.
+   */
+  rowCount: PropTypes.number,
+  /**
+   * Sets the height in pixel of a row in the Data Grid.
+   * @default 52
+   */
+  rowHeight: PropTypes.number,
+  /**
+   * Controls the modes of the rows.
+   */
+  rowModesModel: PropTypes.object,
+  /**
+   * The milliseconds delay to wait after measuring the row height before recalculating row positions.
+   * Setting it to a lower value could be useful when using dynamic row height,
+   * but might reduce performance when displaying a large number of rows.
+   * @default 166
+   */
+  rowPositionsDebounceMs: PropTypes.number,
+  /**
+   * Set of rows of type [[GridRowsProp]].
+   */
+  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  /**
+   * If `false`, the row selection mode is disabled.
+   * @default true
+   */
+  rowSelection: PropTypes.bool,
+  /**
+   * Sets the row selection model of the Data Grid.
+   */
+  rowSelectionModel: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired), PropTypes.number, PropTypes.string]),
+  /**
+   * Sets the type of space between rows added by `getRowSpacing`.
+   * @default "margin"
+   */
+  rowSpacingType: PropTypes.oneOf(['border', 'margin']),
+  /**
+   * Number of rows from the `rowBuffer` that can be visible before a new slice is rendered.
+   * @default 3
+   */
+  rowThreshold: PropTypes.number,
+  /**
+   * Override the height/width of the Data Grid inner scrollbar.
+   */
+  scrollbarSize: PropTypes.number,
+  /**
+   * If `true`, the vertical borders of the cells are displayed.
+   * @default false
+   */
+  showCellVerticalBorder: PropTypes.bool,
+  /**
+   * If `true`, the right border of the column headers are displayed.
+   * @default false
+   */
+  showColumnVerticalBorder: PropTypes.bool,
+  /**
+   * Overridable components props dynamically passed to the component at rendering.
+   */
+  slotProps: PropTypes.object,
+  /**
+   * Overridable components.
+   */
+  slots: PropTypes.object,
+  /**
+   * Sorting can be processed on the server or client-side.
+   * Set it to 'client' if you would like to handle sorting on the client-side.
+   * Set it to 'server' if you would like to handle sorting on the server-side.
+   * @default "client"
+   */
+  sortingMode: PropTypes.oneOf(['client', 'server']),
+  /**
+   * The order of the sorting sequence.
+   * @default ['asc', 'desc', null]
+   */
+  sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])),
+  /**
+   * Set the sort model of the Data Grid.
+   */
+  sortModel: PropTypes.arrayOf(PropTypes.shape({
+    field: PropTypes.string.isRequired,
+    sort: PropTypes.oneOf(['asc', 'desc'])
+  })),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * If `true`, the Data Grid will not use `valueFormatter` when exporting to CSV or copying to clipboard.
+   * If an object is provided, you can choose to ignore the `valueFormatter` for CSV export or clipboard export.
+   * @default false
+   */
+  unstable_ignoreValueFormatterDuringExport: PropTypes.oneOfType([PropTypes.shape({
+    clipboardExport: PropTypes.bool,
+    csvExport: PropTypes.bool
+  }), PropTypes.bool])
+};

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DataGrid';
+export { DATA_GRID_PROPS_DEFAULT_VALUES } from './useDataGridProps';

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/index.js

@@ -0,0 +1,2 @@
+export * from './DataGrid';
+export { DATA_GRID_PROPS_DEFAULT_VALUES } from './useDataGridProps';

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "main": "../node/DataGrid/index.js",
+  "types": "./index.d.ts"
+}

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/useDataGridComponent.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { DataGridProcessedProps } from '../models/props/DataGridProps';
+import { GridApiCommunity, GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
+export declare const useDataGridComponent: (inputApiRef: React.MutableRefObject<GridApiCommunity> | undefined, props: DataGridProcessedProps) => import("react").MutableRefObject<GridPrivateApiCommunity>;

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/useDataGridComponent.js

@@ -0,0 +1,80 @@
+import { useGridInitialization } from '../hooks/core/useGridInitialization';
+import { useGridInitializeState } from '../hooks/utils/useGridInitializeState';
+import { useGridClipboard } from '../hooks/features/clipboard/useGridClipboard';
+import { columnMenuStateInitializer, useGridColumnMenu } from '../hooks/features/columnMenu/useGridColumnMenu';
+import { useGridColumns, columnsStateInitializer } from '../hooks/features/columns/useGridColumns';
+import { densityStateInitializer, useGridDensity } from '../hooks/features/density/useGridDensity';
+import { useGridCsvExport } from '../hooks/features/export/useGridCsvExport';
+import { useGridPrintExport } from '../hooks/features/export/useGridPrintExport';
+import { useGridFilter, filterStateInitializer } from '../hooks/features/filter/useGridFilter';
+import { focusStateInitializer, useGridFocus } from '../hooks/features/focus/useGridFocus';
+import { useGridKeyboardNavigation } from '../hooks/features/keyboardNavigation/useGridKeyboardNavigation';
+import { useGridPagination, paginationStateInitializer } from '../hooks/features/pagination/useGridPagination';
+import { useGridPreferencesPanel, preferencePanelStateInitializer } from '../hooks/features/preferencesPanel/useGridPreferencesPanel';
+import { useGridEditing, editingStateInitializer } from '../hooks/features/editing/useGridEditing';
+import { useGridRows, rowsStateInitializer } from '../hooks/features/rows/useGridRows';
+import { useGridRowsPreProcessors } from '../hooks/features/rows/useGridRowsPreProcessors';
+import { useGridParamsApi } from '../hooks/features/rows/useGridParamsApi';
+import { rowSelectionStateInitializer, useGridRowSelection } from '../hooks/features/rowSelection/useGridRowSelection';
+import { useGridRowSelectionPreProcessors } from '../hooks/features/rowSelection/useGridRowSelectionPreProcessors';
+import { useGridSorting, sortingStateInitializer } from '../hooks/features/sorting/useGridSorting';
+import { useGridScroll } from '../hooks/features/scroll/useGridScroll';
+import { useGridEvents } from '../hooks/features/events/useGridEvents';
+import { useGridDimensions } from '../hooks/features/dimensions/useGridDimensions';
+import { rowsMetaStateInitializer, useGridRowsMeta } from '../hooks/features/rows/useGridRowsMeta';
+import { useGridStatePersistence } from '../hooks/features/statePersistence/useGridStatePersistence';
+import { useGridColumnSpanning } from '../hooks/features/columns/useGridColumnSpanning';
+import { useGridColumnGrouping, columnGroupsStateInitializer } from '../hooks/features/columnGrouping/useGridColumnGrouping';
+import { useGridVirtualization, virtualizationStateInitializer } from '../hooks/features/virtualization';
+export const useDataGridComponent = (inputApiRef, props) => {
+  const apiRef = useGridInitialization(inputApiRef, props);
+
+  /**
+   * Register all pre-processors called during state initialization here.
+   */
+  useGridRowSelectionPreProcessors(apiRef, props);
+  useGridRowsPreProcessors(apiRef);
+
+  /**
+   * Register all state initializers here.
+   */
+  useGridInitializeState(rowSelectionStateInitializer, apiRef, props);
+  useGridInitializeState(columnsStateInitializer, apiRef, props);
+  useGridInitializeState(rowsStateInitializer, apiRef, props);
+  useGridInitializeState(editingStateInitializer, apiRef, props);
+  useGridInitializeState(focusStateInitializer, apiRef, props);
+  useGridInitializeState(sortingStateInitializer, apiRef, props);
+  useGridInitializeState(preferencePanelStateInitializer, apiRef, props);
+  useGridInitializeState(filterStateInitializer, apiRef, props);
+  useGridInitializeState(densityStateInitializer, apiRef, props);
+  useGridInitializeState(paginationStateInitializer, apiRef, props);
+  useGridInitializeState(rowsMetaStateInitializer, apiRef, props);
+  useGridInitializeState(columnMenuStateInitializer, apiRef, props);
+  useGridInitializeState(columnGroupsStateInitializer, apiRef, props);
+  useGridInitializeState(virtualizationStateInitializer, apiRef, props);
+  useGridKeyboardNavigation(apiRef, props);
+  useGridRowSelection(apiRef, props);
+  useGridColumns(apiRef, props);
+  useGridRows(apiRef, props);
+  useGridParamsApi(apiRef, props);
+  useGridColumnSpanning(apiRef);
+  useGridColumnGrouping(apiRef, props);
+  useGridEditing(apiRef, props);
+  useGridFocus(apiRef, props);
+  useGridPreferencesPanel(apiRef, props);
+  useGridFilter(apiRef, props);
+  useGridSorting(apiRef, props);
+  useGridDensity(apiRef, props);
+  useGridPagination(apiRef, props);
+  useGridRowsMeta(apiRef, props);
+  useGridScroll(apiRef, props);
+  useGridColumnMenu(apiRef);
+  useGridCsvExport(apiRef, props);
+  useGridPrintExport(apiRef, props);
+  useGridClipboard(apiRef, props);
+  useGridDimensions(apiRef, props);
+  useGridEvents(apiRef, props);
+  useGridStatePersistence(apiRef);
+  useGridVirtualization(apiRef, props);
+  return apiRef;
+};

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/useDataGridProps.d.ts

@@ -0,0 +1,7 @@
+import { DataGridProcessedProps, DataGridProps, DataGridPropsWithDefaultValues } from '../models/props/DataGridProps';
+import { GridValidRowModel } from '../models';
+/**
+ * The default values of `DataGridPropsWithDefaultValues` to inject in the props of DataGrid.
+ */
+export declare const DATA_GRID_PROPS_DEFAULT_VALUES: DataGridPropsWithDefaultValues;
+export declare const useDataGridProps: <R extends GridValidRowModel>(inProps: DataGridProps<R>) => DataGridProcessedProps<R>;

control-plane-ui/node_modules/@mui/x-data-grid/DataGrid/useDataGridProps.js

@@ -0,0 +1,95 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useThemeProps } from '@mui/material/styles';
+import { GRID_DEFAULT_LOCALE_TEXT } from '../constants';
+import { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from '../constants/defaultGridSlotsComponents';
+import { GridEditModes } from '../models';
+import { computeSlots, useProps, uncapitalizeObjectKeys } from '../internals/utils';
+const DATA_GRID_FORCED_PROPS = {
+  disableMultipleColumnsFiltering: true,
+  disableMultipleColumnsSorting: true,
+  disableMultipleRowSelection: true,
+  throttleRowsMs: undefined,
+  hideFooterRowCount: false,
+  pagination: true,
+  checkboxSelectionVisibleOnly: false,
+  disableColumnReorder: true,
+  disableColumnResize: true,
+  keepColumnPositionIfDraggedOutside: false,
+  signature: 'DataGrid'
+};
+
+/**
+ * The default values of `DataGridPropsWithDefaultValues` to inject in the props of DataGrid.
+ */
+export const DATA_GRID_PROPS_DEFAULT_VALUES = {
+  autoHeight: false,
+  autoPageSize: false,
+  checkboxSelection: false,
+  checkboxSelectionVisibleOnly: false,
+  columnBuffer: 3,
+  rowBuffer: 3,
+  columnThreshold: 3,
+  rowThreshold: 3,
+  rowSelection: true,
+  density: 'standard',
+  disableColumnFilter: false,
+  disableColumnMenu: false,
+  disableColumnSelector: false,
+  disableDensitySelector: false,
+  disableEval: false,
+  disableMultipleColumnsFiltering: false,
+  disableMultipleRowSelection: false,
+  disableMultipleColumnsSorting: false,
+  disableRowSelectionOnClick: false,
+  disableVirtualization: false,
+  editMode: GridEditModes.Cell,
+  filterMode: 'client',
+  filterDebounceMs: 150,
+  columnHeaderHeight: 56,
+  hideFooter: false,
+  hideFooterPagination: false,
+  hideFooterRowCount: false,
+  hideFooterSelectedRowCount: false,
+  ignoreDiacritics: false,
+  logger: console,
+  logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',
+  pagination: false,
+  paginationMode: 'client',
+  rowHeight: 52,
+  pageSizeOptions: [25, 50, 100],
+  rowSpacingType: 'margin',
+  showCellVerticalBorder: false,
+  showColumnVerticalBorder: false,
+  sortingOrder: ['asc', 'desc', null],
+  sortingMode: 'client',
+  throttleRowsMs: 0,
+  disableColumnReorder: false,
+  disableColumnResize: false,
+  keepNonExistentRowsSelected: false,
+  keepColumnPositionIfDraggedOutside: false,
+  unstable_ignoreValueFormatterDuringExport: false,
+  clipboardCopyCellDelimiter: '\t',
+  rowPositionsDebounceMs: 166
+};
+const defaultSlots = uncapitalizeObjectKeys(DATA_GRID_DEFAULT_SLOTS_COMPONENTS);
+export const useDataGridProps = inProps => {
+  const [components, componentsProps, themedProps] = useProps(useThemeProps({
+    props: inProps,
+    name: 'MuiDataGrid'
+  }));
+  const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
+  const slots = React.useMemo(() => computeSlots({
+    defaultSlots,
+    slots: themedProps.slots,
+    components
+  }), [components, themedProps.slots]);
+  return React.useMemo(() => {
+    var _themedProps$slotProp;
+    return _extends({}, DATA_GRID_PROPS_DEFAULT_VALUES, themedProps, {
+      localeText,
+      slots,
+      slotProps: (_themedProps$slotProp = themedProps.slotProps) != null ? _themedProps$slotProp : componentsProps
+    }, DATA_GRID_FORCED_PROPS);
+  }, [themedProps, localeText, slots, componentsProps]);
+};

control-plane-ui/node_modules/@mui/x-data-grid/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Material-UI SAS
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

control-plane-ui/node_modules/@mui/x-data-grid/README.md

@@ -0,0 +1,27 @@
+# MUI X Data Grid
+
+This package is the Community plan edition of the data grid component.
+It's part of [MUI X](https://mui.com/x/), an open-core extension of MUI Core, with advanced components.
+
+## Installation
+
+Install the package in your project directory with:
+
+```bash
+npm install @mui/x-data-grid
+```
+
+This component has the following peer dependencies that you will need to install as well.
+
+```json
+"peerDependencies": {
+  "@mui/material": "^5.4.1",
+  "@mui/system": "^5.4.1",
+  "react": "^17.0.0 || ^18.0.0",
+  "react-dom": "^17.0.0 || ^18.0.0"
+},
+```
+
+## Documentation
+
+Visit [https://mui.com/x/react-data-grid/](https://mui.com/x/react-data-grid/) to view the full documentation.

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridActionsColDef.d.ts

@@ -0,0 +1,3 @@
+import { GridColTypeDef } from '../models/colDef/gridColDef';
+export declare const GRID_ACTIONS_COLUMN_TYPE = "actions";
+export declare const GRID_ACTIONS_COL_DEF: GridColTypeDef;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridActionsColDef.js

@@ -0,0 +1,19 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { renderActionsCell } from '../components/cell/GridActionsCell';
+export const GRID_ACTIONS_COLUMN_TYPE = 'actions';
+export const GRID_ACTIONS_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  sortable: false,
+  filterable: false,
+  // @ts-ignore
+  aggregable: false,
+  width: 100,
+  align: 'center',
+  headerAlign: 'center',
+  headerName: '',
+  disableColumnMenu: true,
+  disableExport: true,
+  renderCell: renderActionsCell,
+  getApplyQuickFilterFn: undefined,
+  getApplyQuickFilterFnV7: undefined
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridBooleanColDef.d.ts

@@ -0,0 +1,2 @@
+import { GridColTypeDef } from '../models/colDef/gridColDef';
+export declare const GRID_BOOLEAN_COL_DEF: GridColTypeDef<boolean | null, any>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridBooleanColDef.js

@@ -0,0 +1,44 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { renderBooleanCell } from '../components/cell/GridBooleanCell';
+import { renderEditBooleanCell } from '../components/cell/GridEditBooleanCell';
+import { gridNumberComparator } from '../hooks/features/sorting/gridSortingUtils';
+import { getGridBooleanOperators } from './gridBooleanOperators';
+function gridBooleanFormatter({
+  value,
+  api
+}) {
+  return value ? api.getLocaleText('booleanCellTrueLabel') : api.getLocaleText('booleanCellFalseLabel');
+}
+const stringToBoolean = value => {
+  switch (value.toLowerCase().trim()) {
+    case 'true':
+    case 'yes':
+    case '1':
+      return true;
+    case 'false':
+    case 'no':
+    case '0':
+    case 'null':
+    case 'undefined':
+      return false;
+    default:
+      return undefined;
+  }
+};
+export const GRID_BOOLEAN_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  type: 'boolean',
+  align: 'center',
+  headerAlign: 'center',
+  renderCell: renderBooleanCell,
+  renderEditCell: renderEditBooleanCell,
+  sortComparator: gridNumberComparator,
+  valueFormatter: gridBooleanFormatter,
+  filterOperators: getGridBooleanOperators(),
+  getApplyQuickFilterFn: undefined,
+  getApplyQuickFilterFnV7: undefined,
+  // @ts-ignore
+  aggregable: false,
+  // @ts-ignore
+  pastedValueParser: value => stringToBoolean(value)
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridBooleanOperators.d.ts

@@ -0,0 +1,2 @@
+import { GridFilterOperator } from '../models/gridFilterOperator';
+export declare const getGridBooleanOperators: () => GridFilterOperator<any, boolean | null, any>[];

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridBooleanOperators.js

@@ -0,0 +1,15 @@
+import { GridFilterInputBoolean } from '../components/panel/filterPanel/GridFilterInputBoolean';
+import { convertLegacyOperators } from './utils';
+export const getGridBooleanOperators = () => convertLegacyOperators([{
+  value: 'is',
+  getApplyFilterFnV7: filterItem => {
+    if (!filterItem.value) {
+      return null;
+    }
+    const valueAsBoolean = filterItem.value === 'true';
+    return value => {
+      return Boolean(value) === valueAsBoolean;
+    };
+  },
+  InputComponent: GridFilterInputBoolean
+}]);

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridCheckboxSelectionColDef.d.ts

@@ -0,0 +1,3 @@
+import { GridColDef } from '../models/colDef/gridColDef';
+export declare const GRID_CHECKBOX_SELECTION_FIELD = "__check__";
+export declare const GRID_CHECKBOX_SELECTION_COL_DEF: GridColDef;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridCheckboxSelectionColDef.js

@@ -0,0 +1,29 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { GridCellCheckboxRenderer } from '../components/columnSelection/GridCellCheckboxRenderer';
+import { GridHeaderCheckbox } from '../components/columnSelection/GridHeaderCheckbox';
+import { selectedIdsLookupSelector } from '../hooks/features/rowSelection/gridRowSelectionSelector';
+import { GRID_BOOLEAN_COL_DEF } from './gridBooleanColDef';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const GRID_CHECKBOX_SELECTION_FIELD = '__check__';
+export const GRID_CHECKBOX_SELECTION_COL_DEF = _extends({}, GRID_BOOLEAN_COL_DEF, {
+  field: GRID_CHECKBOX_SELECTION_FIELD,
+  type: 'checkboxSelection',
+  width: 50,
+  resizable: false,
+  sortable: false,
+  filterable: false,
+  // @ts-ignore
+  aggregable: false,
+  disableColumnMenu: true,
+  disableReorder: true,
+  disableExport: true,
+  getApplyQuickFilterFn: undefined,
+  getApplyQuickFilterFnV7: undefined,
+  valueGetter: params => {
+    const selectionLookup = selectedIdsLookupSelector(params.api.state, params.api.instanceId);
+    return selectionLookup[params.id] !== undefined;
+  },
+  renderHeader: params => /*#__PURE__*/_jsx(GridHeaderCheckbox, _extends({}, params)),
+  renderCell: params => /*#__PURE__*/_jsx(GridCellCheckboxRenderer, _extends({}, params))
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDateColDef.d.ts

@@ -0,0 +1,6 @@
+import { GridColTypeDef } from '../models/colDef/gridColDef';
+import { GridValueFormatterParams } from '../models/params/gridCellParams';
+export declare function gridDateFormatter({ value, field, id }: GridValueFormatterParams<Date>): string;
+export declare function gridDateTimeFormatter({ value, field, id }: GridValueFormatterParams<Date>): string;
+export declare const GRID_DATE_COL_DEF: GridColTypeDef<Date, string>;
+export declare const GRID_DATETIME_COL_DEF: GridColTypeDef<Date, string>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDateColDef.js

@@ -0,0 +1,65 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { gridDateComparator } from '../hooks/features/sorting/gridSortingUtils';
+import { getGridDateOperators } from './gridDateOperators';
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { renderEditDateCell } from '../components/cell/GridEditDateCell';
+function throwIfNotDateObject({
+  value,
+  columnType,
+  rowId,
+  field
+}) {
+  if (!(value instanceof Date)) {
+    throw new Error([`MUI: \`${columnType}\` column type only accepts \`Date\` objects as values.`, 'Use `valueGetter` to transform the value into a `Date` object.', `Row ID: ${rowId}, field: "${field}".`].join('\n'));
+  }
+}
+export function gridDateFormatter({
+  value,
+  field,
+  id
+}) {
+  if (!value) {
+    return '';
+  }
+  throwIfNotDateObject({
+    value,
+    columnType: 'date',
+    rowId: id,
+    field
+  });
+  return value.toLocaleDateString();
+}
+export function gridDateTimeFormatter({
+  value,
+  field,
+  id
+}) {
+  if (!value) {
+    return '';
+  }
+  throwIfNotDateObject({
+    value,
+    columnType: 'dateTime',
+    rowId: id,
+    field
+  });
+  return value.toLocaleString();
+}
+export const GRID_DATE_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  type: 'date',
+  sortComparator: gridDateComparator,
+  valueFormatter: gridDateFormatter,
+  filterOperators: getGridDateOperators(),
+  renderEditCell: renderEditDateCell,
+  // @ts-ignore
+  pastedValueParser: value => new Date(value)
+});
+export const GRID_DATETIME_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  type: 'dateTime',
+  sortComparator: gridDateComparator,
+  valueFormatter: gridDateTimeFormatter,
+  filterOperators: getGridDateOperators(true),
+  renderEditCell: renderEditDateCell,
+  // @ts-ignore
+  pastedValueParser: value => new Date(value)
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDateOperators.d.ts

@@ -0,0 +1,2 @@
+import { GridFilterOperator } from '../models/gridFilterOperator';
+export declare const getGridDateOperators: (showTime?: boolean) => GridFilterOperator<any, Date, any>[];

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDateOperators.js

@@ -0,0 +1,95 @@
+import { GridFilterInputDate } from '../components/panel/filterPanel/GridFilterInputDate';
+import { convertLegacyOperators } from './utils';
+const dateRegex = /(\d+)-(\d+)-(\d+)/;
+const dateTimeRegex = /(\d+)-(\d+)-(\d+)T(\d+):(\d+)/;
+function buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {
+  if (!filterItem.value) {
+    return null;
+  }
+  const [year, month, day, hour, minute] = filterItem.value.match(showTime ? dateTimeRegex : dateRegex).slice(1).map(Number);
+  const time = new Date(year, month - 1, day, hour || 0, minute || 0).getTime();
+  return value => {
+    if (!value) {
+      return false;
+    }
+    if (keepHours) {
+      return compareFn(value.getTime(), time);
+    }
+
+    // Make a copy of the date to not reset the hours in the original object
+    const dateCopy = new Date(value);
+    const timeToCompare = dateCopy.setHours(showTime ? value.getHours() : 0, showTime ? value.getMinutes() : 0, 0, 0);
+    return compareFn(timeToCompare, time);
+  };
+}
+export const getGridDateOperators = showTime => convertLegacyOperators([{
+  value: 'is',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 === value2, showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'not',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 !== value2, showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'after',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 > value2, showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'onOrAfter',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 >= value2, showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'before',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 < value2, showTime, !showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'onOrBefore',
+  getApplyFilterFnV7: filterItem => {
+    return buildApplyFilterFn(filterItem, (value1, value2) => value1 <= value2, showTime);
+  },
+  InputComponent: GridFilterInputDate,
+  InputComponentProps: {
+    type: showTime ? 'datetime-local' : 'date'
+  }
+}, {
+  value: 'isEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value == null;
+    };
+  },
+  requiresFilterValue: false
+}, {
+  value: 'isNotEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value != null;
+    };
+  },
+  requiresFilterValue: false
+}]);

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDefaultColumnTypes.d.ts

@@ -0,0 +1,3 @@
+import { GridColumnTypesRecord } from '../models/colDef/gridColumnTypesRecord';
+export declare const DEFAULT_GRID_COL_TYPE_KEY = "__default__";
+export declare const getGridDefaultColumnTypes: () => GridColumnTypesRecord;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridDefaultColumnTypes.js

@@ -0,0 +1,20 @@
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { GRID_NUMERIC_COL_DEF } from './gridNumericColDef';
+import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from './gridDateColDef';
+import { GRID_BOOLEAN_COL_DEF } from './gridBooleanColDef';
+import { GRID_SINGLE_SELECT_COL_DEF } from './gridSingleSelectColDef';
+import { GRID_ACTIONS_COL_DEF, GRID_ACTIONS_COLUMN_TYPE } from './gridActionsColDef';
+export const DEFAULT_GRID_COL_TYPE_KEY = '__default__';
+export const getGridDefaultColumnTypes = () => {
+  const nativeColumnTypes = {
+    string: GRID_STRING_COL_DEF,
+    number: GRID_NUMERIC_COL_DEF,
+    date: GRID_DATE_COL_DEF,
+    dateTime: GRID_DATETIME_COL_DEF,
+    boolean: GRID_BOOLEAN_COL_DEF,
+    singleSelect: GRID_SINGLE_SELECT_COL_DEF,
+    [GRID_ACTIONS_COLUMN_TYPE]: GRID_ACTIONS_COL_DEF,
+    [DEFAULT_GRID_COL_TYPE_KEY]: GRID_STRING_COL_DEF
+  };
+  return nativeColumnTypes;
+};

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridNumericColDef.d.ts

@@ -0,0 +1,2 @@
+import { GridColTypeDef } from '../models/colDef/gridColDef';
+export declare const GRID_NUMERIC_COL_DEF: GridColTypeDef<number | string | null, string>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridNumericColDef.js

@@ -0,0 +1,19 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { gridNumberComparator } from '../hooks/features/sorting/gridSortingUtils';
+import { isNumber } from '../utils/utils';
+import { getGridNumericOperators, getGridNumericQuickFilterFn } from './gridNumericOperators';
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { convertQuickFilterV7ToLegacy } from './utils';
+export const GRID_NUMERIC_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  type: 'number',
+  align: 'right',
+  headerAlign: 'right',
+  sortComparator: gridNumberComparator,
+  valueParser: value => value === '' ? null : Number(value),
+  valueFormatter: ({
+    value
+  }) => isNumber(value) ? value.toLocaleString() : value || '',
+  filterOperators: getGridNumericOperators(),
+  getApplyQuickFilterFn: convertQuickFilterV7ToLegacy(getGridNumericQuickFilterFn),
+  getApplyQuickFilterFnV7: getGridNumericQuickFilterFn
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridNumericOperators.d.ts

@@ -0,0 +1,4 @@
+import { GridFilterOperator } from '../models/gridFilterOperator';
+import type { GridApplyQuickFilterV7 } from '../models/colDef/gridColDef';
+export declare const getGridNumericQuickFilterFn: (value: any) => GridApplyQuickFilterV7 | null;
+export declare const getGridNumericOperators: () => GridFilterOperator<any, number | string | null, any>[];

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridNumericOperators.js

@@ -0,0 +1,144 @@
+import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';
+import { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';
+import { convertLegacyOperators, tagInternalFilter } from './utils';
+const parseNumericValue = value => {
+  if (value == null) {
+    return null;
+  }
+  return Number(value);
+};
+export const getGridNumericQuickFilterFn = tagInternalFilter(value => {
+  if (value == null || Number.isNaN(value) || value === '') {
+    return null;
+  }
+  return columnValue => {
+    return parseNumericValue(columnValue) === parseNumericValue(value);
+  };
+});
+export const getGridNumericOperators = () => convertLegacyOperators([{
+  value: '=',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      return parseNumericValue(value) === filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: '!=',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      return parseNumericValue(value) !== filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: '>',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      if (value == null) {
+        return false;
+      }
+      return parseNumericValue(value) > filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: '>=',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      if (value == null) {
+        return false;
+      }
+      return parseNumericValue(value) >= filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: '<',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      if (value == null) {
+        return false;
+      }
+      return parseNumericValue(value) < filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: '<=',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || Number.isNaN(filterItem.value)) {
+      return null;
+    }
+    return value => {
+      if (value == null) {
+        return false;
+      }
+      return parseNumericValue(value) <= filterItem.value;
+    };
+  },
+  InputComponent: GridFilterInputValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}, {
+  value: 'isEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value == null;
+    };
+  },
+  requiresFilterValue: false
+}, {
+  value: 'isNotEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value != null;
+    };
+  },
+  requiresFilterValue: false
+}, {
+  value: 'isAnyOf',
+  getApplyFilterFnV7: filterItem => {
+    if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
+      return null;
+    }
+    return value => {
+      return value != null && filterItem.value.includes(Number(value));
+    };
+  },
+  InputComponent: GridFilterInputMultipleValue,
+  InputComponentProps: {
+    type: 'number'
+  }
+}]);

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridSingleSelectColDef.d.ts

@@ -0,0 +1,2 @@
+import { GridSingleSelectColDef } from '../models/colDef/gridColDef';
+export declare const GRID_SINGLE_SELECT_COL_DEF: Omit<GridSingleSelectColDef, 'field'>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridSingleSelectColDef.js

@@ -0,0 +1,75 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { GRID_STRING_COL_DEF } from './gridStringColDef';
+import { renderEditSingleSelectCell } from '../components/cell/GridEditSingleSelectCell';
+import { getGridSingleSelectOperators } from './gridSingleSelectOperators';
+import { isSingleSelectColDef } from '../components/panel/filterPanel/filterPanelUtils';
+import { isObject } from '../utils/utils';
+const isArrayOfObjects = options => {
+  return typeof options[0] === 'object';
+};
+const defaultGetOptionValue = value => {
+  return isObject(value) ? value.value : value;
+};
+const defaultGetOptionLabel = value => {
+  return isObject(value) ? value.label : String(value);
+};
+export const GRID_SINGLE_SELECT_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
+  type: 'singleSelect',
+  getOptionLabel: defaultGetOptionLabel,
+  getOptionValue: defaultGetOptionValue,
+  valueFormatter(params) {
+    const {
+      id,
+      field,
+      value,
+      api
+    } = params;
+    const colDef = params.api.getColumn(field);
+    if (!isSingleSelectColDef(colDef)) {
+      return '';
+    }
+    let valueOptions;
+    if (typeof colDef.valueOptions === 'function') {
+      valueOptions = colDef.valueOptions({
+        id,
+        row: id ? api.getRow(id) : null,
+        field
+      });
+    } else {
+      valueOptions = colDef.valueOptions;
+    }
+    if (value == null) {
+      return '';
+    }
+    if (!valueOptions) {
+      return value;
+    }
+    if (!isArrayOfObjects(valueOptions)) {
+      return colDef.getOptionLabel(value);
+    }
+    const valueOption = valueOptions.find(option => colDef.getOptionValue(option) === value);
+    return valueOption ? colDef.getOptionLabel(valueOption) : '';
+  },
+  renderEditCell: renderEditSingleSelectCell,
+  filterOperators: getGridSingleSelectOperators(),
+  // @ts-ignore
+  pastedValueParser: (value, params) => {
+    const colDef = params.colDef;
+    const colDefValueOptions = colDef.valueOptions;
+    const valueOptions = typeof colDefValueOptions === 'function' ? colDefValueOptions({
+      field: colDef.field
+    }) : colDefValueOptions || [];
+    const getOptionValue = colDef.getOptionValue;
+    const valueOption = valueOptions.find(option => {
+      if (getOptionValue(option) === value) {
+        return true;
+      }
+      return false;
+    });
+    if (valueOption) {
+      return value;
+    }
+    // do not paste the value if it is not in the valueOptions
+    return undefined;
+  }
+});

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridSingleSelectOperators.d.ts

@@ -0,0 +1,2 @@
+import { GridFilterOperator } from '../models/gridFilterOperator';
+export declare const getGridSingleSelectOperators: () => GridFilterOperator[];

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridSingleSelectOperators.js

@@ -0,0 +1,39 @@
+import { GridFilterInputSingleSelect } from '../components/panel/filterPanel/GridFilterInputSingleSelect';
+import { GridFilterInputMultipleSingleSelect } from '../components/panel/filterPanel/GridFilterInputMultipleSingleSelect';
+import { isObject } from '../utils/utils';
+import { convertLegacyOperators } from './utils';
+const parseObjectValue = value => {
+  if (value == null || !isObject(value)) {
+    return value;
+  }
+  return value.value;
+};
+export const getGridSingleSelectOperators = () => convertLegacyOperators([{
+  value: 'is',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || filterItem.value === '') {
+      return null;
+    }
+    return value => parseObjectValue(value) === parseObjectValue(filterItem.value);
+  },
+  InputComponent: GridFilterInputSingleSelect
+}, {
+  value: 'not',
+  getApplyFilterFnV7: filterItem => {
+    if (filterItem.value == null || filterItem.value === '') {
+      return null;
+    }
+    return value => parseObjectValue(value) !== parseObjectValue(filterItem.value);
+  },
+  InputComponent: GridFilterInputSingleSelect
+}, {
+  value: 'isAnyOf',
+  getApplyFilterFnV7: filterItem => {
+    if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
+      return null;
+    }
+    const filterItemValues = filterItem.value.map(parseObjectValue);
+    return value => filterItemValues.includes(parseObjectValue(value));
+  },
+  InputComponent: GridFilterInputMultipleSingleSelect
+}]);

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridStringColDef.d.ts

@@ -0,0 +1,5 @@
+import { GridColTypeDef } from '../models/colDef/gridColDef';
+/**
+ * TODO: Move pro and premium properties outside of this Community file
+ */
+export declare const GRID_STRING_COL_DEF: GridColTypeDef<any, any>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridStringColDef.js

@@ -0,0 +1,29 @@
+import { renderEditInputCell } from '../components/cell/GridEditInputCell';
+import { gridStringOrNumberComparator } from '../hooks/features/sorting/gridSortingUtils';
+import { getGridStringOperators, getGridStringQuickFilterFn } from './gridStringOperators';
+import { convertQuickFilterV7ToLegacy } from './utils';
+
+/**
+ * TODO: Move pro and premium properties outside of this Community file
+ */
+export const GRID_STRING_COL_DEF = {
+  width: 100,
+  minWidth: 50,
+  maxWidth: Infinity,
+  hideable: true,
+  sortable: true,
+  resizable: true,
+  filterable: true,
+  groupable: true,
+  pinnable: true,
+  // @ts-ignore
+  aggregable: true,
+  editable: false,
+  sortComparator: gridStringOrNumberComparator,
+  type: 'string',
+  align: 'left',
+  filterOperators: getGridStringOperators(),
+  renderEditCell: renderEditInputCell,
+  getApplyQuickFilterFn: convertQuickFilterV7ToLegacy(getGridStringQuickFilterFn),
+  getApplyQuickFilterFnV7: getGridStringQuickFilterFn
+};

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridStringOperators.d.ts

@@ -0,0 +1,4 @@
+import type { GridApplyQuickFilterV7 } from '../models/colDef/gridColDef';
+import { GridFilterOperator } from '../models/gridFilterOperator';
+export declare const getGridStringQuickFilterFn: (value: any) => GridApplyQuickFilterV7 | null;
+export declare const getGridStringOperators: (disableTrim?: boolean) => GridFilterOperator<any, number | string | null, any>[];

control-plane-ui/node_modules/@mui/x-data-grid/colDef/gridStringOperators.js

@@ -0,0 +1,106 @@
+import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';
+import { escapeRegExp } from '../utils/utils';
+import { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';
+import { convertLegacyOperators, tagInternalFilter } from './utils';
+import { removeDiacritics } from '../hooks/features/filter/gridFilterUtils';
+export const getGridStringQuickFilterFn = tagInternalFilter(value => {
+  if (!value) {
+    return null;
+  }
+  const filterRegex = new RegExp(escapeRegExp(value), 'i');
+  return (_, row, column, apiRef) => {
+    let columnValue = apiRef.current.getRowFormattedValue(row, column);
+    if (apiRef.current.ignoreDiacritics) {
+      columnValue = removeDiacritics(columnValue);
+    }
+    return columnValue != null ? filterRegex.test(columnValue.toString()) : false;
+  };
+});
+export const getGridStringOperators = (disableTrim = false) => convertLegacyOperators([{
+  value: 'contains',
+  getApplyFilterFnV7: filterItem => {
+    if (!filterItem.value) {
+      return null;
+    }
+    const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();
+    const filterRegex = new RegExp(escapeRegExp(filterItemValue), 'i');
+    return value => {
+      return value != null ? filterRegex.test(String(value)) : false;
+    };
+  },
+  InputComponent: GridFilterInputValue
+}, {
+  value: 'equals',
+  getApplyFilterFnV7: filterItem => {
+    if (!filterItem.value) {
+      return null;
+    }
+    const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();
+    const collator = new Intl.Collator(undefined, {
+      sensitivity: 'base',
+      usage: 'search'
+    });
+    return value => {
+      return value != null ? collator.compare(filterItemValue, value.toString()) === 0 : false;
+    };
+  },
+  InputComponent: GridFilterInputValue
+}, {
+  value: 'startsWith',
+  getApplyFilterFnV7: filterItem => {
+    if (!filterItem.value) {
+      return null;
+    }
+    const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();
+    const filterRegex = new RegExp(`^${escapeRegExp(filterItemValue)}.*$`, 'i');
+    return value => {
+      return value != null ? filterRegex.test(value.toString()) : false;
+    };
+  },
+  InputComponent: GridFilterInputValue
+}, {
+  value: 'endsWith',
+  getApplyFilterFnV7: filterItem => {
+    if (!filterItem.value) {
+      return null;
+    }
+    const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();
+    const filterRegex = new RegExp(`.*${escapeRegExp(filterItemValue)}$`, 'i');
+    return value => {
+      return value != null ? filterRegex.test(value.toString()) : false;
+    };
+  },
+  InputComponent: GridFilterInputValue
+}, {
+  value: 'isEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value === '' || value == null;
+    };
+  },
+  requiresFilterValue: false
+}, {
+  value: 'isNotEmpty',
+  getApplyFilterFnV7: () => {
+    return value => {
+      return value !== '' && value != null;
+    };
+  },
+  requiresFilterValue: false
+}, {
+  value: 'isAnyOf',
+  getApplyFilterFnV7: filterItem => {
+    if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
+      return null;
+    }
+    const filterItemValue = disableTrim ? filterItem.value : filterItem.value.map(val => val.trim());
+    const collator = new Intl.Collator(undefined, {
+      sensitivity: 'base',
+      usage: 'search'
+    });
+    return value => value != null ? filterItemValue.some(filterValue => {
+      return collator.compare(filterValue, value.toString() || '') === 0;
+    }) : false;
+  },
+  InputComponent: GridFilterInputMultipleValue
+}]);

control-plane-ui/node_modules/@mui/x-data-grid/colDef/index.d.ts

@@ -0,0 +1,13 @@
+export * from './gridActionsColDef';
+export * from './gridBooleanColDef';
+export * from './gridCheckboxSelectionColDef';
+export * from './gridDateColDef';
+export * from './gridNumericColDef';
+export * from './gridSingleSelectColDef';
+export * from './gridStringColDef';
+export * from './gridBooleanOperators';
+export * from './gridDateOperators';
+export * from './gridNumericOperators';
+export * from './gridSingleSelectOperators';
+export * from './gridStringOperators';
+export * from './gridDefaultColumnTypes';

control-plane-ui/node_modules/@mui/x-data-grid/colDef/index.js

@@ -0,0 +1,13 @@
+export * from './gridActionsColDef';
+export * from './gridBooleanColDef';
+export * from './gridCheckboxSelectionColDef';
+export * from './gridDateColDef';
+export * from './gridNumericColDef';
+export * from './gridSingleSelectColDef';
+export * from './gridStringColDef';
+export * from './gridBooleanOperators';
+export * from './gridDateOperators';
+export * from './gridNumericOperators';
+export * from './gridSingleSelectOperators';
+export * from './gridStringOperators';
+export * from './gridDefaultColumnTypes';

control-plane-ui/node_modules/@mui/x-data-grid/colDef/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "main": "../node/colDef/index.js",
+  "types": "./index.d.ts"
+}

control-plane-ui/node_modules/@mui/x-data-grid/colDef/utils.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { GridApiCommunity } from '../models/api/gridApiCommunity';
+import { GetApplyFilterFnV7, GetApplyFilterFnLegacy, GridFilterOperator } from '../models';
+import { GetApplyQuickFilterFnV7, GetApplyQuickFilterFnLegacy } from '../models/colDef/gridColDef';
+/**
+ * A global API ref, for v7-to-legacy converter
+ */
+export declare const GLOBAL_API_REF: {
+    current: React.MutableRefObject<GridApiCommunity> | null;
+};
+/**
+ * A tagger to determine if the filter is internal or custom user-supplied.
+ * To be a valid internal filter, the v7 function *must* be defined/redefined at
+ * the same time as the legacy one.
+ * https://github.com/mui/mui-x/pull/9254#discussion_r1231095551
+ */
+export declare function tagInternalFilter<T>(fn: T): T;
+export declare function isInternalFilter(fn: Function | undefined): boolean;
+export declare function convertFilterV7ToLegacy(fn: GetApplyFilterFnV7): GetApplyFilterFnLegacy;
+export declare function convertLegacyOperators(ops: Omit<GridFilterOperator, 'getApplyFilterFn'>[]): GridFilterOperator[];
+export declare function convertQuickFilterV7ToLegacy(fn: GetApplyQuickFilterFnV7): GetApplyQuickFilterFnLegacy<any, any, any>;

control-plane-ui/node_modules/@mui/x-data-grid/colDef/utils.js

@@ -0,0 +1,51 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+/**
+ * A global API ref, for v7-to-legacy converter
+ */
+export const GLOBAL_API_REF = {
+  current: null
+};
+
+/**
+ * A tagger to determine if the filter is internal or custom user-supplied.
+ * To be a valid internal filter, the v7 function *must* be defined/redefined at
+ * the same time as the legacy one.
+ * https://github.com/mui/mui-x/pull/9254#discussion_r1231095551
+ */
+export function tagInternalFilter(fn) {
+  fn.isInternal = true;
+  return fn;
+}
+export function isInternalFilter(fn) {
+  return fn !== undefined && fn.isInternal === true;
+}
+export function convertFilterV7ToLegacy(fn) {
+  return tagInternalFilter((filterItem, column) => {
+    const filterFn = fn(filterItem, column);
+    if (!filterFn) {
+      return filterFn;
+    }
+    return cellParams => {
+      return filterFn(cellParams.value, cellParams.row, column, GLOBAL_API_REF.current);
+    };
+  });
+}
+export function convertLegacyOperators(ops) {
+  return ops.map(op => {
+    return _extends({}, op, {
+      getApplyFilterFn: convertFilterV7ToLegacy(op.getApplyFilterFnV7),
+      getApplyFilterFnV7: tagInternalFilter(op.getApplyFilterFnV7)
+    });
+  });
+}
+export function convertQuickFilterV7ToLegacy(fn) {
+  return tagInternalFilter((filterItem, column, apiRef) => {
+    const filterFn = fn(filterItem, column, apiRef);
+    if (!filterFn) {
+      return filterFn;
+    }
+    return cellParams => {
+      return filterFn(cellParams.value, cellParams.row, column, apiRef);
+    };
+  });
+}

control-plane-ui/node_modules/@mui/x-data-grid/components/DataGridVirtualScroller.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const DataGridVirtualScroller: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { DataGridVirtualScroller };

control-plane-ui/node_modules/@mui/x-data-grid/components/DataGridVirtualScroller.js

@@ -0,0 +1,35 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className"];
+import * as React from 'react';
+import { GridVirtualScroller } from './virtualization/GridVirtualScroller';
+import { GridVirtualScrollerContent } from './virtualization/GridVirtualScrollerContent';
+import { GridVirtualScrollerRenderZone } from './virtualization/GridVirtualScrollerRenderZone';
+import { useGridVirtualScroller } from '../hooks/features/virtualization/useGridVirtualScroller';
+import { GridOverlays } from './base/GridOverlays';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const DataGridVirtualScroller = /*#__PURE__*/React.forwardRef(function DataGridVirtualScroller(props, ref) {
+  const {
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    getRootProps,
+    getContentProps,
+    getRenderZoneProps,
+    getRows
+  } = useGridVirtualScroller({
+    ref
+  });
+  return /*#__PURE__*/_jsxs(GridVirtualScroller, _extends({
+    className: className
+  }, getRootProps(other), {
+    children: [/*#__PURE__*/_jsx(GridOverlays, {}), /*#__PURE__*/_jsx(GridVirtualScrollerContent, _extends({}, getContentProps(), {
+      children: /*#__PURE__*/_jsx(GridVirtualScrollerRenderZone, _extends({}, getRenderZoneProps(), {
+        children: getRows()
+      }))
+    }))]
+  }));
+});
+export { DataGridVirtualScroller };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridApiContext.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const GridApiContext: React.Context<unknown>;

control-plane-ui/node_modules/@mui/x-data-grid/components/GridApiContext.js

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export const GridApiContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== 'production') {
+  GridApiContext.displayName = 'GridApiContext';
+}

control-plane-ui/node_modules/@mui/x-data-grid/components/GridColumnHeaders.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { UseGridColumnHeadersProps } from '../hooks/features/columnHeaders/useGridColumnHeaders';
+interface GridColumnHeadersProps extends React.HTMLAttributes<HTMLDivElement>, Omit<UseGridColumnHeadersProps, 'innerRef'> {
+    innerRef?: React.Ref<HTMLDivElement>;
+}
+declare const MemoizedGridColumnHeaders: React.ForwardRefExoticComponent<GridColumnHeadersProps & React.RefAttributes<HTMLDivElement>>;
+export { MemoizedGridColumnHeaders as GridColumnHeaders };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridColumnHeaders.js

@@ -0,0 +1,104 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["innerRef", "className", "visibleColumns", "sortColumnLookup", "filterColumnLookup", "columnPositions", "columnHeaderTabIndexState", "columnGroupHeaderTabIndexState", "columnHeaderFocus", "columnGroupHeaderFocus", "densityFactor", "headerGroupingMaxDepth", "columnMenuState", "columnVisibility", "columnGroupsHeaderStructure", "hasOtherElementInTabSequence"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { refType } from '@mui/utils';
+import { fastMemo } from '../utils/fastMemo';
+import { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';
+import { GridBaseColumnHeaders } from './columnHeaders/GridBaseColumnHeaders';
+import { GridColumnHeadersInner } from './columnHeaders/GridColumnHeadersInner';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+const GridColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnsHeaders(props, ref) {
+  const {
+      innerRef,
+      visibleColumns,
+      sortColumnLookup,
+      filterColumnLookup,
+      columnPositions,
+      columnHeaderTabIndexState,
+      columnGroupHeaderTabIndexState,
+      columnHeaderFocus,
+      columnGroupHeaderFocus,
+      densityFactor,
+      headerGroupingMaxDepth,
+      columnMenuState,
+      columnVisibility,
+      columnGroupsHeaderStructure,
+      hasOtherElementInTabSequence
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    isDragging,
+    getRootProps,
+    getInnerProps,
+    getColumnHeaders,
+    getColumnGroupHeaders
+  } = useGridColumnHeaders({
+    innerRef,
+    visibleColumns,
+    sortColumnLookup,
+    filterColumnLookup,
+    columnPositions,
+    columnHeaderTabIndexState,
+    columnGroupHeaderTabIndexState,
+    columnHeaderFocus,
+    columnGroupHeaderFocus,
+    densityFactor,
+    headerGroupingMaxDepth,
+    columnMenuState,
+    columnVisibility,
+    columnGroupsHeaderStructure,
+    hasOtherElementInTabSequence
+  });
+  return /*#__PURE__*/_jsx(GridBaseColumnHeaders, _extends({
+    ref: ref
+  }, getRootProps(other), {
+    children: /*#__PURE__*/_jsxs(GridColumnHeadersInner, _extends({
+      isDragging: isDragging
+    }, getInnerProps(), {
+      children: [getColumnGroupHeaders(), getColumnHeaders()]
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridColumnHeaders.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  columnGroupHeaderFocus: PropTypes.shape({
+    depth: PropTypes.number.isRequired,
+    field: PropTypes.string.isRequired
+  }),
+  columnGroupHeaderTabIndexState: PropTypes.shape({
+    depth: PropTypes.number.isRequired,
+    field: PropTypes.string.isRequired
+  }),
+  columnGroupsHeaderStructure: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.shape({
+    columnFields: PropTypes.arrayOf(PropTypes.string).isRequired,
+    groupId: PropTypes.string
+  }))).isRequired,
+  columnHeaderFocus: PropTypes.shape({
+    field: PropTypes.string.isRequired
+  }),
+  columnHeaderTabIndexState: PropTypes.shape({
+    field: PropTypes.string.isRequired
+  }),
+  columnMenuState: PropTypes.shape({
+    field: PropTypes.string,
+    open: PropTypes.bool.isRequired
+  }).isRequired,
+  columnPositions: PropTypes.arrayOf(PropTypes.number).isRequired,
+  columnVisibility: PropTypes.object.isRequired,
+  densityFactor: PropTypes.number.isRequired,
+  filterColumnLookup: PropTypes.object.isRequired,
+  hasOtherElementInTabSequence: PropTypes.bool.isRequired,
+  headerGroupingMaxDepth: PropTypes.number.isRequired,
+  innerRef: refType,
+  minColumnIndex: PropTypes.number,
+  sortColumnLookup: PropTypes.object.isRequired,
+  visibleColumns: PropTypes.arrayOf(PropTypes.object).isRequired
+} : void 0;
+const MemoizedGridColumnHeaders = fastMemo(GridColumnHeaders);
+export { MemoizedGridColumnHeaders as GridColumnHeaders };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridFooter.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+declare const GridFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    sx?: import("@mui/system").SxProps<import("@mui/system").Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { GridFooter };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridFooter.js

@@ -0,0 +1,42 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useGridSelector } from '../hooks/utils/useGridSelector';
+import { gridTopLevelRowCountSelector } from '../hooks/features/rows/gridRowsSelector';
+import { selectedGridRowsCountSelector } from '../hooks/features/rowSelection/gridRowSelectionSelector';
+import { gridFilteredTopLevelRowCountSelector } from '../hooks/features/filter/gridFilterSelector';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { GridSelectedRowCount } from './GridSelectedRowCount';
+import { GridFooterContainer } from './containers/GridFooterContainer';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const GridFooter = /*#__PURE__*/React.forwardRef(function GridFooter(props, ref) {
+  var _rootProps$slotProps, _rootProps$slotProps2;
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const totalTopLevelRowCount = useGridSelector(apiRef, gridTopLevelRowCountSelector);
+  const selectedRowCount = useGridSelector(apiRef, selectedGridRowsCountSelector);
+  const visibleTopLevelRowCount = useGridSelector(apiRef, gridFilteredTopLevelRowCountSelector);
+  const selectedRowCountElement = !rootProps.hideFooterSelectedRowCount && selectedRowCount > 0 ? /*#__PURE__*/_jsx(GridSelectedRowCount, {
+    selectedRowCount: selectedRowCount
+  }) : /*#__PURE__*/_jsx("div", {});
+  const rowCountElement = !rootProps.hideFooterRowCount && !rootProps.pagination ? /*#__PURE__*/_jsx(rootProps.slots.footerRowCount, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.footerRowCount, {
+    rowCount: totalTopLevelRowCount,
+    visibleRowCount: visibleTopLevelRowCount
+  })) : null;
+  const paginationElement = rootProps.pagination && !rootProps.hideFooterPagination && rootProps.slots.pagination && /*#__PURE__*/_jsx(rootProps.slots.pagination, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.pagination));
+  return /*#__PURE__*/_jsxs(GridFooterContainer, _extends({
+    ref: ref
+  }, props, {
+    children: [selectedRowCountElement, rowCountElement, paginationElement]
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridFooter.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridFooter };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridHeader.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function GridHeader(): React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/GridHeader.js

@@ -0,0 +1,12 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function GridHeader() {
+  var _rootProps$slotProps, _rootProps$slotProps2;
+  const rootProps = useGridRootProps();
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx(rootProps.slots.preferencesPanel, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.preferencesPanel)), rootProps.slots.toolbar && /*#__PURE__*/_jsx(rootProps.slots.toolbar, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.toolbar))]
+  });
+}

control-plane-ui/node_modules/@mui/x-data-grid/components/GridLoadingOverlay.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+declare const GridLoadingOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    sx?: import("@mui/system").SxProps<import("@mui/system").Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { GridLoadingOverlay };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridLoadingOverlay.js

@@ -0,0 +1,21 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import CircularProgress from '@mui/material/CircularProgress';
+import { GridOverlay } from './containers/GridOverlay';
+import { jsx as _jsx } from "react/jsx-runtime";
+const GridLoadingOverlay = /*#__PURE__*/React.forwardRef(function GridLoadingOverlay(props, ref) {
+  return /*#__PURE__*/_jsx(GridOverlay, _extends({
+    ref: ref
+  }, props, {
+    children: /*#__PURE__*/_jsx(CircularProgress, {})
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridLoadingOverlay.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridLoadingOverlay };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridNoResultsOverlay.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const GridNoResultsOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    sx?: import("@mui/system").SxProps<import("@mui/system").Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;

control-plane-ui/node_modules/@mui/x-data-grid/components/GridNoResultsOverlay.js

@@ -0,0 +1,14 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { GridOverlay } from './containers/GridOverlay';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const GridNoResultsOverlay = /*#__PURE__*/React.forwardRef(function GridNoResultsOverlay(props, ref) {
+  const apiRef = useGridApiContext();
+  const noResultsOverlayLabel = apiRef.current.getLocaleText('noResultsOverlayLabel');
+  return /*#__PURE__*/_jsx(GridOverlay, _extends({
+    ref: ref
+  }, props, {
+    children: noResultsOverlayLabel
+  }));
+});

control-plane-ui/node_modules/@mui/x-data-grid/components/GridNoRowsOverlay.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+declare const GridNoRowsOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    sx?: import("@mui/system").SxProps<import("@mui/system").Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { GridNoRowsOverlay };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridNoRowsOverlay.js

@@ -0,0 +1,23 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { GridOverlay } from './containers/GridOverlay';
+import { jsx as _jsx } from "react/jsx-runtime";
+const GridNoRowsOverlay = /*#__PURE__*/React.forwardRef(function GridNoRowsOverlay(props, ref) {
+  const apiRef = useGridApiContext();
+  const noRowsLabel = apiRef.current.getLocaleText('noRowsLabel');
+  return /*#__PURE__*/_jsx(GridOverlay, _extends({
+    ref: ref
+  }, props, {
+    children: noRowsLabel
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridNoRowsOverlay.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridNoRowsOverlay };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridPagination.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { TablePaginationProps } from '@mui/material/TablePagination';
+interface GridPaginationOwnProps {
+    component?: React.ElementType;
+}
+declare const GridPagination: React.ForwardRefExoticComponent<Omit<Partial<Omit<TablePaginationProps, "component">> & GridPaginationOwnProps, "ref"> & React.RefAttributes<unknown>>;
+export { GridPagination };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridPagination.js

@@ -0,0 +1,89 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import TablePagination, { tablePaginationClasses } from '@mui/material/TablePagination';
+import { styled } from '@mui/material/styles';
+import { useGridSelector } from '../hooks/utils/useGridSelector';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { gridPaginationModelSelector, gridPaginationRowCountSelector } from '../hooks/features/pagination/gridPaginationSelector';
+import { jsx as _jsx } from "react/jsx-runtime";
+const GridPaginationRoot = styled(TablePagination)(({
+  theme
+}) => ({
+  [`& .${tablePaginationClasses.selectLabel}`]: {
+    display: 'none',
+    [theme.breakpoints.up('sm')]: {
+      display: 'block'
+    }
+  },
+  [`& .${tablePaginationClasses.input}`]: {
+    display: 'none',
+    [theme.breakpoints.up('sm')]: {
+      display: 'inline-flex'
+    }
+  }
+}));
+
+// A mutable version of a readonly array.
+
+const GridPagination = /*#__PURE__*/React.forwardRef(function GridPagination(props, ref) {
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const paginationModel = useGridSelector(apiRef, gridPaginationModelSelector);
+  const rowCount = useGridSelector(apiRef, gridPaginationRowCountSelector);
+  const lastPage = React.useMemo(() => Math.floor(rowCount / (paginationModel.pageSize || 1)), [rowCount, paginationModel.pageSize]);
+  const handlePageSizeChange = React.useCallback(event => {
+    const pageSize = Number(event.target.value);
+    apiRef.current.setPageSize(pageSize);
+  }, [apiRef]);
+  const handlePageChange = React.useCallback((_, page) => {
+    apiRef.current.setPage(page);
+  }, [apiRef]);
+  const isPageSizeIncludedInPageSizeOptions = pageSize => {
+    for (let i = 0; i < rootProps.pageSizeOptions.length; i += 1) {
+      const option = rootProps.pageSizeOptions[i];
+      if (typeof option === 'number') {
+        if (option === pageSize) {
+          return true;
+        }
+      } else if (option.value === pageSize) {
+        return true;
+      }
+    }
+    return false;
+  };
+  if (process.env.NODE_ENV !== 'production') {
+    var _rootProps$pagination, _rootProps$pagination2;
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const warnedOnceMissingInPageSizeOptions = React.useRef(false);
+    const pageSize = (_rootProps$pagination = (_rootProps$pagination2 = rootProps.paginationModel) == null ? void 0 : _rootProps$pagination2.pageSize) != null ? _rootProps$pagination : paginationModel.pageSize;
+    if (!warnedOnceMissingInPageSizeOptions.current && !rootProps.autoPageSize && !isPageSizeIncludedInPageSizeOptions(pageSize)) {
+      console.warn([`MUI X: The page size \`${paginationModel.pageSize}\` is not preset in the \`pageSizeOptions\`.`, `Add it to show the pagination select.`].join('\n'));
+      warnedOnceMissingInPageSizeOptions.current = true;
+    }
+  }
+  const pageSizeOptions = isPageSizeIncludedInPageSizeOptions(paginationModel.pageSize) ? rootProps.pageSizeOptions : [];
+  return /*#__PURE__*/_jsx(GridPaginationRoot, _extends({
+    ref: ref,
+    component: "div",
+    count: rowCount,
+    page: paginationModel.page <= lastPage ? paginationModel.page : lastPage
+    // TODO: Remove the cast once the type is fixed in Material UI and that the min Material UI version
+    // for x-data-grid is past the fix.
+    // Note that Material UI will not mutate the array, so this is safe.
+    ,
+    rowsPerPageOptions: pageSizeOptions,
+    rowsPerPage: paginationModel.pageSize,
+    onPageChange: handlePageChange,
+    onRowsPerPageChange: handlePageSizeChange
+  }, apiRef.current.getLocaleText('MuiTablePagination'), props));
+});
+process.env.NODE_ENV !== "production" ? GridPagination.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  component: PropTypes.elementType
+} : void 0;
+export { GridPagination };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridRow.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { GridRowId, GridRowModel } from '../models/gridRows';
+import { GridStateColDef } from '../models/colDef/gridColDef';
+export interface GridRowProps extends React.HTMLAttributes<HTMLDivElement> {
+    rowId: GridRowId;
+    selected: boolean;
+    /**
+     * Index of the row in the whole sorted and filtered dataset.
+     * If some rows above have expanded children, this index also take those children into account.
+     */
+    index: number;
+    rowHeight: number | 'auto';
+    containerWidth: number;
+    firstColumnToRender: number;
+    lastColumnToRender: number;
+    visibleColumns: GridStateColDef[];
+    renderedColumns: GridStateColDef[];
+    position: 'left' | 'center' | 'right';
+    /**
+     * Determines which cell has focus.
+     * If `null`, no cell in this row has focus.
+     */
+    focusedCell: string | null;
+    /**
+     * Determines which cell should be tabbable by having tabIndex=0.
+     * If `null`, no cell in this row is in the tab sequence.
+     */
+    tabbableCell: string | null;
+    row?: GridRowModel;
+    isLastVisible?: boolean;
+    focusedCellColumnIndexNotInRange?: number;
+    isNotVisible?: boolean;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    onDoubleClick?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+    [x: string]: any;
+}
+declare const MemoizedGridRow: React.ForwardRefExoticComponent<Omit<GridRowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { MemoizedGridRow as GridRow };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridRow.js

@@ -0,0 +1,383 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["selected", "hovered", "rowId", "row", "index", "style", "position", "rowHeight", "className", "visibleColumns", "renderedColumns", "containerWidth", "firstColumnToRender", "lastColumnToRender", "isLastVisible", "focusedCellColumnIndexNotInRange", "isNotVisible", "focusedCell", "tabbableCell", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave", "onMouseOut", "onMouseOver"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses, unstable_useForkRef as useForkRef } from '@mui/utils';
+import { fastMemo } from '../utils/fastMemo';
+import { GridEditModes, GridRowModes, GridCellModes } from '../models/gridEditRowModel';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { gridColumnsTotalWidthSelector } from '../hooks/features/columns/gridColumnsSelector';
+import { useGridSelector, objectShallowCompare } from '../hooks/utils/useGridSelector';
+import { useGridVisibleRows } from '../hooks/utils/useGridVisibleRows';
+import { findParentElementFromClassName, isEventTargetInPortal } from '../utils/domUtils';
+import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../colDef/gridCheckboxSelectionColDef';
+import { GRID_ACTIONS_COLUMN_TYPE } from '../colDef/gridActionsColDef';
+import { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../constants/gridDetailPanelToggleField';
+import { gridSortModelSelector } from '../hooks/features/sorting/gridSortingSelector';
+import { gridRowMaximumTreeDepthSelector } from '../hooks/features/rows/gridRowsSelector';
+import { gridColumnGroupsHeaderMaxDepthSelector } from '../hooks/features/columnGrouping/gridColumnGroupsSelector';
+import { randomNumberBetween } from '../utils/utils';
+import { GridCellWrapper, GridCellV7 } from './cell/GridCell';
+import { gridEditRowsStateSelector } from '../hooks/features/editing/gridEditingSelectors';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    editable,
+    editing,
+    selected,
+    isLastVisible,
+    rowHeight,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['row', selected && 'selected', editable && 'row--editable', editing && 'row--editing', isLastVisible && 'row--lastVisible', rowHeight === 'auto' && 'row--dynamicHeight']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function EmptyCell({
+  width
+}) {
+  if (!width) {
+    return null;
+  }
+  const style = {
+    width
+  };
+  return /*#__PURE__*/_jsx("div", {
+    className: `${gridClasses.cell} ${gridClasses.withBorderColor}`,
+    style: style
+  }); // TODO change to .MuiDataGrid-emptyCell or .MuiDataGrid-rowFiller
+}
+const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
+  const {
+      selected,
+      hovered,
+      rowId,
+      row,
+      index,
+      style: styleProp,
+      position,
+      rowHeight,
+      className,
+      visibleColumns,
+      renderedColumns,
+      containerWidth,
+      firstColumnToRender,
+      isLastVisible = false,
+      focusedCellColumnIndexNotInRange,
+      isNotVisible,
+      focusedCell,
+      onClick,
+      onDoubleClick,
+      onMouseEnter,
+      onMouseLeave,
+      onMouseOut,
+      onMouseOver
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const ref = React.useRef(null);
+  const rootProps = useGridRootProps();
+  const currentPage = useGridVisibleRows(apiRef, rootProps);
+  const columnsTotalWidth = useGridSelector(apiRef, gridColumnsTotalWidthSelector);
+  const sortModel = useGridSelector(apiRef, gridSortModelSelector);
+  const treeDepth = useGridSelector(apiRef, gridRowMaximumTreeDepthSelector);
+  const headerGroupingMaxDepth = useGridSelector(apiRef, gridColumnGroupsHeaderMaxDepthSelector);
+  const editRowsState = useGridSelector(apiRef, gridEditRowsStateSelector);
+  const handleRef = useForkRef(ref, refProp);
+  const ariaRowIndex = index + headerGroupingMaxDepth + 2; // 1 for the header row and 1 as it's 1-based
+
+  const ownerState = {
+    selected,
+    hovered,
+    isLastVisible,
+    classes: rootProps.classes,
+    editing: apiRef.current.getRowMode(rowId) === GridRowModes.Edit,
+    editable: rootProps.editMode === GridEditModes.Row,
+    rowHeight
+  };
+  const classes = useUtilityClasses(ownerState);
+  React.useLayoutEffect(() => {
+    if (rowHeight === 'auto' && ref.current && typeof ResizeObserver === 'undefined') {
+      // Fallback for IE
+      apiRef.current.unstable_storeRowHeightMeasurement(rowId, ref.current.clientHeight, position);
+    }
+  }, [apiRef, rowHeight, rowId, position]);
+  React.useLayoutEffect(() => {
+    if (currentPage.range) {
+      // The index prop is relative to the rows from all pages. As example, the index prop of the
+      // first row is 5 if `paginationModel.pageSize=5` and `paginationModel.page=1`. However, the index used by the virtualization
+      // doesn't care about pagination and considers the rows from the current page only, so the
+      // first row always has index=0. We need to subtract the index of the first row to make it
+      // compatible with the index used by the virtualization.
+      const rowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(rowId);
+      // pinned rows are not part of the visible rows
+      if (rowIndex != null) {
+        apiRef.current.unstable_setLastMeasuredRowIndex(rowIndex);
+      }
+    }
+    const rootElement = ref.current;
+    const hasFixedHeight = rowHeight !== 'auto';
+    if (!rootElement || hasFixedHeight || typeof ResizeObserver === 'undefined') {
+      return undefined;
+    }
+    const resizeObserver = new ResizeObserver(entries => {
+      const [entry] = entries;
+      const height = entry.borderBoxSize && entry.borderBoxSize.length > 0 ? entry.borderBoxSize[0].blockSize : entry.contentRect.height;
+      apiRef.current.unstable_storeRowHeightMeasurement(rowId, height, position);
+    });
+    resizeObserver.observe(rootElement);
+    return () => resizeObserver.disconnect();
+  }, [apiRef, currentPage.range, index, rowHeight, rowId, position]);
+  const publish = React.useCallback((eventName, propHandler) => event => {
+    // Ignore portal
+    if (isEventTargetInPortal(event)) {
+      return;
+    }
+
+    // The row might have been deleted
+    if (!apiRef.current.getRow(rowId)) {
+      return;
+    }
+    apiRef.current.publishEvent(eventName, apiRef.current.getRowParams(rowId), event);
+    if (propHandler) {
+      propHandler(event);
+    }
+  }, [apiRef, rowId]);
+  const publishClick = React.useCallback(event => {
+    const cell = findParentElementFromClassName(event.target, gridClasses.cell);
+    const field = cell == null ? void 0 : cell.getAttribute('data-field');
+
+    // Check if the field is available because the cell that fills the empty
+    // space of the row has no field.
+    if (field) {
+      // User clicked in the checkbox added by checkboxSelection
+      if (field === GRID_CHECKBOX_SELECTION_COL_DEF.field) {
+        return;
+      }
+
+      // User opened a detail panel
+      if (field === GRID_DETAIL_PANEL_TOGGLE_FIELD) {
+        return;
+      }
+
+      // User reorders a row
+      if (field === '__reorder__') {
+        return;
+      }
+
+      // User is editing a cell
+      if (apiRef.current.getCellMode(rowId, field) === GridCellModes.Edit) {
+        return;
+      }
+
+      // User clicked a button from the "actions" column type
+      const column = apiRef.current.getColumn(field);
+      if ((column == null ? void 0 : column.type) === GRID_ACTIONS_COLUMN_TYPE) {
+        return;
+      }
+    }
+    publish('rowClick', onClick)(event);
+  }, [apiRef, onClick, publish, rowId]);
+  const {
+    slots,
+    slotProps,
+    disableColumnReorder
+  } = rootProps;
+  const CellComponent = slots.cell === GridCellV7 ? GridCellV7 : GridCellWrapper;
+  const rowReordering = rootProps.rowReordering;
+  const getCell = (column, cellProps) => {
+    var _editRowsState$rowId$, _editRowsState$rowId;
+    const disableDragEvents = disableColumnReorder && column.disableReorder || !rowReordering && !!sortModel.length && treeDepth > 1 && Object.keys(editRowsState).length > 0;
+    const editCellState = (_editRowsState$rowId$ = (_editRowsState$rowId = editRowsState[rowId]) == null ? void 0 : _editRowsState$rowId[column.field]) != null ? _editRowsState$rowId$ : null;
+    let cellIsNotVisible = false;
+    if (focusedCellColumnIndexNotInRange !== undefined && visibleColumns[focusedCellColumnIndexNotInRange].field === column.field) {
+      cellIsNotVisible = true;
+    }
+    return /*#__PURE__*/_jsx(CellComponent, _extends({
+      column: column,
+      width: cellProps.width,
+      rowId: rowId,
+      height: rowHeight,
+      showRightBorder: cellProps.showRightBorder,
+      align: column.align || 'left',
+      colIndex: cellProps.indexRelativeToAllColumns,
+      colSpan: cellProps.colSpan,
+      disableDragEvents: disableDragEvents,
+      editCellState: editCellState,
+      isNotVisible: cellIsNotVisible
+    }, slotProps == null ? void 0 : slotProps.cell), column.field);
+  };
+  const sizes = useGridSelector(apiRef, () => _extends({}, apiRef.current.unstable_getRowInternalSizes(rowId)), objectShallowCompare);
+  let minHeight = rowHeight;
+  if (minHeight === 'auto' && sizes) {
+    let numberOfBaseSizes = 0;
+    const maximumSize = Object.entries(sizes).reduce((acc, [key, size]) => {
+      const isBaseHeight = /^base[A-Z]/.test(key);
+      if (!isBaseHeight) {
+        return acc;
+      }
+      numberOfBaseSizes += 1;
+      if (size > acc) {
+        return size;
+      }
+      return acc;
+    }, 0);
+    if (maximumSize > 0 && numberOfBaseSizes > 1) {
+      minHeight = maximumSize;
+    }
+  }
+  const style = React.useMemo(() => {
+    if (isNotVisible) {
+      return {
+        opacity: 0,
+        width: 0,
+        height: 0
+      };
+    }
+    const rowStyle = _extends({}, styleProp, {
+      maxHeight: rowHeight === 'auto' ? 'none' : rowHeight,
+      // max-height doesn't support "auto"
+      minHeight
+    });
+    if (sizes != null && sizes.spacingTop) {
+      const property = rootProps.rowSpacingType === 'border' ? 'borderTopWidth' : 'marginTop';
+      rowStyle[property] = sizes.spacingTop;
+    }
+    if (sizes != null && sizes.spacingBottom) {
+      const property = rootProps.rowSpacingType === 'border' ? 'borderBottomWidth' : 'marginBottom';
+      let propertyValue = rowStyle[property];
+      // avoid overriding existing value
+      if (typeof propertyValue !== 'number') {
+        propertyValue = parseInt(propertyValue || '0', 10);
+      }
+      propertyValue += sizes.spacingBottom;
+      rowStyle[property] = propertyValue;
+    }
+    return rowStyle;
+  }, [isNotVisible, rowHeight, styleProp, minHeight, sizes, rootProps.rowSpacingType]);
+  const rowClassNames = apiRef.current.unstable_applyPipeProcessors('rowClassName', [], rowId);
+  if (typeof rootProps.getRowClassName === 'function') {
+    var _currentPage$range;
+    const indexRelativeToCurrentPage = index - (((_currentPage$range = currentPage.range) == null ? void 0 : _currentPage$range.firstRowIndex) || 0);
+    const rowParams = _extends({}, apiRef.current.getRowParams(rowId), {
+      isFirstVisible: indexRelativeToCurrentPage === 0,
+      isLastVisible: indexRelativeToCurrentPage === currentPage.rows.length - 1,
+      indexRelativeToCurrentPage
+    });
+    rowClassNames.push(rootProps.getRowClassName(rowParams));
+  }
+  const randomNumber = randomNumberBetween(10000, 20, 80);
+  const rowNode = apiRef.current.getRowNode(rowId);
+  if (!rowNode) {
+    return null;
+  }
+  const rowType = rowNode.type;
+  const cells = [];
+  for (let i = 0; i < renderedColumns.length; i += 1) {
+    const column = renderedColumns[i];
+    let indexRelativeToAllColumns = firstColumnToRender + i;
+    if (focusedCellColumnIndexNotInRange !== undefined && focusedCell) {
+      if (visibleColumns[focusedCellColumnIndexNotInRange].field === column.field) {
+        indexRelativeToAllColumns = focusedCellColumnIndexNotInRange;
+      } else {
+        indexRelativeToAllColumns -= 1;
+      }
+    }
+    const cellColSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowId, indexRelativeToAllColumns);
+    if (cellColSpanInfo && !cellColSpanInfo.spannedByColSpan) {
+      if (rowType !== 'skeletonRow') {
+        const {
+          colSpan,
+          width
+        } = cellColSpanInfo.cellProps;
+        const cellProps = {
+          width,
+          colSpan,
+          showRightBorder: rootProps.showCellVerticalBorder,
+          indexRelativeToAllColumns
+        };
+        cells.push(getCell(column, cellProps));
+      } else {
+        const {
+          width
+        } = cellColSpanInfo.cellProps;
+        const contentWidth = Math.round(randomNumber());
+        cells.push( /*#__PURE__*/_jsx(slots.skeletonCell, {
+          width: width,
+          contentWidth: contentWidth,
+          field: column.field,
+          align: column.align
+        }, column.field));
+      }
+    }
+  }
+  const emptyCellWidth = containerWidth - columnsTotalWidth;
+  const eventHandlers = row ? {
+    onClick: publishClick,
+    onDoubleClick: publish('rowDoubleClick', onDoubleClick),
+    onMouseEnter: publish('rowMouseEnter', onMouseEnter),
+    onMouseLeave: publish('rowMouseLeave', onMouseLeave),
+    onMouseOut: publish('rowMouseOut', onMouseOut),
+    onMouseOver: publish('rowMouseOver', onMouseOver)
+  } : null;
+  return /*#__PURE__*/_jsxs("div", _extends({
+    ref: handleRef,
+    "data-id": rowId,
+    "data-rowindex": index,
+    role: "row",
+    className: clsx(...rowClassNames, classes.root, className, hovered && 'Mui-hovered'),
+    "aria-rowindex": ariaRowIndex,
+    "aria-selected": selected,
+    style: style
+  }, eventHandlers, other, {
+    children: [cells, emptyCellWidth > 0 && /*#__PURE__*/_jsx(EmptyCell, {
+      width: emptyCellWidth
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridRow.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  containerWidth: PropTypes.number.isRequired,
+  firstColumnToRender: PropTypes.number.isRequired,
+  /**
+   * Determines which cell has focus.
+   * If `null`, no cell in this row has focus.
+   */
+  focusedCell: PropTypes.string,
+  focusedCellColumnIndexNotInRange: PropTypes.number,
+  /**
+   * Index of the row in the whole sorted and filtered dataset.
+   * If some rows above have expanded children, this index also take those children into account.
+   */
+  index: PropTypes.number.isRequired,
+  isLastVisible: PropTypes.bool,
+  isNotVisible: PropTypes.bool,
+  lastColumnToRender: PropTypes.number.isRequired,
+  onClick: PropTypes.func,
+  onDoubleClick: PropTypes.func,
+  onMouseEnter: PropTypes.func,
+  onMouseLeave: PropTypes.func,
+  position: PropTypes.oneOf(['center', 'left', 'right']).isRequired,
+  renderedColumns: PropTypes.arrayOf(PropTypes.object).isRequired,
+  row: PropTypes.object,
+  rowHeight: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]).isRequired,
+  rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  selected: PropTypes.bool.isRequired,
+  /**
+   * Determines which cell should be tabbable by having tabIndex=0.
+   * If `null`, no cell in this row is in the tab sequence.
+   */
+  tabbableCell: PropTypes.string,
+  visibleColumns: PropTypes.arrayOf(PropTypes.object).isRequired
+} : void 0;
+const MemoizedGridRow = fastMemo(GridRow);
+export { MemoizedGridRow as GridRow };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridRowCount.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { SxProps, Theme } from '@mui/system';
+interface RowCountProps {
+    rowCount: number;
+    visibleRowCount: number;
+}
+export type GridRowCountProps = React.HTMLAttributes<HTMLDivElement> & RowCountProps & {
+    sx?: SxProps<Theme>;
+};
+declare const GridRowCount: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & RowCountProps & {
+    sx?: SxProps<Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { GridRowCount };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridRowCount.js

@@ -0,0 +1,64 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "rowCount", "visibleRowCount"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { styled } from '@mui/system';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { getDataGridUtilityClass } from '../constants/gridClasses';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['rowCount']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const GridRowCountRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'RowCount',
+  overridesResolver: (props, styles) => styles.rowCount
+})(({
+  theme
+}) => ({
+  alignItems: 'center',
+  display: 'flex',
+  margin: theme.spacing(0, 2)
+}));
+const GridRowCount = /*#__PURE__*/React.forwardRef(function GridRowCount(props, ref) {
+  const {
+      className,
+      rowCount,
+      visibleRowCount
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const ownerState = useGridRootProps();
+  const classes = useUtilityClasses(ownerState);
+  if (rowCount === 0) {
+    return null;
+  }
+  const text = visibleRowCount < rowCount ? apiRef.current.getLocaleText('footerTotalVisibleRows')(visibleRowCount, rowCount) : rowCount.toLocaleString();
+  return /*#__PURE__*/_jsxs(GridRowCountRoot, _extends({
+    ref: ref,
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [apiRef.current.getLocaleText('footerTotalRows'), " ", text]
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridRowCount.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  rowCount: PropTypes.number.isRequired,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  visibleRowCount: PropTypes.number.isRequired
+} : void 0;
+export { GridRowCount };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridSelectedRowCount.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { SxProps, Theme } from '@mui/system';
+interface SelectedRowCountProps {
+    selectedRowCount: number;
+}
+declare const GridSelectedRowCount: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & SelectedRowCountProps & {
+    sx?: SxProps<Theme> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { GridSelectedRowCount };

control-plane-ui/node_modules/@mui/x-data-grid/components/GridSelectedRowCount.js

@@ -0,0 +1,67 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "selectedRowCount"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { styled } from '@mui/system';
+import { useGridApiContext } from '../hooks/utils/useGridApiContext';
+import { getDataGridUtilityClass } from '../constants/gridClasses';
+import { useGridRootProps } from '../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['selectedRowCount']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const GridSelectedRowCountRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'SelectedRowCount',
+  overridesResolver: (props, styles) => styles.selectedRowCount
+})(({
+  theme
+}) => ({
+  alignItems: 'center',
+  display: 'flex',
+  margin: theme.spacing(0, 2),
+  visibility: 'hidden',
+  width: 0,
+  height: 0,
+  [theme.breakpoints.up('sm')]: {
+    visibility: 'visible',
+    width: 'auto',
+    height: 'auto'
+  }
+}));
+const GridSelectedRowCount = /*#__PURE__*/React.forwardRef(function GridSelectedRowCount(props, ref) {
+  const {
+      className,
+      selectedRowCount
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const ownerState = useGridRootProps();
+  const classes = useUtilityClasses(ownerState);
+  const rowSelectedText = apiRef.current.getLocaleText('footerRowSelected')(selectedRowCount);
+  return /*#__PURE__*/_jsx(GridSelectedRowCountRoot, _extends({
+    ref: ref,
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: rowSelectedText
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridSelectedRowCount.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  selectedRowCount: PropTypes.number.isRequired,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridSelectedRowCount };

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridBody.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+interface GridBodyProps {
+    children?: React.ReactNode;
+    ColumnHeadersProps?: Record<string, any>;
+    VirtualScrollerComponent: React.JSXElementConstructor<React.HTMLAttributes<HTMLDivElement> & {
+        ref: React.Ref<HTMLDivElement>;
+    }>;
+}
+declare function GridBody(props: GridBodyProps): React.JSX.Element;
+declare namespace GridBody {
+    var propTypes: any;
+}
+export { GridBody };

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridBody.js

@@ -0,0 +1,116 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';
+import { useGridSelector } from '../../hooks/utils/useGridSelector';
+import { GridMainContainer } from '../containers/GridMainContainer';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { gridColumnPositionsSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector } from '../../hooks/features/columns/gridColumnsSelector';
+import { gridFilterActiveItemsLookupSelector } from '../../hooks/features/filter/gridFilterSelector';
+import { gridSortColumnLookupSelector } from '../../hooks/features/sorting/gridSortingSelector';
+import { gridTabIndexColumnHeaderSelector, gridTabIndexCellSelector, gridFocusColumnHeaderSelector, unstable_gridTabIndexColumnGroupHeaderSelector, unstable_gridFocusColumnGroupHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';
+import { gridDensityFactorSelector } from '../../hooks/features/density/densitySelector';
+import { gridColumnGroupsHeaderMaxDepthSelector, gridColumnGroupsHeaderStructureSelector } from '../../hooks/features/columnGrouping/gridColumnGroupsSelector';
+import { gridColumnMenuSelector } from '../../hooks/features/columnMenu/columnMenuSelector';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function GridBody(props) {
+  const {
+    VirtualScrollerComponent,
+    ColumnHeadersProps,
+    children
+  } = props;
+  const apiRef = useGridPrivateApiContext();
+  const rootProps = useGridRootProps();
+  const rootRef = React.useRef(null);
+  const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);
+  const filterColumnLookup = useGridSelector(apiRef, gridFilterActiveItemsLookupSelector);
+  const sortColumnLookup = useGridSelector(apiRef, gridSortColumnLookupSelector);
+  const columnPositions = useGridSelector(apiRef, gridColumnPositionsSelector);
+  const columnHeaderTabIndexState = useGridSelector(apiRef, gridTabIndexColumnHeaderSelector);
+  const cellTabIndexState = useGridSelector(apiRef, gridTabIndexCellSelector);
+  const columnGroupHeaderTabIndexState = useGridSelector(apiRef, unstable_gridTabIndexColumnGroupHeaderSelector);
+  const columnHeaderFocus = useGridSelector(apiRef, gridFocusColumnHeaderSelector);
+  const columnGroupHeaderFocus = useGridSelector(apiRef, unstable_gridFocusColumnGroupHeaderSelector);
+  const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
+  const headerGroupingMaxDepth = useGridSelector(apiRef, gridColumnGroupsHeaderMaxDepthSelector);
+  const columnMenuState = useGridSelector(apiRef, gridColumnMenuSelector);
+  const columnVisibility = useGridSelector(apiRef, gridColumnVisibilityModelSelector);
+  const columnGroupsHeaderStructure = useGridSelector(apiRef, gridColumnGroupsHeaderStructureSelector);
+  const hasOtherElementInTabSequence = !(columnGroupHeaderTabIndexState === null && columnHeaderTabIndexState === null && cellTabIndexState === null);
+  useEnhancedEffect(() => {
+    apiRef.current.computeSizeAndPublishResizeEvent();
+    const elementToObserve = rootRef.current;
+    if (typeof ResizeObserver === 'undefined') {
+      return () => {};
+    }
+    let animationFrame;
+    const observer = new ResizeObserver(() => {
+      // See https://github.com/mui/mui-x/issues/8733
+      animationFrame = requestAnimationFrame(() => {
+        apiRef.current.computeSizeAndPublishResizeEvent();
+      });
+    });
+    if (elementToObserve) {
+      observer.observe(elementToObserve);
+    }
+    return () => {
+      if (animationFrame) {
+        window.cancelAnimationFrame(animationFrame);
+      }
+      if (elementToObserve) {
+        observer.unobserve(elementToObserve);
+      }
+    };
+  }, [apiRef]);
+  const columnHeadersRef = React.useRef(null);
+  const columnsContainerRef = React.useRef(null);
+  const virtualScrollerRef = React.useRef(null);
+  apiRef.current.register('private', {
+    columnHeadersContainerElementRef: columnsContainerRef,
+    columnHeadersElementRef: columnHeadersRef,
+    virtualScrollerRef,
+    mainElementRef: rootRef
+  });
+  const hasDimensions = !!apiRef.current.getRootDimensions();
+  return /*#__PURE__*/_jsxs(GridMainContainer, {
+    ref: rootRef,
+    children: [/*#__PURE__*/_jsx(rootProps.slots.columnHeaders, _extends({
+      ref: columnsContainerRef,
+      innerRef: columnHeadersRef,
+      visibleColumns: visibleColumns,
+      filterColumnLookup: filterColumnLookup,
+      sortColumnLookup: sortColumnLookup,
+      columnPositions: columnPositions,
+      columnHeaderTabIndexState: columnHeaderTabIndexState,
+      columnGroupHeaderTabIndexState: columnGroupHeaderTabIndexState,
+      columnHeaderFocus: columnHeaderFocus,
+      columnGroupHeaderFocus: columnGroupHeaderFocus,
+      densityFactor: densityFactor,
+      headerGroupingMaxDepth: headerGroupingMaxDepth,
+      columnMenuState: columnMenuState,
+      columnVisibility: columnVisibility,
+      columnGroupsHeaderStructure: columnGroupsHeaderStructure,
+      hasOtherElementInTabSequence: hasOtherElementInTabSequence
+    }, ColumnHeadersProps)), hasDimensions && /*#__PURE__*/_jsx(VirtualScrollerComponent
+    // The content is only rendered after dimensions are computed because
+    // the lazy-loading hook is listening to `renderedRowsIntervalChange`,
+    // but only does something if the dimensions are also available.
+    // If this event is published while dimensions haven't been computed,
+    // the `onFetchRows` prop won't be called during mount.
+    , {
+      ref: virtualScrollerRef
+    }), 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,
+  ColumnHeadersProps: PropTypes.object,
+  VirtualScrollerComponent: PropTypes.elementType.isRequired
+} : void 0;
+export { GridBody };

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridFooterPlaceholder.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function GridFooterPlaceholder(): React.JSX.Element | null;

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridFooterPlaceholder.js

@@ -0,0 +1,12 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function GridFooterPlaceholder() {
+  var _rootProps$slotProps;
+  const rootProps = useGridRootProps();
+  if (rootProps.hideFooter) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(rootProps.slots.footer, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.footer));
+}

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridOverlays.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function GridOverlays(): React.JSX.Element | null;

control-plane-ui/node_modules/@mui/x-data-grid/components/base/GridOverlays.js

@@ -0,0 +1,126 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { styled } from '@mui/system';
+import { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import clsx from 'clsx';
+import { useGridSelector } from '../../hooks/utils/useGridSelector';
+import { gridExpandedRowCountSelector } from '../../hooks/features/filter/gridFilterSelector';
+import { gridRowCountSelector, gridRowsLoadingSelector } from '../../hooks/features/rows/gridRowsSelector';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { getMinimalContentHeight } from '../../hooks/features/rows/gridRowsUtils';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const GridOverlayWrapperRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'OverlayWrapper',
+  shouldForwardProp: prop => prop !== 'overlayType',
+  overridesResolver: (props, styles) => styles.overlayWrapper
+})(({
+  overlayType
+}) => ({
+  position: 'sticky',
+  // To stay in place while scrolling
+  top: 0,
+  left: 0,
+  width: 0,
+  // To stay above the content instead of shifting it down
+  height: 0,
+  // To stay above the content instead of shifting it down
+  zIndex: overlayType === 'loadingOverlay' ? 5 // Should be above pinned columns, pinned rows, and detail panel
+  : 4 // Should be above pinned columns and detail panel
+}));
+const GridOverlayWrapperInner = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'OverlayWrapperInner',
+  shouldForwardProp: prop => prop !== 'overlayType',
+  overridesResolver: (props, styles) => styles.overlayWrapperInner
+})({});
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['overlayWrapper'],
+    inner: ['overlayWrapperInner']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function GridOverlayWrapper(props) {
+  var _viewportInnerSize$he, _viewportInnerSize$wi;
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const [viewportInnerSize, setViewportInnerSize] = React.useState(() => {
+    var _apiRef$current$getRo, _apiRef$current$getRo2;
+    return (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize) != null ? _apiRef$current$getRo : null;
+  });
+  const handleViewportSizeChange = React.useCallback(() => {
+    var _apiRef$current$getRo3, _apiRef$current$getRo4;
+    setViewportInnerSize((_apiRef$current$getRo3 = (_apiRef$current$getRo4 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo4.viewportInnerSize) != null ? _apiRef$current$getRo3 : null);
+  }, [apiRef]);
+  useEnhancedEffect(() => {
+    return apiRef.current.subscribeEvent('viewportInnerSizeChange', handleViewportSizeChange);
+  }, [apiRef, handleViewportSizeChange]);
+  let height = (_viewportInnerSize$he = viewportInnerSize == null ? void 0 : viewportInnerSize.height) != null ? _viewportInnerSize$he : 0;
+  if (rootProps.autoHeight && height === 0) {
+    height = getMinimalContentHeight(apiRef, rootProps.rowHeight); // Give room to show the overlay when there no rows.
+  }
+  const classes = useUtilityClasses(_extends({}, props, {
+    classes: rootProps.classes
+  }));
+  if (!viewportInnerSize) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(GridOverlayWrapperRoot, {
+    className: clsx(classes.root),
+    overlayType: props.overlayType,
+    children: /*#__PURE__*/_jsx(GridOverlayWrapperInner, _extends({
+      className: clsx(classes.inner),
+      style: {
+        height,
+        width: (_viewportInnerSize$wi = viewportInnerSize == null ? void 0 : viewportInnerSize.width) != null ? _viewportInnerSize$wi : 0
+      }
+    }, props))
+  });
+}
+process.env.NODE_ENV !== "production" ? GridOverlayWrapper.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  overlayType: PropTypes.string.isRequired
+} : void 0;
+export function GridOverlays() {
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const totalRowCount = useGridSelector(apiRef, gridRowCountSelector);
+  const visibleRowCount = useGridSelector(apiRef, gridExpandedRowCountSelector);
+  const loading = useGridSelector(apiRef, gridRowsLoadingSelector);
+  const showNoRowsOverlay = !loading && totalRowCount === 0;
+  const showNoResultsOverlay = !loading && totalRowCount > 0 && visibleRowCount === 0;
+  let overlay = null;
+  let overlayType = '';
+  if (showNoRowsOverlay) {
+    var _rootProps$slotProps;
+    overlay = /*#__PURE__*/_jsx(rootProps.slots.noRowsOverlay, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.noRowsOverlay));
+    overlayType = 'noRowsOverlay';
+  }
+  if (showNoResultsOverlay) {
+    var _rootProps$slotProps2;
+    overlay = /*#__PURE__*/_jsx(rootProps.slots.noResultsOverlay, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.noResultsOverlay));
+    overlayType = 'noResultsOverlay';
+  }
+  if (loading) {
+    var _rootProps$slotProps3;
+    overlay = /*#__PURE__*/_jsx(rootProps.slots.loadingOverlay, _extends({}, (_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.loadingOverlay));
+    overlayType = 'loadingOverlay';
+  }
+  if (overlay === null) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(GridOverlayWrapper, {
+    overlayType: overlayType,
+    children: overlay
+  });
+}

control-plane-ui/node_modules/@mui/x-data-grid/components/base/index.d.ts

@@ -0,0 +1,3 @@
+export * from './GridBody';
+export * from './GridFooterPlaceholder';
+export * from './GridOverlays';

control-plane-ui/node_modules/@mui/x-data-grid/components/base/index.js

@@ -0,0 +1,3 @@
+export * from './GridBody';
+export * from './GridFooterPlaceholder';
+export * from './GridOverlays';

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridActionsCell.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '../../models/params/gridCellParams';
+import { GridMenuProps } from '../menu/GridMenu';
+interface GridActionsCellProps extends Omit<GridRenderCellParams, 'api'> {
+    api?: GridRenderCellParams['api'];
+    position?: GridMenuProps['position'];
+}
+declare function GridActionsCell(props: GridActionsCellProps): React.JSX.Element;
+declare namespace GridActionsCell {
+    var propTypes: any;
+}
+export { GridActionsCell };
+export declare const renderActionsCell: (params: GridRenderCellParams) => React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridActionsCell.js

@@ -0,0 +1,257 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["api", "colDef", "id", "hasFocus", "isEditable", "field", "value", "formattedValue", "row", "rowNode", "cellMode", "tabIndex", "position", "focusElementRef"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import MenuList from '@mui/material/MenuList';
+import { useTheme } from '@mui/material/styles';
+import { unstable_useId as useId } from '@mui/utils';
+import { gridClasses } from '../../constants/gridClasses';
+import { GridMenu } from '../menu/GridMenu';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const hasActions = colDef => typeof colDef.getActions === 'function';
+function GridActionsCell(props) {
+  var _rootProps$slotProps;
+  const {
+      colDef,
+      id,
+      hasFocus,
+      tabIndex,
+      position = 'bottom-end',
+      focusElementRef
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const [focusedButtonIndex, setFocusedButtonIndex] = React.useState(-1);
+  const [open, setOpen] = React.useState(false);
+  const apiRef = useGridApiContext();
+  const rootRef = React.useRef(null);
+  const buttonRef = React.useRef(null);
+  const ignoreCallToFocus = React.useRef(false);
+  const touchRippleRefs = React.useRef({});
+  const theme = useTheme();
+  const menuId = useId();
+  const buttonId = useId();
+  const rootProps = useGridRootProps();
+  if (!hasActions(colDef)) {
+    throw new Error('MUI: Missing the `getActions` property in the `GridColDef`.');
+  }
+  const options = colDef.getActions(apiRef.current.getRowParams(id));
+  const iconButtons = options.filter(option => !option.props.showInMenu);
+  const menuButtons = options.filter(option => option.props.showInMenu);
+  const numberOfButtons = iconButtons.length + (menuButtons.length ? 1 : 0);
+  React.useLayoutEffect(() => {
+    if (!hasFocus) {
+      Object.entries(touchRippleRefs.current).forEach(([index, ref]) => {
+        ref == null || ref.stop({}, () => {
+          delete touchRippleRefs.current[index];
+        });
+      });
+    }
+  }, [hasFocus]);
+  React.useEffect(() => {
+    if (focusedButtonIndex < 0 || !rootRef.current) {
+      return;
+    }
+    if (focusedButtonIndex >= rootRef.current.children.length) {
+      return;
+    }
+    const child = rootRef.current.children[focusedButtonIndex];
+    child.focus({
+      preventScroll: true
+    });
+  }, [focusedButtonIndex]);
+  React.useEffect(() => {
+    if (!hasFocus) {
+      setFocusedButtonIndex(-1);
+      ignoreCallToFocus.current = false;
+    }
+  }, [hasFocus]);
+  React.useImperativeHandle(focusElementRef, () => ({
+    focus() {
+      // If ignoreCallToFocus is true, then one of the buttons was clicked and the focus is already set
+      if (!ignoreCallToFocus.current) {
+        // find the first focusable button and pass the index to the state
+        const focusableButtonIndex = options.findIndex(o => !o.props.disabled);
+        setFocusedButtonIndex(focusableButtonIndex);
+      }
+    }
+  }), [options]);
+  React.useEffect(() => {
+    if (focusedButtonIndex >= numberOfButtons) {
+      setFocusedButtonIndex(numberOfButtons - 1);
+    }
+  }, [focusedButtonIndex, numberOfButtons]);
+  const showMenu = () => {
+    setOpen(true);
+    setFocusedButtonIndex(numberOfButtons - 1);
+    ignoreCallToFocus.current = true;
+  };
+  const hideMenu = () => {
+    setOpen(false);
+  };
+  const handleTouchRippleRef = index => instance => {
+    touchRippleRefs.current[index] = instance;
+  };
+  const handleButtonClick = (index, onClick) => event => {
+    setFocusedButtonIndex(index);
+    ignoreCallToFocus.current = true;
+    if (onClick) {
+      onClick(event);
+    }
+  };
+  const handleRootKeyDown = event => {
+    if (numberOfButtons <= 1) {
+      return;
+    }
+    const getNewIndex = (index, direction) => {
+      var _options;
+      if (index < 0 || index > options.length) {
+        return index;
+      }
+
+      // for rtl mode we need to reverse the direction
+      const rtlMod = theme.direction === 'rtl' ? -1 : 1;
+      const indexMod = (direction === 'left' ? -1 : 1) * rtlMod;
+
+      // if the button that should receive focus is disabled go one more step
+      return (_options = options[index + indexMod]) != null && _options.props.disabled ? getNewIndex(index + indexMod, direction) : index + indexMod;
+    };
+    let newIndex = focusedButtonIndex;
+    if (event.key === 'ArrowRight') {
+      newIndex = getNewIndex(focusedButtonIndex, 'right');
+    } else if (event.key === 'ArrowLeft') {
+      newIndex = getNewIndex(focusedButtonIndex, 'left');
+    }
+    if (newIndex < 0 || newIndex >= numberOfButtons) {
+      return; // We're already in the first or last item = do nothing and let the grid listen the event
+    }
+    if (newIndex !== focusedButtonIndex) {
+      event.preventDefault(); // Prevent scrolling
+      event.stopPropagation(); // Don't stop propagation for other keys, e.g. ArrowUp
+      setFocusedButtonIndex(newIndex);
+    }
+  };
+  const handleListKeyDown = event => {
+    if (event.key === 'Tab') {
+      event.preventDefault();
+    }
+    if (['Tab', 'Escape'].includes(event.key)) {
+      hideMenu();
+    }
+  };
+  return /*#__PURE__*/_jsxs("div", _extends({
+    role: "menu",
+    ref: rootRef,
+    tabIndex: -1,
+    className: gridClasses.actionsCell,
+    onKeyDown: handleRootKeyDown
+  }, other, {
+    children: [iconButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button, {
+      key: index,
+      touchRippleRef: handleTouchRippleRef(index),
+      onClick: handleButtonClick(index, button.props.onClick),
+      tabIndex: focusedButtonIndex === index ? tabIndex : -1
+    })), menuButtons.length > 0 && buttonId && /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
+      ref: buttonRef,
+      id: buttonId,
+      "aria-label": apiRef.current.getLocaleText('actionsCellMore'),
+      "aria-haspopup": "menu",
+      "aria-expanded": open,
+      "aria-controls": open ? menuId : undefined,
+      role: "menuitem",
+      size: "small",
+      onClick: showMenu,
+      touchRippleRef: handleTouchRippleRef(buttonId),
+      tabIndex: focusedButtonIndex === iconButtons.length ? tabIndex : -1
+    }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {
+      children: /*#__PURE__*/_jsx(rootProps.slots.moreActionsIcon, {
+        fontSize: "small"
+      })
+    })), menuButtons.length > 0 && /*#__PURE__*/_jsx(GridMenu, {
+      open: open,
+      target: buttonRef.current,
+      position: position,
+      onClose: hideMenu,
+      children: /*#__PURE__*/_jsx(MenuList, {
+        id: menuId,
+        className: gridClasses.menuList,
+        onKeyDown: handleListKeyDown,
+        "aria-labelledby": buttonId,
+        variant: "menu",
+        autoFocusItem: true,
+        children: menuButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button, {
+          key: index,
+          closeMenu: hideMenu
+        }))
+      })
+    })]
+  }));
+}
+process.env.NODE_ENV !== "production" ? GridActionsCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  api: PropTypes.object,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * A ref allowing to set imperative focus.
+   * It can be passed to the element that should receive focus.
+   * @ignore - do not document.
+   */
+  focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.shape({
+      focus: PropTypes.func.isRequired
+    })
+  })]),
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  position: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+export { GridActionsCell };
+export const renderActionsCell = params => /*#__PURE__*/_jsx(GridActionsCell, _extends({}, params));

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { IconButtonProps } from '@mui/material/IconButton';
+import { MenuItemProps } from '@mui/material/MenuItem';
+interface GridActionsCellItemCommonProps {
+    label: string;
+    icon?: React.ReactElement;
+    /** from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component */
+    component?: React.ElementType;
+}
+export type GridActionsCellItemProps = GridActionsCellItemCommonProps & (({
+    showInMenu?: false;
+    icon: React.ReactElement;
+} & Omit<IconButtonProps, 'component'>) | ({
+    showInMenu: true;
+    /**
+     * If false, the menu will not close when this item is clicked.
+     * @default true
+     */
+    closeMenuOnClick?: boolean;
+    closeMenu?: () => void;
+} & Omit<MenuItemProps, 'component'>));
+declare const GridActionsCellItem: React.ForwardRefExoticComponent<(Omit<GridActionsCellItemCommonProps & {
+    showInMenu?: false | undefined;
+    icon: React.ReactElement;
+} & Omit<IconButtonProps, "component">, "ref"> | Omit<GridActionsCellItemCommonProps & {
+    showInMenu: true;
+    /**
+     * If false, the menu will not close when this item is clicked.
+     * @default true
+     */
+    closeMenuOnClick?: boolean | undefined;
+    closeMenu?: (() => void) | undefined;
+} & Omit<MenuItemProps, "component">, "ref">) & React.RefAttributes<HTMLElement>>;
+export { GridActionsCellItem };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.js

@@ -0,0 +1,74 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["label", "icon", "showInMenu", "onClick"],
+  _excluded2 = ["label", "icon", "showInMenu", "onClick", "closeMenuOnClick", "closeMenu"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import MenuItem from '@mui/material/MenuItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const GridActionsCellItem = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const rootProps = useGridRootProps();
+  if (!props.showInMenu) {
+    var _rootProps$slotProps;
+    const {
+        label,
+        icon,
+        onClick
+      } = props,
+      other = _objectWithoutPropertiesLoose(props, _excluded);
+    const handleClick = event => {
+      onClick == null || onClick(event);
+    };
+    return /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
+      ref: ref,
+      size: "small",
+      role: "menuitem",
+      "aria-label": label
+    }, other, {
+      onClick: handleClick
+    }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {
+      children: /*#__PURE__*/React.cloneElement(icon, {
+        fontSize: 'small'
+      })
+    }));
+  }
+  const {
+      label,
+      icon,
+      onClick,
+      closeMenuOnClick = true,
+      closeMenu
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const handleClick = event => {
+    onClick == null || onClick(event);
+    if (closeMenuOnClick) {
+      closeMenu == null || closeMenu();
+    }
+  };
+  return /*#__PURE__*/_jsxs(MenuItem, _extends({
+    ref: ref
+  }, other, {
+    onClick: handleClick,
+    children: [icon && /*#__PURE__*/_jsx(ListItemIcon, {
+      children: icon
+    }), label]
+  }));
+});
+process.env.NODE_ENV !== "production" ? GridActionsCellItem.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component
+   */
+  component: PropTypes.elementType,
+  icon: PropTypes.element,
+  label: PropTypes.string.isRequired,
+  showInMenu: PropTypes.bool
+} : void 0;
+export { GridActionsCellItem };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridBooleanCell.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { SvgIconProps } from '@mui/material/SvgIcon';
+import { GridRenderCellParams } from '../../models/params/gridCellParams';
+import { GridColDef } from '../../models/colDef/gridColDef';
+interface GridBooleanCellProps extends GridRenderCellParams, Omit<SvgIconProps, 'tabIndex' | 'id'> {
+}
+declare function GridBooleanCellRaw(props: GridBooleanCellProps): React.JSX.Element;
+declare namespace GridBooleanCellRaw {
+    var propTypes: any;
+}
+declare const GridBooleanCell: React.MemoExoticComponent<typeof GridBooleanCellRaw>;
+export { GridBooleanCell };
+export declare const renderBooleanCell: GridColDef['renderCell'];

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridBooleanCell.js

@@ -0,0 +1,112 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "hasFocus", "tabIndex"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { isAutoGeneratedRow } from '../../hooks/features/rows/gridRowsUtils';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['booleanCell']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function GridBooleanCellRaw(props) {
+  const {
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    classes: rootProps.classes
+  };
+  const classes = useUtilityClasses(ownerState);
+  const Icon = React.useMemo(() => value ? rootProps.slots.booleanCellTrueIcon : rootProps.slots.booleanCellFalseIcon, [rootProps.slots.booleanCellFalseIcon, rootProps.slots.booleanCellTrueIcon, value]);
+  return /*#__PURE__*/_jsx(Icon, _extends({
+    fontSize: "small",
+    className: classes.root,
+    titleAccess: apiRef.current.getLocaleText(value ? 'booleanCellTrueLabel' : 'booleanCellFalseLabel'),
+    "data-value": Boolean(value)
+  }, other));
+}
+process.env.NODE_ENV !== "production" ? GridBooleanCellRaw.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * GridApi that let you manipulate the grid.
+   */
+  api: PropTypes.object.isRequired,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * A ref allowing to set imperative focus.
+   * It can be passed to the element that should receive focus.
+   * @ignore - do not document.
+   */
+  focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.shape({
+      focus: PropTypes.func.isRequired
+    })
+  })]),
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+const GridBooleanCell = /*#__PURE__*/React.memo(GridBooleanCellRaw);
+export { GridBooleanCell };
+export const renderBooleanCell = params => {
+  if (isAutoGeneratedRow(params.rowNode)) {
+    return '';
+  }
+  return /*#__PURE__*/_jsx(GridBooleanCell, _extends({}, params));
+};

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridCell.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { GridRowId, GridCellMode, GridEditCellProps } from '../../models';
+import { GridColDef, GridAlignment } from '../../models/colDef/gridColDef';
+type GridCellV7Props = {
+    align: GridAlignment;
+    className?: string;
+    colIndex: number;
+    column: GridColDef;
+    rowId: GridRowId;
+    height: number | 'auto';
+    showRightBorder?: boolean;
+    width: number;
+    colSpan?: number;
+    disableDragEvents?: boolean;
+    isNotVisible?: boolean;
+    editCellState: GridEditCellProps<any> | null;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    onDoubleClick?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseUp?: React.MouseEventHandler<HTMLDivElement>;
+    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
+    onDragEnter?: React.DragEventHandler<HTMLDivElement>;
+    onDragOver?: React.DragEventHandler<HTMLDivElement>;
+    [x: string]: any;
+};
+type GridCellWrapperProps = GridCellV7Props;
+export type GridCellProps<V = any, F = V> = GridCellWrapperProps & {
+    field: string;
+    formattedValue?: F;
+    hasFocus?: boolean;
+    isEditable?: boolean;
+    isSelected?: boolean;
+    value?: V;
+    cellMode?: GridCellMode;
+    children: React.ReactNode;
+    tabIndex: 0 | -1;
+};
+declare const GridCell: React.ForwardRefExoticComponent<Omit<GridCellProps<any, any>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const MemoizedCellWrapper: React.ForwardRefExoticComponent<Omit<GridCellV7Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { MemoizedCellWrapper as GridCellWrapper, GridCell };
+declare const MemoizedGridCellV7: React.ForwardRefExoticComponent<Omit<GridCellV7Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { MemoizedGridCellV7 as GridCellV7 };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridCell.js

@@ -0,0 +1,650 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["changeReason", "unstable_updateValueOnRender"],
+  _excluded2 = ["align", "children", "editCellState", "colIndex", "column", "cellMode", "field", "formattedValue", "hasFocus", "height", "isEditable", "isSelected", "rowId", "tabIndex", "style", "value", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver"],
+  _excluded3 = ["column", "rowId", "editCellState", "align", "children", "colIndex", "height", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver", "style"],
+  _excluded4 = ["changeReason", "unstable_updateValueOnRender"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_useForkRef as useForkRef, unstable_composeClasses as composeClasses, unstable_ownerDocument as ownerDocument, unstable_capitalize as capitalize } from '@mui/utils';
+import { fastMemo } from '../../utils/fastMemo';
+import { doesSupportPreventScroll } from '../../utils/doesSupportPreventScroll';
+import { getDataGridUtilityClass, gridClasses } from '../../constants/gridClasses';
+import { GridCellModes } from '../../models';
+import { useGridSelector, objectShallowCompare } from '../../hooks/utils/useGridSelector';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { gridFocusCellSelector } from '../../hooks/features/focus/gridFocusStateSelector';
+import { MissingRowIdError } from '../../hooks/features/rows/useGridParamsApi';
+import { jsx as _jsx } from "react/jsx-runtime";
+const EMPTY_CELL_PARAMS = {
+  id: -1,
+  field: '__unset__',
+  row: {},
+  rowNode: {
+    id: -1,
+    depth: 0,
+    type: 'leaf',
+    parent: -1,
+    groupingKey: null
+  },
+  colDef: {
+    type: 'string',
+    field: '__unset__',
+    computedWidth: 0
+  },
+  cellMode: GridCellModes.View,
+  hasFocus: false,
+  tabIndex: -1,
+  value: null,
+  formattedValue: '__unset__',
+  isEditable: false,
+  api: {}
+};
+const useUtilityClasses = ownerState => {
+  const {
+    align,
+    showRightBorder,
+    isEditable,
+    isSelected,
+    isSelectionMode,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['cell', `cell--text${capitalize(align)}`, isEditable && 'cell--editable', isSelected && 'selected', showRightBorder && 'cell--withRightBorder', isSelectionMode && !isEditable && 'cell--selectionMode', 'withBorderColor'],
+    content: ['cellContent']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+let warnedOnce = false;
+
+// GridCellWrapper is a compatibility layer for the V6 cell slot. If we can use the more efficient
+// `GridCellV7`, we should. That component is a merge of `GridCellWrapper` and `GridCell`.
+// TODO(v7): Remove the wrapper & cellV6 and use the cellV7 exclusively.
+// TODO(v7): Removing the wrapper will break the docs performance visualization demo.
+const GridCellWrapper = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const {
+    column,
+    rowId,
+    editCellState
+  } = props;
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const field = column.field;
+  const cellParamsWithAPI = useGridSelector(apiRef, () => {
+    // This is required because `.getCellParams` tries to get the `state.rows.tree` entry
+    // associated with `rowId`/`fieldId`, but this selector runs after the state has been
+    // updated, while `rowId`/`fieldId` reference an entry in the old state.
+    try {
+      const cellParams = apiRef.current.getCellParams(rowId, field);
+      const result = cellParams;
+      result.api = apiRef.current;
+      return result;
+    } catch (e) {
+      if (e instanceof MissingRowIdError) {
+        return EMPTY_CELL_PARAMS;
+      }
+      throw e;
+    }
+  }, objectShallowCompare);
+  const isSelected = useGridSelector(apiRef, () => apiRef.current.unstable_applyPipeProcessors('isCellSelected', false, {
+    id: rowId,
+    field
+  }));
+  if (cellParamsWithAPI === EMPTY_CELL_PARAMS) {
+    return null;
+  }
+  const {
+    cellMode,
+    hasFocus,
+    isEditable,
+    value,
+    formattedValue
+  } = cellParamsWithAPI;
+  const managesOwnFocus = column.type === 'actions';
+  const tabIndex = (cellMode === 'view' || !isEditable) && !managesOwnFocus ? cellParamsWithAPI.tabIndex : -1;
+  const {
+    classes: rootClasses,
+    getCellClassName
+  } = rootProps;
+  const classNames = apiRef.current.unstable_applyPipeProcessors('cellClassName', [], {
+    id: rowId,
+    field
+  });
+  if (column.cellClassName) {
+    classNames.push(typeof column.cellClassName === 'function' ? column.cellClassName(cellParamsWithAPI) : column.cellClassName);
+  }
+  if (getCellClassName) {
+    classNames.push(getCellClassName(cellParamsWithAPI));
+  }
+  let children;
+  if (editCellState == null && column.renderCell) {
+    children = column.renderCell(cellParamsWithAPI);
+    classNames.push(gridClasses['cell--withRenderer']);
+    classNames.push(rootClasses == null ? void 0 : rootClasses['cell--withRenderer']);
+  }
+  if (editCellState != null && column.renderEditCell) {
+    const updatedRow = apiRef.current.getRowWithUpdatedValues(rowId, column.field);
+
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    const editCellStateRest = _objectWithoutPropertiesLoose(editCellState, _excluded);
+    const params = _extends({}, cellParamsWithAPI, {
+      row: updatedRow
+    }, editCellStateRest);
+    children = column.renderEditCell(params);
+    classNames.push(gridClasses['cell--editing']);
+    classNames.push(rootClasses == null ? void 0 : rootClasses['cell--editing']);
+  }
+  const {
+    slots
+  } = rootProps;
+  const CellComponent = slots.cell;
+  const cellProps = _extends({}, props, {
+    ref,
+    field,
+    formattedValue,
+    hasFocus,
+    isEditable,
+    isSelected,
+    value,
+    cellMode,
+    children,
+    tabIndex,
+    className: clsx(classNames)
+  });
+  return /*#__PURE__*/React.createElement(CellComponent, cellProps);
+});
+const GridCell = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _rootProps$experiment, _rootProps$experiment2;
+  const {
+      align,
+      children: childrenProp,
+      colIndex,
+      column,
+      cellMode,
+      field,
+      formattedValue,
+      hasFocus,
+      height,
+      isEditable,
+      isSelected,
+      rowId,
+      tabIndex,
+      style: styleProp,
+      value,
+      width,
+      className,
+      showRightBorder,
+      colSpan,
+      disableDragEvents,
+      isNotVisible,
+      onClick,
+      onDoubleClick,
+      onMouseDown,
+      onMouseUp,
+      onMouseOver,
+      onKeyDown,
+      onKeyUp,
+      onDragEnter,
+      onDragOver
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const valueToRender = formattedValue == null ? value : formattedValue;
+  const cellRef = React.useRef(null);
+  const handleRef = useForkRef(ref, cellRef);
+  const focusElementRef = React.useRef(null);
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    align,
+    showRightBorder,
+    isEditable,
+    classes: rootProps.classes,
+    isSelected
+  };
+  const classes = useUtilityClasses(ownerState);
+  const publishMouseUp = React.useCallback(eventName => event => {
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (onMouseUp) {
+      onMouseUp(event);
+    }
+  }, [apiRef, field, onMouseUp, rowId]);
+  const publishMouseDown = React.useCallback(eventName => event => {
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (onMouseDown) {
+      onMouseDown(event);
+    }
+  }, [apiRef, field, onMouseDown, rowId]);
+  const publish = React.useCallback((eventName, propHandler) => event => {
+    // The row might have been deleted during the click
+    if (!apiRef.current.getRow(rowId)) {
+      return;
+    }
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (propHandler) {
+      propHandler(event);
+    }
+  }, [apiRef, field, rowId]);
+  const style = React.useMemo(() => {
+    if (isNotVisible) {
+      return {
+        padding: 0,
+        opacity: 0,
+        width: 0,
+        border: 0
+      };
+    }
+    const cellStyle = _extends({
+      minWidth: width,
+      maxWidth: width,
+      minHeight: height,
+      maxHeight: height === 'auto' ? 'none' : height
+    }, styleProp);
+    return cellStyle;
+  }, [width, height, isNotVisible, styleProp]);
+  React.useEffect(() => {
+    if (!hasFocus || cellMode === GridCellModes.Edit) {
+      return;
+    }
+    const doc = ownerDocument(apiRef.current.rootElementRef.current);
+    if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {
+      const focusableElement = cellRef.current.querySelector('[tabindex="0"]');
+      const elementToFocus = focusElementRef.current || focusableElement || cellRef.current;
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
+    }
+  }, [hasFocus, cellMode, apiRef]);
+  let handleFocus = other.onFocus;
+  if (process.env.NODE_ENV === 'test' && (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.warnIfFocusStateIsNotSynced) {
+    handleFocus = event => {
+      const focusedCell = gridFocusCellSelector(apiRef);
+      if ((focusedCell == null ? void 0 : focusedCell.id) === rowId && focusedCell.field === field) {
+        if (typeof other.onFocus === 'function') {
+          other.onFocus(event);
+        }
+        return;
+      }
+      if (!warnedOnce) {
+        console.warn([`MUI: The cell with id=${rowId} and field=${field} received focus.`, `According to the state, the focus should be at id=${focusedCell == null ? void 0 : focusedCell.id}, field=${focusedCell == null ? void 0 : focusedCell.field}.`, "Not syncing the state may cause unwanted behaviors since the `cellFocusIn` event won't be fired.", 'Call `fireEvent.mouseUp` before the `fireEvent.click` to sync the focus with the state.'].join('\n'));
+        warnedOnce = true;
+      }
+    };
+  }
+  const managesOwnFocus = column.type === 'actions';
+  let children = childrenProp;
+  if (children === undefined) {
+    const valueString = valueToRender == null ? void 0 : valueToRender.toString();
+    children = /*#__PURE__*/_jsx("div", {
+      className: classes.content,
+      title: valueString,
+      role: "presentation",
+      children: valueString
+    });
+  }
+  if ( /*#__PURE__*/React.isValidElement(children) && managesOwnFocus) {
+    children = /*#__PURE__*/React.cloneElement(children, {
+      focusElementRef
+    });
+  }
+  const draggableEventHandlers = disableDragEvents ? null : {
+    onDragEnter: publish('cellDragEnter', onDragEnter),
+    onDragOver: publish('cellDragOver', onDragOver)
+  };
+  const ariaV7 = (_rootProps$experiment2 = rootProps.experimentalFeatures) == null ? void 0 : _rootProps$experiment2.ariaV7;
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    _jsx("div", _extends({
+      ref: handleRef,
+      className: clsx(className, classes.root),
+      role: ariaV7 ? 'gridcell' : 'cell',
+      "data-field": field,
+      "data-colindex": colIndex,
+      "aria-colindex": colIndex + 1,
+      "aria-colspan": colSpan,
+      style: style,
+      tabIndex: tabIndex,
+      onClick: publish('cellClick', onClick),
+      onDoubleClick: publish('cellDoubleClick', onDoubleClick),
+      onMouseOver: publish('cellMouseOver', onMouseOver),
+      onMouseDown: publishMouseDown('cellMouseDown'),
+      onMouseUp: publishMouseUp('cellMouseUp'),
+      onKeyDown: publish('cellKeyDown', onKeyDown),
+      onKeyUp: publish('cellKeyUp', onKeyUp)
+    }, draggableEventHandlers, other, {
+      onFocus: handleFocus,
+      children: children
+    }))
+  );
+});
+const MemoizedCellWrapper = fastMemo(GridCellWrapper);
+process.env.NODE_ENV !== "production" ? GridCellWrapper.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  align: PropTypes.oneOf(['center', 'left', 'right']),
+  className: PropTypes.string,
+  colIndex: PropTypes.number,
+  colSpan: PropTypes.number,
+  column: PropTypes.object,
+  disableDragEvents: PropTypes.bool,
+  height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
+  onClick: PropTypes.func,
+  onDoubleClick: PropTypes.func,
+  onDragEnter: PropTypes.func,
+  onDragOver: PropTypes.func,
+  onKeyDown: PropTypes.func,
+  onMouseDown: PropTypes.func,
+  onMouseUp: PropTypes.func,
+  rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  showRightBorder: PropTypes.bool,
+  width: PropTypes.number
+} : void 0;
+process.env.NODE_ENV !== "production" ? GridCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  align: PropTypes.oneOf(['center', 'left', 'right']),
+  cellMode: PropTypes.oneOf(['edit', 'view']),
+  children: PropTypes.node,
+  className: PropTypes.string,
+  colIndex: PropTypes.number,
+  colSpan: PropTypes.number,
+  column: PropTypes.object,
+  disableDragEvents: PropTypes.bool,
+  editCellState: PropTypes.shape({
+    changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+    isProcessingProps: PropTypes.bool,
+    isValidating: PropTypes.bool,
+    value: PropTypes.any
+  }),
+  isNotVisible: PropTypes.bool,
+  height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
+  onClick: PropTypes.func,
+  onDoubleClick: PropTypes.func,
+  onDragEnter: PropTypes.func,
+  onDragOver: PropTypes.func,
+  onKeyDown: PropTypes.func,
+  onMouseDown: PropTypes.func,
+  onMouseUp: PropTypes.func,
+  rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  showRightBorder: PropTypes.bool,
+  width: PropTypes.number
+} : void 0;
+export { MemoizedCellWrapper as GridCellWrapper, GridCell };
+const GridCellV7 = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _getActions, _ref, _rootProps$unstable_c, _rootProps$experiment3, _rootProps$experiment4;
+  const {
+      column,
+      rowId,
+      editCellState,
+      align,
+      colIndex,
+      height,
+      width,
+      className,
+      showRightBorder,
+      colSpan,
+      disableDragEvents,
+      isNotVisible,
+      onClick,
+      onDoubleClick,
+      onMouseDown,
+      onMouseUp,
+      onMouseOver,
+      onKeyDown,
+      onKeyUp,
+      onDragEnter,
+      onDragOver,
+      style: styleProp
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded3);
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const field = column.field;
+  const cellParamsWithAPI = useGridSelector(apiRef, () => {
+    // This is required because `.getCellParams` tries to get the `state.rows.tree` entry
+    // associated with `rowId`/`fieldId`, but this selector runs after the state has been
+    // updated, while `rowId`/`fieldId` reference an entry in the old state.
+    try {
+      const cellParams = apiRef.current.getCellParams(rowId, field);
+      const result = cellParams;
+      result.api = apiRef.current;
+      return result;
+    } catch (e) {
+      if (e instanceof MissingRowIdError) {
+        return EMPTY_CELL_PARAMS;
+      }
+      throw e;
+    }
+  }, objectShallowCompare);
+  const isSelected = useGridSelector(apiRef, () => apiRef.current.unstable_applyPipeProcessors('isCellSelected', false, {
+    id: rowId,
+    field
+  }));
+  const {
+    cellMode,
+    hasFocus,
+    isEditable,
+    value,
+    formattedValue
+  } = cellParamsWithAPI;
+  const canManageOwnFocus = column.type === 'actions' && ((_getActions = (_ref = column).getActions) == null ? void 0 : _getActions.call(_ref, apiRef.current.getRowParams(rowId)).some(action => !action.props.disabled));
+  const tabIndex = (cellMode === 'view' || !isEditable) && !canManageOwnFocus ? cellParamsWithAPI.tabIndex : -1;
+  const {
+    classes: rootClasses,
+    getCellClassName
+  } = rootProps;
+  const classNames = apiRef.current.unstable_applyPipeProcessors('cellClassName', [], {
+    id: rowId,
+    field
+  });
+  if (column.cellClassName) {
+    classNames.push(typeof column.cellClassName === 'function' ? column.cellClassName(cellParamsWithAPI) : column.cellClassName);
+  }
+  if (getCellClassName) {
+    classNames.push(getCellClassName(cellParamsWithAPI));
+  }
+  const valueToRender = formattedValue == null ? value : formattedValue;
+  const cellRef = React.useRef(null);
+  const handleRef = useForkRef(ref, cellRef);
+  const focusElementRef = React.useRef(null);
+  // @ts-expect-error To access `unstable_cellSelection` flag as it's a `premium` feature
+  const isSelectionMode = (_rootProps$unstable_c = rootProps.unstable_cellSelection) != null ? _rootProps$unstable_c : false;
+  const ownerState = {
+    align,
+    showRightBorder,
+    isEditable,
+    classes: rootProps.classes,
+    isSelected,
+    isSelectionMode
+  };
+  const classes = useUtilityClasses(ownerState);
+  const publishMouseUp = React.useCallback(eventName => event => {
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (onMouseUp) {
+      onMouseUp(event);
+    }
+  }, [apiRef, field, onMouseUp, rowId]);
+  const publishMouseDown = React.useCallback(eventName => event => {
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (onMouseDown) {
+      onMouseDown(event);
+    }
+  }, [apiRef, field, onMouseDown, rowId]);
+  const publish = React.useCallback((eventName, propHandler) => event => {
+    // The row might have been deleted during the click
+    if (!apiRef.current.getRow(rowId)) {
+      return;
+    }
+    const params = apiRef.current.getCellParams(rowId, field || '');
+    apiRef.current.publishEvent(eventName, params, event);
+    if (propHandler) {
+      propHandler(event);
+    }
+  }, [apiRef, field, rowId]);
+  const style = React.useMemo(() => {
+    if (isNotVisible) {
+      return _extends({
+        padding: 0,
+        opacity: 0,
+        width: 0,
+        border: 0
+      }, styleProp);
+    }
+    const cellStyle = _extends({
+      minWidth: width,
+      maxWidth: width,
+      minHeight: height,
+      maxHeight: height === 'auto' ? 'none' : height
+    }, styleProp);
+    return cellStyle;
+  }, [width, height, isNotVisible, styleProp]);
+  React.useEffect(() => {
+    if (!hasFocus || cellMode === GridCellModes.Edit) {
+      return;
+    }
+    const doc = ownerDocument(apiRef.current.rootElementRef.current);
+    if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {
+      const focusableElement = cellRef.current.querySelector('[tabindex="0"]');
+      const elementToFocus = focusElementRef.current || focusableElement || cellRef.current;
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
+    }
+  }, [hasFocus, cellMode, apiRef]);
+  if (cellParamsWithAPI === EMPTY_CELL_PARAMS) {
+    return null;
+  }
+  let handleFocus = other.onFocus;
+  if (process.env.NODE_ENV === 'test' && (_rootProps$experiment3 = rootProps.experimentalFeatures) != null && _rootProps$experiment3.warnIfFocusStateIsNotSynced) {
+    handleFocus = event => {
+      const focusedCell = gridFocusCellSelector(apiRef);
+      if ((focusedCell == null ? void 0 : focusedCell.id) === rowId && focusedCell.field === field) {
+        if (typeof other.onFocus === 'function') {
+          other.onFocus(event);
+        }
+        return;
+      }
+      if (!warnedOnce) {
+        console.warn([`MUI: The cell with id=${rowId} and field=${field} received focus.`, `According to the state, the focus should be at id=${focusedCell == null ? void 0 : focusedCell.id}, field=${focusedCell == null ? void 0 : focusedCell.field}.`, "Not syncing the state may cause unwanted behaviors since the `cellFocusIn` event won't be fired.", 'Call `fireEvent.mouseUp` before the `fireEvent.click` to sync the focus with the state.'].join('\n'));
+        warnedOnce = true;
+      }
+    };
+  }
+  let children;
+  if (editCellState == null && column.renderCell) {
+    children = column.renderCell(cellParamsWithAPI);
+    classNames.push(gridClasses['cell--withRenderer']);
+    classNames.push(rootClasses == null ? void 0 : rootClasses['cell--withRenderer']);
+  }
+  if (editCellState != null && column.renderEditCell) {
+    const updatedRow = apiRef.current.getRowWithUpdatedValues(rowId, column.field);
+
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    const editCellStateRest = _objectWithoutPropertiesLoose(editCellState, _excluded4);
+    const params = _extends({}, cellParamsWithAPI, {
+      row: updatedRow
+    }, editCellStateRest);
+    children = column.renderEditCell(params);
+    classNames.push(gridClasses['cell--editing']);
+    classNames.push(rootClasses == null ? void 0 : rootClasses['cell--editing']);
+  }
+  if (children === undefined) {
+    const valueString = valueToRender == null ? void 0 : valueToRender.toString();
+    children = /*#__PURE__*/_jsx("div", {
+      className: classes.content,
+      title: valueString,
+      role: "presentation",
+      children: valueString
+    });
+  }
+  if ( /*#__PURE__*/React.isValidElement(children) && canManageOwnFocus) {
+    children = /*#__PURE__*/React.cloneElement(children, {
+      focusElementRef
+    });
+  }
+  const draggableEventHandlers = disableDragEvents ? null : {
+    onDragEnter: publish('cellDragEnter', onDragEnter),
+    onDragOver: publish('cellDragOver', onDragOver)
+  };
+  const ariaV7 = (_rootProps$experiment4 = rootProps.experimentalFeatures) == null ? void 0 : _rootProps$experiment4.ariaV7;
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    _jsx("div", _extends({
+      ref: handleRef,
+      className: clsx(className, classNames, classes.root),
+      role: ariaV7 ? 'gridcell' : 'cell',
+      "data-field": field,
+      "data-colindex": colIndex,
+      "aria-colindex": colIndex + 1,
+      "aria-colspan": colSpan,
+      style: style,
+      tabIndex: tabIndex,
+      onClick: publish('cellClick', onClick),
+      onDoubleClick: publish('cellDoubleClick', onDoubleClick),
+      onMouseOver: publish('cellMouseOver', onMouseOver),
+      onMouseDown: publishMouseDown('cellMouseDown'),
+      onMouseUp: publishMouseUp('cellMouseUp'),
+      onKeyDown: publish('cellKeyDown', onKeyDown),
+      onKeyUp: publish('cellKeyUp', onKeyUp)
+    }, draggableEventHandlers, other, {
+      onFocus: handleFocus,
+      children: children
+    }))
+  );
+});
+process.env.NODE_ENV !== "production" ? GridCellV7.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  align: PropTypes.oneOf(['center', 'left', 'right']).isRequired,
+  className: PropTypes.string,
+  colIndex: PropTypes.number.isRequired,
+  colSpan: PropTypes.number,
+  column: PropTypes.object.isRequired,
+  disableDragEvents: PropTypes.bool,
+  editCellState: PropTypes.shape({
+    changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+    isProcessingProps: PropTypes.bool,
+    isValidating: PropTypes.bool,
+    value: PropTypes.any
+  }),
+  height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]).isRequired,
+  isNotVisible: PropTypes.bool,
+  onClick: PropTypes.func,
+  onDoubleClick: PropTypes.func,
+  onDragEnter: PropTypes.func,
+  onDragOver: PropTypes.func,
+  onKeyDown: PropTypes.func,
+  onMouseDown: PropTypes.func,
+  onMouseUp: PropTypes.func,
+  rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  showRightBorder: PropTypes.bool,
+  width: PropTypes.number.isRequired
+} : void 0;
+const MemoizedGridCellV7 = fastMemo(GridCellV7);
+export { MemoizedGridCellV7 as GridCellV7 };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditBooleanCell.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '../../models/params/gridCellParams';
+export interface GridEditBooleanCellProps extends GridRenderEditCellParams, Omit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, 'id' | 'tabIndex'> {
+    /**
+     * Callback called when the value is changed by the user.
+     * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+     * @param {boolean} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+     * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+     */
+    onValueChange?: (event: React.ChangeEvent<HTMLInputElement>, newValue: boolean) => Promise<void> | void;
+}
+declare function GridEditBooleanCell(props: GridEditBooleanCellProps): React.JSX.Element;
+declare namespace GridEditBooleanCell {
+    var propTypes: any;
+}
+export { GridEditBooleanCell };
+export declare const renderEditBooleanCell: (params: GridEditBooleanCellProps) => React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditBooleanCell.js

@@ -0,0 +1,140 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses, unstable_useId as useId, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['editBooleanCell']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function GridEditBooleanCell(props) {
+  var _rootProps$slotProps;
+  const {
+      id: idProp,
+      value,
+      field,
+      className,
+      hasFocus,
+      onValueChange
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const inputRef = React.useRef(null);
+  const id = useId();
+  const [valueState, setValueState] = React.useState(value);
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    classes: rootProps.classes
+  };
+  const classes = useUtilityClasses(ownerState);
+  const handleChange = React.useCallback(async event => {
+    const newValue = event.target.checked;
+    if (onValueChange) {
+      await onValueChange(event, newValue);
+    }
+    setValueState(newValue);
+    await apiRef.current.setEditCellValue({
+      id: idProp,
+      field,
+      value: newValue
+    }, event);
+  }, [apiRef, field, idProp, onValueChange]);
+  React.useEffect(() => {
+    setValueState(value);
+  }, [value]);
+  useEnhancedEffect(() => {
+    if (hasFocus) {
+      inputRef.current.focus();
+    }
+  }, [hasFocus]);
+  return /*#__PURE__*/_jsx("label", _extends({
+    htmlFor: id,
+    className: clsx(classes.root, className)
+  }, other, {
+    children: /*#__PURE__*/_jsx(rootProps.slots.baseCheckbox, _extends({
+      id: id,
+      inputRef: inputRef,
+      checked: Boolean(valueState),
+      onChange: handleChange,
+      size: "small"
+    }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseCheckbox))
+  }));
+}
+process.env.NODE_ENV !== "production" ? GridEditBooleanCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * GridApi that let you manipulate the grid.
+   */
+  api: PropTypes.object.isRequired,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  isProcessingProps: PropTypes.bool,
+  isValidating: PropTypes.bool,
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {boolean} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: PropTypes.func,
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+export { GridEditBooleanCell };
+export const renderEditBooleanCell = params => /*#__PURE__*/_jsx(GridEditBooleanCell, _extends({}, params));

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditDateCell.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { InputBaseProps } from '@mui/material/InputBase';
+import { GridRenderEditCellParams } from '../../models/params/gridCellParams';
+export interface GridEditDateCellProps extends GridRenderEditCellParams, Omit<InputBaseProps, 'id' | 'value' | 'tabIndex'> {
+    /**
+     * Callback called when the value is changed by the user.
+     * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+     * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+     * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+     */
+    onValueChange?: (event: React.ChangeEvent<HTMLInputElement>, newValue: Date | null) => Promise<void> | void;
+}
+declare function GridEditDateCell(props: GridEditDateCellProps): React.JSX.Element;
+declare namespace GridEditDateCell {
+    var propTypes: any;
+}
+export { GridEditDateCell };
+export declare const renderEditDateCell: (params: GridRenderEditCellParams) => React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditDateCell.js

@@ -0,0 +1,189 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "inputProps", "isValidating", "isProcessingProps", "onValueChange"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import InputBase from '@mui/material/InputBase';
+import { styled } from '@mui/material/styles';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+const StyledInputBase = styled(InputBase)({
+  fontSize: 'inherit'
+});
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['editInputCell']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function GridEditDateCell(props) {
+  const {
+      id,
+      value: valueProp,
+      field,
+      colDef,
+      hasFocus,
+      inputProps,
+      onValueChange
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const isDateTime = colDef.type === 'dateTime';
+  const apiRef = useGridApiContext();
+  const inputRef = React.useRef();
+  const valueTransformed = React.useMemo(() => {
+    let parsedDate;
+    if (valueProp == null) {
+      parsedDate = null;
+    } else if (valueProp instanceof Date) {
+      parsedDate = valueProp;
+    } else {
+      parsedDate = new Date((valueProp != null ? valueProp : '').toString());
+    }
+    let formattedDate;
+    if (parsedDate == null || Number.isNaN(parsedDate.getTime())) {
+      formattedDate = '';
+    } else {
+      const localDate = new Date(parsedDate.getTime() - parsedDate.getTimezoneOffset() * 60 * 1000);
+      formattedDate = localDate.toISOString().substr(0, isDateTime ? 16 : 10);
+    }
+    return {
+      parsed: parsedDate,
+      formatted: formattedDate
+    };
+  }, [valueProp, isDateTime]);
+  const [valueState, setValueState] = React.useState(valueTransformed);
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    classes: rootProps.classes
+  };
+  const classes = useUtilityClasses(ownerState);
+  const parseValueToDate = React.useCallback(value => {
+    if (value === '') {
+      return null;
+    }
+    const [date, time] = value.split('T');
+    const [year, month, day] = date.split('-');
+    const parsedDate = new Date();
+    parsedDate.setFullYear(Number(year), Number(month) - 1, Number(day));
+    parsedDate.setHours(0, 0, 0, 0);
+    if (time) {
+      const [hours, minutes] = time.split(':');
+      parsedDate.setHours(Number(hours), Number(minutes), 0, 0);
+    }
+    return parsedDate;
+  }, []);
+  const handleChange = React.useCallback(async event => {
+    const newFormattedDate = event.target.value;
+    const newParsedDate = parseValueToDate(newFormattedDate);
+    if (onValueChange) {
+      await onValueChange(event, newParsedDate);
+    }
+    setValueState({
+      parsed: newParsedDate,
+      formatted: newFormattedDate
+    });
+    apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: newParsedDate
+    }, event);
+  }, [apiRef, field, id, onValueChange, parseValueToDate]);
+  React.useEffect(() => {
+    setValueState(state => {
+      var _valueTransformed$par, _state$parsed;
+      if (valueTransformed.parsed !== state.parsed && ((_valueTransformed$par = valueTransformed.parsed) == null ? void 0 : _valueTransformed$par.getTime()) !== ((_state$parsed = state.parsed) == null ? void 0 : _state$parsed.getTime())) {
+        return valueTransformed;
+      }
+      return state;
+    });
+  }, [valueTransformed]);
+  useEnhancedEffect(() => {
+    if (hasFocus) {
+      inputRef.current.focus();
+    }
+  }, [hasFocus]);
+  return /*#__PURE__*/_jsx(StyledInputBase, _extends({
+    inputRef: inputRef,
+    fullWidth: true,
+    className: classes.root,
+    type: isDateTime ? 'datetime-local' : 'date',
+    inputProps: _extends({
+      max: isDateTime ? '9999-12-31T23:59' : '9999-12-31'
+    }, inputProps),
+    value: valueState.formatted,
+    onChange: handleChange
+  }, other));
+}
+process.env.NODE_ENV !== "production" ? GridEditDateCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * GridApi that let you manipulate the grid.
+   */
+  api: PropTypes.object.isRequired,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  isProcessingProps: PropTypes.bool,
+  isValidating: PropTypes.bool,
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: PropTypes.func,
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+export { GridEditDateCell };
+export const renderEditDateCell = params => /*#__PURE__*/_jsx(GridEditDateCell, _extends({}, params));

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditInputCell.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { InputBaseProps } from '@mui/material/InputBase';
+import { GridRenderEditCellParams } from '../../models/params/gridCellParams';
+export interface GridEditInputCellProps extends GridRenderEditCellParams, Omit<InputBaseProps, 'id' | 'value' | 'tabIndex' | 'ref'> {
+    debounceMs?: number;
+    /**
+     * Callback called when the value is changed by the user.
+     * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+     * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+     * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+     */
+    onValueChange?: (event: React.ChangeEvent<HTMLInputElement>, newValue: string) => Promise<void> | void;
+}
+declare const GridEditInputCell: React.ForwardRefExoticComponent<Omit<GridEditInputCellProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export { GridEditInputCell };
+export declare const renderEditInputCell: (params: GridEditInputCellProps) => React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditInputCell.js

@@ -0,0 +1,164 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "isValidating", "debounceMs", "isProcessingProps", "onValueChange"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { styled } from '@mui/material/styles';
+import InputBase from '@mui/material/InputBase';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['editInputCell']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const GridEditInputCellRoot = styled(InputBase, {
+  name: 'MuiDataGrid',
+  slot: 'EditInputCell',
+  overridesResolver: (props, styles) => styles.editInputCell
+})(({
+  theme
+}) => _extends({}, theme.typography.body2, {
+  padding: '1px 0',
+  '& input': {
+    padding: '0 16px',
+    height: '100%'
+  }
+}));
+const GridEditInputCell = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const rootProps = useGridRootProps();
+  const {
+      id,
+      value,
+      field,
+      colDef,
+      hasFocus,
+      debounceMs = 200,
+      isProcessingProps,
+      onValueChange
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const inputRef = React.useRef();
+  const [valueState, setValueState] = React.useState(value);
+  const classes = useUtilityClasses(rootProps);
+  const handleChange = React.useCallback(async event => {
+    const newValue = event.target.value;
+    if (onValueChange) {
+      await onValueChange(event, newValue);
+    }
+    const column = apiRef.current.getColumn(field);
+    let parsedValue = newValue;
+    if (column.valueParser) {
+      parsedValue = column.valueParser(newValue, apiRef.current.getCellParams(id, field));
+    }
+    setValueState(parsedValue);
+    apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: parsedValue,
+      debounceMs,
+      unstable_skipValueParser: true
+    }, event);
+  }, [apiRef, debounceMs, field, id, onValueChange]);
+  const meta = apiRef.current.unstable_getEditCellMeta(id, field);
+  React.useEffect(() => {
+    if ((meta == null ? void 0 : meta.changeReason) !== 'debouncedSetEditCellValue') {
+      setValueState(value);
+    }
+  }, [meta, value]);
+  useEnhancedEffect(() => {
+    if (hasFocus) {
+      inputRef.current.focus();
+    }
+  }, [hasFocus]);
+  return /*#__PURE__*/_jsx(GridEditInputCellRoot, _extends({
+    ref: ref,
+    inputRef: inputRef,
+    className: classes.root,
+    ownerState: rootProps,
+    fullWidth: true,
+    type: colDef.type === 'number' ? colDef.type : 'text',
+    value: valueState != null ? valueState : '',
+    onChange: handleChange,
+    endAdornment: isProcessingProps ? /*#__PURE__*/_jsx(rootProps.slots.loadIcon, {
+      fontSize: "small",
+      color: "action"
+    }) : undefined
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? GridEditInputCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * GridApi that let you manipulate the grid.
+   */
+  api: PropTypes.object.isRequired,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  debounceMs: PropTypes.number,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  isProcessingProps: PropTypes.bool,
+  isValidating: PropTypes.bool,
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: PropTypes.func,
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+export { GridEditInputCell };
+export const renderEditInputCell = params => /*#__PURE__*/_jsx(GridEditInputCell, _extends({}, params));

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditSingleSelectCell.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { SelectProps, SelectChangeEvent } from '@mui/material/Select';
+import { GridRenderEditCellParams } from '../../models/params/gridCellParams';
+import { GridSingleSelectColDef } from '../../models/colDef/gridColDef';
+export interface GridEditSingleSelectCellProps extends GridRenderEditCellParams, Omit<SelectProps, 'id' | 'tabIndex' | 'value'>, Pick<GridSingleSelectColDef, 'getOptionLabel' | 'getOptionValue'> {
+    /**
+     * Callback called when the value is changed by the user.
+     * @param {SelectChangeEvent<any>} event The event source of the callback.
+     * @param {any} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+     * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+     */
+    onValueChange?: (event: SelectChangeEvent<any>, newValue: any) => Promise<void> | void;
+    /**
+     * If true, the select opens by default.
+     */
+    initialOpen?: boolean;
+}
+declare function GridEditSingleSelectCell(props: GridEditSingleSelectCellProps): React.JSX.Element | null;
+declare namespace GridEditSingleSelectCell {
+    var propTypes: any;
+}
+export { GridEditSingleSelectCell };
+export declare const renderEditSingleSelectCell: (params: GridEditSingleSelectCellProps) => React.JSX.Element;

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridEditSingleSelectCell.js

@@ -0,0 +1,216 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange", "initialOpen", "getOptionLabel", "getOptionValue"],
+  _excluded2 = ["MenuProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { GridCellEditStopReasons } from '../../models/params/gridEditCellParams';
+import { isEscapeKey } from '../../utils/keyboardUtils';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { GridEditModes } from '../../models/gridEditRowModel';
+import { getValueFromValueOptions, isSingleSelectColDef } from '../panel/filterPanel/filterPanelUtils';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { createElement as _createElement } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+function isKeyboardEvent(event) {
+  return !!event.key;
+}
+function GridEditSingleSelectCell(props) {
+  var _rootProps$slotProps, _baseSelectProps$nati, _rootProps$slotProps2;
+  const rootProps = useGridRootProps();
+  const {
+      id,
+      value: valueProp,
+      field,
+      row,
+      colDef,
+      hasFocus,
+      error,
+      onValueChange,
+      initialOpen = rootProps.editMode === GridEditModes.Cell,
+      getOptionLabel: getOptionLabelProp,
+      getOptionValue: getOptionValueProp
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const apiRef = useGridApiContext();
+  const ref = React.useRef();
+  const inputRef = React.useRef();
+  const [open, setOpen] = React.useState(initialOpen);
+  const baseSelectProps = ((_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseSelect) || {};
+  const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : false;
+  const _ref = ((_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseSelect) || {},
+    {
+      MenuProps
+    } = _ref,
+    otherBaseSelectProps = _objectWithoutPropertiesLoose(_ref, _excluded2);
+  useEnhancedEffect(() => {
+    if (hasFocus) {
+      var _inputRef$current;
+      (_inputRef$current = inputRef.current) == null || _inputRef$current.focus();
+    }
+  }, [hasFocus]);
+  if (!isSingleSelectColDef(colDef)) {
+    return null;
+  }
+  let valueOptions;
+  if (typeof (colDef == null ? void 0 : colDef.valueOptions) === 'function') {
+    valueOptions = colDef == null ? void 0 : colDef.valueOptions({
+      id,
+      row,
+      field
+    });
+  } else {
+    valueOptions = colDef == null ? void 0 : colDef.valueOptions;
+  }
+  if (!valueOptions) {
+    return null;
+  }
+  const getOptionValue = getOptionValueProp || colDef.getOptionValue;
+  const getOptionLabel = getOptionLabelProp || colDef.getOptionLabel;
+  const handleChange = async event => {
+    if (!isSingleSelectColDef(colDef) || !valueOptions) {
+      return;
+    }
+    setOpen(false);
+    const target = event.target;
+    // NativeSelect casts the value to a string.
+    const formattedTargetValue = getValueFromValueOptions(target.value, valueOptions, getOptionValue);
+    if (onValueChange) {
+      await onValueChange(event, formattedTargetValue);
+    }
+    await apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: formattedTargetValue
+    }, event);
+  };
+  const handleClose = (event, reason) => {
+    if (rootProps.editMode === GridEditModes.Row) {
+      setOpen(false);
+      return;
+    }
+    if (reason === 'backdropClick' || isEscapeKey(event.key)) {
+      const params = apiRef.current.getCellParams(id, field);
+      apiRef.current.publishEvent('cellEditStop', _extends({}, params, {
+        reason: isEscapeKey(event.key) ? GridCellEditStopReasons.escapeKeyDown : GridCellEditStopReasons.cellFocusOut
+      }));
+    }
+  };
+  const handleOpen = event => {
+    if (isKeyboardEvent(event) && event.key === 'Enter') {
+      return;
+    }
+    setOpen(true);
+  };
+  if (!valueOptions || !colDef) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(rootProps.slots.baseSelect, _extends({
+    ref: ref,
+    inputRef: inputRef,
+    value: valueProp,
+    onChange: handleChange,
+    open: open,
+    onOpen: handleOpen,
+    MenuProps: _extends({
+      onClose: handleClose
+    }, MenuProps),
+    error: error,
+    native: isSelectNative,
+    fullWidth: true
+  }, other, otherBaseSelectProps, {
+    children: valueOptions.map(valueOption => {
+      var _rootProps$slotProps3;
+      const value = getOptionValue(valueOption);
+      return /*#__PURE__*/_createElement(rootProps.slots.baseSelectOption, _extends({}, ((_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.baseSelectOption) || {}, {
+        native: isSelectNative,
+        key: value,
+        value: value
+      }), getOptionLabel(valueOption));
+    })
+  }));
+}
+process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * GridApi that let you manipulate the grid.
+   */
+  api: PropTypes.object.isRequired,
+  /**
+   * The mode of the cell.
+   */
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
+  changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: PropTypes.string.isRequired,
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: PropTypes.any,
+  /**
+   * Used to determine the label displayed for a given value option.
+   * @param {ValueOptions} value The current value option.
+   * @returns {string} The text to be displayed.
+   */
+  getOptionLabel: PropTypes.func,
+  /**
+   * Used to determine the value used for a value option.
+   * @param {ValueOptions} value The current value option.
+   * @returns {string} The value to be used.
+   */
+  getOptionValue: PropTypes.func,
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  /**
+   * If true, the select opens by default.
+   */
+  initialOpen: PropTypes.bool,
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: PropTypes.bool,
+  isProcessingProps: PropTypes.bool,
+  isValidating: PropTypes.bool,
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {SelectChangeEvent<any>} event The event source of the callback.
+   * @param {any} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: PropTypes.func,
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: PropTypes.any.isRequired,
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: PropTypes.object.isRequired,
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  /**
+   * The cell value.
+   * If the column has `valueGetter`, use `params.row` to directly access the fields.
+   */
+  value: PropTypes.any
+} : void 0;
+export { GridEditSingleSelectCell };
+export const renderEditSingleSelectCell = params => /*#__PURE__*/_jsx(GridEditSingleSelectCell, _extends({}, params));

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridSkeletonCell.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+export interface GridSkeletonCellProps {
+    width: number;
+    contentWidth: number;
+    field: string;
+    align: string;
+}
+declare function GridSkeletonCell(props: React.HTMLAttributes<HTMLDivElement> & GridSkeletonCellProps): React.JSX.Element;
+declare namespace GridSkeletonCell {
+    var propTypes: any;
+}
+export { GridSkeletonCell };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/GridSkeletonCell.js

@@ -0,0 +1,55 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["field", "align", "width", "contentWidth"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import Skeleton from '@mui/material/Skeleton';
+import { unstable_composeClasses as composeClasses, unstable_capitalize as capitalize } from '@mui/utils';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    align,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['cell', 'cellSkeleton', `cell--text${capitalize(align)}`, 'withBorderColor']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+function GridSkeletonCell(props) {
+  const {
+      align,
+      width,
+      contentWidth
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    classes: rootProps.classes,
+    align
+  };
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx("div", _extends({
+    className: classes.root,
+    style: {
+      width
+    }
+  }, other, {
+    children: /*#__PURE__*/_jsx(Skeleton, {
+      width: `${contentWidth}%`
+    })
+  }));
+}
+process.env.NODE_ENV !== "production" ? GridSkeletonCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  align: PropTypes.string.isRequired,
+  contentWidth: PropTypes.number.isRequired,
+  field: PropTypes.string.isRequired,
+  width: PropTypes.number.isRequired
+} : void 0;
+export { GridSkeletonCell };

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/index.d.ts

@@ -0,0 +1,10 @@
+export { GridCell } from './GridCell';
+export type { GridCellProps } from './GridCell';
+export * from './GridBooleanCell';
+export * from './GridEditBooleanCell';
+export * from './GridEditDateCell';
+export * from './GridEditInputCell';
+export * from './GridEditSingleSelectCell';
+export * from './GridActionsCell';
+export * from './GridActionsCellItem';
+export * from './GridSkeletonCell';

control-plane-ui/node_modules/@mui/x-data-grid/components/cell/index.js

@@ -0,0 +1,9 @@
+export { GridCell } from './GridCell';
+export * from './GridBooleanCell';
+export * from './GridEditBooleanCell';
+export * from './GridEditDateCell';
+export * from './GridEditInputCell';
+export * from './GridEditSingleSelectCell';
+export * from './GridActionsCell';
+export * from './GridActionsCellItem';
+export * from './GridSkeletonCell';

control-plane-ui/node_modules/@mui/x-data-grid/components/columnHeaders/ColumnHeaderMenuIcon.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { GridStateColDef } from '../../models/colDef/gridColDef';
+export interface ColumnHeaderMenuIconProps {
+    colDef: GridStateColDef;
+    columnMenuId: string;
+    columnMenuButtonId: string;
+    open: boolean;
+    iconButtonRef: React.RefObject<HTMLButtonElement>;
+}
+export declare const ColumnHeaderMenuIcon: React.MemoExoticComponent<(props: ColumnHeaderMenuIconProps) => React.JSX.Element>;

control-plane-ui/node_modules/@mui/x-data-grid/components/columnHeaders/ColumnHeaderMenuIcon.js

@@ -0,0 +1,63 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    open
+  } = ownerState;
+  const slots = {
+    root: ['menuIcon', open && 'menuOpen'],
+    button: ['menuIconButton']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+export const ColumnHeaderMenuIcon = /*#__PURE__*/React.memo(props => {
+  var _rootProps$slotProps, _rootProps$slotProps2;
+  const {
+    colDef,
+    open,
+    columnMenuId,
+    columnMenuButtonId,
+    iconButtonRef
+  } = props;
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const ownerState = _extends({}, props, {
+    classes: rootProps.classes
+  });
+  const classes = useUtilityClasses(ownerState);
+  const handleMenuIconClick = React.useCallback(event => {
+    event.preventDefault();
+    event.stopPropagation();
+    apiRef.current.toggleColumnMenu(colDef.field);
+  }, [apiRef, colDef.field]);
+  return /*#__PURE__*/_jsx("div", {
+    className: classes.root,
+    children: /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, _extends({
+      title: apiRef.current.getLocaleText('columnMenuLabel'),
+      enterDelay: 1000
+    }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseTooltip, {
+      children: /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
+        ref: iconButtonRef,
+        tabIndex: -1,
+        className: classes.button,
+        "aria-label": apiRef.current.getLocaleText('columnMenuLabel'),
+        size: "small",
+        onClick: handleMenuIconClick,
+        "aria-haspopup": "menu",
+        "aria-expanded": open,
+        "aria-controls": open ? columnMenuId : undefined,
+        id: columnMenuButtonId
+      }, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseIconButton, {
+        children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuIcon, {
+          fontSize: "small"
+        })
+      }))
+    }))
+  });
+});

control-plane-ui/node_modules/@mui/x-data-grid/components/columnHeaders/GridBaseColumnHeaders.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { SxProps, Theme } from '@mui/system';
+interface GridBaseColumnHeadersProps extends React.HTMLAttributes<HTMLDivElement> {
+    sx?: SxProps<Theme>;
+}
+export declare const GridBaseColumnHeaders: React.ForwardRefExoticComponent<GridBaseColumnHeadersProps & React.RefAttributes<HTMLDivElement>>;
+export {};

control-plane-ui/node_modules/@mui/x-data-grid/components/columnHeaders/GridBaseColumnHeaders.js

@@ -0,0 +1,48 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className"];
+import * as React from 'react';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { styled } from '@mui/system';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['columnHeaders', 'withBorderColor']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const GridColumnHeadersRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'ColumnHeaders',
+  overridesResolver: (props, styles) => styles.columnHeaders
+})({
+  position: 'relative',
+  overflow: 'hidden',
+  display: 'flex',
+  alignItems: 'center',
+  boxSizing: 'border-box',
+  borderBottom: '1px solid',
+  borderTopLeftRadius: 'var(--unstable_DataGrid-radius)',
+  borderTopRightRadius: 'var(--unstable_DataGrid-radius)'
+});
+export const GridBaseColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnHeaders(props, ref) {
+  const {
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rootProps = useGridRootProps();
+  const classes = useUtilityClasses(rootProps);
+  return /*#__PURE__*/_jsx(GridColumnHeadersRoot, _extends({
+    ref: ref,
+    className: clsx(className, classes.root),
+    ownerState: rootProps
+  }, other, {
+    role: "presentation"
+  }));
+});

control-plane-ui/node_modules/@mui/x-data-grid/components/columnHeaders/GridColumnGroupHeader.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+interface GridColumnGroupHeaderProps {
+    groupId: string | null;
+    width: number;
+    fields: string[];
+    colIndex: number;
+    isLastColumn: boolean;
+    depth: number;
+    maxDepth: number;
+    height: number;
+    hasFocus?: boolean;
+    tabIndex: 0 | -1;
+}
+declare function GridColumnGroupHeader(props: GridColumnGroupHeaderProps): React.JSX.Element;
+export { GridColumnGroupHeader };