versacall-core-library-react 2.0.32 → 2.0.36

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/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/context/Channels/ChannelsConsumer.js

@@ -55,7 +55,7 @@ function (_Component) {
   _createClass(ChannelsConsumer, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      this.props.channels.registerHandlers(this.props.id, this.props.handler, this.props.connectionChanged);
+      this.props.channels.registerHandlers(this.props.id, this.props.handler, this.props.connectionChanged, this.props.subscribing);
     }
   }, {
     key: "componentWillUnmount",
@@ -77,11 +77,13 @@ ChannelsConsumer.propTypes = {
   id: _propTypes.default.string.isRequired,
   handler: _propTypes.default.func.isRequired,
   connectionChanged: _propTypes.default.func,
+  subscribing: _propTypes.default.func,
   addDefaultChannels: _propTypes.default.bool,
   channels: _propTypes.default.objectOf(_propTypes.default.func).isRequired
 };
 ChannelsConsumer.defaultProps = {
   connectionChanged: null,
+  subscribing: null,
   addDefaultChannels: true,
   children: null
 };

package/dist/context/Channels/ChannelsProvider.js

@@ -44,6 +44,7 @@ var channelInformation = [];
 var channelFunctions = [];
 var handlers = [];
 var connectionChangedHandlers = [];
+var subscribingHandlers = [];
 var client;
 
 function compareChannelInfo(ci1, ci2) {
@@ -70,7 +71,7 @@ function compareChannelInfo(ci1, ci2) {
   return true;
 }
 
-var _registerHandlers = function registerHandlers(id, handler, connectionChanged) {
+var _registerHandlers = function registerHandlers(id, handler, connectionChanged, subscribing) {
   var existing = handlers.find(function (x) {
     return x.id === id;
   });
@@ -98,6 +99,21 @@ var _registerHandlers = function registerHandlers(id, handler, connectionChanged
       });
     }
   }
+
+  if (subscribing) {
+    var existingSubscribing = subscribingHandlers.find(function (x) {
+      return x.id === id;
+    });
+
+    if (existing !== undefined) {
+      existingSubscribing.handler = subscribing;
+    } else {
+      subscribingHandlers.push({
+        id: id,
+        handle: subscribing
+      });
+    }
+  }
 };
 
 var _unregisterHandlers = function unregisterHandlers(id) {
@@ -116,6 +132,14 @@ var _unregisterHandlers = function unregisterHandlers(id) {
   if (existingConnectionChanged !== undefined) {
     connectionChangedHandlers.splice(connectionChangedHandlers.indexOf(existingConnectionChanged), 1);
   }
+
+  var existingSubscribing = subscribingHandlers.find(function (x) {
+    return x.id === id;
+  });
+
+  if (existingSubscribing !== undefined) {
+    subscribingHandlers.splice(subscribingHandlers.indexOf(existingSubscribing), 1);
+  }
 };
 
 var _registerChannel = function registerChannel(id, _channelFunction) {
@@ -167,6 +191,12 @@ var notifyConnectionChanged = function notifyConnectionChanged(connected) {
   });
 };
 
+var notifySubscribing = function notifySubscribing(channel) {
+  subscribingHandlers.forEach(function (x) {
+    x.handler(channel);
+  });
+};
+
 var ChannelsProvider =
 /*#__PURE__*/
 function (_Component) {
@@ -303,17 +333,18 @@ function (_Component) {
     key: "subscribe",
     value: function subscribe(channelInfo) {
       var methodName = 'subscribe()';
-      this.props.core.log('system', namespace, methodName, 'Subscribing', channelInfo);
+      this.props.core.log('system', namespace, methodName, "Subscribing to ".concat(channelInfo.channelName));
       client.subscribe({
         key: channelInfo.channelKey,
         channel: channelInfo.channelName
       });
+      notifySubscribing(channelInfo.channelName);
     }
   }, {
     key: "unsubscribe",
     value: function unsubscribe(channelInfo) {
       var methodName = 'unsubscribe()';
-      this.props.core.log('system', namespace, methodName, 'Unsubscribing', channelInfo);
+      this.props.core.log('system', namespace, methodName, "Unsubscribing from ".concat(channelInfo.channelName));
       client.unsubscribe({
         key: channelInfo.channelKey,
         channel: channelInfo.channelName
@@ -344,8 +375,8 @@ function (_Component) {
           updateChannel: function updateChannel(id, data) {
             return _this5.updateChannel(id, data);
           },
-          registerHandlers: function registerHandlers(id, handler, connectionChanged) {
-            return _registerHandlers(id, handler, connectionChanged);
+          registerHandlers: function registerHandlers(id, handler, connectionChanged, subscribing) {
+            return _registerHandlers(id, handler, connectionChanged, subscribing);
           },
           registerChannel: function registerChannel(id, channelFunction) {
             return _registerChannel(id, channelFunction);

package/package.json

@@ -2,10 +2,10 @@
   "versacall": {
     "title": "Versacall Core Library React",
     "applicationType": "react-library",
-    "build": 32
+    "build": 36
   },
   "name": "versacall-core-library-react",
-  "version": "2.0.32",
+  "version": "2.0.36",
   "description": "Versacall Core Library",
   "main": "dist/index.js",
   "module": "dist/index.js",