@plusscommunities/pluss-core-web 1.6.18 → 1.6.19-beta.1

package/dist/index.cjs.js

@@ -23,6 +23,7 @@ var reactCsv = require('react-csv');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var reactColor = require('react-color');
 var tinycolor = require('tinycolor2');
+var recharts = require('recharts');
 var reactRouterDom = require('react-router-dom');
 var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
 
@@ -356,6 +357,44 @@ var session = /*#__PURE__*/Object.freeze({
   isTVEnabled: isTVEnabled
 });
 
+// Distinct colour palette for multi-site comparison charts
+const SITE_COLOURS = ["#5e9efc",
+// Blue
+"#49bdbb",
+// Teal
+"#ff8c75",
+// Tangerine
+"#6e79c5",
+// Purple
+"#00cc9c",
+// Green
+"#c02743",
+// Red
+"#bdbd27",
+// Citron
+"#191e78",
+// Dark Blue
+"#ff6363",
+// Grapefruit
+"#536280" // Dusk
+];
+const getSiteColour = index => {
+  return SITE_COLOURS[index % SITE_COLOURS.length];
+};
+const fetchMultiSiteData = async (sites, fetchFn) => {
+  const results = {};
+  const promises = sites.map(async site => {
+    try {
+      const data = await fetchFn(site);
+      results[site] = data;
+    } catch (error) {
+      console.log("fetchMultiSiteData failed for site ".concat(site, ":"), error);
+      results[site] = null;
+    }
+  });
+  await Promise.all(promises);
+  return results;
+};
 const compileStats = stats => {
   const totalStats = {};
   Object.keys(stats).forEach(id => {
@@ -405,33 +444,33 @@ const getInsight = (stats, previousStats, source, key, activity) => {
 };
 const getAnalyticsFilterOptions = () => {
   return [{
-    text: 'Yesterday',
+    text: "Yesterday",
     dayCount: 1,
-    prevText: 'day before'
+    prevText: "day before"
   }, {
-    text: 'Last 7 days',
+    text: "Last 7 days",
     dayCount: 7,
-    prevText: 'previous 7 days'
+    prevText: "previous 7 days"
   }, {
-    text: 'Last 14 days',
+    text: "Last 14 days",
     dayCount: 14,
-    prevText: 'previous 14 days'
+    prevText: "previous 14 days"
   }, {
-    text: 'Last 30 days',
+    text: "Last 30 days",
     dayCount: 30,
-    prevText: 'previous 30 days'
+    prevText: "previous 30 days"
   }, {
-    text: 'Last 90 days',
+    text: "Last 90 days",
     dayCount: 90,
-    prevText: 'previous 90 days'
+    prevText: "previous 90 days"
   }, {
-    text: 'Last 365 days',
+    text: "Last 365 days",
     dayCount: 365,
-    prevText: 'previous 365 days'
+    prevText: "previous 365 days"
   }, {
-    text: 'Custom Range',
+    text: "Custom Range",
     dayCount: 0,
-    prevText: 'previous * days'
+    prevText: "previous * days"
   }];
 };
 const countActivities = (data, activityKey, countType) => {
@@ -442,19 +481,19 @@ const countActivities = (data, activityKey, countType) => {
     for (const entity in stats) {
       const entityStats = stats[entity];
       switch (countType) {
-        case 'unique':
+        case "unique":
           if (entityStats[activityKey]) {
             set.add(entity);
           }
           break;
-        case 'uniquearray':
+        case "uniquearray":
           if (entityStats[activityKey]) {
             ___default["default"].values(entityStats[activityKey]).forEach(value => {
               set.add(value);
             });
           }
           break;
-        case 'total':
+        case "total":
           if (entityStats[activityKey]) {
             count += entityStats[activityKey];
           }
@@ -463,23 +502,23 @@ const countActivities = (data, activityKey, countType) => {
     }
   });
   switch (countType) {
-    case 'unique':
-    case 'uniquearray':
+    case "unique":
+    case "uniquearray":
       console.log(countType, set);
       return set.size;
-    case 'total':
+    case "total":
       return count;
     default:
       return 0;
   }
 };
 const generateDateRangeObjects = function (startTime, endTime) {
-  let groupBy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'day';
+  let groupBy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "day";
   const startDate = moment__default["default"](startTime);
   const endDate = moment__default["default"](endTime);
   const dates = {};
   while (startDate.isSameOrBefore(endDate)) {
-    const dateString = startDate.format('DD-MM-YYYY');
+    const dateString = startDate.format("DD-MM-YYYY");
     dates[dateString] = {
       Date: dateString,
       Timestamp: startDate.valueOf(),
@@ -490,28 +529,28 @@ const generateDateRangeObjects = function (startTime, endTime) {
   return dates;
 };
 const generateDateActivities = function (data, activityKey, countType, startTime, endTime) {
-  let groupBy = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 'day';
+  let groupBy = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : "day";
   const dates = generateDateRangeObjects(startTime, endTime, groupBy);
   const result = [];
-  let formatToUse = 'DD-MM-YYYY';
-  let labelFormat = 'D MMM';
+  let formatToUse = "DD-MM-YYYY";
+  let labelFormat = "D MMM";
   switch (groupBy) {
-    case 'month':
-      formatToUse = 'MM-YYYY';
-      labelFormat = 'MMMM';
+    case "month":
+      formatToUse = "MM-YYYY";
+      labelFormat = "MMMM";
       break;
-    case 'week':
-      formatToUse = 'w-gggg';
-      labelFormat = '[Week of] D MMM';
+    case "week":
+      formatToUse = "w-gggg";
+      labelFormat = "[Week of] D MMM";
       break;
   }
   Object.keys(dates).forEach(d => {
     const datesToUse = ___default["default"].filter(data, date => {
-      return moment__default["default"](date.Date, 'DD-MM-YYYY').format(formatToUse) === moment__default["default"](d, 'DD-MM-YYYY').format(formatToUse);
+      return moment__default["default"](date.Date, "DD-MM-YYYY").format(formatToUse) === moment__default["default"](d, "DD-MM-YYYY").format(formatToUse);
     }) || [dates[d]];
     const compiledValue = {
       date: d,
-      label: moment__default["default"](d, 'DD-MM-YYYY').format(labelFormat),
+      label: moment__default["default"](d, "DD-MM-YYYY").format(labelFormat),
       value: countActivities(datesToUse, activityKey, countType)
     };
     result.push(compiledValue);
@@ -522,6 +561,8 @@ const generateDateActivities = function (data, activityKey, countType, startTime
 
 var analytics = /*#__PURE__*/Object.freeze({
   __proto__: null,
+  getSiteColour: getSiteColour,
+  fetchMultiSiteData: fetchMultiSiteData,
   compileStats: compileStats,
   getInsight: getInsight,
   getAnalyticsFilterOptions: getAnalyticsFilterOptions,
@@ -701,8 +742,8 @@ const randomString = () => {
   });
 };
 
-function ownKeys$l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$m(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$m(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$m(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$m(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const toParagraphed = (text, style) => {
   if (!text) return text;
   text = text.replace(/\t/g, '\u00a0\u00a0\u00a0\u00a0');
@@ -710,7 +751,7 @@ const toParagraphed = (text, style) => {
   return ___default["default"].map(textSplit, (t, i) => {
     return /*#__PURE__*/React__default["default"].createElement("span", {
       key: "paragraph_".concat(i),
-      style: _objectSpread$l({
+      style: _objectSpread$m({
         display: 'block'
       }, style)
     }, t || '\u00A0');
@@ -1161,8 +1202,8 @@ const addRecentlyCreated = feature => {
 const analyticsActions = {
   log: (site, actionType, entityType, entityId, data) => {
     return authedFunction({
-      method: 'POST',
-      url: getUrl('analytics', 'log'),
+      method: "POST",
+      url: getUrl("analytics", "log"),
       data: {
         site,
         actionType,
@@ -1174,14 +1215,18 @@ const analyticsActions = {
   },
   getEntityStats: (entityId, entityType) => {
     return authedFunction({
-      method: 'GET',
-      url: getUrl('analytics', 'getentity', {
+      method: "GET",
+      url: getUrl("analytics", "getentity", {
         entityId,
         entityType
       })
     });
   },
-  getActivityLog: (entityId, entityType, actionType, minTime, maxTime) => {
+  getActivityLog: function (entityId, entityType, actionType, minTime, maxTime) {
+    let {
+      userType,
+      userCategory
+    } = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
     const query = {
       entityId,
       entityType,
@@ -1193,32 +1238,53 @@ const analyticsActions = {
     if (maxTime) {
       query.maxTime = maxTime;
     }
+    if (userType) query.userType = userType;
+    if (userCategory) query.userCategory = userCategory;
     return authedFunction({
-      method: 'GET',
-      url: getUrl('analytics', 'activity', query)
+      method: "GET",
+      url: getUrl("analytics", "activity", query)
     });
   },
   getAggregateUserStats: site => {
     return authedFunction({
-      method: 'GET',
-      url: getUrl('analytics', 'users', {
+      method: "GET",
+      url: getUrl("analytics", "users", {
         site
       })
     });
   },
-  getAggregateEntityStats: (site, type, minTime, maxTime, raw) => {
+  getAggregateEntityStats: function (site, type, minTime, maxTime, raw) {
+    let {
+      userType,
+      userCategory
+    } = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
     const query = {
       site,
       type,
       minTime,
       maxTime
     };
-    if (raw) {
-      query.raw = raw;
-    }
+    if (raw) query.raw = raw;
+    if (userType) query.userType = userType;
+    if (userCategory) query.userCategory = userCategory;
     return authedFunction({
-      method: 'GET',
-      url: getUrl('analytics', 'aggregate', query)
+      method: "GET",
+      url: getUrl("analytics", "aggregate", query)
+    });
+  },
+  getUserRetention: function (site) {
+    let {
+      userType,
+      userCategory
+    } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    const query = {
+      site
+    };
+    if (userType) query.userType = userType;
+    if (userCategory) query.userCategory = userCategory;
+    return authedFunction({
+      method: "GET",
+      url: getUrl("analytics", "get/userretention", query)
     });
   }
 };
@@ -1565,8 +1631,8 @@ const fileActions = {
   }
 };
 
-function ownKeys$k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const typeActions = {
   getSubdomains: () => {
     return authedFunction({
@@ -1642,7 +1708,7 @@ const typeActions = {
     const request = {
       method: 'POST',
       url,
-      data: _objectSpread$k({
+      data: _objectSpread$l({
         siteName
       }, options)
     };
@@ -1748,7 +1814,7 @@ const typeActions = {
     return authedFunction({
       method: 'POST',
       url: getUrl('types', 'site/edit'),
-      data: _objectSpread$k({
+      data: _objectSpread$l({
         Id: site
       }, values)
     });
@@ -2290,8 +2356,8 @@ var index$2 = /*#__PURE__*/Object.freeze({
   scheduledActionsActions: scheduledActionsActions
 });
 
-function ownKeys$j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const usersUpdate = site => {
   return dispatch => {
     userActions.fetchUsers(site).then(res => {
@@ -2301,7 +2367,7 @@ const usersUpdate = site => {
           const users = res.data.results.Items;
           const allList = [];
           Object.keys(users).forEach(userId => {
-            allList.push(_objectSpread$j(_objectSpread$j({}, users[userId]), {}, {
+            allList.push(_objectSpread$k(_objectSpread$k({}, users[userId]), {}, {
               id: userId
             }));
           });
@@ -3458,8 +3524,8 @@ class Attachment extends React.Component {
   }
 }
 
-function ownKeys$i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class Button extends React.Component {
   getClasses() {
     let string = '';
@@ -3512,20 +3578,20 @@ class Button extends React.Component {
   render() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "buttonWrapper ".concat(this.getClasses()),
-      style: _objectSpread$i({}, this.props.buttonStyle)
+      style: _objectSpread$j({}, this.props.buttonStyle)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       onClick: () => this.buttonClick(),
       className: this.getButtonClasses(),
-      style: _objectSpread$i({}, this.props.style)
+      style: _objectSpread$j({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.getButtonTextClasses(),
-      style: _objectSpread$i({}, this.props.textStyle)
+      style: _objectSpread$j({}, this.props.textStyle)
     }, this.renderLeftIcon(), this.props.children)));
   }
 }
 
-function ownKeys$h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class CheckBox extends React.PureComponent {
   constructor() {
     super(...arguments);
@@ -3569,7 +3635,7 @@ class CheckBox extends React.PureComponent {
       className: this.props.className
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.props.showWarning ? 'checkBox--error' : null,
-      style: _objectSpread$h(_objectSpread$h({}, styles$9.row), this.props.style)
+      style: _objectSpread$i(_objectSpread$i({}, styles$9.row), this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.generateClassNames(),
       onClick: this.onChange,
@@ -3581,7 +3647,7 @@ class CheckBox extends React.PureComponent {
       name: 'check'
     }))), !___default["default"].isEmpty(this.props.label) && /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.getLabelClasses(),
-      style: _objectSpread$h({
+      style: _objectSpread$i({
         marginLeft: 8,
         fontSize: 14,
         lineHeight: '20px'
@@ -3613,13 +3679,13 @@ class Text extends React.Component {
   }
 }
 
-function ownKeys$g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class ProfilePicComponent extends React.Component {
   renderPic() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.props.className,
-      style: _objectSpread$g({
+      style: _objectSpread$h({
         width: this.props.size || 30,
         height: this.props.size || 30,
         borderRadius: this.props.size / 2 || 15,
@@ -4145,8 +4211,8 @@ function DurationInput(_ref) {
   }, "Minute(s)"));
 }
 
-function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const DEFAULT_INPUT$1 = {
   uploadingFile: false,
   value: ""
@@ -4201,7 +4267,7 @@ class FileInputComponent extends React.Component {
               this.handleFile(newInput, file);
             }
           } else {
-            const newInput = _objectSpread$f({}, DEFAULT_INPUT$1);
+            const newInput = _objectSpread$g({}, DEFAULT_INPUT$1);
             newInputs.splice(newInputs.length - 1, 0, newInput);
             this.handleFile(newInput, file);
           }
@@ -4336,7 +4402,7 @@ class FileInputComponent extends React.Component {
           className: "imageInput_simpleContainer"
         }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "imageInput_image",
-          style: _objectSpread$f(_objectSpread$f({}, this.props.style), {}, {
+          style: _objectSpread$g(_objectSpread$g({}, this.props.style), {}, {
             height: this.props.style && this.props.style.height ? this.props.style.height - 62 : 80
           })
         }, /*#__PURE__*/React__default["default"].createElement("img", {
@@ -4366,7 +4432,7 @@ class FileInputComponent extends React.Component {
       }
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "imageInput_image",
-        style: _objectSpread$f({}, this.props.style)
+        style: _objectSpread$g({}, this.props.style)
       });
     };
     const renderRemove = () => {
@@ -4394,7 +4460,7 @@ class FileInputComponent extends React.Component {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       key: index,
       className: this.getClassNames(input, inputsLength),
-      style: _objectSpread$f({}, this.props.style)
+      style: _objectSpread$g({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement(Dropzone__default["default"], {
       accept: this.getAccept(),
       onDrop: this.onDrop
@@ -4406,7 +4472,7 @@ class FileInputComponent extends React.Component {
       } = state;
       return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
         className: "imageInput_upload ".concat(this.getErrorState()),
-        style: _objectSpread$f({}, this.props.style)
+        style: _objectSpread$g({}, this.props.style)
       }, getRootProps()), /*#__PURE__*/React__default["default"].createElement("input", getInputProps()), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "".concat(isDragActive ? "imageInput_dropZoneActive" : "")
       }, !this.props.simpleStyle && /*#__PURE__*/React__default["default"].createElement("img", {
@@ -4422,7 +4488,7 @@ class FileInputComponent extends React.Component {
       }, this.props.multiple ? "Upload files" : "Upload a file")));
     }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInput_uploading",
-      style: _objectSpread$f({}, this.props.style)
+      style: _objectSpread$g({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement(FontAwesome__default["default"], {
       className: "spinner imageInput_spinner",
       name: "spinner fa-pulse fa-fw"
@@ -4431,7 +4497,7 @@ class FileInputComponent extends React.Component {
   renderUploadFiles(inputs) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInputContainer clearfix ".concat(inputs.length === 1 ? "imageInputContainer-noPadding" : "", " ").concat(this.props.simpleStyle ? "imageInputContainer-simple" : ""),
-      style: _objectSpread$f({}, this.props.style)
+      style: _objectSpread$g({}, this.props.style)
     }, inputs.map((input, index) => {
       return this.renderInput(input, index, inputs.length);
     }));
@@ -4452,8 +4518,8 @@ const FileInput = reactRedux.connect(mapStateToProps$5, {}, null, {
   forwardRef: true
 })(FileInputComponent);
 
-function ownKeys$e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class GenericInput extends React.Component {
   componentDidUpdate(prevProps, prevState) {
     if (!___default["default"].isUndefined(this.props.autofocus) && this.props.autofocus) {
@@ -4520,7 +4586,7 @@ class GenericInput extends React.Component {
   renderInput() {
     if (!___default["default"].isUndefined(this.props.inputComponent)) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
+        style: _objectSpread$f(_objectSpread$f({}, styles$8.row), {}, {
           alignItems: 'flex-start'
         })
       }, this.props.isRequired && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -4530,7 +4596,7 @@ class GenericInput extends React.Component {
     if (!___default["default"].isUndefined(this.props.type) && this.props.type === 'textarea') {
       // Render expandable text area
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
+        style: _objectSpread$f(_objectSpread$f({}, styles$8.row), {}, {
           alignItems: 'flex-start'
         })
       }, this.props.isRequired && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -4544,7 +4610,7 @@ class GenericInput extends React.Component {
         onChange: this.props.onChange,
         onKeyPress: this.props.onKeyPress || this.props.onEnter,
         onKeyDown: this.props.onKeyDown,
-        style: _objectSpread$e({}, this.props.inputStyle),
+        style: _objectSpread$f({}, this.props.inputStyle),
         readOnly: !___default["default"].isUndefined(this.props.readOnly) ? this.props.readOnly : false,
         disabled: !___default["default"].isUndefined(this.props.disabled) ? this.props.disabled : false,
         autoComplete: this.getAutoComplete(),
@@ -4555,7 +4621,7 @@ class GenericInput extends React.Component {
     }
     // Render default input
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$e(_objectSpread$e({}, styles$8.row), this.props.textWrapperStyle)
+      style: _objectSpread$f(_objectSpread$f({}, styles$8.row), this.props.textWrapperStyle)
     }, this.props.isRequired && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "inputRequired "
     }), /*#__PURE__*/React__default["default"].createElement("input", {
@@ -4569,7 +4635,7 @@ class GenericInput extends React.Component {
       onClick: this.props.onClick,
       onKeyPress: this.props.onKeyPress || this.props.onEnter,
       onKeyDown: this.props.onKeyDown,
-      style: _objectSpread$e({}, this.props.inputStyle),
+      style: _objectSpread$f({}, this.props.inputStyle),
       readOnly: !___default["default"].isUndefined(this.props.readOnly) ? this.props.readOnly : false,
       disabled: !___default["default"].isUndefined(this.props.disabled) ? this.props.disabled : false,
       autoComplete: this.getAutoComplete(),
@@ -4582,9 +4648,9 @@ class GenericInput extends React.Component {
   render() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: this.getClassNames(),
-      style: _objectSpread$e({}, this.props.style)
+      style: _objectSpread$f({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
+      style: _objectSpread$f(_objectSpread$f({}, styles$8.row), {}, {
         marginBottom: 0,
         justifyContent: 'space-between'
       })
@@ -4687,8 +4753,8 @@ let exportObj$4 = reactRedux.connect(mapStateToProps$4, {
   setNavData
 })(reactRouter.withRouter(Header));
 
-function ownKeys$d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class SideNavItem extends React.Component {
   constructor(props) {
     super(props);
@@ -4751,7 +4817,7 @@ class SideNavItem extends React.Component {
       });
     }
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$d(_objectSpread$d({}, styles$7.section), {}, {
+      style: _objectSpread$e(_objectSpread$e({}, styles$7.section), {}, {
         width: 18,
         marginRight: 16
       })
@@ -4763,7 +4829,7 @@ class SideNavItem extends React.Component {
       style: this.props.style,
       onClick: this.goTo
     }, !this.props.noSideDot && /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$d(_objectSpread$d({}, styles$7.section), {}, {
+      style: _objectSpread$e(_objectSpread$e({}, styles$7.section), {}, {
         marginRight: 15
       })
     }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -4793,8 +4859,8 @@ const styles$7 = {
 };
 let exportObj$3 = reactRedux.connect(null, {})(reactRouter.withRouter(SideNavItem));
 
-function ownKeys$c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class HubSidebar extends React.PureComponent {
   constructor(props) {
     super(props);
@@ -4853,7 +4919,7 @@ class HubSidebar extends React.PureComponent {
     }, item.text));
   }
   renderNewButton(item, index) {
-    return this.renderButton(_objectSpread$c(_objectSpread$c({}, item), {}, {
+    return this.renderButton(_objectSpread$d(_objectSpread$d({}, item), {}, {
       icon: 'plus'
     }), index);
   }
@@ -4910,8 +4976,8 @@ let exportObj$2 = reactRedux.connect(mapStateToProps$3, {
   setNavData
 })(HubSidebar);
 
-function ownKeys$b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class Popup extends React.Component {
   renderClose() {
     if (!this.props.onClose) {
@@ -4951,7 +5017,7 @@ class Popup extends React.Component {
         return /*#__PURE__*/React__default["default"].createElement(Button, {
           key: index,
           buttonType: b.type,
-          style: _objectSpread$b({
+          style: _objectSpread$c({
             marginLeft: 8,
             marginRight: 8
           }, b.style),
@@ -4969,7 +5035,7 @@ class Popup extends React.Component {
       return /*#__PURE__*/React__default["default"].createElement(Button, {
         key: index,
         buttonType: b.type,
-        style: _objectSpread$b({
+        style: _objectSpread$c({
           marginLeft: 16
         }, b.style),
         buttonStyle: b.buttonStyle,
@@ -5001,8 +5067,8 @@ class Popup extends React.Component {
   }
 }
 
-function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const DEFAULT_INPUT = {
   uploadingImage: false,
   value: '',
@@ -5099,7 +5165,7 @@ class ImageInputComponent extends React.Component {
         try {
           await fileActions.addMediaFolder(this.props.auth.site, this.state.addFolderInput);
           const folders = await this.refreshFolders();
-          this.setState(_objectSpread$a({
+          this.setState(_objectSpread$b({
             addingFolder: false,
             folders
           }, this.cancelAddStates));
@@ -5142,7 +5208,7 @@ class ImageInputComponent extends React.Component {
               _this.handleFile(newInput, file);
             }
           } else {
-            const newInput = _objectSpread$a(_objectSpread$a({}, DEFAULT_INPUT), {}, {
+            const newInput = _objectSpread$b(_objectSpread$b({}, DEFAULT_INPUT), {}, {
               fromLibrary
             });
             newInputs.splice(newInputs.length - 1, 0, newInput);
@@ -5189,9 +5255,9 @@ class ImageInputComponent extends React.Component {
     _defineProperty__default["default"](this, "deleteFolder", (event, folder) => {
       event.stopPropagation();
       if (window.confirm("Are you sure you want to delete ".concat(folder.Name, "?"))) {
-        const deletingFolder = _objectSpread$a({}, this.state.deletingFolder);
+        const deletingFolder = _objectSpread$b({}, this.state.deletingFolder);
         deletingFolder[folder.RowId] = true;
-        this.setState(_objectSpread$a({
+        this.setState(_objectSpread$b({
           deletingFolder: ___default["default"].clone(deletingFolder)
         }, this.cancelAddStates), async () => {
           try {
@@ -5216,7 +5282,7 @@ class ImageInputComponent extends React.Component {
       if (window.confirm('Are you sure you want to delete the image?')) {
         // Unselect the image first if selected
         if (image.Selected) this.toggleLibraryItem(image);
-        const deletingImage = _objectSpread$a({}, this.state.deletingImage);
+        const deletingImage = _objectSpread$b({}, this.state.deletingImage);
         deletingImage[image.Value] = true;
         this.setState({
           deletingImage: ___default["default"].clone(deletingImage)
@@ -5527,7 +5593,7 @@ class ImageInputComponent extends React.Component {
           className: "imageInput_simpleContainer"
         }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "imageInput_image",
-          style: _objectSpread$a(_objectSpread$a({}, this.getImageStyle(input.displayValue)), this.props.style)
+          style: _objectSpread$b(_objectSpread$b({}, this.getImageStyle(input.displayValue)), this.props.style)
         }, /*#__PURE__*/React__default["default"].createElement(Dropzone__default["default"], {
           disabled: this.props.disabled,
           accept: this.getAccept(),
@@ -5548,7 +5614,7 @@ class ImageInputComponent extends React.Component {
       }
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "imageInput_image",
-        style: _objectSpread$a(_objectSpread$a({}, this.getImageStyle(input.displayValue)), this.props.style)
+        style: _objectSpread$b(_objectSpread$b({}, this.getImageStyle(input.displayValue)), this.props.style)
       });
     };
     const renderRemove = () => {
@@ -5578,7 +5644,7 @@ class ImageInputComponent extends React.Component {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       key: index,
       className: this.getClassNames(input, inputsLength),
-      style: _objectSpread$a({}, this.props.style)
+      style: _objectSpread$b({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement(Dropzone__default["default"], {
       disabled: this.props.disabled,
       accept: this.getAccept(),
@@ -5590,7 +5656,7 @@ class ImageInputComponent extends React.Component {
         isDragActive
       } = state;
       return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-        style: _objectSpread$a({}, this.props.style),
+        style: _objectSpread$b({}, this.props.style),
         className: "imageInput_upload ".concat(this.getErrorState())
       }, getRootProps()), /*#__PURE__*/React__default["default"].createElement("input", getInputProps()), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "".concat(isDragActive ? 'imageInput_dropZoneActive' : '', " ").concat(this.props.horizontalText ? ' imageInput_horizontalText' : '')
@@ -5607,7 +5673,7 @@ class ImageInputComponent extends React.Component {
       }, this.props.multiple ? "Upload ".concat(mediaText) : "Upload an ".concat(mediaText))));
     }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInput_uploading",
-      style: _objectSpread$a({}, this.props.style)
+      style: _objectSpread$b({}, this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement(FontAwesome__default["default"], {
       className: "spinner imageInput_spinner",
       name: "spinner fa-pulse fa-fw"
@@ -5627,7 +5693,7 @@ class ImageInputComponent extends React.Component {
       className: classes
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInput_image",
-      style: _objectSpread$a({}, this.getImageStyle(image[1400])),
+      style: _objectSpread$b({}, this.getImageStyle(image[1400])),
       onClick: this.toggleLibraryItem.bind(this, image)
     }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInput_selected"
@@ -5784,7 +5850,7 @@ class ImageInputComponent extends React.Component {
     const mediaText = this.props.allowVideo ? 'media' : "image".concat(this.props.multiple ? 's' : '');
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInputContainer imageInputContainer-library",
-      style: _objectSpread$a({}, this.props.style)
+      style: _objectSpread$b({}, this.props.style)
     }, this.renderBreadCrumbs(), stockFolder ? this.state.imageLibrary.map((image, index) => {
       return this.renderLibraryImage(image, index);
     }) : /*#__PURE__*/React__default["default"].createElement("div", null, this.canAddImageToLibrary() && /*#__PURE__*/React__default["default"].createElement(Dropzone__default["default"], {
@@ -5832,7 +5898,7 @@ class ImageInputComponent extends React.Component {
   renderUploadImages(inputs) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "imageInputContainer ".concat(inputs.length === 1 ? 'imageInputContainer-noPadding' : ''),
-      style: _objectSpread$a({}, this.props.style)
+      style: _objectSpread$b({}, this.props.style)
     }, inputs.map((input, index) => {
       return this.renderInput(input, index, inputs.length);
     }));
@@ -5968,8 +6034,8 @@ class MoreMenu extends React.Component {
   }
 }
 
-function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class OverlayPage extends React.Component {
   constructor(props) {
     super(props);
@@ -6006,9 +6072,9 @@ class OverlayPage extends React.Component {
   }
   render() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$9(_objectSpread$9({}, styles$5.pageWrapper), this.props.style)
+      style: _objectSpread$a(_objectSpread$a({}, styles$5.pageWrapper), this.props.style)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$9(_objectSpread$9({}, styles$5.backgroundOverlay), this.props.backgroundStyle)
+      style: _objectSpread$a(_objectSpread$a({}, styles$5.backgroundOverlay), this.props.backgroundStyle)
     }), this.renderContent());
   }
 }
@@ -6031,8 +6097,8 @@ const styles$5 = {
   }
 };
 
-function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class OverlayPageContents extends React.Component {
   constructor(props) {
     super(props);
@@ -6051,7 +6117,7 @@ class OverlayPageContents extends React.Component {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       id: this.props.id,
       className: "animateOpacity",
-      style: _objectSpread$8(_objectSpread$8({}, styles$4.wrapper), {}, {
+      style: _objectSpread$9(_objectSpread$9({}, styles$4.wrapper), {}, {
         height: this.props.noBottomButtons ? '100%' : 'calc(100% - 57px)',
         opacity: this.state.opacity
       }, this.props.style)
@@ -6071,8 +6137,8 @@ const styles$4 = {
   }
 };
 
-function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class OverlayPageSection extends React.Component {
   getClassName() {
     if (this.props.className) {
@@ -6083,7 +6149,7 @@ class OverlayPageSection extends React.Component {
   render() {
     return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({}, this.props, {
       className: this.getClassName(),
-      style: _objectSpread$7(_objectSpread$7({}, styles$3.wrapper), this.props.style)
+      style: _objectSpread$8(_objectSpread$8({}, styles$3.wrapper), this.props.style)
     }), this.props.children);
   }
 }
@@ -6098,8 +6164,8 @@ const styles$3 = {
   }
 };
 
-function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class OverlayPageBottomButtons extends React.Component {
   constructor(props) {
     super(props);
@@ -6117,7 +6183,7 @@ class OverlayPageBottomButtons extends React.Component {
   render() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "animateOpacity",
-      style: _objectSpread$6(_objectSpread$6({}, styles$2.wrapper), {}, {
+      style: _objectSpread$7(_objectSpread$7({}, styles$2.wrapper), {}, {
         opacity: this.state.opacity
       }, this.props.style)
     }, this.props.children);
@@ -6145,8 +6211,8 @@ class PageTitle extends React.Component {
   }
 }
 
-function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class RadioButton extends React.Component {
   generateClassNames(e) {
     let string = 'radioButton';
@@ -6194,7 +6260,7 @@ class RadioButton extends React.Component {
     if (!___default["default"].isEmpty(this.props.label)) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "fieldLabel",
-        style: _objectSpread$5({
+        style: _objectSpread$6({
           marginBottom: 5
         }, this.props.labelStyle)
       }, this.props.label);
@@ -6205,7 +6271,7 @@ class RadioButton extends React.Component {
     if (!___default["default"].isEmpty(this.props.subLabel)) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "genericInput-help",
-        style: _objectSpread$5({
+        style: _objectSpread$6({
           marginBottom: 5
         }, this.props.subLabelStyle)
       }, this.props.subLabel);
@@ -6217,13 +6283,13 @@ class RadioButton extends React.Component {
       return null;
     }
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      style: _objectSpread$5(_objectSpread$5({}, styles$1.row), this.props.rowStyle)
+      style: _objectSpread$6(_objectSpread$6({}, styles$1.row), this.props.rowStyle)
     }, this.props.options.map(e => {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: this.generateWrapperClassNames(),
         onClick: () => this.performMultiAction(e),
         key: e.Label,
-        style: _objectSpread$5(_objectSpread$5({}, styles$1.row), {}, {
+        style: _objectSpread$6(_objectSpread$6({}, styles$1.row), {}, {
           marginRight: 14
         }, this.props.buttonStyle)
       }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -6657,6 +6723,8 @@ class UserListing extends React.Component {
   }
 }
 
+function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class TimePicker extends React.Component {
   constructor() {
     super(...arguments);
@@ -6664,9 +6732,9 @@ class TimePicker extends React.Component {
       id: randomString(),
       selectedTime: this.props.optional ? this.props.selectedTime : moment__default["default"](),
       grid: [],
-      hourInput: '',
-      minuteInput: '',
-      mInput: ''
+      hourInput: "",
+      minuteInput: "",
+      mInput: ""
     });
     _defineProperty__default["default"](this, "onClear", () => {
       this.props.selectTime(undefined);
@@ -6680,21 +6748,21 @@ class TimePicker extends React.Component {
   }
   onNewProps(nextProps, forceUpdate) {
     if (forceUpdate || nextProps.selectedTime !== this.props.selectedTime) {
-      let mDate = moment__default["default"](nextProps.selectedTime, 'h:mma');
+      let mDate = moment__default["default"](nextProps.selectedTime, "h:mma");
       if (!mDate.isValid()) {
         this.setState({
           selectedTime: null,
-          hourInput: '',
-          minuteInput: '',
-          mInput: ''
+          hourInput: "",
+          minuteInput: "",
+          mInput: ""
         });
       } else {
         const minutesFocused = document.getElementById("time_minute_".concat(this.state.id)) === document.activeElement;
         this.setState({
           selectedTime: mDate,
-          hourInput: mDate.format('h'),
-          minuteInput: mDate.format(minutesFocused ? 'm' : 'mm'),
-          mInput: mDate.format('a')
+          hourInput: mDate.format("h"),
+          minuteInput: mDate.format(minutesFocused ? "m" : "mm"),
+          mInput: mDate.format("a")
         });
       }
     }
@@ -6710,6 +6778,11 @@ class TimePicker extends React.Component {
     let hour = 0;
     if (!___default["default"].isEmpty(event.target.value)) {
       hour = parseInt(event.target.value, 10);
+    } else {
+      this.setState(_objectSpread$5(_objectSpread$5({}, this.state), {}, {
+        hourInput: ""
+      }));
+      return;
     }
     if (isNaN(hour)) {
       return;
@@ -6717,7 +6790,7 @@ class TimePicker extends React.Component {
     hour = Math.max(Math.min(12, hour), 0);
     const dateToUse = this.state.selectedTime || this.getDefaultTime();
     const selectNext = hour > 1; // if hour is > 1, assume user is done typing and select minutes input
-    if (dateToUse.format('a') === 'pm') {
+    if (dateToUse.format("a") === "pm") {
       hour += 12;
     }
     dateToUse.hour(hour);
@@ -6733,6 +6806,11 @@ class TimePicker extends React.Component {
     let minute = 0;
     if (!___default["default"].isEmpty(event.target.value)) {
       minute = parseInt(event.target.value, 10);
+    } else {
+      this.setState(_objectSpread$5(_objectSpread$5({}, this.state), {}, {
+        minuteInput: ""
+      }));
+      return;
     }
     if (isNaN(minute)) {
       return;
@@ -6744,27 +6822,27 @@ class TimePicker extends React.Component {
       selectedTime: moment__default["default"](dateToUse)
     });
     this.selectTime(dateToUse);
-    if (minute >= 10 || event.target.value === '00') {
+    if (minute >= 10 || event.target.value === "00") {
       this.select("time_am_".concat(this.state.id));
     }
   }
   onBlurMinute() {
     if (this.state.selectedTime) {
       this.setState({
-        minuteInput: this.state.selectedTime.format('mm')
+        minuteInput: this.state.selectedTime.format("mm")
       });
     }
   }
   onChangeM(event) {
     const dateToUse = this.state.selectedTime || this.getDefaultTime();
-    if (event.target.value.toLowerCase().indexOf('a') > -1) {
+    if (event.target.value.toLowerCase().indexOf("a") > -1) {
       // am
-      if (dateToUse.format('a') === 'pm') {
+      if (dateToUse.format("a") === "pm") {
         dateToUse.hour(dateToUse.hour() - 12);
       }
     } else {
       // pm
-      if (dateToUse.format('a') === 'am') {
+      if (dateToUse.format("a") === "am") {
         dateToUse.hour(dateToUse.hour() + 12);
       }
     }
@@ -6774,7 +6852,7 @@ class TimePicker extends React.Component {
     this.selectTime(dateToUse);
   }
   selectTime(date) {
-    this.props.selectTime(moment__default["default"](date).format(this.props.callbackFormat || 'h:mma'));
+    this.props.selectTime(moment__default["default"](date).format(this.props.callbackFormat || "h:mma"));
   }
   select(id) {
     document.getElementById(id).select();
@@ -8942,6 +9020,70 @@ class ColourPicker extends React.Component {
   }
 }
 
+const BAR_HEIGHT = 36;
+const CHART_PADDING = 20;
+const ComparisonStatBox = _ref => {
+  let {
+    title,
+    icon,
+    data,
+    isLoading
+  } = _ref;
+  const chartHeight = data.length * BAR_HEIGHT + CHART_PADDING;
+  const maxLabelLength = data.reduce((max, d) => Math.max(max, d.name.length), 0);
+  const yAxisWidth = Math.min(Math.max(maxLabelLength * 7, 80), 160);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "dashboardBox dashboardBox-inline",
+    style: {
+      opacity: isLoading ? 0.3 : 1,
+      minWidth: 280
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "dashboardBox-stats_title",
+    style: {
+      display: "flex",
+      alignItems: "center"
+    }
+  }, icon && /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: icon,
+    style: {
+      marginRight: 8
+    }
+  }), /*#__PURE__*/React__default["default"].createElement(Text, {
+    type: "h6"
+  }, title)), /*#__PURE__*/React__default["default"].createElement(recharts.ResponsiveContainer, {
+    width: "100%",
+    height: chartHeight
+  }, /*#__PURE__*/React__default["default"].createElement(recharts.BarChart, {
+    data: data,
+    layout: "vertical",
+    margin: {
+      top: 4,
+      right: 20,
+      bottom: 0,
+      left: 0
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(recharts.XAxis, {
+    type: "number",
+    hide: true
+  }), /*#__PURE__*/React__default["default"].createElement(recharts.YAxis, {
+    type: "category",
+    dataKey: "name",
+    width: yAxisWidth,
+    tick: {
+      fontSize: 12
+    }
+  }), /*#__PURE__*/React__default["default"].createElement(recharts.Tooltip, {
+    formatter: value => [value, title]
+  }), /*#__PURE__*/React__default["default"].createElement(recharts.Bar, {
+    dataKey: "value",
+    radius: [0, 4, 4, 0]
+  }, data.map((entry, index) => /*#__PURE__*/React__default["default"].createElement(recharts.Cell, {
+    key: entry.name,
+    fill: getSiteColour(index)
+  }))))));
+};
+
 // StatBox Component
 const StatBox = _ref => {
   let {
@@ -9043,6 +9185,7 @@ var index = /*#__PURE__*/Object.freeze({
   InputGroup: InputGroup,
   ColourOptions: ColourOptions,
   ColourPicker: ColourPicker,
+  ComparisonStatBox: ComparisonStatBox,
   StatBox: StatBox,
   Tabs: Tabs
 });