@devexpress/dx-react-grid-material-ui/dist/dx-react-grid-material-ui.es.js

Material-UI templates for DevExtreme React Grid component

/**
 * Bundle of @devexpress/dx-react-grid-material-ui
 * Generated: 2025-05-05
 * Version: 4.0.11
 * License: https://js.devexpress.com/Licensing
 */

import { createElement, PureComponent, memo, useState, Fragment, forwardRef, useRef, useCallback, useEffect, createRef, cloneElement } from 'react';
import PropTypes from 'prop-types';
import { Grid as Grid$1, ColumnChooser as ColumnChooser$1, DragDropProvider as DragDropProvider$1, withKeyboardNavigation, PagingPanel as PagingPanel$1, GroupingPanel as GroupingPanel$1, TableRowDetail as TableRowDetail$1, TableGroupRow as TableGroupRow$1, InlineSummaryItem, TableSelection as TableSelection$1, TableLayout as TableLayout$1, StaticTableLayout, Table as Table$3, VirtualTableLayout as VirtualTableLayout$1, makeVirtualTable, TableFilterRow as TableFilterRow$1, TableHeaderRow as TableHeaderRow$1, TableBandHeader as TableBandHeader$1, TableEditRow as TableEditRow$1, TableEditColumn as TableEditColumn$1, TableColumnVisibility as TableColumnVisibility$1, TableColumnReordering as TableColumnReordering$1, TableColumnResizing as TableColumnResizing$1, Toolbar as Toolbar$3, TableTreeColumn as TableTreeColumn$1, SearchPanel as SearchPanel$1, TableFixedColumns as TableFixedColumns$1, TableSummaryRow as TableSummaryRow$1, TableInlineCellEditing as TableInlineCellEditing$1, ExportPanel as ExportPanel$1, TableKeyboardNavigation as TableKeyboardNavigation$1 } from '@devexpress/dx-react-grid';
import classNames from 'clsx';
import { styled, Popover, List, Tooltip, IconButton, ListItem, Checkbox, ListItemText, Chip, Select, Input, MenuItem as MenuItem$1, Button, TableSortLabel, TableCell as TableCell$1, TableRow as TableRow$1, lighten, alpha, darken, TableHead, TableFooter, TableBody, Table as Table$2, Menu as Menu$1, ListItemIcon, SvgIcon, Toolbar as Toolbar$2, InputAdornment } from '@mui/material';
import { withComponents, Draggable, DragSource, Sizer } from '@devexpress/dx-react-core';
import VisibilityOff from '@mui/icons-material/esm/VisibilityOff.js';
import ChevronLeft from '@mui/icons-material/esm/ChevronLeft.js';
import ChevronRight from '@mui/icons-material/esm/ChevronRight.js';
import { firstRowOnPage, lastRowOnPage, calculateStartPage, getCellGeometries } from '@devexpress/dx-grid-core';
import ExpandMore from '@mui/icons-material/esm/ExpandMore.js';
import ExpandLess from '@mui/icons-material/esm/ExpandLess.js';
import SearchIcon from '@mui/icons-material/esm/Search.js';
import List$1 from '@mui/icons-material/esm/List.js';
import Save from '@mui/icons-material/esm/Save.js';

function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);

    if (enumerableOnly) {
      symbols = symbols.filter(function (sym) {
        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
      });
    }

    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(Object(source), true).forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

function _defineProperties(target, props) {
  for (var i = 0; i < props.length; i++) {
    var descriptor = props[i];
    descriptor.enumerable = descriptor.enumerable || false;
    descriptor.configurable = true;
    if ("value" in descriptor) descriptor.writable = true;
    Object.defineProperty(target, descriptor.key, descriptor);
  }
}

function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  if (staticProps) _defineProperties(Constructor, staticProps);
  return Constructor;
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

function _extends() {
  _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
          target[key] = source[key];
        }
      }
    }

    return target;
  };

  return _extends.apply(this, arguments);
}

function _inherits(subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
    throw new TypeError("Super expression must either be null or a function");
  }

  subClass.prototype = Object.create(superClass && superClass.prototype, {
    constructor: {
      value: subClass,
      writable: true,
      configurable: true
    }
  });
  if (superClass) _setPrototypeOf(subClass, superClass);
}

function _getPrototypeOf(o) {
  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
    return o.__proto__ || Object.getPrototypeOf(o);
  };
  return _getPrototypeOf(o);
}

function _setPrototypeOf(o, p) {
  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
    o.__proto__ = p;
    return o;
  };

  return _setPrototypeOf(o, p);
}

function _isNativeReflectConstruct() {
  if (typeof Reflect === "undefined" || !Reflect.construct) return false;
  if (Reflect.construct.sham) return false;
  if (typeof Proxy === "function") return true;

  try {
    Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
    return true;
  } catch (e) {
    return false;
  }
}

function _objectWithoutPropertiesLoose(source, excluded) {
  if (source == null) return {};
  var target = {};
  var sourceKeys = Object.keys(source);
  var key, i;

  for (i = 0; i < sourceKeys.length; i++) {
    key = sourceKeys[i];
    if (excluded.indexOf(key) >= 0) continue;
    target[key] = source[key];
  }

  return target;
}

function _objectWithoutProperties(source, excluded) {
  if (source == null) return {};

  var target = _objectWithoutPropertiesLoose(source, excluded);

  var key, i;

  if (Object.getOwnPropertySymbols) {
    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);

    for (i = 0; i < sourceSymbolKeys.length; i++) {
      key = sourceSymbolKeys[i];
      if (excluded.indexOf(key) >= 0) continue;
      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
      target[key] = source[key];
    }
  }

  return target;
}

function _assertThisInitialized(self) {
  if (self === void 0) {
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  }

  return self;
}

function _possibleConstructorReturn(self, call) {
  if (call && (typeof call === "object" || typeof call === "function")) {
    return call;
  }

  return _assertThisInitialized(self);
}

function _createSuper(Derived) {
  var hasNativeReflectConstruct = _isNativeReflectConstruct();

  return function _createSuperInternal() {
    var Super = _getPrototypeOf(Derived),
        result;

    if (hasNativeReflectConstruct) {
      var NewTarget = _getPrototypeOf(this).constructor;

      result = Reflect.construct(Super, arguments, NewTarget);
    } else {
      result = Super.apply(this, arguments);
    }

    return _possibleConstructorReturn(this, result);
  };
}

function _slicedToArray(arr, i) {
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}

function _arrayWithHoles(arr) {
  if (Array.isArray(arr)) return arr;
}

function _iterableToArrayLimit(arr, i) {
  var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];

  if (_i == null) return;
  var _arr = [];
  var _n = true;
  var _d = false;

  var _s, _e;

  try {
    for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
      _arr.push(_s.value);

      if (i && _arr.length === i) break;
    }
  } catch (err) {
    _d = true;
    _e = err;
  } finally {
    try {
      if (!_n && _i["return"] != null) _i["return"]();
    } finally {
      if (_d) throw _e;
    }
  }

  return _arr;
}

function _unsupportedIterableToArray(o, minLen) {
  if (!o) return;
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  var n = Object.prototype.toString.call(o).slice(8, -1);
  if (n === "Object" && o.constructor) n = o.constructor.name;
  if (n === "Map" || n === "Set") return Array.from(o);
  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}

function _arrayLikeToArray(arr, len) {
  if (len == null || len > arr.length) len = arr.length;

  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];

  return arr2;
}

function _nonIterableRest() {
  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}

var _excluded = ["children", "className", "rootRef"];
var PREFIX = 'Layout';
var classes = {
  root: "".concat(PREFIX, "-root")
};
var StyledDiv = styled('div')(function () {
  return _defineProperty({}, "&.".concat(classes.root), {
    display: 'flex',
    flexDirection: 'column'
  });
});
var Root = function Root(_ref2) {
  var children = _ref2.children,
      className = _ref2.className,
      rootRef = _ref2.rootRef,
      restProps = _objectWithoutProperties(_ref2, _excluded);

  return /*#__PURE__*/createElement(StyledDiv, _extends({
    className: classNames(classes.root, className),
    ref: rootRef
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? Root.propTypes = {
  children: PropTypes.node.isRequired,
  className: PropTypes.string,
  rootRef: PropTypes.object
} : void 0;
Root.defaultProps = {
  className: undefined,
  rootRef: undefined
};

var _excluded$1 = ["children"];
var Grid = function Grid(_ref) {
  var children = _ref.children,
      props = _objectWithoutProperties(_ref, _excluded$1);

  return /*#__PURE__*/createElement(Grid$1, _extends({
    rootComponent: Root
  }, props), children);
};
Grid.Root = Root;
process.env.NODE_ENV !== "production" ? Grid.propTypes = {
  children: PropTypes.node.isRequired
} : void 0;

var _excluded$2 = ["visible", "onHide", "children", "target"];
var Overlay = function Overlay(_ref) {
  var visible = _ref.visible,
      onHide = _ref.onHide,
      children = _ref.children,
      target = _ref.target,
      restProps = _objectWithoutProperties(_ref, _excluded$2);

  return /*#__PURE__*/createElement(Popover, _extends({
    open: visible,
    anchorEl: target,
    onClose: onHide,
    anchorOrigin: {
      vertical: 'top',
      horizontal: 'right'
    },
    transformOrigin: {
      vertical: 'top',
      horizontal: 'right'
    }
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? Overlay.propTypes = {
  onHide: PropTypes.func.isRequired,
  children: PropTypes.node.isRequired,
  visible: PropTypes.bool,
  target: PropTypes.oneOfType([PropTypes.object, PropTypes.func])
} : void 0;
Overlay.defaultProps = {
  visible: false,
  target: null
};

var _excluded$3 = ["children"];
var Container = function Container(_ref) {
  var children = _ref.children,
      restProps = _objectWithoutProperties(_ref, _excluded$3);

  return /*#__PURE__*/createElement(List, _extends({
    dense: true
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? Container.propTypes = {
  children: PropTypes.node.isRequired
} : void 0;

var _excluded$4 = ["onToggle", "getMessage", "buttonRef", "active"];
var ToggleButton = function ToggleButton(_ref) {
  var onToggle = _ref.onToggle,
      getMessage = _ref.getMessage,
      buttonRef = _ref.buttonRef,
      active = _ref.active,
      restProps = _objectWithoutProperties(_ref, _excluded$4);

  return /*#__PURE__*/createElement(Tooltip, {
    title: getMessage('showColumnChooser'),
    placement: "bottom",
    enterDelay: 300
  }, /*#__PURE__*/createElement(IconButton, _extends({
    onClick: onToggle,
    ref: buttonRef
  }, restProps, {
    size: "large"
  }), /*#__PURE__*/createElement(VisibilityOff, null)));
};
process.env.NODE_ENV !== "production" ? ToggleButton.propTypes = {
  onToggle: PropTypes.func.isRequired,
  getMessage: PropTypes.func.isRequired,
  buttonRef: PropTypes.func.isRequired,
  active: PropTypes.bool
} : void 0;
ToggleButton.defaultProps = {
  active: false
};

var _excluded$5 = ["item", "disabled", "onToggle"];
var PREFIX$1 = 'Item';
var classes$1 = {
  checkbox: "".concat(PREFIX$1, "-checkbox"),
  itemText: "".concat(PREFIX$1, "-itemText")
};
var StyledListItem = styled(ListItem)(function (_ref) {
  var _ref2;

  var theme = _ref.theme;
  return _ref2 = {}, _defineProperty(_ref2, "& .".concat(classes$1.itemText), {
    paddingLeft: theme.spacing(1)
  }), _defineProperty(_ref2, "& .".concat(classes$1.checkbox), {
    padding: 0
  }), _ref2;
});
var Item = function Item(_ref3) {
  var _ref3$item = _ref3.item,
      column = _ref3$item.column,
      hidden = _ref3$item.hidden,
      disabled = _ref3.disabled,
      onToggle = _ref3.onToggle,
      restProps = _objectWithoutProperties(_ref3, _excluded$5);

  return /*#__PURE__*/createElement(StyledListItem, _extends({
    key: column.name,
    button: !disabled,
    component: "li",
    disabled: disabled,
    onClick: !disabled ? onToggle : null
  }, restProps), /*#__PURE__*/createElement(Checkbox, {
    checked: !hidden,
    tabIndex: -1,
    disableRipple: true,
    disabled: disabled,
    className: classes$1.checkbox
  }), /*#__PURE__*/createElement(ListItemText, {
    className: classes$1.itemText,
    primary: column.title || column.name
  }));
};
process.env.NODE_ENV !== "production" ? Item.propTypes = {
  item: PropTypes.shape({
    column: PropTypes.shape({
      name: PropTypes.string,
      title: PropTypes.string
    }),
    hidden: PropTypes.bool
  }).isRequired,
  disabled: PropTypes.bool,
  onToggle: PropTypes.func
} : void 0;
Item.defaultProps = {
  onToggle: function onToggle() {},
  disabled: false
};

var withPatchedProps = function withPatchedProps(patchProps) {
  return function (Target) {
    var Patched = /*#__PURE__*/function (_React$PureComponent) {
      _inherits(Patched, _React$PureComponent);

      var _super = _createSuper(Patched);

      function Patched() {
        _classCallCheck(this, Patched);

        return _super.apply(this, arguments);
      }

      _createClass(Patched, [{
        key: "render",
        value: function render() {
          return /*#__PURE__*/createElement(Target, patchProps(this.props));
        }
      }]);

      return Patched;
    }(PureComponent);

    return Patched;
  };
};

var _excluded$6 = ["messages"];
var defaultMessages = {
  showColumnChooser: 'Show Column Chooser'
};
var ColumnChooserWithMessages = withPatchedProps(function (_ref) {
  var messages = _ref.messages,
      restProps = _objectWithoutProperties(_ref, _excluded$6);

  return _objectSpread2({
    messages: _objectSpread2(_objectSpread2({}, defaultMessages), messages)
  }, restProps);
})(ColumnChooser$1);
ColumnChooserWithMessages.propTypes = {
  messages: PropTypes.shape({
    hiddenColumnNames: PropTypes.string
  })
};
ColumnChooserWithMessages.defaultProps = {
  messages: {}
};
ColumnChooserWithMessages.components = ColumnChooser$1.components;
var ColumnChooser = withComponents({
  Container: Container,
  Item: Item,
  Overlay: Overlay,
  ToggleButton: ToggleButton
})(ColumnChooserWithMessages);

var _excluded$7 = ["clientOffset", "style", "className", "children"],
    _excluded2 = ["column", "className"];
var PREFIX$2 = 'DragDrop';
var classes$2 = {
  container: "".concat(PREFIX$2, "-container"),
  column: "".concat(PREFIX$2, "-column")
};
var StyledDiv$1 = styled('div')(function () {
  return _defineProperty({}, "&.".concat(classes$2.container), {
    position: 'fixed',
    zIndex: 1000,
    left: 0,
    top: 0,
    display: 'inline-block'
  });
});
var Container$1 = function Container(_ref2) {
  var clientOffset = _ref2.clientOffset,
      style = _ref2.style,
      className = _ref2.className,
      children = _ref2.children,
      restProps = _objectWithoutProperties(_ref2, _excluded$7);

  return /*#__PURE__*/createElement(StyledDiv$1, _extends({
    className: classNames(classes$2.container, className),
    style: _objectSpread2({
      transform: "translate(calc(".concat(clientOffset.x, "px - 50%), calc(").concat(clientOffset.y, "px - 50%))"),
      msTransform: "translateX(".concat(clientOffset.x, "px) translateX(-50%) translateY(").concat(clientOffset.y, "px) translateY(-50%)")
    }, style)
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? Container$1.propTypes = {
  clientOffset: PropTypes.shape({
    x: PropTypes.number.isRequired,
    y: PropTypes.number.isRequired
  }).isRequired,
  children: PropTypes.node,
  style: PropTypes.object,
  className: PropTypes.string
} : void 0;
Container$1.defaultProps = {
  style: null,
  className: undefined,
  children: undefined
};
var StyledChip = styled(Chip)(function (_ref3) {
  var theme = _ref3.theme;
  return _defineProperty({}, "&.".concat(classes$2.column), {
    paddingLeft: theme.spacing(2),
    paddingRight: theme.spacing(2),
    float: 'right',
    cursor: 'move'
  });
});
var Column = /*#__PURE__*/memo(function (_ref5) {
  var column = _ref5.column,
      className = _ref5.className,
      restProps = _objectWithoutProperties(_ref5, _excluded2);

  return /*#__PURE__*/createElement(StyledChip, _extends({
    className: classNames(classes$2.column, className),
    label: column.title
  }, restProps));
});
Column.propTypes = {
  column: PropTypes.object.isRequired,
  className: PropTypes.string
};
Column.defaultProps = {
  className: undefined
};

var DragDropProvider = withComponents({
  Container: Container$1,
  Column: Column
})(DragDropProvider$1);

var IS_LEGACY_EDGE_MEDIA_QUERY = '@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)';

var PREFIX$3 = 'PageSizeSelector';
var classes$3 = {
  pageSizeSelector: "".concat(PREFIX$3, "-pageSizeSelector"),
  label: "".concat(PREFIX$3, "-label"),
  selectIcon: "".concat(PREFIX$3, "-selectIcon"),
  selectMenu: "".concat(PREFIX$3, "-selectMenu"),
  inputRoot: "".concat(PREFIX$3, "-inputRoot")
};
var StyledDiv$2 = styled('div')(function (_ref) {
  var _mediaMaxWidth, _ref2;

  var theme = _ref.theme;
  return _ref2 = {}, _defineProperty(_ref2, "&.".concat(classes$3.pageSizeSelector), _objectSpread2(_objectSpread2({}, theme.typography.caption), {}, {
    paddingRight: theme.spacing(5),
    // NOTE: fixes vertical alignment in FF
    display: 'flex',
    alignItems: 'center'
  })), _defineProperty(_ref2, "& .".concat(classes$3.label), {
    paddingRight: theme.spacing(3)
  }), _defineProperty(_ref2, "& .".concat(classes$3.selectIcon), {
    top: 2
  }), _defineProperty(_ref2, "& .".concat(classes$3.selectMenu), _defineProperty({}, "".concat(IS_LEGACY_EDGE_MEDIA_QUERY), {
    position: 'absolute !important'
  })), _defineProperty(_ref2, "& .".concat(classes$3.inputRoot), {
    fontSize: theme.spacing(1.75),
    textAlign: 'right'
  }), _defineProperty(_ref2, '@media (max-width: 768px)', (_mediaMaxWidth = {}, _defineProperty(_mediaMaxWidth, "&.".concat(classes$3.pageSizeSelector), {
    paddingRight: theme.spacing(2)
  }), _defineProperty(_mediaMaxWidth, "& .".concat(classes$3.label), {
    display: 'none'
  }), _mediaMaxWidth)), _ref2;
});
var PageSizeSelector = function PageSizeSelector(_ref3) {
  var pageSize = _ref3.pageSize,
      onPageSizeChange = _ref3.onPageSizeChange,
      pageSizes = _ref3.pageSizes,
      getMessage = _ref3.getMessage;
  var showAll = getMessage('showAll');
  return /*#__PURE__*/createElement(StyledDiv$2, {
    className: classes$3.pageSizeSelector
  }, /*#__PURE__*/createElement("span", {
    className: classes$3.label
  }, getMessage('rowsPerPage')), /*#__PURE__*/createElement(Select, {
    value: pageSize,
    onChange: function onChange(event) {
      return onPageSizeChange(event.target.value);
    },
    classes: {
      icon: classes$3.selectIcon
    },
    MenuProps: {
      className: classes$3.selectMenu
    },
    input: /*#__PURE__*/createElement(Input, {
      disableUnderline: true,
      classes: {
        root: classes$3.inputRoot
      }
    })
  }, pageSizes.map(function (item) {
    return /*#__PURE__*/createElement(MenuItem$1, {
      key: item,
      value: item
    }, item !== 0 ? item : showAll);
  })));
};
process.env.NODE_ENV !== "production" ? PageSizeSelector.propTypes = {
  pageSize: PropTypes.number.isRequired,
  onPageSizeChange: PropTypes.func.isRequired,
  pageSizes: PropTypes.arrayOf(PropTypes.number).isRequired,
  getMessage: PropTypes.func.isRequired
} : void 0;

var PREFIX$4 = 'Pagination';
var classes$4 = {
  button: "".concat(PREFIX$4, "-button"),
  activeButton: "".concat(PREFIX$4, "-activeButton"),
  text: "".concat(PREFIX$4, "-text"),
  pagination: "".concat(PREFIX$4, "-pagination"),
  rowsLabel: "".concat(PREFIX$4, "-rowsLabel")
};
var StyledButton = styled(Button)(function (_ref) {
  var _ref2;

  var theme = _ref.theme;
  return _ref2 = {}, _defineProperty(_ref2, "&.".concat(classes$4.button), {
    minWidth: theme.spacing(2)
  }), _defineProperty(_ref2, "&.".concat(classes$4.activeButton), {
    fontWeight: 'bold',
    cursor: 'default'
  }), _defineProperty(_ref2, "&.".concat(classes$4.text), {
    color: 'rgba(0, 0, 0, 0.87)'
  }), _defineProperty(_ref2, '@media(max-width: 768px)', _defineProperty({}, "&.".concat(classes$4.button), {
    display: 'none'
  })), _ref2;
});
var StyledDiv$3 = styled('div')(function (_ref3) {
  var _mediaMaxWidth2, _ref4;

  var theme = _ref3.theme;
  return _ref4 = {}, _defineProperty(_ref4, "&.".concat(classes$4.pagination), {
    margin: 0
  }), _defineProperty(_ref4, "& .".concat(classes$4.rowsLabel), _objectSpread2(_objectSpread2({}, theme.typography.caption), {}, {
    paddingRight: theme.spacing(5)
  })), _defineProperty(_ref4, "& .".concat(classes$4.arrowButton), {
    display: 'inline-block',
    transform: theme.direction === 'rtl' ? 'rotate(180deg)' : null,
    msTransform: theme.direction === 'rtl' ? 'rotate(180deg)' : null
  }), _defineProperty(_ref4, "& .".concat(classes$4.prev), {
    marginRight: 0
  }), _defineProperty(_ref4, "& .".concat(classes$4.next), {
    marginLeft: 0
  }), _defineProperty(_ref4, '@media(max-width: 768px)', (_mediaMaxWidth2 = {}, _defineProperty(_mediaMaxWidth2, "& .".concat(classes$4.rowsLabel), {
    paddingRight: theme.spacing(2)
  }), _defineProperty(_mediaMaxWidth2, "& .".concat(classes$4.prev), {
    marginRight: theme.spacing(1)
  }), _defineProperty(_mediaMaxWidth2, "& .".concat(classes$4.next), {
    marginLeft: theme.spacing(1)
  }), _mediaMaxWidth2)), _ref4;
});

var PageButton = function PageButton(_ref5) {
  var _classNames;

  var text = _ref5.text,
      isActive = _ref5.isActive,
      isDisabled = _ref5.isDisabled,
      onClick = _ref5.onClick;
  var buttonClasses = classNames((_classNames = {}, _defineProperty(_classNames, classes$4.button, true), _defineProperty(_classNames, classes$4.activeButton, isActive), _defineProperty(_classNames, classes$4.text, true), _classNames));
  return /*#__PURE__*/createElement(StyledButton, _extends({
    className: buttonClasses,
    disabled: isDisabled,
    onClick: onClick
  }, isActive ? {
    tabIndex: -1
  } : null), text);
};

process.env.NODE_ENV !== "production" ? PageButton.propTypes = {
  text: PropTypes.string.isRequired,
  isActive: PropTypes.bool,
  isDisabled: PropTypes.bool,
  onClick: PropTypes.func
} : void 0;
PageButton.defaultProps = {
  onClick: function onClick() {},
  isDisabled: false,
  isActive: false
};
var ellipsisSymbol = "\u2026";

var RenderPageButtons = function RenderPageButtons(currentPage, totalPageCount, onCurrentPageChange) {
  var pageButtons = [];
  var maxButtonCount = 3;
  var startPage = 1;
  var endPage = totalPageCount || 1; // NOTE: take into account last button and ellipsis (T1004797)

  if (maxButtonCount < totalPageCount - 2) {
    startPage = calculateStartPage(currentPage + 1, maxButtonCount, totalPageCount);
    endPage = startPage + maxButtonCount - 1;
  }

  if (startPage > 1) {
    pageButtons.push( /*#__PURE__*/createElement(PageButton, {
      key: 1,
      text: String(1),
      onClick: function onClick() {
        return onCurrentPageChange(0);
      }
    }));

    if (startPage > 2) {
      pageButtons.push( /*#__PURE__*/createElement(PageButton, {
        key: "ellipsisStart",
        text: ellipsisSymbol,
        isDisabled: true
      }));
    }
  }

  var _loop = function _loop(page) {
    pageButtons.push( /*#__PURE__*/createElement(PageButton, {
      key: page,
      text: String(page),
      isActive: page === currentPage + 1,
      classes: classes$4,
      onClick: function onClick() {
        return onCurrentPageChange(page - 1);
      },
      isDisabled: startPage === endPage
    }));
  };

  for (var page = startPage; page <= endPage; page += 1) {
    _loop(page);
  }

  if (endPage < totalPageCount) {
    if (endPage < totalPageCount - 1) {
      pageButtons.push( /*#__PURE__*/createElement(PageButton, {
        key: "ellipsisEnd",
        text: ellipsisSymbol,
        classes: classes$4,
        isDisabled: true
      }));
    }

    pageButtons.push( /*#__PURE__*/createElement(PageButton, {
      key: totalPageCount,
      text: String(totalPageCount),
      classes: classes$4,
      onClick: function onClick() {
        return onCurrentPageChange(totalPageCount - 1);
      }
    }));
  }

  return pageButtons;
};

var Pagination = function Pagination(_ref6) {
  var totalPages = _ref6.totalPages,
      totalCount = _ref6.totalCount,
      pageSize = _ref6.pageSize,
      currentPage = _ref6.currentPage,
      onCurrentPageChange = _ref6.onCurrentPageChange,
      getMessage = _ref6.getMessage;
  var from = firstRowOnPage(currentPage, pageSize, totalCount);
  var to = lastRowOnPage(currentPage, pageSize, totalCount);
  return /*#__PURE__*/createElement(StyledDiv$3, {
    className: classes$4.pagination
  }, /*#__PURE__*/createElement("span", {
    className: classes$4.rowsLabel
  }, getMessage('info', {
    from: from,
    to: to,
    count: totalCount
  })), /*#__PURE__*/createElement(IconButton, {
    className: classNames(classes$4.arrowButton, classes$4.prev),
    disabled: currentPage === 0,
    onClick: function onClick() {
      return currentPage > 0 && onCurrentPageChange(currentPage - 1);
    },
    "aria-label": "Previous",
    size: "large"
  }, /*#__PURE__*/createElement(ChevronLeft, null)), RenderPageButtons(currentPage, totalPages, onCurrentPageChange), /*#__PURE__*/createElement(IconButton, {
    className: classNames(classes$4.arrowButton, classes$4.next),
    disabled: currentPage === totalPages - 1 || totalCount === 0,
    onClick: function onClick() {
      return currentPage < totalPages - 1 && onCurrentPageChange(currentPage + 1);
    },
    "aria-label": "Next",
    size: "large"
  }, /*#__PURE__*/createElement(ChevronRight, null)));
};
process.env.NODE_ENV !== "production" ? Pagination.propTypes = {
  totalPages: PropTypes.number.isRequired,
  currentPage: PropTypes.number.isRequired,
  onCurrentPageChange: PropTypes.func.isRequired,
  totalCount: PropTypes.number.isRequired,
  pageSize: PropTypes.number.isRequired,
  getMessage: PropTypes.func.isRequired
} : void 0;

var _excluded$8 = ["currentPage", "pageSizes", "totalPages", "pageSize", "onCurrentPageChange", "onPageSizeChange", "totalCount", "getMessage", "className", "forwardedRef"];
var PREFIX$5 = 'Pager';
var classes$5 = {
  pager: "".concat(PREFIX$5, "-pager")
};
var StyledDiv$4 = styled('div')(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$5.pager), {
    overflow: 'hidden',
    padding: theme.spacing(1.5),
    display: 'flex',
    flex: 'none',
    alignItems: 'center',
    justifyContent: 'flex-end'
  });
});

var PagerBase = function PagerBase(_ref3) {
  var currentPage = _ref3.currentPage,
      pageSizes = _ref3.pageSizes,
      totalPages = _ref3.totalPages,
      pageSize = _ref3.pageSize,
      _onCurrentPageChange = _ref3.onCurrentPageChange,
      onPageSizeChange = _ref3.onPageSizeChange,
      totalCount = _ref3.totalCount,
      getMessage = _ref3.getMessage,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      restProps = _objectWithoutProperties(_ref3, _excluded$8);

  return /*#__PURE__*/createElement(StyledDiv$4, _extends({
    className: classNames(classes$5.pager, className),
    ref: forwardedRef
  }, restProps), !!pageSizes.length && /*#__PURE__*/createElement(PageSizeSelector, {
    pageSize: pageSize,
    onPageSizeChange: onPageSizeChange,
    pageSizes: pageSizes,
    getMessage: getMessage
  }), /*#__PURE__*/createElement(Pagination, {
    totalPages: totalPages,
    totalCount: totalCount,
    currentPage: currentPage,
    onCurrentPageChange: function onCurrentPageChange(page) {
      return _onCurrentPageChange(page);
    },
    pageSize: pageSize,
    getMessage: getMessage
  }));
};

process.env.NODE_ENV !== "production" ? PagerBase.propTypes = {
  currentPage: PropTypes.number.isRequired,
  totalPages: PropTypes.number.isRequired,
  pageSizes: PropTypes.arrayOf(PropTypes.number).isRequired,
  pageSize: PropTypes.number.isRequired,
  onCurrentPageChange: PropTypes.func.isRequired,
  onPageSizeChange: PropTypes.func.isRequired,
  totalCount: PropTypes.number.isRequired,
  getMessage: PropTypes.func.isRequired,
  className: PropTypes.string,
  forwardedRef: PropTypes.func
} : void 0;
PagerBase.defaultProps = {
  className: undefined,
  forwardedRef: undefined
};
var Pager = withKeyboardNavigation('paging', 'none')(PagerBase);

var _excluded$9 = ["messages"];
var defaultMessages$1 = {
  rowsPerPage: 'Rows per page:'
};
var PagingPanelWithMessages = withPatchedProps(function (_ref) {
  var messages = _ref.messages,
      restProps = _objectWithoutProperties(_ref, _excluded$9);

  return _objectSpread2({
    messages: _objectSpread2(_objectSpread2({}, defaultMessages$1), messages)
  }, restProps);
})(PagingPanel$1);
PagingPanelWithMessages.propTypes = {
  messages: PropTypes.shape({
    showAll: PropTypes.string,
    rowsPerPage: PropTypes.string,
    info: PropTypes.oneOfType([PropTypes.string, PropTypes.func])
  })
};
PagingPanelWithMessages.defaultProps = {
  messages: {}
};
PagingPanelWithMessages.components = PagingPanel$1.components;
var PagingPanel = withComponents({
  Container: Pager
})(PagingPanelWithMessages);

var _excluded$a = ["children", "className", "forwardedRef"];
var PREFIX$6 = 'GroupPanelContainer';
var classes$6 = {
  panel: "".concat(PREFIX$6, "-panel")
};
var StyledDiv$5 = styled('div')(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$6.panel), {
    display: 'flex',
    flexWrap: 'wrap',
    width: '100%',
    marginTop: theme.spacing(1.5)
  });
});
var GroupPanelContainer = function GroupPanelContainer(_ref3) {
  var children = _ref3.children,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      restProps = _objectWithoutProperties(_ref3, _excluded$a);

  return /*#__PURE__*/createElement(StyledDiv$5, _extends({
    ref: forwardedRef,
    className: classNames(classes$6.panel, className)
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? GroupPanelContainer.propTypes = {
  children: PropTypes.node,
  className: PropTypes.string,
  forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
} : void 0;
GroupPanelContainer.defaultProps = {
  children: undefined,
  className: undefined,
  forwardedRef: undefined
};

var _excluded$b = ["item", "onGroup", "showGroupingControls", "showSortingControls", "sortingDirection", "onSort", "sortingEnabled", "groupingEnabled", "className", "forwardedRef"];
var PREFIX$7 = 'GroupPanelItem';
var classes$7 = {
  button: "".concat(PREFIX$7, "-button"),
  withoutIcon: "".concat(PREFIX$7, "-withoutIcon"),
  draftCell: "".concat(PREFIX$7, "-draftCell")
};
var StyledChip$1 = styled(Chip)(function (_ref) {
  var _ref2;

  var theme = _ref.theme;
  return _ref2 = {}, _defineProperty(_ref2, "&.".concat(classes$7.button), {
    marginRight: theme.spacing(1),
    marginBottom: theme.spacing(1.5)
  }), _defineProperty(_ref2, "&.".concat(classes$7.withoutIcon), {
    paddingRight: '13px',
    paddingLeft: '13px'
  }), _defineProperty(_ref2, "&.".concat(classes$7.draftCell), {
    opacity: 0.3
  }), _ref2;
});
var ENTER_KEY_CODE = 13;
var SPACE_KEY_CODE = 32;

var label = function label(showSortingControls, sortingEnabled, sortingDirection, column, hovered) {
  var title = column.title || column.name;
  return showSortingControls ? /*#__PURE__*/createElement(TableSortLabel, {
    active: !!sortingDirection,
    direction: sortingDirection === null ? undefined : sortingDirection,
    disabled: !sortingEnabled,
    hideSortIcon: !hovered,
    tabIndex: -1
  }, title) : title;
};

var GroupPanelItem = function GroupPanelItem(_ref3) {
  var _classNames;

  var _ref3$item = _ref3.item,
      column = _ref3$item.column,
      draft = _ref3$item.draft,
      onGroup = _ref3.onGroup,
      showGroupingControls = _ref3.showGroupingControls,
      showSortingControls = _ref3.showSortingControls,
      sortingDirection = _ref3.sortingDirection,
      onSort = _ref3.onSort,
      sortingEnabled = _ref3.sortingEnabled,
      groupingEnabled = _ref3.groupingEnabled,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      restProps = _objectWithoutProperties(_ref3, _excluded$b);

  var _React$useState = useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      hovered = _React$useState2[0],
      setHovered = _React$useState2[1];

  var chipClassNames = classNames((_classNames = {}, _defineProperty(_classNames, classes$7.button, true), _defineProperty(_classNames, classes$7.withoutIcon, !showSortingControls || !hovered && sortingDirection === null), _defineProperty(_classNames, classes$7.draftCell, draft), _classNames), className);

  var onClick = function onClick(e) {
    var isActionKeyDown = e.keyCode === ENTER_KEY_CODE || e.keyCode === SPACE_KEY_CODE;
    var isMouseClick = e.keyCode === undefined;
    var cancelSortingRelatedKey = e.metaKey || e.ctrlKey;
    var direction = (isMouseClick || isActionKeyDown) && cancelSortingRelatedKey ? null : undefined;
    onSort({
      direction: direction,
      keepOther: cancelSortingRelatedKey
    });
  };

  return /*#__PURE__*/createElement(StyledChip$1, _extends({
    ref: forwardedRef,
    label: label(showSortingControls, sortingEnabled, sortingDirection, column, hovered),
    className: chipClassNames
  }, showGroupingControls ? {
    onDelete: groupingEnabled ? onGroup : null
  } : null, showSortingControls ? {
    onClick: sortingEnabled ? onClick : null,
    onMouseEnter: function onMouseEnter() {
      return setHovered(true);
    },
    onMouseLeave: function onMouseLeave() {
      return setHovered(false);
    }
  } : null, restProps));
};
process.env.NODE_ENV !== "production" ? GroupPanelItem.propTypes = {
  item: PropTypes.shape({
    column: PropTypes.shape({
      title: PropTypes.string,
      name: PropTypes.string
    }).isRequired,
    draft: PropTypes.bool
  }).isRequired,
  showSortingControls: PropTypes.bool,
  sortingDirection: PropTypes.oneOf(['asc', 'desc', null]),
  onSort: PropTypes.func,
  onGroup: PropTypes.func,
  showGroupingControls: PropTypes.bool,
  className: PropTypes.string,
  sortingEnabled: PropTypes.bool,
  groupingEnabled: PropTypes.bool,
  forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
} : void 0;
GroupPanelItem.defaultProps = {
  showSortingControls: false,
  sortingEnabled: false,
  sortingDirection: undefined,
  onSort: undefined,
  onGroup: undefined,
  showGroupingControls: false,
  groupingEnabled: false,
  className: undefined,
  forwardedRef: undefined
};

var _excluded$c = ["getMessage", "className", "forwardedRef"];
var PREFIX$8 = 'GroupPanelEmptyMessage';
var classes$8 = {
  groupInfo: "".concat(PREFIX$8, "-groupInfo")
};
var StyledDiv$6 = styled('div')(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$8.groupInfo), {
    color: theme.typography.caption.color,
    fontFamily: theme.typography.fontFamily,
    fontSize: theme.typography.fontSize
  });
});
var GroupPanelEmptyMessage = function GroupPanelEmptyMessage(_ref3) {
  var getMessage = _ref3.getMessage,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      restProps = _objectWithoutProperties(_ref3, _excluded$c);

  return /*#__PURE__*/createElement(StyledDiv$6, _extends({
    ref: forwardedRef,
    className: classNames(classes$8.groupInfo, className)
  }, restProps), getMessage('groupByColumn'));
};
process.env.NODE_ENV !== "production" ? GroupPanelEmptyMessage.propTypes = {
  getMessage: PropTypes.func.isRequired,
  className: PropTypes.string,
  forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
} : void 0;
GroupPanelEmptyMessage.defaultProps = {
  className: undefined,
  forwardedRef: undefined
};

var GroupingPanel = withComponents({
  Container: GroupPanelContainer,
  Item: GroupPanelItem,
  EmptyMessage: GroupPanelEmptyMessage
})(GroupingPanel$1);

var _excluded$d = ["style", "expanded", "onToggle", "tableColumn", "tableRow", "row", "className", "forwardedRef"];
var PREFIX$9 = 'TableDetailToggleCell';
var classes$9 = {
  toggleCell: "".concat(PREFIX$9, "-toggleCell"),
  toggleCellButton: "".concat(PREFIX$9, "-toggleCellButton")
};
var StyledTableCell = styled(TableCell$1)(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$9.toggleCell), {
    textAlign: 'center',
    textOverflow: 'initial',
    paddingTop: 0,
    paddingBottom: 0,
    paddingLeft: theme.spacing(1)
  });
});
var TableDetailToggleCell = function TableDetailToggleCell(_ref3) {
  var style = _ref3.style,
      expanded = _ref3.expanded,
      onToggle = _ref3.onToggle,
      tableColumn = _ref3.tableColumn,
      tableRow = _ref3.tableRow,
      row = _ref3.row,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      restProps = _objectWithoutProperties(_ref3, _excluded$d);

  var handleClick = function handleClick(e) {
    e.stopPropagation();
    onToggle();
  };

  return /*#__PURE__*/createElement(StyledTableCell, _extends({
    className: classNames(classes$9.toggleCell, className),
    style: style,
    ref: forwardedRef
  }, restProps), /*#__PURE__*/createElement(IconButton, {
    onClick: handleClick
  }, expanded ? /*#__PURE__*/createElement(ExpandLess, null) : /*#__PURE__*/createElement(ExpandMore, null)));
};
process.env.NODE_ENV !== "production" ? TableDetailToggleCell.propTypes = {
  style: PropTypes.object,
  expanded: PropTypes.bool,
  onToggle: PropTypes.func,
  className: PropTypes.string,
  tableColumn: PropTypes.object,
  tableRow: PropTypes.object,
  row: PropTypes.any,
  forwardedRef: PropTypes.func
} : void 0;
TableDetailToggleCell.defaultProps = {
  style: null,
  expanded: false,
  onToggle: function onToggle() {},
  className: undefined,
  tableColumn: undefined,
  tableRow: undefined,
  row: undefined,
  forwardedRef: undefined
};

var _excluded$e = ["colSpan", "style", "children", "className", "forwardedRef", "tableColumn", "tableRow", "row"];
var PREFIX$a = 'TableDetailCell';
var classes$a = {
  active: "".concat(PREFIX$a, "-active")
};
var StyledTableCell$1 = styled(TableCell$1)(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$a.active), {
    backgroundColor: theme.palette.background.default
  });
});
var TableDetailCell = function TableDetailCell(_ref3) {
  var colSpan = _ref3.colSpan,
      style = _ref3.style,
      children = _ref3.children,
      className = _ref3.className,
      forwardedRef = _ref3.forwardedRef,
      tableColumn = _ref3.tableColumn,
      tableRow = _ref3.tableRow,
      row = _ref3.row,
      restProps = _objectWithoutProperties(_ref3, _excluded$e);

  return /*#__PURE__*/createElement(StyledTableCell$1, _extends({
    style: style,
    colSpan: colSpan,
    ref: forwardedRef,
    className: classNames(classes$a.active, className)
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? TableDetailCell.propTypes = {
  style: PropTypes.object,
  colSpan: PropTypes.number,
  children: PropTypes.node,
  className: PropTypes.string,
  tableColumn: PropTypes.object,
  tableRow: PropTypes.object,
  row: PropTypes.any,
  forwardedRef: PropTypes.func
} : void 0;
TableDetailCell.defaultProps = {
  style: null,
  colSpan: 1,
  className: undefined,
  tableColumn: undefined,
  tableRow: undefined,
  row: undefined,
  children: undefined,
  forwardedRef: undefined
};

var _excluded$f = ["children", "row", "tableRow", "forwardedRef"];
var TableRow = function TableRow(_ref) {
  var children = _ref.children,
      row = _ref.row,
      tableRow = _ref.tableRow,
      forwardedRef = _ref.forwardedRef,
      restProps = _objectWithoutProperties(_ref, _excluded$f);

  return /*#__PURE__*/createElement(TableRow$1, _extends({
    ref: forwardedRef
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? TableRow.propTypes = {
  children: PropTypes.node,
  row: PropTypes.any,
  tableRow: PropTypes.object,
  forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
} : void 0;
TableRow.defaultProps = {
  children: undefined,
  row: undefined,
  tableRow: undefined,
  forwardedRef: undefined
};

var TableRowDetailWithWidth = function TableRowDetailWithWidth(props) {
  return /*#__PURE__*/createElement(TableRowDetail$1, _extends({
    toggleColumnWidth: 48
  }, props));
};

TableRowDetailWithWidth.components = TableRowDetail$1.components;
var TableRowDetail = withComponents({
  Row: TableRow,
  Cell: TableDetailCell,
  ToggleCell: TableDetailToggleCell
})(TableRowDetailWithWidth);
TableRowDetail.COLUMN_TYPE = TableRowDetail$1.COLUMN_TYPE;
TableRowDetail.ROW_TYPE = TableRowDetail$1.ROW_TYPE;

var _excluded$g = ["contentComponent", "iconComponent", "containerComponent", "inlineSummaryComponent", "inlineSummaryItemComponent", "inlineSummaries", "getMessage", "style", "colSpan", "row", "column", "expanded", "onToggle", "children", "className", "tableRow", "forwardedRef", "tableColumn", "side", "position"];
var PREFIX$b = 'TableGroupCell';
var classes$b = {
  cell: "".concat(PREFIX$b, "-cell"),
  cellNoWrap: "".concat(PREFIX$b, "-cellNoWrap")
};
var StyledTableCell$2 = styled(TableCell$1)(function (_ref) {
  var _ref2;

  var theme = _ref.theme;
  return _ref2 = {}, _defineProperty(_ref2, "&.".concat(classes$b.cell), {
    cursor: 'pointer',
    paddingLeft: theme.spacing(1),
    paddingRight: theme.spacing(1),
    paddingTop: theme.spacing(0.5),
    paddingBottom: theme.spacing(0.5)
  }), _defineProperty(_ref2, "&.".concat(classes$b.cellNoWrap), {
    whiteSpace: 'nowrap'
  }), _ref2;
});
var Cell = function Cell(_ref3) {
  var _classNames;

  var Content = _ref3.contentComponent,
      Icon = _ref3.iconComponent,
      Container = _ref3.containerComponent,
      InlineSummary = _ref3.inlineSummaryComponent,
      InlineSummaryItem = _ref3.inlineSummaryItemComponent,
      inlineSummaries = _ref3.inlineSummaries,
      getMessage = _ref3.getMessage,
      style = _ref3.style,
      colSpan = _ref3.colSpan,
      row = _ref3.row,
      column = _ref3.column,
      expanded = _ref3.expanded,
      onToggle = _ref3.onToggle,
      children = _ref3.children,
      className = _ref3.className,
      tableRow = _ref3.tableRow,
      forwardedRef = _ref3.forwardedRef,
      tableColumn = _ref3.tableColumn,
      side = _ref3.side,
      position = _ref3.position,
      restProps = _objectWithoutProperties(_ref3, _excluded$g);

  var handleClick = function handleClick() {
    return onToggle();
  };

  return /*#__PURE__*/createElement(StyledTableCell$2, _extends({
    colSpan: colSpan,
    style: style,
    className: classNames((_classNames = {}, _defineProperty(_classNames, classes$b.cell, true), _defineProperty(_classNames, classes$b.cellNoWrap, !(tableColumn && tableColumn.wordWrapEnabled)), _classNames), className),
    ref: forwardedRef,
    onClick: handleClick
  }, restProps), /*#__PURE__*/createElement(Container, {
    side: side,
    position: position
  }, /*#__PURE__*/createElement(Icon, {
    expanded: expanded
  }), /*#__PURE__*/createElement(Content, {
    column: column,
    row: row
  }, children), inlineSummaries.length ? /*#__PURE__*/createElement(InlineSummary, {
    inlineSummaries: inlineSummaries,
    getMessage: getMessage,
    inlineSummaryItemComponent: InlineSummaryItem
  }) : null));
};
process.env.NODE_ENV !== "production" ? Cell.propTypes = {
  // oneOfType is a workaround because withStyles returns react object
  contentComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
  iconComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
  containerComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
  inlineSummaryComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
  inlineSummaryItemComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
  style: PropTypes.object,
  colSpan: PropTypes.number,
  row: PropTypes.any,
  column: PropTypes.object,
  expanded: PropTypes.bool,
  onToggle: PropTypes.func,
  getMessage: PropTypes.func.isRequired,
  children: PropTypes.node,
  className: PropTypes.string,
  tableRow: PropTypes.object,
  tableColumn: PropTypes.object,
  inlineSummaries: PropTypes.array,
  side: PropTypes.string,
  position: PropTypes.string,
  forwardedRef: PropTypes.func
} : void 0;
Cell.defaultProps = {
  style: null,
  colSpan: 1,
  row: {},
  column: {},
  expanded: false,
  inlineSummaries: [],
  onToggle: function onToggle() {},
  children: undefined,
  className: undefined,
  tableRow: undefined,
  tableColumn: undefined,
  side: 'left',
  position: '',
  forwardedRef: undefined
};

var _excluded$h = ["column", "row", "className", "children"];
var PREFIX$c = 'Content';
var classes$c = {
  columnTitle: "".concat(PREFIX$c, "-columnTitle")
};
var StyledSpan = styled('span')(function () {
  return _defineProperty({}, "&.".concat(classes$c.columnTitle), {
    verticalAlign: 'middle'
  });
});
var Content = function Content(_ref2) {
  var column = _ref2.column,
      row = _ref2.row,
      className = _ref2.className,
      children = _ref2.children,
      restProps = _objectWithoutProperties(_ref2, _excluded$h);

  return /*#__PURE__*/createElement(StyledSpan, _extends({
    className: classNames(classes$c.columnTitle, className)
  }, restProps), /*#__PURE__*/createElement("strong", null, column.title || column.name, ":", ' '), children || String(row.value));
};
process.env.NODE_ENV !== "production" ? Content.propTypes = {
  row: PropTypes.any,
  column: PropTypes.object,
  children: PropTypes.node,
  className: PropTypes.string
} : void 0;
Content.defaultProps = {
  row: {},
  column: {},
  children: undefined,
  className: undefined
};

var getBorder = function getBorder(theme) {
  return "1px solid ".concat(theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68));
};
var getStickyStyles = function getStickyStyles(theme) {
  var zIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 300;
  return {
    position: 'sticky',
    background: theme.palette.background.paper,
    zIndex: zIndex
  };
};
var getStickyCellStyle = function getStickyCellStyle(theme) {
  return _objectSpread2(_objectSpread2({}, getStickyStyles(theme)), {}, {
    backgroundClip: 'padding-box'
  });
};

var _excluded$i = ["children", "style", "className", "side", "position"];
var PREFIX$d = 'Container';
var classes$d = {
  wrapper: "".concat(PREFIX$d, "-wrapper")
};
var StyledDiv$7 = styled('div')(function (_ref) {
  var theme = _ref.theme;
  return _defineProperty({}, "&.".concat(classes$d.wrapper), _objectSpread2(_objectSpread2({}, getStickyCellStyle(theme)), {}, {
    float: 'left',
    maxWidth: '100%',
    overflowX: 'hidden',
    textOverflow: 'ellipsis'
  }));
});
var Container$2 = function Container(_ref3) {
  var children = _ref3.children,
      style = _ref3.style,
      className = _ref3.className,
      side = _ref3.side,
      position = _ref3.position,
      restProps = _objectWithoutProperties(_ref3, _excluded$i);

  return /*#__PURE__*/createElement(StyledDiv$7, _extends({
    className: classNames(classes$d.wrapper, className),
    style: _objectSpread2(_objectSpread2({}, style), {}, _defineProperty({}, side, position))
  }, restProps), children);
};
process.env.NODE_ENV !== "production" ? Container$2.propTypes = {
  children: PropTypes.node,
  className: PropTypes.string,
  style: PropTypes.object,
  side: PropTypes.string,
  position: PropTypes.string
} : void 0;
Container$2.defaultProps = {
  children: undefined,
  className: undefined,
  style: null,
  side: 'left',
  position: ''
};

var _excluded$j = ["tableRow", "tableColumn", "row", "column", "style", "className", "position", "side", "forwardedRef"];
var PREFIX$e = 'IndentCell';
var classes$e = {
  i