@mui/x-data-grid 5.4.0 → 5.6.0

package/legacy/components/base/GridFooterPlaceholder.js

@@ -0,0 +1,22 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function GridFooterPlaceholder() {
+  var _rootProps$components;
+
+  var apiRef = useGridApiContext();
+  var rootProps = useGridRootProps();
+  var footerRef = React.useRef(null);
+  apiRef.current.footerRef = footerRef;
+
+  if (rootProps.hideFooter) {
+    return null;
+  }
+
+  return /*#__PURE__*/_jsx("div", {
+    ref: footerRef,
+    children: /*#__PURE__*/_jsx(rootProps.components.Footer, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.footer))
+  });
+}

package/legacy/components/base/GridHeaderPlaceholder.js

@@ -0,0 +1,17 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function GridHeaderPlaceholder() {
+  var _rootProps$components;
+
+  var apiRef = useGridApiContext();
+  var rootProps = useGridRootProps();
+  var headerRef = React.useRef(null);
+  apiRef.current.headerRef = headerRef;
+  return /*#__PURE__*/_jsx("div", {
+    ref: headerRef,
+    children: /*#__PURE__*/_jsx(rootProps.components.Header, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.header))
+  });
+}

package/legacy/components/base/GridOverlays.js

@@ -0,0 +1,93 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';
+import { useGridSelector } from '../../hooks/utils/useGridSelector';
+import { gridVisibleRowCountSelector } from '../../hooks/features/filter/gridFilterSelector';
+import { gridRowCountSelector } from '../../hooks/features/rows/gridRowsSelector';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { gridDensityHeaderHeightSelector } from '../../hooks/features/density/densitySelector';
+import { GridEvents } from '../../models/events';
+import { jsx as _jsx } from "react/jsx-runtime";
+
+function GridOverlayWrapper(props) {
+  var _viewportInnerSize$he, _viewportInnerSize$wi;
+
+  var apiRef = useGridApiContext();
+  var rootProps = useGridRootProps();
+  var headerHeight = useGridSelector(apiRef, gridDensityHeaderHeightSelector);
+
+  var _React$useState = React.useState(function () {
+    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;
+  }),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      viewportInnerSize = _React$useState2[0],
+      setViewportInnerSize = _React$useState2[1];
+
+  var handleViewportSizeChange = React.useCallback(function () {
+    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(function () {
+    return apiRef.current.subscribeEvent(GridEvents.viewportInnerSizeChange, handleViewportSizeChange);
+  }, [apiRef, handleViewportSizeChange]);
+  var height = (_viewportInnerSize$he = viewportInnerSize == null ? void 0 : viewportInnerSize.height) != null ? _viewportInnerSize$he : 0;
+
+  if (rootProps.autoHeight && height === 0) {
+    height = 'auto';
+  }
+
+  if (!viewportInnerSize) {
+    return null;
+  }
+
+  return /*#__PURE__*/_jsx("div", _extends({
+    style: {
+      height: height,
+      width: (_viewportInnerSize$wi = viewportInnerSize == null ? void 0 : viewportInnerSize.width) != null ? _viewportInnerSize$wi : 0,
+      position: 'absolute',
+      top: headerHeight,
+      bottom: height === 'auto' ? 0 : undefined
+    }
+  }, props));
+}
+
+export function GridOverlays() {
+  var apiRef = useGridApiContext();
+  var rootProps = useGridRootProps();
+  var totalRowCount = useGridSelector(apiRef, gridRowCountSelector);
+  var visibleRowCount = useGridSelector(apiRef, gridVisibleRowCountSelector);
+  var showNoRowsOverlay = !rootProps.loading && totalRowCount === 0;
+  var showNoResultsOverlay = !rootProps.loading && totalRowCount > 0 && visibleRowCount === 0;
+  var overlay = null;
+
+  if (showNoRowsOverlay) {
+    var _rootProps$components;
+
+    overlay = /*#__PURE__*/_jsx(rootProps.components.NoRowsOverlay, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.noRowsOverlay));
+  }
+
+  if (showNoResultsOverlay) {
+    var _rootProps$components2;
+
+    overlay = /*#__PURE__*/_jsx(rootProps.components.NoResultsOverlay, _extends({}, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.noResultsOverlay));
+  }
+
+  if (rootProps.loading) {
+    var _rootProps$components3;
+
+    overlay = /*#__PURE__*/_jsx(rootProps.components.LoadingOverlay, _extends({}, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.loadingOverlay));
+  }
+
+  if (overlay === null) {
+    return null;
+  }
+
+  return /*#__PURE__*/_jsx(GridOverlayWrapper, {
+    children: overlay
+  });
+}

package/legacy/components/base/index.js

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

package/legacy/components/cell/GridActionsCell.js

@@ -0,0 +1,146 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import IconButton from '@mui/material/IconButton';
+import MenuList from '@mui/material/MenuList';
+import { unstable_useId as useId } from '@mui/material/utils';
+import { gridClasses } from '../../constants/gridClasses';
+import { GridMenu } from '../menu/GridMenu';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+var hasActions = function hasActions(colDef) {
+  return typeof colDef.getActions === 'function';
+};
+
+var GridActionsCell = function GridActionsCell(props) {
+  var _React$useState = React.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      open = _React$useState2[0],
+      setOpen = _React$useState2[1];
+
+  var buttonRef = React.useRef(null);
+  var touchRippleRefs = React.useRef({});
+  var menuId = useId();
+  var buttonId = useId();
+  var rootProps = useGridRootProps();
+  var colDef = props.colDef,
+      id = props.id,
+      api = props.api,
+      hasFocus = props.hasFocus,
+      _props$position = props.position,
+      position = _props$position === void 0 ? 'bottom-end' : _props$position; // TODO apply the rest to the root element
+
+  React.useLayoutEffect(function () {
+    if (!hasFocus) {
+      Object.entries(touchRippleRefs.current).forEach(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+            index = _ref2[0],
+            ref = _ref2[1];
+
+        ref == null ? void 0 : ref.stop({}, function () {
+          delete touchRippleRefs.current[index];
+        });
+      });
+    }
+  }, [hasFocus]);
+
+  if (!hasActions(colDef)) {
+    throw new Error('MUI: Missing the `getActions` property in the `GridColDef`.');
+  }
+
+  var showMenu = function showMenu() {
+    return setOpen(true);
+  };
+
+  var hideMenu = function hideMenu() {
+    return setOpen(false);
+  };
+
+  var options = colDef.getActions(api.getRowParams(id));
+  var iconButtons = options.filter(function (option) {
+    return !option.props.showInMenu;
+  });
+  var menuButtons = options.filter(function (option) {
+    return option.props.showInMenu;
+  });
+
+  var handleTouchRippleRef = function handleTouchRippleRef(index) {
+    return function (instance) {
+      touchRippleRefs.current[index] = instance;
+    };
+  };
+
+  return /*#__PURE__*/_jsxs("div", {
+    className: gridClasses.actionsCell,
+    children: [iconButtons.map(function (button, index) {
+      return /*#__PURE__*/React.cloneElement(button, {
+        key: index,
+        touchRippleRef: handleTouchRippleRef(index)
+      });
+    }), menuButtons.length > 0 && /*#__PURE__*/_jsx(IconButton, {
+      ref: buttonRef,
+      id: buttonId,
+      "aria-label": api.getLocaleText('actionsCellMore'),
+      "aria-controls": menuId,
+      "aria-expanded": open ? 'true' : undefined,
+      "aria-haspopup": "true",
+      size: "small",
+      onClick: showMenu,
+      children: /*#__PURE__*/_jsx(rootProps.components.MoreActionsIcon, {
+        fontSize: "small"
+      })
+    }), menuButtons.length > 0 && /*#__PURE__*/_jsx(GridMenu, {
+      id: menuId,
+      onClickAway: hideMenu,
+      onClick: hideMenu,
+      open: open,
+      target: buttonRef.current,
+      position: position,
+      "aria-labelledby": buttonId,
+      children: /*#__PURE__*/_jsx(MenuList, {
+        className: gridClasses.menuList,
+        children: menuButtons.map(function (button, index) {
+          return /*#__PURE__*/React.cloneElement(button, {
+            key: index
+          });
+        })
+      })
+    })]
+  });
+};
+
+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"  |
+  // ----------------------------------------------------------------------
+
+  /**
+   * GridApi that let you manipulate the grid.
+   * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)
+   */
+  api: PropTypes.any.isRequired,
+
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: PropTypes.object.isRequired,
+
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: PropTypes.bool.isRequired,
+
+  /**
+   * The grid row id.
+   */
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  position: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top'])
+} : void 0;
+export { GridActionsCell };
+export var renderActionsCell = function renderActionsCell(params) {
+  return /*#__PURE__*/_jsx(GridActionsCell, _extends({}, params));
+};

package/legacy/components/cell/GridActionsCellItem.js

@@ -0,0 +1,54 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["label", "icon", "showInMenu", "onClick"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import IconButton from '@mui/material/IconButton';
+import MenuItem from '@mui/material/MenuItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+var GridActionsCellItem = function GridActionsCellItem(props) {
+  var label = props.label,
+      icon = props.icon,
+      showInMenu = props.showInMenu,
+      onClick = props.onClick,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var handleClick = function handleClick(event) {
+    if (onClick) {
+      onClick(event);
+    }
+  };
+
+  if (!showInMenu) {
+    return /*#__PURE__*/_jsx(IconButton, _extends({
+      size: "small",
+      "aria-label": label
+    }, other, {
+      onClick: handleClick,
+      children: /*#__PURE__*/React.cloneElement(icon, {
+        fontSize: 'small'
+      })
+    }));
+  }
+
+  return /*#__PURE__*/_jsxs(MenuItem, _extends({}, other, {
+    onClick: onClick,
+    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"  |
+  // ----------------------------------------------------------------------
+  icon: PropTypes.element,
+  label: PropTypes.string.isRequired,
+  showInMenu: PropTypes.bool
+} : void 0;
+export { GridActionsCellItem };

package/legacy/components/cell/GridBooleanCell.js

@@ -0,0 +1,55 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "hasFocus", "tabIndex", "getValue"];
+import * as React from 'react';
+import { unstable_composeClasses as composeClasses } from '@mui/material';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { jsx as _jsx } from "react/jsx-runtime";
+
+var useUtilityClasses = function useUtilityClasses(ownerState) {
+  var classes = ownerState.classes;
+  var slots = {
+    root: ['booleanCell']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+
+export var GridBooleanCell = /*#__PURE__*/React.memo(function (props) {
+  var id = props.id,
+      value = props.value,
+      formattedValue = props.formattedValue,
+      api = props.api,
+      field = props.field,
+      row = props.row,
+      rowNode = props.rowNode,
+      colDef = props.colDef,
+      cellMode = props.cellMode,
+      isEditable = props.isEditable,
+      hasFocus = props.hasFocus,
+      tabIndex = props.tabIndex,
+      getValue = props.getValue,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var rootProps = useGridRootProps();
+  var ownerState = {
+    classes: rootProps.classes
+  };
+  var classes = useUtilityClasses(ownerState);
+  var Icon = React.useMemo(function () {
+    return value ? rootProps.components.BooleanCellTrueIcon : rootProps.components.BooleanCellFalseIcon;
+  }, [rootProps.components.BooleanCellFalseIcon, rootProps.components.BooleanCellTrueIcon, value]);
+  return /*#__PURE__*/_jsx(Icon, _extends({
+    fontSize: "small",
+    className: classes.root,
+    titleAccess: api.getLocaleText(value ? 'booleanCellTrueLabel' : 'booleanCellFalseLabel'),
+    "data-value": Boolean(value)
+  }, other));
+});
+export var renderBooleanCell = function renderBooleanCell(params) {
+  if (params.rowNode.isAutoGenerated) {
+    return '';
+  }
+
+  return /*#__PURE__*/_jsx(GridBooleanCell, _extends({}, params));
+};

package/legacy/components/cell/GridCell.js

@@ -0,0 +1,218 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["align", "children", "colIndex", "cellMode", "field", "formattedValue", "hasFocus", "height", "isEditable", "rowId", "tabIndex", "value", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onKeyDown", "onDragEnter", "onDragOver"];
+
+/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses } from '@mui/material';
+import { ownerDocument, capitalize } from '@mui/material/utils';
+import { getDataGridUtilityClass } from '../../constants/gridClasses';
+import { GridEvents, GridCellModes } from '../../models';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
+import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { gridFocusCellSelector } from '../../hooks/features/focus/gridFocusStateSelector';
+import { jsx as _jsx } from "react/jsx-runtime";
+// Based on https://stackoverflow.com/a/59518678
+var cachedSupportsPreventScroll;
+
+function doesSupportPreventScroll() {
+  if (cachedSupportsPreventScroll === undefined) {
+    document.createElement('div').focus({
+      get preventScroll() {
+        cachedSupportsPreventScroll = true;
+        return false;
+      }
+
+    });
+  }
+
+  return cachedSupportsPreventScroll;
+}
+
+var useUtilityClasses = function useUtilityClasses(ownerState) {
+  var align = ownerState.align,
+      showRightBorder = ownerState.showRightBorder,
+      isEditable = ownerState.isEditable,
+      classes = ownerState.classes;
+  var slots = {
+    root: ['cell', "cell--text".concat(capitalize(align)), isEditable && 'cell--editable', showRightBorder && 'withBorder'],
+    content: ['cellContent']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+
+var warnedOnce = false;
+
+function GridCell(props) {
+  var align = props.align,
+      children = props.children,
+      colIndex = props.colIndex,
+      cellMode = props.cellMode,
+      field = props.field,
+      formattedValue = props.formattedValue,
+      hasFocus = props.hasFocus,
+      height = props.height,
+      isEditable = props.isEditable,
+      rowId = props.rowId,
+      tabIndex = props.tabIndex,
+      value = props.value,
+      width = props.width,
+      className = props.className,
+      showRightBorder = props.showRightBorder,
+      extendRowFullWidth = props.extendRowFullWidth,
+      row = props.row,
+      onClick = props.onClick,
+      onDoubleClick = props.onDoubleClick,
+      onMouseDown = props.onMouseDown,
+      onMouseUp = props.onMouseUp,
+      onKeyDown = props.onKeyDown,
+      onDragEnter = props.onDragEnter,
+      onDragOver = props.onDragOver,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var valueToRender = formattedValue == null ? value : formattedValue;
+  var cellRef = React.useRef(null);
+  var apiRef = useGridApiContext();
+  var rootProps = useGridRootProps();
+  var ownerState = {
+    align: align,
+    showRightBorder: showRightBorder,
+    isEditable: isEditable,
+    classes: rootProps.classes
+  };
+  var classes = useUtilityClasses(ownerState);
+  var publishMouseUp = React.useCallback(function (eventName) {
+    return function (event) {
+      var params = apiRef.current.getCellParams(rowId, field || '');
+      apiRef.current.publishEvent(eventName, params, event);
+
+      if (onMouseUp) {
+        onMouseUp(event);
+      }
+    };
+  }, [apiRef, field, onMouseUp, rowId]);
+  var publish = React.useCallback(function (eventName, propHandler) {
+    return function (event) {
+      // Ignore portal
+      if (!event.currentTarget.contains(event.target)) {
+        return;
+      } // The row might have been deleted during the click
+
+
+      if (!apiRef.current.getRow(rowId)) {
+        return;
+      }
+
+      var params = apiRef.current.getCellParams(rowId, field || '');
+      apiRef.current.publishEvent(eventName, params, event);
+
+      if (propHandler) {
+        propHandler(event);
+      }
+    };
+  }, [apiRef, field, rowId]);
+  var style = {
+    minWidth: width,
+    maxWidth: width,
+    minHeight: height,
+    maxHeight: height
+  };
+  React.useLayoutEffect(function () {
+    if (!hasFocus || cellMode === GridCellModes.Edit) {
+      return;
+    }
+
+    var doc = ownerDocument(apiRef.current.rootElementRef.current);
+
+    if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {
+      var focusableElement = cellRef.current.querySelector('[tabindex="0"]');
+      var elementToFocus = focusableElement || cellRef.current;
+
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        var scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
+    }
+  }, [hasFocus, cellMode, apiRef]);
+  var handleFocus = other.onFocus;
+
+  if (process.env.NODE_ENV === 'test') {
+    handleFocus = function handleFocus(event) {
+      var 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.error(["MUI: The cell with id=".concat(rowId, " and field=").concat(field, " received focus."), "According to the state, the focus should be at id=".concat(focusedCell == null ? void 0 : focusedCell.id, ", field=").concat(focusedCell == null ? void 0 : focusedCell.field, "."), 'In the next render, the focus will be changed to match the state.', 'Call `fireEvent.mouseUp` and `fireEvent.click` before to sync the focus with the state.'].join('\n'));
+        warnedOnce = true;
+      }
+    };
+  }
+
+  return /*#__PURE__*/_jsx("div", _extends({
+    ref: cellRef,
+    className: clsx(className, classes.root),
+    role: "cell",
+    "data-field": field,
+    "data-colindex": colIndex,
+    "aria-colindex": colIndex + 1,
+    style: style,
+    tabIndex: cellMode === 'view' || !isEditable ? tabIndex : -1,
+    onClick: publish(GridEvents.cellClick, onClick),
+    onDoubleClick: publish(GridEvents.cellDoubleClick, onDoubleClick),
+    onMouseDown: publish(GridEvents.cellMouseDown, onMouseDown),
+    onMouseUp: publishMouseUp(GridEvents.cellMouseUp),
+    onKeyDown: publish(GridEvents.cellKeyDown, onKeyDown),
+    onDragEnter: publish(GridEvents.cellDragEnter, onDragEnter),
+    onDragOver: publish(GridEvents.cellDragOver, onDragOver)
+  }, other, {
+    onFocus: handleFocus,
+    children: children != null ? children : /*#__PURE__*/_jsx("div", {
+      className: classes.content,
+      children: valueToRender == null ? void 0 : valueToRender.toString()
+    })
+  }));
+}
+
+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']).isRequired,
+  cellMode: PropTypes.oneOf(['edit', 'view']),
+  children: PropTypes.node,
+  className: PropTypes.string,
+  colIndex: PropTypes.number.isRequired,
+  field: PropTypes.string.isRequired,
+  formattedValue: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool]),
+  hasFocus: PropTypes.bool,
+  height: PropTypes.number.isRequired,
+  isEditable: 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,
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+  value: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool]),
+  width: PropTypes.number.isRequired
+} : void 0;
+export { GridCell };