versacall-core-library-react 2.0.68 → 2.0.70

package/dist/components/CoreTable/CoreTableChips.js

@@ -1,50 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Chip = _interopRequireDefault(require("@material-ui/core/Chip"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function CoreTableToolBarChips(props) {
-  const {
-    activeFilters,
-    onDelete
-  } = props;
-  const filterKeys = Object.keys(activeFilters);
-  const chips = [];
-  filterKeys.forEach(key => {
-    chips.push({
-      id: key,
-      val: activeFilters[key]
-    });
-  });
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: 'inline'
-    }
-  }, chips.map((chip, i) => {
-    if (chip.val.length > 0) {
-      return /*#__PURE__*/_react.default.createElement(_Chip.default, {
-        color: "primary",
-        key: String(i),
-        style: {
-          marginRight: '.5em'
-        },
-        onDelete: () => onDelete(chip.id),
-        label: "".concat(chip.id.toUpperCase(), ": ").concat(chip.val)
-      });
-    }
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
-  }));
-}
-CoreTableToolBarChips.propTypes = {
-  onDelete: _propTypes.default.func.isRequired,
-  activeFilters: _propTypes.default.objectOf(_propTypes.default.string)
-};
-CoreTableToolBarChips.defaultProps = {
-  activeFilters: {}
-};
-var _default = exports.default = CoreTableToolBarChips;

package/dist/components/CoreTable/CoreTableHead.js

@@ -1,176 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _DetailsTwoTone = _interopRequireDefault(require("@material-ui/icons/DetailsTwoTone"));
-var _TableSortLabel = _interopRequireDefault(require("@material-ui/core/TableSortLabel"));
-var _InputAdornment = _interopRequireDefault(require("@material-ui/core/InputAdornment"));
-var _styles = require("@material-ui/core/styles");
-var _Details = _interopRequireDefault(require("@material-ui/icons/Details"));
-var _TableCell = _interopRequireDefault(require("@material-ui/core/TableCell"));
-var _TableHead = _interopRequireDefault(require("@material-ui/core/TableHead"));
-var _TableRow = _interopRequireDefault(require("@material-ui/core/TableRow"));
-var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
-var _Clear = _interopRequireDefault(require("@material-ui/icons/Clear"));
-var _Input = _interopRequireDefault(require("@material-ui/core/Input"));
-var _Menu = _interopRequireDefault(require("@material-ui/core/Menu"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const styles = () => ({
-  paperStyle: {
-    margin: '0px',
-    padding: '0px',
-    backgroundColor: 'lightgrey',
-    maxHeight: '2em',
-    overflow: 'hidden',
-    maxWidth: '14em'
-  }
-});
-const buttonStyle = {
-  margin: '0px',
-  padding: '0px',
-  border: '0px',
-  backgroundColor: 'lightgrey'
-};
-class CoreTableHead extends _react.Component {
-  constructor() {
-    super();
-    this.state = {};
-  }
-  componentDidMount() {
-    const displayList = {};
-    this.props.columns.forEach(column => {
-      displayList[column.id] = null;
-    });
-    this.setState({
-      displayList: displayList
-    });
-  }
-  toggleActive(columnID, e) {
-    if (this.state[columnID] === null) {
-      this.setState({
-        [columnID]: e.currentTarget
-      });
-    } else {
-      this.setState({
-        [columnID]: null
-      });
-    }
-  }
-  render() {
-    const {
-      sort,
-      columns,
-      rowCount,
-      selected,
-      onSelectAll,
-      onSort,
-      order,
-      orderBy,
-      multiSelect,
-      activeFilters,
-      classes
-    } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_TableHead.default, null, /*#__PURE__*/_react.default.createElement(_TableRow.default, null, multiSelect && /*#__PURE__*/_react.default.createElement(_TableCell.default, {
-      padding: "checkbox"
-    }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
-      color: "primary",
-      onChange: onSelectAll,
-      checked: selected > 0 && selected === rowCount,
-      indeterminate: selected > 0 && selected < rowCount
-    })), columns.map(column => {
-      let cell;
-      if (column.customHeader) {
-        cell = column.customHeader({
-          column: column
-        });
-      } else if (column.filter && activeFilters.hasOwnProperty(column.id)) {
-        cell = /*#__PURE__*/_react.default.createElement(_TableSortLabel.default, {
-          active: orderBy === column.id,
-          direction: order,
-          onClick: () => onSort(column.id)
-        }, /*#__PURE__*/_react.default.createElement("b", null, column.label ? column.label : ''), /*#__PURE__*/_react.default.createElement("div", {
-          id: "".concat(column.id, "menu")
-        }, activeFilters[column.id].length > 0 ? /*#__PURE__*/_react.default.createElement(_DetailsTwoTone.default, {
-          onClick: event => {
-            event.stopPropagation();
-            this.toggleActive(column.id, event);
-          }
-        }) : /*#__PURE__*/_react.default.createElement(_Details.default, {
-          onClick: event => {
-            event.stopPropagation();
-            this.toggleActive(column.id, event);
-          }
-        })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Menu.default, {
-          id: column.id,
-          anchorEl: this.state[column.id],
-          open: Boolean(this.state[column.id]),
-          classes: {
-            paper: classes.paperStyle
-          },
-          onClose: event => {
-            event.stopPropagation();
-            this.toggleActive(column.id, event);
-          },
-          disableAutoFocusItem: true
-        }, /*#__PURE__*/_react.default.createElement(_Input.default, {
-          margin: "none",
-          name: column.id,
-          id: "".concat(column.id, "input"),
-          value: activeFilters[column.id],
-          onChange: target => this.props.updateFilter(target),
-          onClick: event => event.stopPropagation(),
-          endAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
-            position: "start"
-          }, /*#__PURE__*/_react.default.createElement("button", {
-            style: buttonStyle,
-            type: "button"
-          }, /*#__PURE__*/_react.default.createElement(_Clear.default, {
-            onClick: e => {
-              e.stopPropagation();
-              this.toggleActive(column.id, e);
-            }
-          }))),
-          disableUnderline: true
-        }))));
-      } else {
-        cell = /*#__PURE__*/_react.default.createElement(_TableSortLabel.default, {
-          direction: order,
-          active: orderBy === column.id,
-          onClick: () => sort && column.label && column.label.length > 0 && onSort(column.id)
-        }, /*#__PURE__*/_react.default.createElement("b", null, column.label ? column.label : ''));
-      }
-      return /*#__PURE__*/_react.default.createElement(_TableCell.default, {
-        key: column.id,
-        style: column.style,
-        padding: column.disablePadding ? 'none' : 'default',
-        sortDirection: orderBy === column.id ? order : false
-      }, cell);
-    })));
-  }
-}
-CoreTableHead.propTypes = {
-  sort: _propTypes.default.bool,
-  multiSelect: _propTypes.default.bool,
-  onSort: _propTypes.default.func.isRequired,
-  order: _propTypes.default.string.isRequired,
-  orderBy: _propTypes.default.string.isRequired,
-  classes: _propTypes.default.shape().isRequired,
-  rowCount: _propTypes.default.number.isRequired,
-  selected: _propTypes.default.number.isRequired,
-  onSelectAll: _propTypes.default.func.isRequired,
-  updateFilter: _propTypes.default.func.isRequired,
-  activeFilters: _propTypes.default.objectOf(_propTypes.default.object),
-  columns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired
-};
-CoreTableHead.defaultProps = {
-  sort: true,
-  activeFilters: {},
-  multiSelect: false
-};
-var _default = exports.default = (0, _styles.withStyles)(styles)(CoreTableHead);

package/dist/components/CoreTable/CoreTableToolbar.js

@@ -1,108 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
-var _styles = require("@material-ui/core/styles");
-var _Toolbar = _interopRequireDefault(require("@material-ui/core/Toolbar"));
-var _reactIntl = require("react-intl");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _CoreTableChips = _interopRequireDefault(require("./CoreTableChips"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const styles = theme => ({
-  title: {
-    display: 'flex',
-    width: '100%',
-    height: '100%',
-    justifyContent: 'space-between'
-  },
-  icons: {
-    display: 'flex',
-    flexWrap: 'nowrap'
-  },
-  normal: {
-    background: 'lightgray',
-    color: 'black'
-  },
-  highlight: {
-    background: theme.palette.secondary.light,
-    color: theme.palette.secondary.contrastText
-  }
-});
-function CoreTableToolbar(props) {
-  const {
-    title,
-    selected,
-    customToolbar,
-    activeFilters,
-    handleChipDelete,
-    icons,
-    classes
-  } = props;
-  const toolBarConfig = () => {
-    if (customToolbar) {
-      return customToolbar({
-        title: title,
-        selected: selected,
-        classes: classes
-      });
-    }
-    if (Object.keys(activeFilters).length > 0) {
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: classes.title
-      }, selected.length > 0 || !title ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-        color: "inherit"
-      }, "".concat(selected.length, " "), /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
-        id: "__selected"
-      })), /*#__PURE__*/_react.default.createElement("div", {
-        className: classes.icon
-      }, /*#__PURE__*/_react.default.createElement(_CoreTableChips.default, {
-        activeFilters: activeFilters,
-        onDelete: id => handleChipDelete(id)
-      }), icons)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-        color: "inherit",
-        variant: "h6",
-        id: "tableTitle"
-      }, title), /*#__PURE__*/_react.default.createElement("div", {
-        className: classes.icon
-      }, /*#__PURE__*/_react.default.createElement(_CoreTableChips.default, {
-        activeFilters: activeFilters,
-        onDelete: id => handleChipDelete(id)
-      }), icons)));
-    }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: classes.title
-    }, selected.length > 0 || !title ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-      color: "inherit"
-    }, "".concat(selected.length, " "), /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
-      id: "__selected"
-    })), icons) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-      color: "inherit",
-      variant: "h6",
-      id: "tableTitle"
-    }, title), icons));
-  };
-  return /*#__PURE__*/_react.default.createElement(_Toolbar.default, {
-    variant: "dense",
-    className: selected.length > 0 ? classes.highlight : classes.normal
-  }, toolBarConfig());
-}
-CoreTableToolbar.propTypes = {
-  icons: _propTypes.default.node,
-  title: _propTypes.default.string,
-  customToolbar: _propTypes.default.func,
-  classes: _propTypes.default.shape().isRequired,
-  handleChipDelete: _propTypes.default.func.isRequired,
-  activeFilters: _propTypes.default.objectOf(_propTypes.default.string),
-  selected: _propTypes.default.arrayOf(_propTypes.default.string).isRequired
-};
-CoreTableToolbar.defaultProps = {
-  icons: null,
-  title: null,
-  activeFilters: {},
-  customToolbar: null
-};
-var _default = exports.default = (0, _styles.withStyles)(styles)(CoreTableToolbar);

package/dist/components/CoreTable/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _CoreTable.default;
-  }
-});
-var _CoreTable = _interopRequireDefault(require("./CoreTable"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/components/CoreTable/readMe.md

@@ -1,79 +0,0 @@
-# Core Table
-
-##_Core Table_ should be used for all tables in the application to give them a similar look and suite of features
-
-###_Core Table_ is made of three components:
-
-1. CoreTable
-   - Displays all the data
-2. CoreTableHead
-   - Contains column headers that allows you to order the data
-   - Contains the _filter_ icons, allowing you to filter data
-3. CoreTableToolbar
-   - Contains the title of the Table and any icons
-   - If the table is being filtered, chips with the filter keywords appear here
-   - The Toolbar can also display data on if/how many items are selected
-
-_CoreTable_ takes in the following props:
-
-1. id
-
-   - Type: _String_
-   - Required: **Yes**
-   - Used for identifying table
-
-2. title
-
-   - Type: _String_
-   - Required: **Yes**
-   - Displays in Toolbar
-
-3. columns
-
-   - Type: _Array_
-   - Required: **Yes**
-   - Used to determine header titles as well as column info
-   - An array of objects, one object per column you want in the table, each object should have:
-
-     1. id: _String_, this needs to match the id for each piece of data you pass in inside of the **data** prop. The ids are used to match each rows data to the correct column
-
-     2. align: _String_, use one of: _left, right, center_ to determine how the contents of the column should align
-     3. label: _String_, will be the column header
-     4. filter: _Boolean_, use to determine if you want this column to have a filter or not **(you can also use 'text' instead of a bool, we hope to add different filter types at some point)**
-
-   - **Custom** you can also pass a custom cell to the column through something like: `javascript { id: 'custom', customCell: custom => this.customCell(custom) }` and then pass a function that inserts an edit icon into every row
-
-4. data
-
-   - Type: _Array_
-   - Required: **Yes**
-   - This is an array of objects that will get displayed in the table, think of each object as a "row", each piece of data will be sorted by key, so if a key is 'time' it will match with the column that has an id of 'time'
-
-5. multiSelect
-
-   - Type: _Boolean_
-   - Required: No
-   - This determines if the table has multi-select properties, defaults to false
-
-6. hover
-
-   - Type: _Boolean_
-   - Required: No
-   - Determines if rows highlight on hover, defaults to false
-
-7. icons
-
-   - Type: _Component_
-   - Required: No
-   - Feed this a component for it to appear in the left of the toolbar, must be one parent, unlimited children. Defaults to an empty `<span/>`
-
-8. customToolbar
-
-   - Type: _Function_
-   - Required: No
-   - Similar to customeCell, you can pass your own toolbar with `customToolbar: custom => this.customToolbar(custom)`, note that this replaces the defualt toolbar and all it's functionality
-
-9. customHeader
-   - Type: _Function_
-   - Required: No
-   - Similar to customeCell, you can pass your own header with `customHeader: custom => this.customHeader(custom)`, note that this replaces the defualt header and all it's functionality