versacall-core-library-react 2.0.30 → 2.0.34

package/dist/components/CoreSideBar/CoreSideBarDrawer.js

@@ -37,6 +37,8 @@ var _functions = require("../../functions");
 
 var _context = require("../../context");
 
+var _scrollbarModule = _interopRequireDefault(require("../../css/scrollbar.module.css"));
+
 require("../../css/scrollbar.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -161,7 +163,7 @@ function (_Component) {
       return _react.default.createElement(_Drawer.default, {
         open: open,
         classes: {
-          paper: classes.drawerPaper
+          paper: "".concat(classes.drawerPaper, " ").concat(_scrollbarModule.default.scroll, " ").concat(_scrollbarModule.default.white)
         },
         onClose: function onClose() {
           return _this3.props.onClose();

package/dist/components/CoreTable/CoreTable.js

@@ -15,10 +15,14 @@ var _TableRow = _interopRequireDefault(require("@material-ui/core/TableRow"));
 
 var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
 
+var _CircularProgress = _interopRequireDefault(require("@material-ui/core/CircularProgress"));
+
 var _Table = _interopRequireDefault(require("@material-ui/core/Table"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _reactIntl = require("react-intl");
+
 var _CoreTableToolbar = _interopRequireDefault(require("./CoreTableToolbar"));
 
 var _CoreTableHead = _interopRequireDefault(require("./CoreTableHead"));
@@ -284,7 +288,8 @@ function (_Component) {
           hover = _this$props.hover,
           toolBarIcons = _this$props.toolBarIcons,
           activeRow = _this$props.activeRow,
-          flaggedRows = _this$props.flaggedRows;
+          flaggedRows = _this$props.flaggedRows,
+          loading = _this$props.loading;
       var _this$state = this.state,
           selected = _this$state.selected,
           order = _this$state.order,
@@ -356,7 +361,33 @@ function (_Component) {
         }
 
         return _react.default.createElement(_react.default.Fragment, null);
-      }))));
+      }))), loading && _react.default.createElement("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          paddingTop: 20,
+          paddingBottom: 20
+        }
+      }, _react.default.createElement("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center'
+        }
+      }, _react.default.createElement(_CircularProgress.default, {
+        color: "secondary",
+        style: {
+          marginRight: 20
+        }
+      }), _react.default.createElement("span", {
+        style: {
+          fontSize: '26px',
+          fontStyle: 'italic',
+          color: 'rgba(0,0,0,0.6)'
+        }
+      }, _react.default.createElement(_reactIntl.FormattedMessage, {
+        id: "__loading"
+      }), "\u2026"))));
     }
   }]);
 
@@ -375,7 +406,8 @@ CoreTable.propTypes = {
   id: _propTypes.default.string.isRequired,
   flaggedRows: _propTypes.default.arrayOf(_propTypes.default.string),
   data: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
-  columns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired
+  columns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
+  loading: _propTypes.default.bool
 };
 CoreTable.defaultProps = {
   title: '',
@@ -386,7 +418,8 @@ CoreTable.defaultProps = {
   onRowClick: null,
   multiSelect: false,
   customToolbar: null,
-  toolBarIcons: _react.default.createElement("span", null)
+  toolBarIcons: _react.default.createElement("span", null),
+  loading: false
 };
 var _default = CoreTable;
 exports.default = _default;

package/dist/components/CoreTimerInput/CoreTimerInput.js

@@ -7,9 +7,7 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _InputAdornment = _interopRequireDefault(require("@material-ui/core/InputAdornment"));
-
-var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
+var _InputBase = _interopRequireDefault(require("@material-ui/core/InputBase"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -19,12 +17,49 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-var CoreTimerInput = function CoreTimerInput(_ref) {
-  var time = _ref.time,
-      handleUpdateTime = _ref.handleUpdateTime,
-      showSeconds = _ref.showSeconds,
-      showHours = _ref.showHours,
-      style = _ref.style;
+var muiStyle = {
+  styleBox: {
+    position: 'relative',
+    borderStyle: 'solid',
+    borderWidth: 1,
+    borderColor: 'rgba(0, 0, 0, 0.23)',
+    borderRadius: 4,
+    paddingTop: 11,
+    paddingBottom: 11,
+    paddingLeft: 10 // padding: 10,
+
+  },
+  label: {
+    fontSize: '1rem',
+    padding: 0,
+    paddingLeft: 6,
+    paddingRight: 6,
+    lineHeight: 1,
+    zIndex: 1,
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    transformOrigin: 'top left',
+    transform: 'translate(8px, -6px) scale(0.75)',
+    backgroundColor: 'white',
+    color: 'rgba(0, 0, 0, 0.6)'
+  },
+  unitLabel: {
+    marginRight: 10,
+    color: 'rgba(0, 0, 0, 0.4)',
+    fontSize: 'smaller'
+  }
+};
+
+function CoreTimerInput(props) {
+  var label = props.label,
+      time = props.time,
+      handleUpdateTime = props.handleUpdateTime,
+      showSeconds = props.showSeconds,
+      showMinutes = props.showMinutes,
+      showHours = props.showHours,
+      margin = props.margin,
+      style = props.style;
   var hours = 0;
   var min = 0;
   var sec = time;
@@ -66,96 +101,118 @@ var CoreTimerInput = function CoreTimerInput(_ref) {
     return handleUpdateTime(Math.abs(newTime));
   };
 
-  return _react.default.createElement("span", {
-    style: _objectSpread({
+  function formatValue(value) {
+    var str = value.toString();
+
+    if (str.length === 1) {
+      return "0".concat(str);
+    }
+
+    return str;
+  }
+
+  function getMarginStyle() {
+    if (margin === 'normal') {
+      return {
+        marginTop: 16,
+        marginBottom: 8
+      };
+    }
+
+    if (margin === 'dense') {
+      return {
+        paddingTop: 3,
+        paddingBottom: 3,
+        marginTop: 8,
+        marginBottom: 4
+      };
+    }
+
+    return {};
+  }
+
+  return _react.default.createElement("div", {
+    style: _objectSpread({}, muiStyle.styleBox, getMarginStyle(), style)
+  }, label && _react.default.createElement("span", {
+    style: muiStyle.label
+  }, label), _react.default.createElement("span", {
+    style: {
       display: 'flex',
-      justifyContent: 'space-between'
-    }, style)
-  }, showHours && _react.default.createElement(_TextField.default, {
+      alignItems: 'center'
+    }
+  }, showHours && _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("span", {
+    style: muiStyle.unitLabel
+  }, "H"), _react.default.createElement("div", {
+    style: {
+      flexGrow: 1,
+      paddingRight: 10
+    }
+  }, _react.default.createElement(_InputBase.default, {
     id: "hoursInput",
-    value: hours,
+    value: formatValue(hours),
     onChange: function onChange(event) {
       return handleChange(event.target.value, 'hours');
     },
     type: "number",
-    style: {
-      width: '32%'
-    },
-    InputLabelProps: {
-      shrink: true
-    },
-    InputProps: {
-      startAdornment: _react.default.createElement(_InputAdornment.default, {
-        position: "start"
-      }, "H")
-    },
     inputProps: {
       min: '0'
-    },
-    margin: "normal",
-    variant: "outlined"
-  }), _react.default.createElement(_TextField.default, {
+    }
+  }))), showMinutes && _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("span", {
+    style: muiStyle.unitLabel
+  }, "M"), _react.default.createElement("div", {
+    style: {
+      flexGrow: 1,
+      paddingRight: 10
+    }
+  }, _react.default.createElement(_InputBase.default, {
     id: "minutesInput",
-    value: min,
+    value: formatValue(min),
     onChange: function onChange(event) {
       return handleChange(event.target.value, 'min');
     },
     type: "number",
-    style: {
-      width: '32%'
-    },
-    InputLabelProps: {
-      shrink: true
-    },
-    InputProps: {
-      startAdornment: _react.default.createElement(_InputAdornment.default, {
-        position: "start"
-      }, "M")
-    },
     inputProps: {
       min: '0'
-    },
-    margin: "normal",
-    variant: "outlined"
-  }), showSeconds && _react.default.createElement(_TextField.default, {
+    }
+  }))), showSeconds && _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("span", {
+    style: muiStyle.unitLabel
+  }, "S"), _react.default.createElement("div", {
+    style: {
+      flexGrow: 1,
+      paddingRight: 10
+    }
+  }, _react.default.createElement(_InputBase.default, {
     id: "secondsInput",
-    value: sec,
+    value: formatValue(sec),
     onChange: function onChange(event) {
       return handleChange(event.target.value, 'sec');
     },
     type: "number",
-    style: {
-      width: '32%'
-    },
-    InputLabelProps: {
-      shrink: true
-    },
-    InputProps: {
-      startAdornment: _react.default.createElement(_InputAdornment.default, {
-        position: "start"
-      }, "S")
-    },
     inputProps: {
       min: '0'
-    },
-    margin: "normal",
-    variant: "outlined"
-  })); // should take prop for time in seconds
+    }
+  }))))); // should take prop for time in seconds
   // should take a handleChange function
   // pull the event target value and then update the time with that * seconds
   // might wanna move this coreLibrary after
-};
+}
 
 CoreTimerInput.propTypes = {
+  label: _propTypes.default.string,
   time: _propTypes.default.number.isRequired,
   handleUpdateTime: _propTypes.default.func.isRequired,
   showSeconds: _propTypes.default.bool,
+  showMinutes: _propTypes.default.bool,
   showHours: _propTypes.default.bool,
+  margin: _propTypes.default.string,
   style: _propTypes.default.objectOf(_propTypes.default.string)
 };
 CoreTimerInput.defaultProps = {
+  label: null,
   showSeconds: true,
+  showMinutes: true,
   showHours: true,
+  margin: 'none',
   style: {}
 };
 var _default = CoreTimerInput;

package/dist/components/CoreTimerInput/CoreTimerInputOld.js

@@ -0,0 +1,162 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _InputAdornment = _interopRequireDefault(require("@material-ui/core/InputAdornment"));
+
+var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var CoreTimerInputOld = function CoreTimerInputOld(_ref) {
+  var time = _ref.time,
+      handleUpdateTime = _ref.handleUpdateTime,
+      showSeconds = _ref.showSeconds,
+      showHours = _ref.showHours,
+      style = _ref.style;
+  var hours = 0;
+  var min = 0;
+  var sec = time;
+
+  var getTime = function getTime() {
+    hours = Math.floor(sec / 3600);
+    sec -= hours * 3600;
+    min = Math.floor(sec / 60);
+    sec -= min * 60;
+  }; // 1000
+  // divde by 360 get 2.777
+  // math.floor(2.7) = hours
+  // 1000 - hours * 360
+  // 280 divide by 60  get 4.6
+  // math.floor(4.6) = min
+  // 280 - min * 60 = seconds
+
+
+  getTime();
+
+  var handleChange = function handleChange(value, type) {
+    var newTime = time;
+
+    if (type === 'hours' && value < 24) {
+      newTime -= hours * 3600;
+      newTime += 3600 * value;
+    }
+
+    if (type === 'min' && value < 60) {
+      newTime -= min * 60;
+      newTime += 60 * value;
+    }
+
+    if (type === 'sec' && value < 60) {
+      newTime -= sec;
+      newTime += 1 * value; // added the 1 to convert value to int
+    }
+
+    return handleUpdateTime(Math.abs(newTime));
+  };
+
+  return _react.default.createElement("span", {
+    style: _objectSpread({
+      display: 'flex',
+      justifyContent: 'space-between'
+    }, style)
+  }, showHours && _react.default.createElement(_TextField.default, {
+    id: "hoursInput",
+    value: hours,
+    onChange: function onChange(event) {
+      return handleChange(event.target.value, 'hours');
+    },
+    type: "number",
+    style: {
+      width: '32%'
+    },
+    InputLabelProps: {
+      shrink: true
+    },
+    InputProps: {
+      startAdornment: _react.default.createElement(_InputAdornment.default, {
+        position: "start"
+      }, "H")
+    },
+    inputProps: {
+      min: '0'
+    },
+    margin: "normal",
+    variant: "outlined"
+  }), _react.default.createElement(_TextField.default, {
+    id: "minutesInput",
+    value: min,
+    onChange: function onChange(event) {
+      return handleChange(event.target.value, 'min');
+    },
+    type: "number",
+    style: {
+      width: '32%'
+    },
+    InputLabelProps: {
+      shrink: true
+    },
+    InputProps: {
+      startAdornment: _react.default.createElement(_InputAdornment.default, {
+        position: "start"
+      }, "M")
+    },
+    inputProps: {
+      min: '0'
+    },
+    margin: "normal",
+    variant: "outlined"
+  }), showSeconds && _react.default.createElement(_TextField.default, {
+    id: "secondsInput",
+    value: sec,
+    onChange: function onChange(event) {
+      return handleChange(event.target.value, 'sec');
+    },
+    type: "number",
+    style: {
+      width: '32%'
+    },
+    InputLabelProps: {
+      shrink: true
+    },
+    InputProps: {
+      startAdornment: _react.default.createElement(_InputAdornment.default, {
+        position: "start"
+      }, "S")
+    },
+    inputProps: {
+      min: '0'
+    },
+    margin: "normal",
+    variant: "outlined"
+  })); // should take prop for time in seconds
+  // should take a handleChange function
+  // pull the event target value and then update the time with that * seconds
+  // might wanna move this coreLibrary after
+};
+
+CoreTimerInputOld.propTypes = {
+  time: _propTypes.default.number.isRequired,
+  handleUpdateTime: _propTypes.default.func.isRequired,
+  showSeconds: _propTypes.default.bool,
+  showHours: _propTypes.default.bool,
+  style: _propTypes.default.objectOf(_propTypes.default.string)
+};
+CoreTimerInputOld.defaultProps = {
+  showSeconds: true,
+  showHours: true,
+  style: {}
+};
+var _default = CoreTimerInputOld;
+exports.default = _default;

package/dist/components/CoreToolbar/CoreToolbar.js

@@ -78,7 +78,8 @@ function CoreToolbar(props) {
   var title = props.title,
       warning = props.warning,
       intl = props.intl,
-      classes = props.classes;
+      classes = props.classes,
+      showSeperator = props.showSeperator;
   return _react.default.createElement(_Toolbar.default, null, props.icon, _react.default.createElement(_Typography.default, {
     variant: "h6",
     color: "inherit",
@@ -100,7 +101,7 @@ function CoreToolbar(props) {
     className: classes.iconStyle
   }), _react.default.createElement(_reactIntl.FormattedMessage, {
     id: "__print"
-  })), (props.handlePrint || props.children) && (props.handleSave || props.handleClose) && _react.default.createElement("div", {
+  })), (props.handlePrint || props.children) && (props.handleSave || props.handleClose) && showSeperator && _react.default.createElement("div", {
     className: classes.separator
   }), props.handleSave && _react.default.createElement(_Button.default, {
     variant: "contained",
@@ -150,6 +151,7 @@ CoreToolbar.propTypes = {
   printDisabled: _propTypes.default.bool,
   saveDisabled: _propTypes.default.bool,
   closeDisabled: _propTypes.default.bool,
+  showSeperator: _propTypes.default.bool,
   intl: _propTypes.default.shape().isRequired,
   classes: _propTypes.default.shape().isRequired,
   children: _propTypes.default.node
@@ -164,6 +166,7 @@ CoreToolbar.defaultProps = {
   printDisabled: false,
   saveDisabled: false,
   closeDisabled: false,
+  showSeperator: true,
   children: null
 };
 

package/dist/components/CoreTranslate/translations/en.json

@@ -195,6 +195,7 @@
   "__layout": "Layout",
   "__left": "Left",
   "__left_flex_start": "Left (flex-start)",
+  "__loading": "Loading",
   "__location": "Location",
   "__locations": "Locations",
   "__lock": "Lock",

package/dist/css/scrollbar.module.css

@@ -1,6 +1,7 @@
 /* width */
 .scroll::-webkit-scrollbar {
   width: 10px;
+  height: 10px;
 }
 /* Track */
 .scroll::-webkit-scrollbar-track {
@@ -19,6 +20,7 @@
 /* width */
 .scroll.white::-webkit-scrollbar {
   width: 10px;
+  height: 10px;
 }
 /* Track */
 .scroll.white::-webkit-scrollbar-track {

package/package.json

@@ -2,10 +2,10 @@
   "versacall": {
     "title": "Versacall Core Library React",
     "applicationType": "react-library",
-    "build": 30
+    "build": 34
   },
   "name": "versacall-core-library-react",
-  "version": "2.0.30",
+  "version": "2.0.34",
   "description": "Versacall Core Library",
   "main": "dist/index.js",
   "module": "dist/index.js",