/** * Bundle of @devexpress/dx-react-grid-material-ui * Generated: 2018-03-02 * Version: 1.0.3 * License: https://js.devexpress.com/Licensing */ import React from 'react'; import PropTypes from 'prop-types'; import { ColumnChooser, DragDropProvider, Grid, GroupPanelLayout, GroupingPanel, PagingPanel, StaticTableLayout, Table, TableColumnReordering, TableColumnResizing, TableColumnVisibility, TableEditColumn, TableEditRow, TableFilterRow, TableGroupRow, TableHeaderRow, TableLayout, TableRowDetail, TableSelection, Toolbar, VirtualTableLayout } from '@devexpress/dx-react-grid'; import Popover from 'material-ui/Popover'; import List, { ListItem, ListItemText } from 'material-ui/List'; import IconButton from 'material-ui/IconButton'; import Tooltip from 'material-ui/Tooltip'; import VisibilityOff from 'material-ui-icons/VisibilityOff'; import Checkbox from 'material-ui/Checkbox'; import classNames from 'classnames'; import Paper from 'material-ui/Paper'; import Typography from 'material-ui/Typography'; import { withStyles } from 'material-ui/styles'; import Input from 'material-ui/Input'; import { MenuItem } from 'material-ui/Menu'; import Select from 'material-ui/Select'; import Button from 'material-ui/Button'; import ChevronLeft from 'material-ui-icons/ChevronLeft'; import ChevronRight from 'material-ui-icons/ChevronRight'; import { firstRowOnPage, lastRowOnPage } from '@devexpress/dx-grid-core'; import { darken, fade, lighten } from 'material-ui/styles/colorManipulator'; import TableMUI, { TableBody, TableCell, TableHead, TableRow, TableSortLabel } from 'material-ui/Table'; import Chip from 'material-ui/Chip'; import ExpandMore from 'material-ui-icons/ExpandMore'; import { DragSource, Draggable, DropTarget, createRenderComponent } from '@devexpress/dx-react-core'; import List$1 from 'material-ui-icons/List'; import Toolbar$1 from 'material-ui/Toolbar'; var asyncGenerator = function () { function AwaitValue(value) { this.value = value; } function AsyncGenerator(gen) { var front, back; function send(key, arg) { return new Promise(function (resolve, reject) { var request = { key: key, arg: arg, resolve: resolve, reject: reject, next: null }; if (back) { back = back.next = request; } else { front = back = request; resume(key, arg); } }); } function resume(key, arg) { try { var result = gen[key](arg); var value = result.value; if (value instanceof AwaitValue) { Promise.resolve(value.value).then(function (arg) { resume("next", arg); }, function (arg) { resume("throw", arg); }); } else { settle(result.done ? "return" : "normal", result.value); } } catch (err) { settle("throw", err); } } function settle(type, value) { switch (type) { case "return": front.resolve({ value: value, done: true }); break; case "throw": front.reject(value); break; default: front.resolve({ value: value, done: false }); break; } front = front.next; if (front) { resume(front.key, front.arg); } else { back = null; } } this._invoke = send; if (typeof gen.return !== "function") { this.return = undefined; } } if (typeof Symbol === "function" && Symbol.asyncIterator) { AsyncGenerator.prototype[Symbol.asyncIterator] = function () { return this; }; } AsyncGenerator.prototype.next = function (arg) { return this._invoke("next", arg); }; AsyncGenerator.prototype.throw = function (arg) { return this._invoke("throw", arg); }; AsyncGenerator.prototype.return = function (arg) { return this._invoke("return", arg); }; return { wrap: function (fn) { return function () { return new AsyncGenerator(fn.apply(this, arguments)); }; }, await: function (value) { return new AwaitValue(value); } }; }(); var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var defineProperty = function (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; }; var _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; }; var inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }; var objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }; var possibleConstructorReturn = function (self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }; var Root = function Root(_ref) { var children = _ref.children, restProps = objectWithoutProperties(_ref, ['children']); return React.createElement( 'div', restProps, children ); }; Root.propTypes = { children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]) }; Root.defaultProps = { children: undefined }; var Grid$1 = function Grid$$1(_ref) { var children = _ref.children, props = objectWithoutProperties(_ref, ['children']); return React.createElement( Grid, _extends({ rootComponent: Root }, props), children ); }; Grid$1.Root = Root; Grid$1.propTypes = { children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired }; var Overlay = function Overlay(_ref) { var visible = _ref.visible, onHide = _ref.onHide, children = _ref.children, target = _ref.target, restProps = objectWithoutProperties(_ref, ['visible', 'onHide', 'children', 'target']); return React.createElement( Popover, _extends({ open: visible, anchorEl: target, onClose: onHide, anchorOrigin: { vertical: 'top', horizontal: 'right' }, transformOrigin: { vertical: 'top', horizontal: 'right' } }, restProps), children ); }; Overlay.propTypes = { onHide: PropTypes.func.isRequired, children: PropTypes.node.isRequired, visible: PropTypes.bool, target: PropTypes.object }; Overlay.defaultProps = { visible: false, target: null }; var Container = function Container(_ref) { var children = _ref.children, restProps = objectWithoutProperties(_ref, ['children']); return React.createElement( List, _extends({ dense: true }, restProps), children ); }; Container.propTypes = { children: PropTypes.array.isRequired }; var ToggleButton = function ToggleButton(_ref) { var onToggle = _ref.onToggle, getMessage = _ref.getMessage, buttonRef = _ref.buttonRef, restProps = objectWithoutProperties(_ref, ['onToggle', 'getMessage', 'buttonRef']); return React.createElement( Tooltip, _extends({ title: getMessage('showColumnChooser'), placement: 'bottom', enterDelay: 300 }, restProps), React.createElement( IconButton, { onClick: onToggle, buttonRef: buttonRef }, React.createElement(VisibilityOff, null) ) ); }; ToggleButton.propTypes = { onToggle: PropTypes.func.isRequired, getMessage: PropTypes.func.isRequired, buttonRef: PropTypes.func.isRequired }; var Item = function Item(_ref) { var _ref$item = _ref.item, column = _ref$item.column, hidden = _ref$item.hidden, onToggle = _ref.onToggle, restProps = objectWithoutProperties(_ref, ['item', 'onToggle']); return React.createElement( ListItem, _extends({ key: column.name, button: true, onClick: onToggle }, restProps), React.createElement(Checkbox, { checked: !hidden, tabIndex: -1, disableRipple: true, style: { width: 'auto', height: 'auto' } }), React.createElement(ListItemText, { primary: column.title || column.name }) ); }; Item.propTypes = { item: PropTypes.shape({ column: PropTypes.shape({ name: PropTypes.string }), hidden: PropTypes.bool }).isRequired, onToggle: PropTypes.func }; Item.defaultProps = { onToggle: function onToggle() {} }; var defaultMessages = { showColumnChooser: 'Show Column Chooser' }; var ColumnChooser$1 = function (_React$PureComponent) { inherits(ColumnChooser$$1, _React$PureComponent); function ColumnChooser$$1() { classCallCheck(this, ColumnChooser$$1); return possibleConstructorReturn(this, (ColumnChooser$$1.__proto__ || Object.getPrototypeOf(ColumnChooser$$1)).apply(this, arguments)); } createClass(ColumnChooser$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(ColumnChooser, _extends({ overlayComponent: Overlay, containerComponent: Container, toggleButtonComponent: ToggleButton, itemComponent: Item, messages: _extends({}, defaultMessages, messages) }, restProps)); } }]); return ColumnChooser$$1; }(React.PureComponent); ColumnChooser$1.Container = Container; ColumnChooser$1.Button = ToggleButton; ColumnChooser$1.Item = Item; ColumnChooser$1.Overlay = Overlay; ColumnChooser$1.propTypes = { messages: PropTypes.shape({ hiddenColumnNames: PropTypes.string }) }; ColumnChooser$1.defaultProps = { messages: {} }; var styles$1 = function styles$$1(theme) { return { container: { cursor: 'move', position: 'fixed', zIndex: 1000, left: 0, top: 0, display: 'inline-block' }, column: { paddingTop: theme.spacing.unit, paddingBottom: theme.spacing.unit, paddingLeft: theme.spacing.unit * 2, paddingRight: theme.spacing.unit * 2, float: 'right' } }; }; var ContainerBase = function ContainerBase(_ref) { var clientOffset = _ref.clientOffset, classes = _ref.classes, style = _ref.style, className = _ref.className, children = _ref.children, restProps = objectWithoutProperties(_ref, ['clientOffset', 'classes', 'style', 'className', 'children']); return React.createElement( Paper, _extends({ className: classNames(classes.container, className), style: _extends({ transform: 'translate(calc(' + clientOffset.x + 'px - 50%), calc(' + clientOffset.y + 'px - 50%))' }, style) }, restProps), children ); }; ContainerBase.propTypes = { clientOffset: PropTypes.shape({ x: PropTypes.number.isRequired, y: PropTypes.number.isRequired }).isRequired, children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), classes: PropTypes.object.isRequired, style: PropTypes.object, className: PropTypes.string }; ContainerBase.defaultProps = { style: {}, className: undefined, children: undefined }; var Container$1 = withStyles(styles$1, { name: 'DragDrop' })(ContainerBase); var ColumnBase = function ColumnBase(_ref2) { var column = _ref2.column, classes = _ref2.classes, className = _ref2.className, restProps = objectWithoutProperties(_ref2, ['column', 'classes', 'className']); return React.createElement( Typography, _extends({ className: classNames(classes.column, className), variant: 'body1', component: 'p' }, restProps), column.title ); }; ColumnBase.propTypes = { column: PropTypes.object.isRequired, classes: PropTypes.object.isRequired, className: PropTypes.string }; ColumnBase.defaultProps = { className: undefined }; var Column = withStyles(styles$1, { name: 'DragDrop' })(ColumnBase); var DragDropProvider$1 = function (_React$PureComponent) { inherits(DragDropProvider$$1, _React$PureComponent); function DragDropProvider$$1() { classCallCheck(this, DragDropProvider$$1); return possibleConstructorReturn(this, (DragDropProvider$$1.__proto__ || Object.getPrototypeOf(DragDropProvider$$1)).apply(this, arguments)); } createClass(DragDropProvider$$1, [{ key: 'render', value: function render() { return React.createElement(DragDropProvider, _extends({ containerComponent: Container$1, columnComponent: Column }, this.props)); } }]); return DragDropProvider$$1; }(React.PureComponent); DragDropProvider$1.Container = Container$1; DragDropProvider$1.Column = Column; var styles$3 = function styles$$1(theme) { return { pageSizeSelector: _extends({}, theme.typography.caption, { float: 'right', paddingRight: theme.spacing.unit * 5 }), label: { paddingRight: theme.spacing.unit * 3, lineHeight: theme.spacing.unit * 5 + 'px', float: 'left' }, pageSizes: { display: 'inline-block' }, pageSizeTitle: { width: 'auto', marginRight: theme.spacing.unit / 2 }, inputRoot: { paddingTop: theme.spacing.unit * 0.75, float: 'right', fontSize: theme.spacing.unit * 1.75, textAlign: 'right' }, selectIcon: { top: 2 }, '@media (max-width: 768px)': { label: { display: 'none' }, pageSizeSelector: { paddingRight: theme.spacing.unit * 2 } } }; }; var PageSizeSelectorBase = function PageSizeSelectorBase(_ref) { var pageSize = _ref.pageSize, onPageSizeChange = _ref.onPageSizeChange, pageSizes = _ref.pageSizes, getMessage = _ref.getMessage, classes = _ref.classes; var showAll = getMessage('showAll'); return React.createElement( 'div', { className: classes.pageSizeSelector }, React.createElement( 'span', { className: classes.label }, getMessage('rowsPerPage') ), React.createElement( Select, { value: pageSize, onChange: function onChange(event) { return onPageSizeChange(event.target.value); }, classes: { icon: classes.selectIcon }, input: React.createElement(Input, { disableUnderline: true, classes: { root: classes.inputRoot } }) }, pageSizes.map(function (item) { return React.createElement( MenuItem, { key: item, value: item }, item !== 0 ? item : showAll ); }) ) ); }; PageSizeSelectorBase.propTypes = { pageSize: PropTypes.number.isRequired, onPageSizeChange: PropTypes.func.isRequired, pageSizes: PropTypes.arrayOf(PropTypes.number).isRequired, classes: PropTypes.object.isRequired, getMessage: PropTypes.func.isRequired }; var PageSizeSelector = withStyles(styles$3, { name: 'PageSizeSelector' })(PageSizeSelectorBase); var styles$4 = function styles$$1(theme) { return { pagination: { float: 'right', margin: 0 }, rowsLabel: _extends({}, theme.typography.caption, { paddingRight: theme.spacing.unit * 5, lineHeight: theme.spacing.unit * 5 + 'px' }), button: { minWidth: theme.spacing.unit * 2, height: theme.spacing.unit * 5 }, activeButton: { fontWeight: 'bold', cursor: 'default' }, arrowButton: { width: theme.spacing.unit * 4, height: theme.spacing.unit * 4, display: 'inline-block', verticalAlign: 'middle' }, prev: { marginRight: 0 }, next: { marginLeft: 0 }, '@media(max-width: 768px)': { button: { display: 'none' }, prev: { marginRight: theme.spacing.unit }, next: { marginLeft: theme.spacing.unit }, rowsLabel: { paddingRight: theme.spacing.unit * 2 } } }; }; var PageButton = function PageButton(_ref) { var _classNames; var text = _ref.text, isActive = _ref.isActive, isDisabled = _ref.isDisabled, classes = _ref.classes, onClick = _ref.onClick; var buttonClasses = classNames((_classNames = {}, defineProperty(_classNames, classes.button, true), defineProperty(_classNames, classes.activeButton, isActive), _classNames)); return React.createElement( Button, { className: buttonClasses, disabled: isDisabled, onClick: onClick, disableRipple: isActive }, text ); }; PageButton.propTypes = { text: PropTypes.string.isRequired, isActive: PropTypes.bool, isDisabled: PropTypes.bool, classes: PropTypes.object.isRequired, onClick: PropTypes.func }; PageButton.defaultProps = { onClick: function onClick() {}, isDisabled: false, isActive: false }; var ellipsisSymbol = '\u2026'; var calculateStartPage = function calculateStartPage(currentPage, maxButtonCount, totalPageCount) { return Math.max(Math.min(currentPage - Math.floor(maxButtonCount / 2, 10), totalPageCount - maxButtonCount + 1), 1); }; var renderPageButtons = function renderPageButtons(currentPage, totalPageCount, classes, onCurrentPageChange) { var pageButtons = []; var maxButtonCount = 3; var startPage = 1; var endPage = totalPageCount || 1; if (maxButtonCount < totalPageCount) { startPage = calculateStartPage(currentPage + 1, maxButtonCount, totalPageCount); endPage = startPage + maxButtonCount - 1; } if (startPage > 1) { pageButtons.push(React.createElement(PageButton, { key: 1, text: String(1), classes: classes, onClick: function onClick() { return onCurrentPageChange(0); } })); if (startPage > 2) { pageButtons.push(React.createElement(PageButton, { key: 'ellipsisStart', text: ellipsisSymbol, classes: classes, isDisabled: true })); } } var _loop = function _loop(page) { pageButtons.push(React.createElement(PageButton, { key: page, text: String(page), isActive: page === currentPage + 1, classes: classes, 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(React.createElement(PageButton, { key: 'ellipsisEnd', text: ellipsisSymbol, classes: classes, isDisabled: true })); } pageButtons.push(React.createElement(PageButton, { key: totalPageCount, text: String(totalPageCount), classes: classes, onClick: function onClick() { return onCurrentPageChange(totalPageCount - 1); } })); } return pageButtons; }; var PaginationBase = function PaginationBase(_ref2) { var totalPages = _ref2.totalPages, totalCount = _ref2.totalCount, pageSize = _ref2.pageSize, currentPage = _ref2.currentPage, onCurrentPageChange = _ref2.onCurrentPageChange, getMessage = _ref2.getMessage, classes = _ref2.classes; var from = firstRowOnPage(currentPage, pageSize, totalCount); var to = lastRowOnPage(currentPage, pageSize, totalCount); return React.createElement( 'div', { className: classes.pagination }, React.createElement( 'span', { className: classes.rowsLabel }, getMessage('info', { from: from, to: to, count: totalCount }) ), React.createElement( IconButton, { className: classNames(classes.arrowButton, classes.prev), disabled: currentPage === 0, onClick: function onClick() { return currentPage > 0 && onCurrentPageChange(currentPage - 1); } }, React.createElement(ChevronLeft, null) ), renderPageButtons(currentPage, totalPages, classes, onCurrentPageChange), React.createElement( IconButton, { className: classNames(classes.arrowButton, classes.next), disabled: currentPage === totalPages - 1 || totalCount === 0, onClick: function onClick() { return currentPage < totalPages - 1 && onCurrentPageChange(currentPage + 1); } }, React.createElement(ChevronRight, null) ) ); }; PaginationBase.propTypes = { totalPages: PropTypes.number.isRequired, currentPage: PropTypes.number.isRequired, onCurrentPageChange: PropTypes.func.isRequired, classes: PropTypes.object.isRequired, totalCount: PropTypes.number.isRequired, pageSize: PropTypes.number.isRequired, getMessage: PropTypes.func.isRequired }; var Pagination = withStyles(styles$4, { name: 'Pagination' })(PaginationBase); var getBorderColor = function getBorderColor(theme) { return '1px solid ' + (theme.palette.type === 'light' ? lighten(fade(theme.palette.divider, 1), 0.88) : darken(fade(theme.palette.divider, 1), 0.8)); }; var styles$2 = function styles$$1(theme) { return { pager: { overflow: 'hidden', padding: theme.spacing.unit * 1.5, borderTop: getBorderColor(theme) } }; }; var PagerBase = function PagerBase(_ref) { var currentPage = _ref.currentPage, pageSizes = _ref.pageSizes, totalPages = _ref.totalPages, pageSize = _ref.pageSize, classes = _ref.classes, _onCurrentPageChange = _ref.onCurrentPageChange, onPageSizeChange = _ref.onPageSizeChange, totalCount = _ref.totalCount, getMessage = _ref.getMessage, className = _ref.className, restProps = objectWithoutProperties(_ref, ['currentPage', 'pageSizes', 'totalPages', 'pageSize', 'classes', 'onCurrentPageChange', 'onPageSizeChange', 'totalCount', 'getMessage', 'className']); return React.createElement( 'div', _extends({ className: classNames(classes.pager, className) }, restProps), React.createElement(Pagination, { totalPages: totalPages, totalCount: totalCount, currentPage: currentPage, onCurrentPageChange: function onCurrentPageChange(page) { return _onCurrentPageChange(page); }, pageSize: pageSize, getMessage: getMessage }), !!pageSizes.length && React.createElement(PageSizeSelector, { pageSize: pageSize, onPageSizeChange: onPageSizeChange, pageSizes: pageSizes, getMessage: getMessage }) ); }; PagerBase.propTypes = { currentPage: PropTypes.number.isRequired, totalPages: PropTypes.number.isRequired, pageSizes: PropTypes.arrayOf(PropTypes.number).isRequired, pageSize: PropTypes.number.isRequired, classes: PropTypes.object.isRequired, onCurrentPageChange: PropTypes.func.isRequired, onPageSizeChange: PropTypes.func.isRequired, totalCount: PropTypes.number.isRequired, getMessage: PropTypes.func.isRequired, className: PropTypes.string }; PagerBase.defaultProps = { className: undefined }; var Pager = withStyles(styles$2, { name: 'Pager' })(PagerBase); var defaultMessages$1 = { showAll: 'All', rowsPerPage: 'Rows per page:', info: function info(_ref) { var from = _ref.from, to = _ref.to, count = _ref.count; return '' + from + (from < to ? '-' + to : '') + ' of ' + count; } }; var PagingPanel$1 = function (_React$PureComponent) { inherits(PagingPanel$$1, _React$PureComponent); function PagingPanel$$1() { classCallCheck(this, PagingPanel$$1); return possibleConstructorReturn(this, (PagingPanel$$1.__proto__ || Object.getPrototypeOf(PagingPanel$$1)).apply(this, arguments)); } createClass(PagingPanel$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(PagingPanel, _extends({ containerComponent: Pager, messages: _extends({}, defaultMessages$1, messages) }, restProps)); } }]); return PagingPanel$$1; }(React.PureComponent); PagingPanel$1.Container = Pager; PagingPanel$1.propTypes = { messages: PropTypes.shape({ showAll: PropTypes.string, rowsPerPage: PropTypes.string, info: PropTypes.oneOfType([PropTypes.string, PropTypes.func]) }) }; PagingPanel$1.defaultProps = { messages: {} }; var styles$5 = function styles$$1(theme) { return { panel: { display: 'flex', flexWrap: 'wrap', width: '100%', marginTop: theme.spacing.unit * 1.5 } }; }; var GroupPanelContainerBase = function GroupPanelContainerBase(_ref) { var classes = _ref.classes, children = _ref.children, className = _ref.className, restProps = objectWithoutProperties(_ref, ['classes', 'children', 'className']); return React.createElement( 'div', _extends({ className: classNames(classes.panel, className) }, restProps), children ); }; GroupPanelContainerBase.propTypes = { classes: PropTypes.object.isRequired, children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]), className: PropTypes.string }; GroupPanelContainerBase.defaultProps = { children: null, className: undefined }; var GroupPanelContainer = withStyles(styles$5, { name: 'GroupPanelContainer' })(GroupPanelContainerBase); var ENTER_KEY_CODE = 13; var SPACE_KEY_CODE = 32; var styles$6 = function styles$$1(theme) { return { button: { marginRight: theme.spacing.unit, marginBottom: theme.spacing.unit * 1.5 }, draftCell: { opacity: 0.3 } }; }; var label = function label(showSortingControls, sortingDirection, column) { var title = column.title || column.name; return showSortingControls ? React.createElement( TableSortLabel, { active: !!sortingDirection, direction: sortingDirection, tabIndex: -1 }, title ) : title; }; var GroupPanelItemBase = function GroupPanelItemBase(_ref) { var _classNames; var _ref$item = _ref.item, column = _ref$item.column, draft = _ref$item.draft, onGroup = _ref.onGroup, showGroupingControls = _ref.showGroupingControls, showSortingControls = _ref.showSortingControls, sortingDirection = _ref.sortingDirection, onSort = _ref.onSort, classes = _ref.classes, className = _ref.className, restProps = objectWithoutProperties(_ref, ['item', 'onGroup', 'showGroupingControls', 'showSortingControls', 'sortingDirection', 'onSort', 'classes', 'className']); var chipClassNames = classNames((_classNames = {}, defineProperty(_classNames, classes.button, true), defineProperty(_classNames, classes.draftCell, draft), _classNames), className); var onClick = function onClick(e) { if (!showSortingControls) return; 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 React.createElement(Chip, _extends({ label: label(showSortingControls, sortingDirection, column), className: chipClassNames }, showGroupingControls ? { onDelete: onGroup } : null, { onClick: onClick }, restProps)); }; GroupPanelItemBase.propTypes = { item: PropTypes.shape({ column: PropTypes.shape({ title: 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, classes: PropTypes.object.isRequired, className: PropTypes.string }; GroupPanelItemBase.defaultProps = { showSortingControls: false, sortingDirection: undefined, onSort: undefined, onGroup: undefined, showGroupingControls: false, className: undefined }; var GroupPanelItem = withStyles(styles$6, { name: 'GroupPanelItem' })(GroupPanelItemBase); var styles$7 = function styles$$1(theme) { return { groupInfo: { color: theme.typography.title.color } }; }; var GroupPanelEmptyMessageBase = function GroupPanelEmptyMessageBase(_ref) { var getMessage = _ref.getMessage, classes = _ref.classes, className = _ref.className, restProps = objectWithoutProperties(_ref, ['getMessage', 'classes', 'className']); return React.createElement( 'div', _extends({ className: classNames(classes.groupInfo, className) }, restProps), getMessage('groupByColumn') ); }; GroupPanelEmptyMessageBase.propTypes = { getMessage: PropTypes.func.isRequired, classes: PropTypes.object.isRequired, className: PropTypes.string }; GroupPanelEmptyMessageBase.defaultProps = { className: undefined }; var GroupPanelEmptyMessage = withStyles(styles$7, { name: 'GroupPanelEmptyMessage' })(GroupPanelEmptyMessageBase); var defaultMessages$2 = { groupByColumn: 'Drag a column header here to group by that column' }; var GroupingPanel$1 = function (_React$PureComponent) { inherits(GroupingPanel$$1, _React$PureComponent); function GroupingPanel$$1() { classCallCheck(this, GroupingPanel$$1); return possibleConstructorReturn(this, (GroupingPanel$$1.__proto__ || Object.getPrototypeOf(GroupingPanel$$1)).apply(this, arguments)); } createClass(GroupingPanel$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(GroupingPanel, _extends({ layoutComponent: GroupPanelLayout, containerComponent: GroupPanelContainer, itemComponent: GroupPanelItem, emptyMessageComponent: GroupPanelEmptyMessage, messages: _extends({}, defaultMessages$2, messages) }, restProps)); } }]); return GroupingPanel$$1; }(React.PureComponent); GroupingPanel$1.Container = GroupPanelContainer; GroupingPanel$1.Item = GroupPanelItem; GroupingPanel$1.EmptyMessage = GroupPanelEmptyMessage; GroupingPanel$1.propTypes = { messages: PropTypes.shape({ groupByColumn: PropTypes.string }) }; GroupingPanel$1.defaultProps = { messages: {} }; var styles$8 = function styles$$1(theme) { return { toggleCell: { textAlign: 'center', textOverflow: 'initial', paddingTop: 0, paddingBottom: 0, paddingLeft: theme.spacing.unit }, toggleCellButton: { verticalAlign: 'middle', display: 'inline-block', height: theme.spacing.unit * 5, width: theme.spacing.unit * 5 } }; }; var TableDetailToggleCellBase = function TableDetailToggleCellBase(_ref) { var style = _ref.style, expanded = _ref.expanded, classes = _ref.classes, onToggle = _ref.onToggle, tableColumn = _ref.tableColumn, tableRow = _ref.tableRow, row = _ref.row, className = _ref.className, restProps = objectWithoutProperties(_ref, ['style', 'expanded', 'classes', 'onToggle', 'tableColumn', 'tableRow', 'row', 'className']); var handleClick = function handleClick(e) { e.stopPropagation(); onToggle(); }; return React.createElement( TableCell, _extends({ className: classNames(classes.toggleCell, className), style: style }, restProps), React.createElement( IconButton, { className: classes.toggleCellButton, onClick: handleClick }, expanded ? React.createElement(ExpandMore, null) : React.createElement(ChevronRight, null) ) ); }; TableDetailToggleCellBase.propTypes = { style: PropTypes.object, expanded: PropTypes.bool, classes: PropTypes.object.isRequired, onToggle: PropTypes.func, className: PropTypes.string, tableColumn: PropTypes.object, tableRow: PropTypes.object, row: PropTypes.object }; TableDetailToggleCellBase.defaultProps = { style: null, expanded: false, onToggle: function onToggle() {}, className: undefined, tableColumn: undefined, tableRow: undefined, row: undefined }; var TableDetailToggleCell = withStyles(styles$8, { name: 'TableDetailToggleCell' })(TableDetailToggleCellBase); var styles$9 = function styles$$1(theme) { return { active: { backgroundColor: theme.palette.background.default } }; }; var TableDetailCellBase = function TableDetailCellBase(_ref) { var colSpan = _ref.colSpan, style = _ref.style, children = _ref.children, classes = _ref.classes, className = _ref.className, tableColumn = _ref.tableColumn, tableRow = _ref.tableRow, row = _ref.row, restProps = objectWithoutProperties(_ref, ['colSpan', 'style', 'children', 'classes', 'className', 'tableColumn', 'tableRow', 'row']); return React.createElement( TableCell, _extends({ style: style, colSpan: colSpan, className: classNames(classes.active, className) }, restProps), children ); }; TableDetailCellBase.propTypes = { style: PropTypes.object, colSpan: PropTypes.number, children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]), classes: PropTypes.object.isRequired, className: PropTypes.string, tableColumn: PropTypes.object, tableRow: PropTypes.object, row: PropTypes.object }; TableDetailCellBase.defaultProps = { style: null, colSpan: 1, className: undefined, tableColumn: undefined, tableRow: undefined, row: undefined, children: undefined }; var TableDetailCell = withStyles(styles$9, { name: 'TableDetailCell' })(TableDetailCellBase); var TableRow$1 = function TableRow$$1(_ref) { var children = _ref.children, row = _ref.row, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['children', 'row', 'tableRow', 'tableColumn']); return React.createElement( TableRow, restProps, children ); }; TableRow$1.propTypes = { children: PropTypes.node, row: PropTypes.object, tableRow: PropTypes.object, tableColumn: PropTypes.object }; TableRow$1.defaultProps = { children: null, row: undefined, tableRow: undefined, tableColumn: undefined }; var TableRowDetail$1 = function (_React$PureComponent) { inherits(TableRowDetail$$1, _React$PureComponent); function TableRowDetail$$1() { classCallCheck(this, TableRowDetail$$1); return possibleConstructorReturn(this, (TableRowDetail$$1.__proto__ || Object.getPrototypeOf(TableRowDetail$$1)).apply(this, arguments)); } createClass(TableRowDetail$$1, [{ key: 'render', value: function render() { return React.createElement(TableRowDetail, _extends({ toggleCellComponent: TableDetailToggleCell, cellComponent: TableDetailCell, rowComponent: TableRow$1, toggleColumnWidth: 48 }, this.props)); } }]); return TableRowDetail$$1; }(React.PureComponent); TableRowDetail$1.Cell = TableDetailCell; TableRowDetail$1.ToggleCell = TableDetailToggleCell; TableRowDetail$1.Row = TableRow$1; var styles$10 = function styles$$1(theme) { return { cell: { cursor: 'pointer', paddingLeft: theme.spacing.unit, paddingRight: theme.spacing.unit, paddingTop: theme.spacing.unit / 2 - 1 }, indentCell: { padding: 0 }, groupButton: { verticalAlign: 'middle', display: 'inline-block', height: theme.spacing.unit * 5, width: theme.spacing.unit * 5, marginRight: theme.spacing.unit }, columnTitle: { verticalAlign: 'middle' } }; }; var TableGroupCellBase = function TableGroupCellBase(_ref) { var style = _ref.style, colSpan = _ref.colSpan, row = _ref.row, column = _ref.column, expanded = _ref.expanded, onToggle = _ref.onToggle, classes = _ref.classes, children = _ref.children, className = _ref.className, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['style', 'colSpan', 'row', 'column', 'expanded', 'onToggle', 'classes', 'children', 'className', 'tableRow', 'tableColumn']); var handleClick = function handleClick() { return onToggle(); }; return React.createElement( TableCell, _extends({ colSpan: colSpan, style: style, className: classNames(classes.cell, className), onClick: handleClick }, restProps), React.createElement( IconButton, { className: classes.groupButton }, expanded ? React.createElement(ExpandMore, null) : React.createElement(ChevronRight, null) ), React.createElement( 'span', { className: classes.columnTitle }, React.createElement( 'strong', null, column.title || column.name, ': ' ), children || row.value ) ); }; TableGroupCellBase.propTypes = { style: PropTypes.object, colSpan: PropTypes.number, row: PropTypes.object, column: PropTypes.object, expanded: PropTypes.bool, onToggle: PropTypes.func, classes: PropTypes.object.isRequired, children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; TableGroupCellBase.defaultProps = { style: null, colSpan: 1, row: {}, column: {}, expanded: false, onToggle: function onToggle() {}, children: undefined, className: undefined, tableRow: undefined, tableColumn: undefined }; var TableGroupCell = withStyles(styles$10, { name: 'TableGroupCell' })(TableGroupCellBase); var TableGroupRow$1 = function (_React$PureComponent) { inherits(TableGroupRow$$1, _React$PureComponent); function TableGroupRow$$1() { classCallCheck(this, TableGroupRow$$1); return possibleConstructorReturn(this, (TableGroupRow$$1.__proto__ || Object.getPrototypeOf(TableGroupRow$$1)).apply(this, arguments)); } createClass(TableGroupRow$$1, [{ key: 'render', value: function render() { return React.createElement(TableGroupRow, _extends({ cellComponent: TableGroupCell, rowComponent: TableRow$1, indentColumnWidth: 48 }, this.props)); } }]); return TableGroupRow$$1; }(React.PureComponent); TableGroupRow$1.Row = TableRow$1; TableGroupRow$1.Cell = TableGroupCell; var styles$11 = function styles$$1(theme) { return { cell: { overflow: 'visible', paddingRight: 0, paddingLeft: theme.spacing.unit, textAlign: 'center' }, pointer: { cursor: 'pointer' } }; }; var TableSelectAllCellBase = function TableSelectAllCellBase(_ref) { var _classNames; var style = _ref.style, allSelected = _ref.allSelected, someSelected = _ref.someSelected, disabled = _ref.disabled, onToggle = _ref.onToggle, classes = _ref.classes, className = _ref.className, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['style', 'allSelected', 'someSelected', 'disabled', 'onToggle', 'classes', 'className', 'tableRow', 'tableColumn']); var cellClasses = classNames((_classNames = {}, defineProperty(_classNames, classes.cell, true), defineProperty(_classNames, classes.pointer, !disabled), _classNames), className); return React.createElement( TableCell, _extends({ padding: 'checkbox', style: style, className: cellClasses }, restProps), React.createElement(Checkbox, { checked: allSelected, indeterminate: someSelected, disabled: disabled, onClick: function onClick(e) { if (disabled) return; e.stopPropagation(); onToggle(); } }) ); }; TableSelectAllCellBase.propTypes = { style: PropTypes.object, allSelected: PropTypes.bool, someSelected: PropTypes.bool, disabled: PropTypes.bool, onToggle: PropTypes.func, classes: PropTypes.object.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; TableSelectAllCellBase.defaultProps = { style: null, allSelected: false, someSelected: false, disabled: false, onToggle: function onToggle() {}, className: undefined, tableRow: undefined, tableColumn: undefined }; var TableSelectAllCell = withStyles(styles$11, { name: 'TableSelectAllCell' })(TableSelectAllCellBase); var styles$12 = function styles$$1(theme) { return { cell: { overflow: 'visible', paddingRight: 0, paddingLeft: theme.spacing.unit, textAlign: 'center' }, checkbox: { marginTop: '-1px', marginBottom: '-1px', width: theme.spacing.unit * 5, height: theme.spacing.unit * 5 } }; }; var TableSelectCellBase = function TableSelectCellBase(_ref) { var style = _ref.style, selected = _ref.selected, onToggle = _ref.onToggle, classes = _ref.classes, className = _ref.className, row = _ref.row, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['style', 'selected', 'onToggle', 'classes', 'className', 'row', 'tableRow', 'tableColumn']); return React.createElement( TableCell, _extends({ padding: 'checkbox', style: style, className: classNames(classes.cell, className) }, restProps), React.createElement(Checkbox, { className: classes.checkbox, checked: selected, onClick: function onClick(e) { e.stopPropagation(); onToggle(); } }) ); }; TableSelectCellBase.propTypes = { style: PropTypes.object, selected: PropTypes.bool, onToggle: PropTypes.func, classes: PropTypes.object.isRequired, row: PropTypes.object, tableRow: PropTypes.object, tableColumn: PropTypes.object, className: PropTypes.string }; TableSelectCellBase.defaultProps = { style: null, selected: false, onToggle: function onToggle() {}, row: undefined, tableRow: undefined, tableColumn: undefined, className: undefined }; var TableSelectCell = withStyles(styles$12, { name: 'TableSelectCell' })(TableSelectCellBase); var TableSelectRow = function TableSelectRow(_ref) { var selected = _ref.selected, children = _ref.children, style = _ref.style, onToggle = _ref.onToggle, selectByRowClick = _ref.selectByRowClick; return React.createElement( TableRow, { style: style, selected: selected, onClick: function onClick(e) { if (!selectByRowClick) return; e.stopPropagation(); onToggle(); } }, children ); }; TableSelectRow.propTypes = { children: PropTypes.node, onToggle: PropTypes.func, selected: PropTypes.bool, selectByRowClick: PropTypes.bool, style: PropTypes.object }; TableSelectRow.defaultProps = { children: null, onToggle: function onToggle() {}, selected: false, selectByRowClick: false, style: null }; var TableSelection$1 = function (_React$PureComponent) { inherits(TableSelection$$1, _React$PureComponent); function TableSelection$$1() { classCallCheck(this, TableSelection$$1); return possibleConstructorReturn(this, (TableSelection$$1.__proto__ || Object.getPrototypeOf(TableSelection$$1)).apply(this, arguments)); } createClass(TableSelection$$1, [{ key: 'render', value: function render() { return React.createElement(TableSelection, _extends({ rowComponent: TableSelectRow, cellComponent: TableSelectCell, headerCellComponent: TableSelectAllCell, selectionColumnWidth: 58 }, this.props)); } }]); return TableSelection$$1; }(React.PureComponent); TableSelection$1.Cell = TableSelectCell; TableSelection$1.HeaderCell = TableSelectAllCell; var styles$13 = { root: { overflow: 'auto', WebkitOverflowScrolling: 'touch' } }; var TableContainerBase = function TableContainerBase(_ref) { var children = _ref.children, classes = _ref.classes, restProps = objectWithoutProperties(_ref, ['children', 'classes']); return React.createElement( 'div', _extends({ className: classes.root }, restProps), children ); }; TableContainerBase.propTypes = { children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired, classes: PropTypes.object.isRequired }; var TableContainer = withStyles(styles$13, { name: 'TableContainer' })(TableContainerBase); var styles$14 = function styles$$1(theme) { return { table: { tableLayout: 'fixed' }, headTable: { position: 'sticky', top: 0, zIndex: 1, overflow: 'visible', background: theme.palette.background.paper, fallbacks: { position: '-webkit-sticky' } } }; }; var TableBase = function TableBase(_ref) { var _classNames; var children = _ref.children, classes = _ref.classes, use = _ref.use, restProps = objectWithoutProperties(_ref, ['children', 'classes', 'use']); return React.createElement( TableMUI, _extends({ className: classNames((_classNames = {}, defineProperty(_classNames, classes.table, true), defineProperty(_classNames, classes.headTable, use === 'head'), _classNames)) }, restProps), children ); }; TableBase.propTypes = { use: PropTypes.oneOf(['head']), children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired, classes: PropTypes.object.isRequired }; TableBase.defaultProps = { use: undefined }; var Table$2 = withStyles(styles$14, { name: 'Table' })(TableBase); var MINIMAL_COLUMN_WIDTH = 120; var TableLayout$1 = function TableLayout$$1(_ref) { var headerRows = _ref.headerRows, bodyRows = _ref.bodyRows, columns = _ref.columns, cellComponent = _ref.cellComponent, rowComponent = _ref.rowComponent; return React.createElement(TableLayout, { layoutComponent: StaticTableLayout, headerRows: headerRows, rows: bodyRows, columns: columns, minColumnWidth: MINIMAL_COLUMN_WIDTH, containerComponent: TableContainer, tableComponent: Table$2, headComponent: TableHead, bodyComponent: TableBody, rowComponent: rowComponent, cellComponent: cellComponent }); }; TableLayout$1.propTypes = { headerRows: PropTypes.array.isRequired, bodyRows: PropTypes.array.isRequired, columns: PropTypes.array.isRequired, cellComponent: PropTypes.func.isRequired, rowComponent: PropTypes.func.isRequired }; var styles$15 = function styles$$1(theme) { return { cell: { paddingRight: theme.spacing.unit, paddingLeft: theme.spacing.unit, '&:first-child': { paddingLeft: theme.spacing.unit * 3 }, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, cellRightAlign: { textAlign: 'right' } }; }; var TableCellBase = function TableCellBase(_ref) { var _classNames; var column = _ref.column, value = _ref.value, children = _ref.children, classes = _ref.classes, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, row = _ref.row, className = _ref.className, restProps = objectWithoutProperties(_ref, ['column', 'value', 'children', 'classes', 'tableRow', 'tableColumn', 'row', 'className']); return React.createElement( TableCell, _extends({ className: classNames((_classNames = {}, defineProperty(_classNames, classes.cell, true), defineProperty(_classNames, classes.cellRightAlign, tableColumn && tableColumn.align === 'right'), _classNames), className) }, restProps), children || value ); }; TableCellBase.propTypes = { value: PropTypes.any, column: PropTypes.object, row: PropTypes.object, classes: PropTypes.object.isRequired, children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), tableRow: PropTypes.object, tableColumn: PropTypes.object, className: PropTypes.string }; TableCellBase.defaultProps = { value: undefined, column: undefined, row: undefined, children: undefined, tableRow: undefined, tableColumn: undefined, className: undefined }; var TableCell$1 = withStyles(styles$15, { name: 'TableCell' })(TableCellBase); var styles$16 = { cell: { padding: 0 } }; var TableStubCellBase = function TableStubCellBase(_ref) { var style = _ref.style, classes = _ref.classes, className = _ref.className, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['style', 'classes', 'className', 'tableRow', 'tableColumn']); return React.createElement(TableCell, _extends({ style: style, className: classNames(classes.cell, className) }, restProps)); }; TableStubCellBase.propTypes = { style: PropTypes.object, classes: PropTypes.object.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; TableStubCellBase.defaultProps = { style: {}, className: undefined, tableRow: undefined, tableColumn: undefined }; var TableStubCell = withStyles(styles$16, { name: 'TableStubCell' })(TableStubCellBase); var styles$17 = function styles$$1(theme) { return { cell: { textAlign: 'center', padding: theme.spacing.unit * 5 + 'px 0' } }; }; var TableNoDataCellBase = function TableNoDataCellBase(_ref) { var style = _ref.style, colSpan = _ref.colSpan, getMessage = _ref.getMessage, classes = _ref.classes, className = _ref.className, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, restProps = objectWithoutProperties(_ref, ['style', 'colSpan', 'getMessage', 'classes', 'className', 'tableRow', 'tableColumn']); return React.createElement( TableCell, _extends({ style: style, className: classNames(classes.cell, className), colSpan: colSpan }, restProps), React.createElement( 'big', { className: 'text-muted' }, getMessage('noData') ) ); }; TableNoDataCellBase.propTypes = { style: PropTypes.object, colSpan: PropTypes.number, getMessage: PropTypes.func.isRequired, classes: PropTypes.object.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; TableNoDataCellBase.defaultProps = { style: null, colSpan: 1, className: undefined, tableRow: undefined, tableColumn: undefined }; var TableNoDataCell = withStyles(styles$17, { name: 'TableNoDataCell' })(TableNoDataCellBase); var defaultMessages$3 = { noData: 'No data' }; var Table$1 = function (_React$PureComponent) { inherits(Table$$1, _React$PureComponent); function Table$$1() { classCallCheck(this, Table$$1); return possibleConstructorReturn(this, (Table$$1.__proto__ || Object.getPrototypeOf(Table$$1)).apply(this, arguments)); } createClass(Table$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(Table, _extends({ layoutComponent: TableLayout$1, rowComponent: TableRow$1, cellComponent: TableCell$1, noDataRowComponent: TableRow$1, noDataCellComponent: TableNoDataCell, stubCellComponent: TableStubCell, stubHeaderCellComponent: TableStubCell, messages: _extends({}, defaultMessages$3, messages) }, restProps)); } }]); return Table$$1; }(React.PureComponent); Table$1.Cell = TableCell$1; Table$1.Row = TableRow$1; Table$1.NoDataCell = TableNoDataCell; Table$1.NoDataRow = TableRow$1; Table$1.StubCell = TableStubCell; Table$1.StubHeaderCell = TableStubCell; Table$1.propTypes = { messages: PropTypes.shape({ noData: PropTypes.string }) }; Table$1.defaultProps = { messages: {} }; var MINIMAL_COLUMN_WIDTH$1 = 120; var HeadTable = function HeadTable(props) { return React.createElement(Table$2, _extends({ use: 'head' }, props)); }; var VirtualTableLayout$1 = function VirtualTableLayout$$1(_ref) { var headerRows = _ref.headerRows, bodyRows = _ref.bodyRows, columns = _ref.columns, cellComponent = _ref.cellComponent, rowComponent = _ref.rowComponent, height = _ref.height, estimatedRowHeight = _ref.estimatedRowHeight; return React.createElement(TableLayout, { layoutComponent: VirtualTableLayout, headerRows: headerRows, rows: bodyRows, columns: columns, cellComponent: cellComponent, rowComponent: rowComponent, bodyComponent: TableBody, headComponent: TableHead, tableComponent: Table$2, headTableComponent: HeadTable, containerComponent: TableContainer, estimatedRowHeight: estimatedRowHeight, minColumnWidth: MINIMAL_COLUMN_WIDTH$1, height: height }); }; VirtualTableLayout$1.propTypes = { headerRows: PropTypes.array.isRequired, bodyRows: PropTypes.array.isRequired, columns: PropTypes.array.isRequired, cellComponent: PropTypes.func.isRequired, rowComponent: PropTypes.func.isRequired, height: PropTypes.number.isRequired, estimatedRowHeight: PropTypes.number.isRequired }; var defaultMessages$4 = { noData: 'No data' }; var VirtualTable = function (_React$PureComponent) { inherits(VirtualTable, _React$PureComponent); function VirtualTable(props) { classCallCheck(this, VirtualTable); var _this = possibleConstructorReturn(this, (VirtualTable.__proto__ || Object.getPrototypeOf(VirtualTable)).call(this, props)); var height = props.height, estimatedRowHeight = props.estimatedRowHeight; _this.layoutRenderComponent = createRenderComponent(VirtualTableLayout$1, { height: height, estimatedRowHeight: estimatedRowHeight }); return _this; } createClass(VirtualTable, [{ key: 'componentWillReceiveProps', value: function componentWillReceiveProps(_ref) { var height = _ref.height, estimatedRowHeight = _ref.estimatedRowHeight; this.layoutRenderComponent.update({ height: height, estimatedRowHeight: estimatedRowHeight }); } }, { key: 'render', value: function render() { var _props = this.props, height = _props.height, estimatedRowHeight = _props.estimatedRowHeight, messages = _props.messages, restProps = objectWithoutProperties(_props, ['height', 'estimatedRowHeight', 'messages']); return React.createElement(Table, _extends({ layoutComponent: this.layoutRenderComponent.component, rowComponent: TableRow$1, cellComponent: TableCell$1, noDataRowComponent: TableRow$1, noDataCellComponent: TableNoDataCell, stubCellComponent: TableStubCell, stubHeaderCellComponent: TableStubCell, messages: _extends({}, defaultMessages$4, messages) }, restProps)); } }]); return VirtualTable; }(React.PureComponent); VirtualTable.Cell = TableCell$1; VirtualTable.Row = TableRow$1; VirtualTable.NoDataCell = TableNoDataCell; VirtualTable.NoDataRow = TableRow$1; VirtualTable.StubCell = TableStubCell; VirtualTable.StubHeaderCell = TableStubCell; VirtualTable.propTypes = { estimatedRowHeight: PropTypes.number, height: PropTypes.number, messages: PropTypes.shape({ noData: PropTypes.string }) }; VirtualTable.defaultProps = { estimatedRowHeight: 48, height: 530, messages: {} }; var styles$18 = function styles$$1(theme) { return { cell: { paddingRight: theme.spacing.unit, paddingLeft: theme.spacing.unit, '&:first-child': { paddingLeft: theme.spacing.unit * 3 } }, input: { width: '100%' } }; }; var TableFilterCellBase = function TableFilterCellBase(_ref) { var style = _ref.style, filter = _ref.filter, getMessage = _ref.getMessage, onFilter = _ref.onFilter, classes = _ref.classes, children = _ref.children, className = _ref.className, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, column = _ref.column, restProps = objectWithoutProperties(_ref, ['style', 'filter', 'getMessage', 'onFilter', 'classes', 'children', 'className', 'tableRow', 'tableColumn', 'column']); return React.createElement( TableCell, _extends({ className: classNames(classes.cell, className), style: style }, restProps), children || React.createElement(Input, { className: classes.input, value: filter ? filter.value : '', placeholder: getMessage('filterPlaceholder'), onChange: function onChange(e) { return onFilter(e.target.value ? { value: e.target.value } : null); } }) ); }; TableFilterCellBase.propTypes = { style: PropTypes.object, filter: PropTypes.object, onFilter: PropTypes.func, classes: PropTypes.object.isRequired, children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), getMessage: PropTypes.func.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object, column: PropTypes.object }; TableFilterCellBase.defaultProps = { style: null, filter: null, onFilter: function onFilter() {}, children: undefined, className: undefined, tableRow: undefined, tableColumn: undefined, column: undefined }; var TableFilterCell = withStyles(styles$18, { name: 'TableFilterCell' })(TableFilterCellBase); var defaultMessages$5 = { filterPlaceholder: 'Filter...' }; var TableFilterRow$1 = function (_React$PureComponent) { inherits(TableFilterRow$$1, _React$PureComponent); function TableFilterRow$$1() { classCallCheck(this, TableFilterRow$$1); return possibleConstructorReturn(this, (TableFilterRow$$1.__proto__ || Object.getPrototypeOf(TableFilterRow$$1)).apply(this, arguments)); } createClass(TableFilterRow$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(TableFilterRow, _extends({ cellComponent: TableFilterCell, rowComponent: TableRow$1, messages: _extends({}, defaultMessages$5, messages) }, restProps)); } }]); return TableFilterRow$$1; }(React.PureComponent); TableFilterRow$1.Cell = TableFilterCell; TableFilterRow$1.Row = TableRow$1; TableFilterRow$1.propTypes = { messages: PropTypes.shape({ filterPlaceholder: PropTypes.string }) }; TableFilterRow$1.defaultProps = { messages: {} }; var styles$20 = function styles$$1(theme) { return { groupingControl: { cursor: 'pointer', paddingLeft: 0, height: theme.spacing.unit * 3 }, floatLeft: { float: 'left', textAlign: 'left' }, floatRight: { float: 'right', textAlign: 'right' } }; }; var GroupingControlBase = function GroupingControlBase(_ref) { var _classNames; var align = _ref.align, onGroup = _ref.onGroup, classes = _ref.classes; var invertedAlign = align === 'left' ? 'right' : 'left'; var groupingControlClasses = classNames((_classNames = {}, defineProperty(_classNames, classes.groupingControl, true), defineProperty(_classNames, classes.floatLeft, invertedAlign === 'left'), defineProperty(_classNames, classes.floatRight, invertedAlign === 'right'), _classNames)); return React.createElement( 'div', { onClick: function onClick(e) { e.stopPropagation(); onGroup(e); }, className: groupingControlClasses }, React.createElement(List$1, null) ); }; GroupingControlBase.propTypes = { align: PropTypes.string.isRequired, onGroup: PropTypes.func.isRequired, classes: PropTypes.object.isRequired }; var GroupingControl = withStyles(styles$20, { name: 'GroupingControl' })(GroupingControlBase); var styles$21 = function styles$$1(theme) { return { resizeHandle: { position: 'absolute', userSelect: 'none', MozUserSelect: 'none', WebkitUserSelect: 'none', width: theme.spacing.unit * 2 + 'px', top: 0, right: '-' + theme.spacing.unit + 'px', height: '100%', cursor: 'col-resize', zIndex: 100 }, resizeHandleLine: { position: 'absolute', backgroundColor: theme.palette.grey[300], height: '50%', width: '1px', top: '25%', transition: 'all linear 100ms' }, resizeHandleFirstLine: { left: theme.spacing.unit - 3 + 'px' }, resizeHandleSecondLine: { left: theme.spacing.unit - 1 + 'px' }, resizeHandleActive: { '& $resizeHandleLine': { backgroundColor: theme.palette.primary[300] } }, '@media (pointer: fine)': { resizeHandleLine: { opacity: 0 }, resizeHandleActive: { '& $resizeHandleLine': { opacity: 1 } }, resizeHandle: { '&:hover $resizeHandleLine': { opacity: 1 } } } }; }; var ResizingControlBase = function (_React$PureComponent) { inherits(ResizingControlBase, _React$PureComponent); function ResizingControlBase(props) { classCallCheck(this, ResizingControlBase); var _this = possibleConstructorReturn(this, (ResizingControlBase.__proto__ || Object.getPrototypeOf(ResizingControlBase)).call(this, props)); _this.state = { resizing: false }; _this.onResizeStart = function (_ref) { var x = _ref.x; _this.resizeStartingX = x; _this.setState({ resizing: true }); }; _this.onResizeUpdate = function (_ref2) { var x = _ref2.x; var onWidthDraft = _this.props.onWidthDraft; onWidthDraft({ shift: x - _this.resizeStartingX }); }; _this.onResizeEnd = function (_ref3) { var x = _ref3.x; var _this$props = _this.props, onWidthChange = _this$props.onWidthChange, onWidthDraftCancel = _this$props.onWidthDraftCancel; onWidthDraftCancel(); onWidthChange({ shift: x - _this.resizeStartingX }); _this.setState({ resizing: false }); }; return _this; } createClass(ResizingControlBase, [{ key: 'render', value: function render() { var _classNames, _classNames2, _classNames3; var classes = this.props.classes; var resizing = this.state.resizing; return React.createElement( Draggable, { onStart: this.onResizeStart, onUpdate: this.onResizeUpdate, onEnd: this.onResizeEnd }, React.createElement( 'div', { className: classNames((_classNames = {}, defineProperty(_classNames, classes.resizeHandle, true), defineProperty(_classNames, classes.resizeHandleActive, resizing), _classNames)) }, React.createElement('div', { className: classNames((_classNames2 = {}, defineProperty(_classNames2, classes.resizeHandleLine, true), defineProperty(_classNames2, classes.resizeHandleFirstLine, true), _classNames2)) }), React.createElement('div', { className: classNames((_classNames3 = {}, defineProperty(_classNames3, classes.resizeHandleLine, true), defineProperty(_classNames3, classes.resizeHandleSecondLine, true), _classNames3)) }) ) ); } }]); return ResizingControlBase; }(React.PureComponent); ResizingControlBase.propTypes = { onWidthChange: PropTypes.func.isRequired, onWidthDraft: PropTypes.func.isRequired, onWidthDraftCancel: PropTypes.func.isRequired, classes: PropTypes.object.isRequired }; var ResizingControl = withStyles(styles$21, { name: 'ResizingControl' })(ResizingControlBase); var styles$22 = function styles$$1(theme) { return { tooltipRoot: { display: 'block', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }, sortLabelRoot: { height: theme.spacing.unit * 3 }, sortLabelActive: { color: 'inherit' } }; }; var SortingControlBase = function SortingControlBase(_ref) { var align = _ref.align, sortingDirection = _ref.sortingDirection, columnTitle = _ref.columnTitle, onClick = _ref.onClick, classes = _ref.classes, getMessage = _ref.getMessage; return React.createElement( Tooltip, { title: getMessage('sortingHint'), placement: align === 'right' ? 'bottom-end' : 'bottom-start', enterDelay: 300, classes: { root: classes.tooltipRoot } }, React.createElement( TableSortLabel, { active: !!sortingDirection, direction: sortingDirection, onClick: onClick, classes: { root: classes.sortLabelRoot, active: classes.sortLabelActive } }, columnTitle ) ); }; SortingControlBase.propTypes = { align: PropTypes.string.isRequired, sortingDirection: PropTypes.oneOf(['asc', 'desc']), columnTitle: PropTypes.string.isRequired, classes: PropTypes.object.isRequired, onClick: PropTypes.func.isRequired, getMessage: PropTypes.func.isRequired }; SortingControlBase.defaultProps = { sortingDirection: null }; var SortingControl = withStyles(styles$22, { name: 'SortingControl' })(SortingControlBase); var ENTER_KEY_CODE$1 = 13; var SPACE_KEY_CODE$1 = 32; var styles$19 = function styles$$1(theme) { return { plainTitle: { overflow: 'hidden', textOverflow: 'ellipsis', height: theme.spacing.unit * 3, lineHeight: theme.spacing.unit * 3 + 'px' }, cell: { outline: 'none', position: 'relative', overflow: 'visible', paddingRight: theme.spacing.unit, paddingLeft: theme.spacing.unit, '&:first-child': { paddingLeft: theme.spacing.unit * 3 } }, cellNoUserSelect: { userSelect: 'none', MozUserSelect: 'none', WebkitUserSelect: 'none' }, cellDraggable: { cursor: 'pointer' }, cellDimmed: { opacity: 0.3 }, cellRight: { paddingLeft: theme.spacing.unit, paddingRight: theme.spacing.unit } }; }; var TableHeaderCellBase = function (_React$PureComponent) { inherits(TableHeaderCellBase, _React$PureComponent); function TableHeaderCellBase(props) { classCallCheck(this, TableHeaderCellBase); var _this = possibleConstructorReturn(this, (TableHeaderCellBase.__proto__ || Object.getPrototypeOf(TableHeaderCellBase)).call(this, props)); _this.state = { dragging: false }; _this.onClick = function (e) { var onSort = _this.props.onSort; var isActionKeyDown = e.keyCode === ENTER_KEY_CODE$1 || e.keyCode === SPACE_KEY_CODE$1; var isMouseClick = e.keyCode === undefined; var cancelSortingRelatedKey = e.metaKey || e.ctrlKey; var direction = (isMouseClick || isActionKeyDown) && cancelSortingRelatedKey ? null : undefined; e.preventDefault(); onSort({ direction: direction, keepOther: e.shiftKey || cancelSortingRelatedKey }); }; return _this; } createClass(TableHeaderCellBase, [{ key: 'render', value: function render() { var _classNames, _this2 = this; var _props = this.props, style = _props.style, column = _props.column, tableColumn = _props.tableColumn, showSortingControls = _props.showSortingControls, sortingDirection = _props.sortingDirection, showGroupingControls = _props.showGroupingControls, onGroup = _props.onGroup, draggingEnabled = _props.draggingEnabled, resizingEnabled = _props.resizingEnabled, onWidthChange = _props.onWidthChange, onWidthDraft = _props.onWidthDraft, onWidthDraftCancel = _props.onWidthDraftCancel, classes = _props.classes, getMessage = _props.getMessage, tableRow = _props.tableRow, className = _props.className, onSort = _props.onSort, restProps = objectWithoutProperties(_props, ['style', 'column', 'tableColumn', 'showSortingControls', 'sortingDirection', 'showGroupingControls', 'onGroup', 'draggingEnabled', 'resizingEnabled', 'onWidthChange', 'onWidthDraft', 'onWidthDraftCancel', 'classes', 'getMessage', 'tableRow', 'className', 'onSort']); var dragging = this.state.dragging; var align = tableColumn && tableColumn.align || 'left'; var columnTitle = column && (column.title || column.name); var tableCellClasses = classNames((_classNames = {}, defineProperty(_classNames, classes.cell, true), defineProperty(_classNames, classes.cellRight, align === 'right'), defineProperty(_classNames, classes.cellNoUserSelect, draggingEnabled || showSortingControls), defineProperty(_classNames, classes.cellDraggable, draggingEnabled), defineProperty(_classNames, classes.cellDimmed, dragging || tableColumn && tableColumn.draft), _classNames), className); var cellLayout = React.createElement( TableCell, _extends({ style: style, className: tableCellClasses, numeric: align === 'right' }, restProps), showGroupingControls && React.createElement(GroupingControl, { align: align, onGroup: onGroup }), showSortingControls ? React.createElement(SortingControl, { align: align, sortingDirection: sortingDirection, columnTitle: columnTitle, onClick: this.onClick, getMessage: getMessage }) : React.createElement( 'div', { className: classes.plainTitle }, columnTitle ), resizingEnabled && React.createElement(ResizingControl, { onWidthChange: onWidthChange, onWidthDraft: onWidthDraft, onWidthDraftCancel: onWidthDraftCancel }) ); return draggingEnabled ? React.createElement( DragSource, { ref: function ref(element) { _this2.cellRef = element; }, payload: [{ type: 'column', columnName: column.name }], onStart: function onStart() { return _this2.setState({ dragging: true }); }, onEnd: function onEnd() { return _this2.cellRef && _this2.setState({ dragging: false }); } }, cellLayout ) : cellLayout; } }]); return TableHeaderCellBase; }(React.PureComponent); TableHeaderCellBase.propTypes = { tableColumn: PropTypes.object, tableRow: PropTypes.object, column: PropTypes.object, style: PropTypes.object, showSortingControls: PropTypes.bool, sortingDirection: PropTypes.oneOf(['asc', 'desc', null]), onSort: PropTypes.func, showGroupingControls: PropTypes.bool, onGroup: PropTypes.func, draggingEnabled: PropTypes.bool, resizingEnabled: PropTypes.bool, onWidthChange: PropTypes.func, onWidthDraft: PropTypes.func, onWidthDraftCancel: PropTypes.func, classes: PropTypes.object.isRequired, getMessage: PropTypes.func.isRequired, className: PropTypes.string }; TableHeaderCellBase.defaultProps = { column: undefined, tableColumn: undefined, tableRow: undefined, style: null, showSortingControls: false, sortingDirection: undefined, onSort: undefined, showGroupingControls: false, onGroup: undefined, draggingEnabled: false, resizingEnabled: false, onWidthChange: undefined, onWidthDraft: undefined, onWidthDraftCancel: undefined, className: undefined }; var TableHeaderCell = withStyles(styles$19, { name: 'TableHeaderCell' })(TableHeaderCellBase); var defaultMessages$6 = { sortingHint: 'Sort' }; var TableHeaderRow$1 = function (_React$PureComponent) { inherits(TableHeaderRow$$1, _React$PureComponent); function TableHeaderRow$$1() { classCallCheck(this, TableHeaderRow$$1); return possibleConstructorReturn(this, (TableHeaderRow$$1.__proto__ || Object.getPrototypeOf(TableHeaderRow$$1)).apply(this, arguments)); } createClass(TableHeaderRow$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(TableHeaderRow, _extends({ cellComponent: TableHeaderCell, rowComponent: TableRow$1, messages: _extends({}, defaultMessages$6, messages) }, restProps)); } }]); return TableHeaderRow$$1; }(React.PureComponent); TableHeaderRow$1.Cell = TableHeaderCell; TableHeaderRow$1.Row = TableRow$1; TableHeaderRow$1.propTypes = { messages: PropTypes.shape({ sortingHint: PropTypes.string }) }; TableHeaderRow$1.defaultProps = { messages: {} }; var styles$23 = function styles$$1(theme) { return { button: { padding: theme.spacing.unit, minWidth: 40 }, headingCell: { whiteSpace: 'nowrap', textAlign: 'center', padding: '0 ' + theme.spacing.unit * 2 + 'px 0 ' + theme.spacing.unit * 3 + 'px' }, cell: { whiteSpace: 'nowrap', textAlign: 'center', padding: '0 ' + theme.spacing.unit * 2 + 'px 0 ' + theme.spacing.unit * 3 + 'px' } }; }; var withEditColumnStyles = withStyles(styles$23, { name: 'EditColumn' }); var CommandButtonBase = function CommandButtonBase(_ref) { var onExecute = _ref.onExecute, text = _ref.text, classes = _ref.classes, className = _ref.className, restProps = objectWithoutProperties(_ref, ['onExecute', 'text', 'classes', 'className']); return React.createElement( Button, _extends({ color: 'primary', className: classNames(classes.button, className), onClick: function onClick(e) { e.stopPropagation(); onExecute(); } }, restProps), text ); }; CommandButtonBase.propTypes = { onExecute: PropTypes.func.isRequired, text: PropTypes.string.isRequired, classes: PropTypes.object.isRequired, className: PropTypes.string }; CommandButtonBase.defaultProps = { className: undefined }; var CommandButton = withEditColumnStyles(CommandButtonBase); var EditCommandHeadingCellBase = function EditCommandHeadingCellBase(_ref2) { var children = _ref2.children, style = _ref2.style, classes = _ref2.classes, className = _ref2.className, tableRow = _ref2.tableRow, tableColumn = _ref2.tableColumn, restProps = objectWithoutProperties(_ref2, ['children', 'style', 'classes', 'className', 'tableRow', 'tableColumn']); return React.createElement( TableCell, _extends({ className: classNames(classes.headingCell, className), style: style }, restProps), children ); }; EditCommandHeadingCellBase.propTypes = { children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]), style: PropTypes.object, classes: PropTypes.object.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; EditCommandHeadingCellBase.defaultProps = { children: undefined, style: {}, className: undefined, tableRow: undefined, tableColumn: undefined }; var EditCommandHeadingCell = withEditColumnStyles(EditCommandHeadingCellBase); var EditCommandCellBase = function EditCommandCellBase(_ref3) { var children = _ref3.children, style = _ref3.style, classes = _ref3.classes, className = _ref3.className, tableRow = _ref3.tableRow, tableColumn = _ref3.tableColumn, restProps = objectWithoutProperties(_ref3, ['children', 'style', 'classes', 'className', 'tableRow', 'tableColumn']); return React.createElement( TableCell, _extends({ className: classNames(classes.cell, className), style: style }, restProps), children ); }; EditCommandCellBase.propTypes = { children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]), style: PropTypes.object, classes: PropTypes.object.isRequired, className: PropTypes.string, tableRow: PropTypes.object, tableColumn: PropTypes.object }; EditCommandCellBase.defaultProps = { children: undefined, style: {}, className: undefined, tableRow: undefined, tableColumn: undefined }; var EditCommandCell = withEditColumnStyles(EditCommandCellBase); var defaultMessages$7 = { addCommand: 'New', editCommand: 'Edit', deleteCommand: 'Delete', commitCommand: 'Save', cancelCommand: 'Cancel' }; var TableEditColumn$1 = function (_React$PureComponent) { inherits(TableEditColumn$$1, _React$PureComponent); function TableEditColumn$$1() { classCallCheck(this, TableEditColumn$$1); return possibleConstructorReturn(this, (TableEditColumn$$1.__proto__ || Object.getPrototypeOf(TableEditColumn$$1)).apply(this, arguments)); } createClass(TableEditColumn$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(TableEditColumn, _extends({ cellComponent: EditCommandCell, headerCellComponent: EditCommandHeadingCell, commandComponent: CommandButton, messages: _extends({}, defaultMessages$7, messages), width: 150 }, restProps)); } }]); return TableEditColumn$$1; }(React.PureComponent); TableEditColumn$1.Command = CommandButton; TableEditColumn$1.Cell = EditCommandCell; TableEditColumn$1.HeaderCell = EditCommandHeadingCell; TableEditColumn$1.propTypes = { messages: PropTypes.shape({ addCommand: PropTypes.string, editCommand: PropTypes.string, deleteCommand: PropTypes.string, commitCommand: PropTypes.string, cancelCommand: PropTypes.string }) }; TableEditColumn$1.defaultProps = { messages: {} }; var styles$24 = function styles$$1(theme) { return { cell: { paddingRight: theme.spacing.unit, paddingLeft: theme.spacing.unit }, inputRoot: { width: '100%' }, inputRight: { textAlign: 'right' } }; }; var EditCellBase = function EditCellBase(_ref) { var column = _ref.column, value = _ref.value, onValueChange = _ref.onValueChange, style = _ref.style, classes = _ref.classes, children = _ref.children, row = _ref.row, tableRow = _ref.tableRow, tableColumn = _ref.tableColumn, className = _ref.className, restProps = objectWithoutProperties(_ref, ['column', 'value', 'onValueChange', 'style', 'classes', 'children', 'row', 'tableRow', 'tableColumn', 'className']); var inputClasses = classNames(defineProperty({}, classes.inputRight, tableColumn && tableColumn.align === 'right')); return React.createElement( TableCell, _extends({ className: classNames(classes.cell, className), style: style }, restProps), children || React.createElement(Input, { className: classes.inputRoot, classes: { input: inputClasses }, value: value || '', onChange: function onChange(e) { return onValueChange(e.target.value); } }) ); }; EditCellBase.propTypes = { column: PropTypes.object, row: PropTypes.object, tableRow: PropTypes.object, tableColumn: PropTypes.object, value: PropTypes.any, onValueChange: PropTypes.func.isRequired, style: PropTypes.object, classes: PropTypes.object.isRequired, children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), className: PropTypes.string }; EditCellBase.defaultProps = { column: undefined, row: undefined, tableRow: undefined, tableColumn: undefined, value: '', style: {}, children: undefined, className: undefined }; var EditCell = withStyles(styles$24, { name: 'EditCell' })(EditCellBase); var TableEditRow$1 = function (_React$PureComponent) { inherits(TableEditRow$$1, _React$PureComponent); function TableEditRow$$1() { classCallCheck(this, TableEditRow$$1); return possibleConstructorReturn(this, (TableEditRow$$1.__proto__ || Object.getPrototypeOf(TableEditRow$$1)).apply(this, arguments)); } createClass(TableEditRow$$1, [{ key: 'render', value: function render() { return React.createElement(TableEditRow, _extends({ cellComponent: EditCell, rowComponent: TableRow$1 }, this.props)); } }]); return TableEditRow$$1; }(React.PureComponent); TableEditRow$1.Cell = EditCell; TableEditRow$1.Row = TableRow$1; var EmptyMessage = function EmptyMessage(_ref) { var getMessage = _ref.getMessage, restProps = objectWithoutProperties(_ref, ['getMessage']); return React.createElement( Toolbar$1, restProps, React.createElement( Typography, null, getMessage('noColumns') ) ); }; EmptyMessage.propTypes = { getMessage: PropTypes.func.isRequired }; var defaultMessages$8 = { noColumns: 'Nothing to show' }; var TableColumnVisibility$1 = function (_React$PureComponent) { inherits(TableColumnVisibility$$1, _React$PureComponent); function TableColumnVisibility$$1() { classCallCheck(this, TableColumnVisibility$$1); return possibleConstructorReturn(this, (TableColumnVisibility$$1.__proto__ || Object.getPrototypeOf(TableColumnVisibility$$1)).apply(this, arguments)); } createClass(TableColumnVisibility$$1, [{ key: 'render', value: function render() { var _props = this.props, messages = _props.messages, restProps = objectWithoutProperties(_props, ['messages']); return React.createElement(TableColumnVisibility, _extends({ emptyMessageComponent: EmptyMessage, messages: _extends({}, defaultMessages$8, messages) }, restProps)); } }]); return TableColumnVisibility$$1; }(React.PureComponent); TableColumnVisibility$1.EmptyMessage = EmptyMessage; TableColumnVisibility$1.propTypes = { messages: PropTypes.shape({ noColumns: PropTypes.string }) }; TableColumnVisibility$1.defaultProps = { messages: {} }; var TableReorderingCell = function TableReorderingCell(_ref) { var style = _ref.style, getCellDimensions = _ref.getCellDimensions; var refHandler = function refHandler(node) { return node && getCellDimensions(function () { var _node$getBoundingClie = node.getBoundingClientRect(), left = _node$getBoundingClie.left, right = _node$getBoundingClie.right; return { left: left, right: right }; }); }; return React.createElement('td', { ref: refHandler, style: _extends({}, style, { padding: 0 }) }); }; TableReorderingCell.propTypes = { getCellDimensions: PropTypes.func.isRequired, style: PropTypes.object }; TableReorderingCell.defaultProps = { style: {} }; var TableContainer$1 = function TableContainer(_ref) { var onOver = _ref.onOver, onLeave = _ref.onLeave, onDrop = _ref.onDrop, children = _ref.children; return React.createElement( DropTarget, { onOver: onOver, onLeave: onLeave, onDrop: onDrop }, children ); }; // eslint-disable-next-line react/prop-types var ReorderingRow = function ReorderingRow(_ref2) { var style = _ref2.style, restParams = objectWithoutProperties(_ref2, ['style']); return React.createElement(TableRow$1, _extends({ style: _extends({}, style, { visibility: 'hidden' }) }, restParams)); }; var TableColumnReordering$1 = function TableColumnReordering$$1(props) { return React.createElement(TableColumnReordering, _extends({ tableContainerComponent: TableContainer$1, rowComponent: ReorderingRow, cellComponent: TableReorderingCell }, props)); }; var TableColumnResizing$1 = function (_React$PureComponent) { inherits(TableColumnResizing$$1, _React$PureComponent); function TableColumnResizing$$1() { classCallCheck(this, TableColumnResizing$$1); return possibleConstructorReturn(this, (TableColumnResizing$$1.__proto__ || Object.getPrototypeOf(TableColumnResizing$$1)).apply(this, arguments)); } createClass(TableColumnResizing$$1, [{ key: 'render', value: function render() { return React.createElement(TableColumnResizing, this.props); } }]); return TableColumnResizing$$1; }(React.PureComponent); var styles$25 = function styles$$1(theme) { return { toolbar: { borderBottom: getBorderColor(theme) } }; }; var ToolbarBase = function ToolbarBase(_ref) { var children = _ref.children, classes = _ref.classes, className = _ref.className, style = _ref.style, restProps = objectWithoutProperties(_ref, ['children', 'classes', 'className', 'style']); return React.createElement( Toolbar$1, _extends({ style: style, className: classNames(classes.toolbar, className) }, restProps), children ); }; ToolbarBase.propTypes = { children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired, classes: PropTypes.object.isRequired, className: PropTypes.string, style: PropTypes.object }; ToolbarBase.defaultProps = { className: undefined, style: null }; var Toolbar$3 = withStyles(styles$25, { name: 'Toolbar' })(ToolbarBase); var FlexibleSpace = function FlexibleSpace() { return React.createElement('div', { style: { flex: '0 0 0', marginLeft: 'auto' } }); }; var Toolbar$2 = function (_React$PureComponent) { inherits(Toolbar$$1, _React$PureComponent); function Toolbar$$1() { classCallCheck(this, Toolbar$$1); return possibleConstructorReturn(this, (Toolbar$$1.__proto__ || Object.getPrototypeOf(Toolbar$$1)).apply(this, arguments)); } createClass(Toolbar$$1, [{ key: 'render', value: function render() { return React.createElement(Toolbar, _extends({ rootComponent: Toolbar$3, flexibleSpaceComponent: FlexibleSpace }, this.props)); } }]); return Toolbar$$1; }(React.PureComponent); Toolbar$2.Root = Toolbar$3; export { Grid$1 as Grid, ColumnChooser$1 as ColumnChooser, DragDropProvider$1 as DragDropProvider, PagingPanel$1 as PagingPanel, GroupingPanel$1 as GroupingPanel, TableRowDetail$1 as TableRowDetail, TableGroupRow$1 as TableGroupRow, TableSelection$1 as TableSelection, Table$1 as Table, VirtualTable, TableFilterRow$1 as TableFilterRow, TableHeaderRow$1 as TableHeaderRow, TableEditColumn$1 as TableEditColumn, TableEditRow$1 as TableEditRow, TableColumnVisibility$1 as TableColumnVisibility, TableColumnReordering$1 as TableColumnReordering, TableColumnResizing$1 as TableColumnResizing, Toolbar$2 as Toolbar }; //# sourceMappingURL=dx-react-grid-material-ui.es.js.map