@plusscommunities/pluss-core-web 1.4.0 → 1.4.2-beta.0

package/dist/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@babel/runtime/helpers/toConsumableArray'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('lodash'), require('axios'), require('aws-amplify'), require('@babel/runtime/helpers/defineProperty'), require('react'), require('jquery'), require('moment'), require('js-cookie'), require('@babel/runtime/helpers/classCallCheck'), require('@babel/runtime/helpers/createClass'), require('@babel/runtime/helpers/inherits'), require('@babel/runtime/helpers/possibleConstructorReturn'), require('@babel/runtime/helpers/getPrototypeOf'), require('react-fontawesome'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/assertThisInitialized'), require('react-redux'), require('react-textarea-autosize'), require('react-dropzone'), require('react-router'), require('react-bootstrap'), require('@crello/react-lottie'), require('react-csv')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@babel/runtime/helpers/toConsumableArray', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'lodash', 'axios', 'aws-amplify', '@babel/runtime/helpers/defineProperty', 'react', 'jquery', 'moment', 'js-cookie', '@babel/runtime/helpers/classCallCheck', '@babel/runtime/helpers/createClass', '@babel/runtime/helpers/inherits', '@babel/runtime/helpers/possibleConstructorReturn', '@babel/runtime/helpers/getPrototypeOf', 'react-fontawesome', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/assertThisInitialized', 'react-redux', 'react-textarea-autosize', 'react-dropzone', 'react-router', 'react-bootstrap', '@crello/react-lottie', 'react-csv'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['@plusscommunities/pluss-core-web'] = {}, global._toConsumableArray, global._asyncToGenerator, global._regeneratorRuntime, global._, global.axios, global.awsAmplify, global._defineProperty, global.React, global.$, global.moment, global.Cookies, global._classCallCheck, global._createClass, global._inherits, global._possibleConstructorReturn, global._getPrototypeOf, global.FontAwesome, global._extends, global._assertThisInitialized, global.reactRedux, global.Textarea, global.Dropzone, global.reactRouter, global.reactBootstrap, global.reactLottie, global.reactCsv));
-}(this, (function (exports, _toConsumableArray, _asyncToGenerator, _regeneratorRuntime, _, axios, awsAmplify, _defineProperty, React, $, moment, Cookies, _classCallCheck, _createClass, _inherits, _possibleConstructorReturn, _getPrototypeOf, FontAwesome, _extends, _assertThisInitialized, reactRedux, Textarea, Dropzone, reactRouter, reactBootstrap, reactLottie, reactCsv) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@babel/runtime/helpers/toConsumableArray'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('lodash'), require('axios'), require('aws-amplify'), require('@babel/runtime/helpers/defineProperty'), require('react'), require('jquery'), require('moment'), require('js-cookie'), require('@babel/runtime/helpers/classCallCheck'), require('@babel/runtime/helpers/createClass'), require('@babel/runtime/helpers/inherits'), require('@babel/runtime/helpers/possibleConstructorReturn'), require('@babel/runtime/helpers/getPrototypeOf'), require('react-fontawesome'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/assertThisInitialized'), require('react-redux'), require('react-textarea-autosize'), require('react-dropzone'), require('react-router'), require('react-bootstrap'), require('@crello/react-lottie'), require('react-csv'), require('@babel/runtime/helpers/objectWithoutProperties')) :
+  typeof define === 'function' && define.amd ? define(['exports', '@babel/runtime/helpers/toConsumableArray', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'lodash', 'axios', 'aws-amplify', '@babel/runtime/helpers/defineProperty', 'react', 'jquery', 'moment', 'js-cookie', '@babel/runtime/helpers/classCallCheck', '@babel/runtime/helpers/createClass', '@babel/runtime/helpers/inherits', '@babel/runtime/helpers/possibleConstructorReturn', '@babel/runtime/helpers/getPrototypeOf', 'react-fontawesome', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/assertThisInitialized', 'react-redux', 'react-textarea-autosize', 'react-dropzone', 'react-router', 'react-bootstrap', '@crello/react-lottie', 'react-csv', '@babel/runtime/helpers/objectWithoutProperties'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['@plusscommunities/pluss-core-web'] = {}, global._toConsumableArray, global._asyncToGenerator, global._regeneratorRuntime, global._, global.axios, global.awsAmplify, global._defineProperty, global.React, global.$, global.moment, global.Cookies, global._classCallCheck, global._createClass, global._inherits, global._possibleConstructorReturn, global._getPrototypeOf, global.FontAwesome, global._extends, global._assertThisInitialized, global.reactRedux, global.Textarea, global.Dropzone, global.reactRouter, global.reactBootstrap, global.reactLottie, global.reactCsv, global._objectWithoutProperties));
+}(this, (function (exports, _toConsumableArray, _asyncToGenerator, _regeneratorRuntime, _, axios, awsAmplify, _defineProperty, React, $, moment, Cookies, _classCallCheck, _createClass, _inherits, _possibleConstructorReturn, _getPrototypeOf, FontAwesome, _extends, _assertThisInitialized, reactRedux, Textarea, Dropzone, reactRouter, reactBootstrap, reactLottie, reactCsv, _objectWithoutProperties) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -26,6 +26,7 @@
   var _assertThisInitialized__default = /*#__PURE__*/_interopDefaultLegacy(_assertThisInitialized);
   var Textarea__default = /*#__PURE__*/_interopDefaultLegacy(Textarea);
   var Dropzone__default = /*#__PURE__*/_interopDefaultLegacy(Dropzone);
+  var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 
   var CoreConfig = {
     env: {
@@ -702,9 +703,9 @@
     });
   };
 
-  function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$l(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$m(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$m(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   var toParagraphed = function toParagraphed(text, style) {
     if (!text) return text;
@@ -713,7 +714,7 @@
     return ___default['default'].map(textSplit, function (t, i) {
       return /*#__PURE__*/React__default['default'].createElement("span", {
         key: "paragraph_".concat(i),
-        style: _objectSpread$l({
+        style: _objectSpread$m({
           display: 'block'
         }, style)
       }, t || "\xA0");
@@ -1610,8 +1611,8 @@
   // const COLOUR_BLUE_ALPHA10 = 'rgba(0, 131, 238, 0.1)';
   // const COLOUR_DARKBLUE = '#191e78';
   // const COLOUR_PURPLE = '#6e79c5';
-  // const COLOUR_RED = '#c02743';
-  // const COLOUR_GREEN = '#00cc9c';
+
+  var COLOUR_RED = '#c02743'; // const COLOUR_GREEN = '#00cc9c';
   // const COLOUR_TANGERINE = '#ff8c75';
   // const COLOUR_CITRON = '#bdbd27';
   // const COLOUR_GRAPEFRUIT = '#ff6363';
@@ -1632,6 +1633,7 @@
     COLOUR_DUSK_LIGHT: COLOUR_DUSK_LIGHT,
     COLOUR_DUSK_LIGHTER: COLOUR_DUSK_LIGHTER,
     LINEGREY: LINEGREY,
+    COLOUR_RED: COLOUR_RED,
     COLOUR_BRANDING_MAIN: COLOUR_BRANDING_MAIN,
     COLOUR_BRANDING_OFF: COLOUR_BRANDING_OFF,
     COLOUR_BRANDING_ACTION: COLOUR_BRANDING_ACTION,
@@ -2064,13 +2066,14 @@
         url: getUrl('media', 'folders', query)
       });
     },
-    addMediaFolder: function addMediaFolder(site, name) {
+    addMediaFolder: function addMediaFolder(site, name, published) {
       return authedFunction({
         method: 'POST',
         url: getUrl('media', 'addFolder'),
         data: {
           site: site,
-          name: name
+          name: name,
+          published: published
         }
       });
     },
@@ -2127,9 +2130,9 @@
     }
   };
 
-  function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$k(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$l(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
   var typeActions = {
     getSubdomains: function getSubdomains() {
       return authedFunction({
@@ -2225,7 +2228,7 @@
       var request = {
         method: 'POST',
         url: url,
-        data: _objectSpread$k({
+        data: _objectSpread$l({
           siteName: siteName
         }, options)
       };
@@ -2333,7 +2336,7 @@
       return authedFunction({
         method: 'POST',
         url: getUrl('types', 'site/edit'),
-        data: _objectSpread$k({
+        data: _objectSpread$l({
           Id: site
         }, values)
       });
@@ -2883,9 +2886,9 @@
     scheduledActionsActions: scheduledActionsActions
   });
 
-  function ownKeys$j(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$j(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$j(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$k(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
   var refreshAuthUser = function refreshAuthUser(site) {
     return function (dispatch) {
       var promises = [];
@@ -2900,13 +2903,13 @@
         dispatch({
           type: SET_AUTH,
           payload: {
-            user: _objectSpread$j(_objectSpread$j({}, userRes), {}, {
+            user: _objectSpread$k(_objectSpread$k({}, userRes), {}, {
               uid: userRes.Id
             }),
             features: getEnabledFeatures(siteSettingsRes, interfaces),
             hidden: _toConsumableArray__default['default'](siteSettingsRes.Hidden || []),
-            siteSettings: _objectSpread$j({}, siteSettingsRes.Settings || {}),
-            siteBranding: _objectSpread$j({}, siteSettingsRes.Branding || {})
+            siteSettings: _objectSpread$k({}, siteSettingsRes.Settings || {}),
+            siteBranding: _objectSpread$k({}, siteSettingsRes.Branding || {})
           }
         });
       });
@@ -2970,9 +2973,9 @@
     };
   };
 
-  function ownKeys$i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$j(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$i(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$i(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$j(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$j(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
   var usersUpdate = function usersUpdate(site) {
     return function (dispatch) {
       userActions.fetchUsers(site).then(function (res) {
@@ -2983,7 +2986,7 @@
             var users = res.data.results.Items;
             var allList = [];
             Object.keys(users).forEach(function (userId) {
-              allList.push(_objectSpread$i(_objectSpread$i({}, users[userId]), {}, {
+              allList.push(_objectSpread$j(_objectSpread$j({}, users[userId]), {}, {
                 id: userId
               }));
             });
@@ -4195,9 +4198,9 @@
     return Attachment;
   }(React.Component);
 
-  function ownKeys$h(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$h(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$h(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$i(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$i(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$z(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -4285,16 +4288,16 @@
 
         return /*#__PURE__*/React__default['default'].createElement("div", {
           className: "buttonWrapper ".concat(this.getClasses()),
-          style: _objectSpread$h({}, this.props.buttonStyle)
+          style: _objectSpread$i({}, this.props.buttonStyle)
         }, /*#__PURE__*/React__default['default'].createElement("div", {
           onClick: function onClick() {
             return _this.buttonClick();
           },
           className: this.getButtonClasses(),
-          style: _objectSpread$h({}, this.props.style)
+          style: _objectSpread$i({}, this.props.style)
         }, /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.getButtonTextClasses(),
-          style: _objectSpread$h({}, this.props.textStyle)
+          style: _objectSpread$i({}, this.props.textStyle)
         }, this.renderLeftIcon(), this.props.children)));
       }
     }]);
@@ -4302,9 +4305,9 @@
     return Button;
   }(React.Component);
 
-  function ownKeys$g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$h(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$g(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$g(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$h(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$h(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$y(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -4386,7 +4389,7 @@
           className: this.props.className
         }, /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.props.showWarning ? 'checkBox--error' : null,
-          style: _objectSpread$g(_objectSpread$g({}, styles$9.row), this.props.style)
+          style: _objectSpread$h(_objectSpread$h({}, styles$9.row), this.props.style)
         }, /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.generateClassNames(),
           onClick: this.onChange,
@@ -4398,7 +4401,7 @@
           name: 'check'
         }))), !___default['default'].isEmpty(this.props.label) && /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.getLabelClasses(),
-          style: _objectSpread$g({
+          style: _objectSpread$h({
             marginLeft: 8,
             fontSize: 14,
             lineHeight: '20px'
@@ -4456,9 +4459,9 @@
     return Text;
   }(React.Component);
 
-  function ownKeys$f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$f(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$f(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$g(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$g(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$w(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$w(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -4480,7 +4483,7 @@
       value: function renderPic() {
         return /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.props.className,
-          style: _objectSpread$f({
+          style: _objectSpread$g({
             width: this.props.size || 30,
             height: this.props.size || 30,
             borderRadius: this.props.size / 2 || 15,
@@ -5091,9 +5094,9 @@
     return DatePicker;
   }(React.Component);
 
-  function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$e(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$f(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$f(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$r(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$r(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -5161,7 +5164,7 @@
                 _this.handleFile(newInput, file);
               }
             } else {
-              var _newInput = _objectSpread$e({}, DEFAULT_INPUT$1);
+              var _newInput = _objectSpread$f({}, DEFAULT_INPUT$1);
 
               newInputs.splice(newInputs.length - 1, 0, _newInput);
 
@@ -5384,7 +5387,7 @@
               className: "imageInput_simpleContainer"
             }, /*#__PURE__*/React__default['default'].createElement("div", {
               className: "imageInput_image",
-              style: _objectSpread$e(_objectSpread$e({}, _this3.props.style), {}, {
+              style: _objectSpread$f(_objectSpread$f({}, _this3.props.style), {}, {
                 height: _this3.props.style && _this3.props.style.height ? _this3.props.style.height - 62 : 80
               })
             }, /*#__PURE__*/React__default['default'].createElement("img", {
@@ -5410,7 +5413,7 @@
 
           return /*#__PURE__*/React__default['default'].createElement("div", {
             className: "imageInput_image",
-            style: _objectSpread$e({}, _this3.props.style)
+            style: _objectSpread$f({}, _this3.props.style)
           });
         };
 
@@ -5441,12 +5444,12 @@
         return /*#__PURE__*/React__default['default'].createElement("div", {
           key: index,
           className: this.getClassNames(input, inputsLength),
-          style: _objectSpread$e({}, this.props.style)
+          style: _objectSpread$f({}, this.props.style)
         }, /*#__PURE__*/React__default['default'].createElement(Dropzone__default['default'], {
           className: "imageInput_upload ".concat(this.getErrorState()),
           accept: this.props.accept,
           onDrop: this.onDrop,
-          style: _objectSpread$e({}, this.props.style)
+          style: _objectSpread$f({}, this.props.style)
         }, function (_ref2) {
           var isDragActive = _ref2.isDragActive;
               _ref2.isDragReject;
@@ -5465,7 +5468,7 @@
           }, _this3.props.multiple ? "Upload files" : "Upload a file"));
         }), /*#__PURE__*/React__default['default'].createElement("div", {
           className: "imageInput_uploading",
-          style: _objectSpread$e({}, this.props.style)
+          style: _objectSpread$f({}, this.props.style)
         }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
           className: "spinner imageInput_spinner",
           name: "spinner fa-pulse fa-fw"
@@ -5478,7 +5481,7 @@
 
         return /*#__PURE__*/React__default['default'].createElement("div", {
           className: "imageInputContainer clearfix ".concat(inputs.length === 1 ? 'imageInputContainer-noPadding' : '', " ").concat(this.props.simpleStyle ? 'imageInputContainer-simple' : ''),
-          style: _objectSpread$e({}, this.props.style)
+          style: _objectSpread$f({}, this.props.style)
         }, inputs.map(function (input, index) {
           return _this4.renderInput(input, index, inputs.length);
         }));
@@ -5508,9 +5511,9 @@
     withRef: true
   })(FileInputComponent);
 
-  function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$d(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$e(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$q(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -5624,7 +5627,7 @@
 
         if (!___default['default'].isUndefined(this.props.inputComponent)) {
           return /*#__PURE__*/React__default['default'].createElement("div", {
-            style: _objectSpread$d(_objectSpread$d({}, styles$8.row), {}, {
+            style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
               alignItems: 'flex-start'
             })
           }, this.props.isRequired && /*#__PURE__*/React__default['default'].createElement("div", {
@@ -5635,7 +5638,7 @@
         if (!___default['default'].isUndefined(this.props.type) && this.props.type === 'textarea') {
           // Render expandable text area
           return /*#__PURE__*/React__default['default'].createElement("div", {
-            style: _objectSpread$d(_objectSpread$d({}, styles$8.row), {}, {
+            style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
               alignItems: 'flex-start'
             })
           }, this.props.isRequired && /*#__PURE__*/React__default['default'].createElement("div", {
@@ -5649,7 +5652,7 @@
             onChange: this.props.onChange,
             onKeyPress: this.props.onKeyPress || this.props.onEnter,
             onKeyDown: this.props.onKeyDown,
-            style: _objectSpread$d({}, this.props.inputStyle),
+            style: _objectSpread$e({}, 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(),
@@ -5661,7 +5664,7 @@
 
 
         return /*#__PURE__*/React__default['default'].createElement("div", {
-          style: _objectSpread$d(_objectSpread$d({}, styles$8.row), this.props.textWrapperStyle)
+          style: _objectSpread$e(_objectSpread$e({}, styles$8.row), this.props.textWrapperStyle)
         }, this.props.isRequired && /*#__PURE__*/React__default['default'].createElement("div", {
           className: "inputRequired "
         }), /*#__PURE__*/React__default['default'].createElement("input", {
@@ -5677,7 +5680,7 @@
           onClick: this.props.onClick,
           onKeyPress: this.props.onKeyPress || this.props.onEnter,
           onKeyDown: this.props.onKeyDown,
-          style: _objectSpread$d({}, this.props.inputStyle),
+          style: _objectSpread$e({}, 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(),
@@ -5692,9 +5695,9 @@
       value: function render() {
         return /*#__PURE__*/React__default['default'].createElement("div", {
           className: this.getClassNames(),
-          style: _objectSpread$d({}, this.props.style)
+          style: _objectSpread$e({}, this.props.style)
         }, /*#__PURE__*/React__default['default'].createElement("div", {
-          style: _objectSpread$d(_objectSpread$d({}, styles$8.row), {}, {
+          style: _objectSpread$e(_objectSpread$e({}, styles$8.row), {}, {
             marginBottom: 0,
             justifyContent: 'space-between'
           })
@@ -5842,9 +5845,9 @@
     setNavData: setNavData
   })(reactRouter.withRouter(Header));
 
-  function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$c(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$d(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
   function _createSuper$o(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$o(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
@@ -5936,7 +5939,7 @@
         }
 
         return /*#__PURE__*/React__default['default'].createElement("div", {
-          style: _objectSpread$c(_objectSpread$c({}, styles$7.section), {}, {
+          style: _objectSpread$d(_objectSpread$d({}, styles$7.section), {}, {
             width: 18,
             marginRight: 16
           })
@@ -5950,7 +5953,7 @@
           style: this.props.style,
           onClick: this.goTo
         }, !this.props.noSideDot && /*#__PURE__*/React__default['default'].createElement("div", {
-          style: _objectSpread$c(_objectSpread$c({}, styles$7.section), {}, {
+          style: _objectSpread$d(_objectSpread$d({}, styles$7.section), {}, {
             marginRight: 15
           })
         }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -5984,6 +5987,10 @@
   };
   var exportObj$3 = reactRedux.connect(null, {})(reactRouter.withRouter(SideNavItem));
 
+  function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+  function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$c(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
   function _createSuper$n(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$n(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
 
   function _isNativeReflectConstruct$n() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -6030,19 +6037,26 @@
         });
       }
     }, {
-      key: "renderNewButton",
-      value: function renderNewButton(item, index) {
+      key: "renderButton",
+      value: function renderButton(item, index) {
         return /*#__PURE__*/React__default['default'].createElement("div", {
-          key: "newbutton_".concat(index),
+          key: "button_".concat(index),
           className: "hubSidebar_newButtonContainer"
         }, /*#__PURE__*/React__default['default'].createElement(Button, {
           buttonType: item.buttonType || 'primary',
           isActive: true,
-          leftIcon: "plus",
+          leftIcon: item.icon,
           narrow: true,
           onClick: item.onClick
         }, item.text));
       }
+    }, {
+      key: "renderNewButton",
+      value: function renderNewButton(item, index) {
+        return this.renderButton(_objectSpread$c(_objectSpread$c({}, item), {}, {
+          icon: 'plus'
+        }), index);
+      }
     }, {
       key: "renderNavItem",
       value: function renderNavItem(item, index) {
@@ -6070,6 +6084,9 @@
           className: "hubSidebar_sectionTitle"
         }, section.title), section.items.map(function (item, itemIndex) {
           switch (item.type) {
+            case 'button':
+              return _this3.renderButton(item, itemIndex);
+
             case 'newButton':
               return _this3.renderNewButton(item, itemIndex);
 
@@ -10858,6 +10875,27 @@
     return ExportCsvPopup;
   }(React.Component);
 
+  var _excluded = ["id", "label", "help", "showError", "required"];
+
+  function InputGroup(_ref) {
+    var id = _ref.id,
+        label = _ref.label,
+        help = _ref.help,
+        showError = _ref.showError,
+        required = _ref.required,
+        props = _objectWithoutProperties__default['default'](_ref, _excluded);
+
+    return /*#__PURE__*/React__default['default'].createElement(reactBootstrap.FormGroup, {
+      controlId: id,
+      validationState: showError ? 'error' : null
+    }, /*#__PURE__*/React__default['default'].createElement(reactBootstrap.ControlLabel, null, /*#__PURE__*/React__default['default'].createElement("span", null, label), required && /*#__PURE__*/React__default['default'].createElement("span", {
+      style: {
+        color: COLOUR_RED,
+        marginLeft: 5
+      }
+    }, "*")), /*#__PURE__*/React__default['default'].createElement(reactBootstrap.FormControl, props), help && /*#__PURE__*/React__default['default'].createElement(reactBootstrap.HelpBlock, null, help));
+  }
+
   var index = /*#__PURE__*/Object.freeze({
     __proto__: null,
     AddButton: AddButton,
@@ -10897,7 +10935,8 @@
     OptionsSection: OptionsSection,
     DropdownInput: DropdownInput,
     MakerPopup: exportObj,
-    ExportCsvPopup: ExportCsvPopup
+    ExportCsvPopup: ExportCsvPopup,
+    InputGroup: InputGroup
   });
 
   function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plusscommunities/pluss-core-web",
-  "version": "1.4.0",
+  "version": "1.4.2-beta.0",
   "description": "Core extension package for Pluss Communities platform",
   "main": "dist/index.cjs.js",
   "scripts": {

package/src/apis/fileActions.js

@@ -87,13 +87,14 @@ export const fileActions = {
       url: getUrl('media', 'folders', query),
     });
   },
-  addMediaFolder: (site, name) => {
+  addMediaFolder: (site, name, published) => {
     return authedFunction({
       method: 'POST',
       url: getUrl('media', 'addFolder'),
       data: {
         site,
         name,
+        published,
       },
     });
   },

package/src/colours.js

@@ -31,7 +31,7 @@ const LINEGREY = COLOUR_BRANDING_INACTIVE;
 // const COLOUR_BLUE_ALPHA10 = 'rgba(0, 131, 238, 0.1)';
 // const COLOUR_DARKBLUE = '#191e78';
 // const COLOUR_PURPLE = '#6e79c5';
-// const COLOUR_RED = '#c02743';
+const COLOUR_RED = '#c02743';
 // const COLOUR_GREEN = '#00cc9c';
 // const COLOUR_TANGERINE = '#ff8c75';
 // const COLOUR_CITRON = '#bdbd27';
@@ -109,7 +109,7 @@ export {
   // COLOUR_BLUE_ALPHA10,
   // COLOUR_DARKBLUE,
   // COLOUR_PURPLE,
-  // COLOUR_RED,
+  COLOUR_RED,
   // COLOUR_TANGERINE,
   // COLOUR_CITRON,
   // COLOUR_GRAPEFRUIT,

package/src/components/HubSidebar.js

@@ -35,16 +35,20 @@ class HubSidebar extends PureComponent {
     });
   }
 
-  renderNewButton(item, index) {
+  renderButton(item, index) {
     return (
-      <div key={`newbutton_${index}`} className="hubSidebar_newButtonContainer">
-        <Button buttonType={item.buttonType || 'primary'} isActive leftIcon="plus" narrow onClick={item.onClick}>
+      <div key={`button_${index}`} className="hubSidebar_newButtonContainer">
+        <Button buttonType={item.buttonType || 'primary'} isActive leftIcon={item.icon} narrow onClick={item.onClick}>
           {item.text}
         </Button>
       </div>
     );
   }
 
+  renderNewButton(item, index) {
+    return this.renderButton({ ...item, icon: 'plus' }, index);
+  }
+
   renderNavItem(item, index) {
     return (
       <SideNavItem
@@ -68,6 +72,8 @@ class HubSidebar extends PureComponent {
         </Text>
         {section.items.map((item, itemIndex) => {
           switch (item.type) {
+            case 'button':
+              return this.renderButton(item, itemIndex);
             case 'newButton':
               return this.renderNewButton(item, itemIndex);
             case 'navItem':

package/src/components/InputGroup.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { FormGroup, FormControl, ControlLabel, HelpBlock } from 'react-bootstrap';
+import { COLOUR_RED } from '../colours';
+
+function InputGroup({ id, label, help, showError, required, ...props }) {
+  return (
+    <FormGroup controlId={id} validationState={showError ? 'error' : null}>
+      <ControlLabel>
+        <span>{label}</span>
+        {required && <span style={{ color: COLOUR_RED, marginLeft: 5 }}>*</span>}
+      </ControlLabel>
+      <FormControl {...props} />
+      {help && <HelpBlock>{help}</HelpBlock>}
+    </FormGroup>
+  );
+}
+
+export { InputGroup };

package/src/components/index.js

@@ -38,3 +38,4 @@ export * from './OptionsSection';
 export * from './DropdownInput';
 export * from './MakerPopup';
 export * from './ExportCsvPopup';
+export * from './InputGroup';