beem-component 1.7.8 → 1.8.0

package/dist/components/iconStyles.js

@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CopyToClipBoard = exports.BmTagIcon = exports.BmSupport = exports.BmQuickReplyIcon = exports.BmIcons = exports.BmEmojiIcon = exports.BmChatbotIcon = exports.BmChatbot = exports.BmButtonIcon = exports.BmAvatarIcon = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styles = require("@material-ui/core/styles");
-
 var _SvgIcon = _interopRequireDefault(require("@material-ui/core/SvgIcon"));
-
 var _colors = require("./colors");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 var size = function size(props) {
   if (props.size === 'xsmall') return '1.143rem !important';
   if (props.size === 'small') return '1.429rem !important';
@@ -25,9 +18,9 @@ var size = function size(props) {
   if (props.size === 'xlarge') return '2.286rem !important';
   if (!props.size) return '1.714rem !important';
   return props.size;
-}; // Button Icons
-
+};
 
+// Button Icons
 var ButtonIcon = {
   root: {
     height: function height(props) {
@@ -38,9 +31,8 @@ var ButtonIcon = {
     },
     fill: function fill(_ref) {
       var variant = _ref.variant,
-          disabled = _ref.disabled,
-          color = _ref.color;
-
+        disabled = _ref.disabled,
+        color = _ref.color;
       if (!disabled) {
         if (variant === 'active') return "".concat(_colors.BmPrimaryWhite);
         if (variant === 'enabled') return "".concat(_colors.BmPrimaryBlack);
@@ -52,15 +44,13 @@ var ButtonIcon = {
         if (variant === 'tertiary') return "".concat(color || _colors.BmPrimaryBlue);
         return "".concat(_colors.BmPrimaryWhite);
       }
-
       return "".concat(_colors.BmGrey400);
     },
     color: function color(_ref2) {
       var variant = _ref2.variant,
-          disabled = _ref2.disabled,
-          _color = _ref2.color;
+        disabled = _ref2.disabled,
+        _color = _ref2.color;
       if (_color) return _color;
-
       if (!disabled) {
         if (variant === 'active') return "".concat(_colors.BmPrimaryWhite);
         if (variant === 'enabled') return "".concat(_colors.BmPrimaryBlack);
@@ -72,7 +62,6 @@ var ButtonIcon = {
         if (variant === 'tertiary') return "".concat(_color || _colors.BmPrimaryBlue);
         return "".concat(_colors.BmPrimaryWhite);
       }
-
       return "".concat(_colors.BmGrey400);
     }
   }
@@ -84,10 +73,10 @@ var BmButtonIcon = (0, _styles.withStyles)(ButtonIcon)(function (props) {
       action: true
     }, props));
   }
-
   return null;
-}); // Tags
+});
 
+// Tags
 exports.BmButtonIcon = BmButtonIcon;
 var TagIcon = {
   root: {
@@ -99,23 +88,19 @@ var TagIcon = {
     },
     fill: function fill(_ref3) {
       var variant = _ref3.variant,
-          color = _ref3.color;
-
+        color = _ref3.color;
       if (color) {
         return color;
       }
-
       if (variant === 'neutral' || variant === 'light') return "".concat(_colors.BmPrimaryBlack);
       return "".concat(_colors.BmPrimaryWhite);
     },
     color: function color(_ref4) {
       var variant = _ref4.variant,
-          _color2 = _ref4.color;
-
+        _color2 = _ref4.color;
       if (_color2) {
         return _color2;
       }
-
       if (variant === 'neutral' || variant === 'light') return "".concat(_colors.BmPrimaryBlack);
       return "".concat(_colors.BmPrimaryWhite);
     }
@@ -128,12 +113,11 @@ var BmTagIcon = (0, _styles.withStyles)(TagIcon)(function (props) {
       action: true
     }, props));
   }
-
   return null;
-}); // Avatar Icons
+});
 
+// Avatar Icons
 exports.BmTagIcon = BmTagIcon;
-
 var Avatarsize = function Avatarsize(props) {
   if (props.size === 'xsmall') return '0.857rem !important';
   if (props.size === 'small') return '1.143rem !important';
@@ -142,7 +126,6 @@ var Avatarsize = function Avatarsize(props) {
   if (!props.size) return '2.286rem !important';
   return props.size;
 };
-
 var AvatarIcon = {
   root: {
     fill: function fill(props) {
@@ -166,10 +149,10 @@ var BmAvatarIcon = (0, _styles.withStyles)(AvatarIcon)(function (props) {
       action: true
     }, props));
   }
-
   return null;
-}); // check on sizing
+});
 
+// check on sizing
 exports.BmAvatarIcon = BmAvatarIcon;
 var BmChatbotIcon = (0, _styles.withStyles)(AvatarIcon)(function (props) {
   return /*#__PURE__*/_react.default.createElement(_SvgIcon.default, _extends({
@@ -178,18 +161,17 @@ var BmChatbotIcon = (0, _styles.withStyles)(AvatarIcon)(function (props) {
     d: "M19 8.975V6C19 5.46957 18.7893 4.96086 18.4142 4.58579C18.0391 4.21072 17.5304 4 17 4H11V2.688C11.305 2.414 11.5 2.02 11.5 1.578C11.5 1.18018 11.342 0.798647 11.0607 0.517343C10.7794 0.236038 10.3978 0.0780029 10 0.0780029C9.60218 0.0780029 9.22064 0.236038 8.93934 0.517343C8.65804 0.798647 8.5 1.18018 8.5 1.578C8.5 2.02 8.695 2.414 9 2.688V4H3C2.46957 4 1.96086 4.21072 1.58579 4.58579C1.21071 4.96086 1 5.46957 1 6V8.998L0.928 9.003C0.675888 9.02097 0.439955 9.13382 0.26775 9.31883C0.095544 9.50384 -0.000132994 9.74725 1.38752e-07 10V12C1.38752e-07 12.2652 0.105357 12.5196 0.292893 12.7071C0.48043 12.8946 0.734784 13 1 13V18C1 18.5304 1.21071 19.0391 1.58579 19.4142C1.96086 19.7893 2.46957 20 3 20H17C17.5304 20 18.0391 19.7893 18.4142 19.4142C18.7893 19.0391 19 18.5304 19 18V13C19.2652 13 19.5196 12.8946 19.7071 12.7071C19.8946 12.5196 20 12.2652 20 12V10.062C20.0116 9.90681 19.9869 9.75104 19.928 9.607C19.726 9.119 19.293 9.002 19 8.975ZM5 10C5 8.896 5.672 8 6.5 8C7.328 8 8 8.896 8 10C8 11.104 7.328 12 6.5 12C5.672 12 5 11.104 5 10ZM13.998 16C12.997 15.997 6.001 16 6 16V14C6 14 13.001 13.998 14.002 14L13.998 16ZM13.5 12C12.672 12 12 11.104 12 10C12 8.896 12.672 8 13.5 8C14.328 8 15 8.896 15 10C15 11.104 14.328 12 13.5 12Z",
     fill: props.color || 'white'
   }));
-}); // To be refacotored
-// Emoji Icons
+});
 
+// To be refacotored
+// Emoji Icons
 exports.BmChatbotIcon = BmChatbotIcon;
-
 var EmojiSize = function EmojiSize() {
   // if (props.size === "small") return "1.429rem";
   // if (props.size === "medium") return "1.714rem";
   // if (props.size === "large") return "1.714rem";
   return '2.286rem !important';
 };
-
 var EmojiIcon = {
   root: {
     fill: function fill(props) {
@@ -213,7 +195,6 @@ var BmEmojiIcon = (0, _styles.withStyles)(EmojiIcon)(function (props) {
       action: true
     }, props));
   }
-
   return null;
 });
 exports.BmEmojiIcon = BmEmojiIcon;
@@ -251,7 +232,6 @@ var BmIcons = (0, _styles.withStyles)(icon)(function (props) {
       fill: props.color
     }));
   }
-
   return null;
 });
 exports.BmIcons = BmIcons;

package/dist/components/index-copy.js

@@ -1185,101 +1185,52 @@ Object.defineProperty(exports, "Overlay", {
     return _noteModalHeader.Overlay;
   }
 });
-
 var _avatars = require("./avatars");
-
 var _buttonAlertIcons = require("./buttonAlertIcons");
-
 var _buttonIconsOnly = require("./buttonIconsOnly");
-
 var _buttons = require("./buttons");
-
 var _checkboxToggler = require("./checkboxToggler");
-
 var _dropdown = require("./dropdown");
-
 var _input = require("./input");
-
 var _logo = require("./logo");
-
 var _search = require("./search");
-
 var _Accordicon = require("./Accordicon");
-
 var _Link = require("./Link");
-
 var _tabs = require("./tabs");
-
 var _tags = require("./tags");
-
 var _navbar = require("./navbar");
-
 var _iconStyles = require("./iconStyles");
-
 var _loaders = require("./loaders");
-
 var _globalStyles = require("./globalStyles");
-
 var _chat = require("./Chats/chat");
-
 var _chatInput = require("./Chats/chatInput");
-
 var _chatwrapper = require("./Chats/chatwrapper");
-
 var _sidebar = require("./sidebar");
-
 var _contacts = require("./contacts");
-
 var _customerInfo = require("../components/CustomerInfo/customerInfo");
-
 var _customerInfoBar = require("../components/CustomerInfo/customerInfoBar");
-
 var _dropdownButton = require("./dropdownButton");
-
 var _dropdownItems = require("./dropdownItems");
-
 var _progressbar = require("../components/progressbar");
-
 var _infoAccordion = require("../components/CustomerInfo/infoAccordion");
-
 var _chatHeader = require("./chatHeader");
-
 var _wrapper = require("./wrapper");
-
 var _noteModalHeader = require("./Modals/noteModalHeader");
-
 var _noteModalBody = require("./Modals/noteModalBody");
-
 var _noteModalFooter = require("./Modals/noteModalFooter");
-
 var _buttons2 = require("./Reports/buttons");
-
 var _cards = require("./Reports/cards");
-
 var _reportsBody = require("./Reports/reportsBody");
-
 var _title = require("./Reports/title");
-
 var _infoHeader = require("./Reports/infoHeader");
-
 var _charts = require("./Reports/charts");
-
 var _modalBody = require("./Modals/modalBody");
-
 var _listheader = require("./Lists/listheader");
-
 var _rowLabels = require("./Lists/rowLabels");
-
 var _index = require("./SuperFluid/Content/index");
-
 var _index2 = require("./SuperFluid/ContentTitle.js/index.js");
-
 var _index3 = require("./SuperFluid/SegmentCard/index");
-
 var _infoNote = require("./infoNote");
-
 var _checkbox = require("./checkbox");
-
 var _notesInfo = require("./CustomerInfo/notesInfo");
-
 var _labelsInfo = require("./CustomerInfo/labelsInfo");

package/dist/components/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -336,91 +335,47 @@ Object.defineProperty(exports, "MainWrapper", {
     return _MainWrapper.MainWrapper;
   }
 });
-
 var _Accordion = _interopRequireDefault(require("./Accordion/Accordion"));
-
 var _avatars = _interopRequireDefault(require("./Avatars/avatars"));
-
 var _buttonAlertIcons = require("./Buttons/buttonAlertIcons");
-
 var _buttonIconsOnly = require("./Buttons/buttonIconsOnly");
-
 var _buttons = require("./Buttons/buttons");
-
 var _cards = _interopRequireDefault(require("./Cards/cards"));
-
 var _dropdownButton = require("./dropdownButton");
-
 var _globalStyles = require("./globalStyles");
-
 var _input = require("./input");
-
 var _link = require("./RouteLink/link");
-
 var _listheader = require("./Lists/listheader");
-
 var _rowLabels = require("./Lists/rowLabels");
-
 var _listBox = require("./Lists/listBox");
-
 var _modal = _interopRequireDefault(require("./Modals/modal"));
-
 var _progressbar = require("./ProgressBar/progressbar");
-
 var _tabs = require("./Tabs/tabs");
-
 var BmColors = _interopRequireWildcard(require("./colors"));
-
 exports.BmColors = BmColors;
-
 var _loader = require("./Loader/loader");
-
 var _checkbox = require("./checkbox");
-
 var _tags = require("./Tags/tags");
-
 var _bannerCards = _interopRequireDefault(require("./BannerCard/bannerCards"));
-
 var _progressRing = _interopRequireDefault(require("./ProgressRing/progressRing"));
-
 var _ProfileIcon = require("./ProfileIcon/ProfileIcon");
-
 var _checkboxToggler = require("./Checkbox/checkboxToggler");
-
 var _paymentBox = _interopRequireDefault(require("./PaymentBox/paymentBox"));
-
 var _iconStyles = require("./iconStyles");
-
 var _noteBar = require("./NoteBar/noteBar");
-
 var _MainWrapper = require("./MainWrapper");
-
 var _chatBody = _interopRequireDefault(require("./ChatComponents/ChatBody/chatBody"));
-
 var _chatHeader = require("./ChatComponents/ChatHeader/chatHeader");
-
 var _contactCards = _interopRequireDefault(require("./ChatComponents/ContactCards/contactCards"));
-
 var _infoTab = _interopRequireDefault(require("./ChatComponents/InfoTab/infoTab"));
-
 var _messageCounter = _interopRequireDefault(require("./MessageCounter/messageCounter"));
-
 var _FormAccordion = _interopRequireDefault(require("./ChatComponents/FormAccordion/FormAccordion"));
-
 var _LabelAccordion = _interopRequireDefault(require("./ChatComponents/LabelAccordion/LabelAccordion"));
-
 var _NoteAccordion = _interopRequireDefault(require("./ChatComponents/NoteAccordion/NoteAccordion"));
-
 var _colorPicker = require("./ChatComponents/ColorPicker/colorPicker");
-
 var _index = require("./SuperFluid/Content/index");
-
 var _ContentTitle = require("./SuperFluid/ContentTitle.js");
-
 var _index2 = require("./SuperFluid/SegmentCard/index");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/input.js

@@ -4,99 +4,71 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.BmInputField = exports.BmInput = void 0;
-
 var _icons = require("@material-ui/icons");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _iconStyles = require("./iconStyles");
-
 var _colors = require("./colors");
-
-var _excluded = ["id", "iconSize", "label", "state"];
-
+var _excluded = ["id", "iconSize", "label", "state", "action"];
 var _templateObject, _templateObject2, _templateObject3;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var BmInputLabel = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-family: Open Sans;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 0.929rem;\n  line-height: 1.286rem;\n  height: 1.286rem;\n  letter-spacing: -0.02em;\n  color: ", ";\n  padding-top: 0.571rem;\n"])), function (_ref) {
+var BmInputLabel = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n  padding-top: 0.5rem;\n"])), function (_ref) {
   var state = _ref.state;
-
   if (state) {
     if (state === 'incomplete') return "".concat(_colors.BmSecondaryRed);
     return "".concat(_colors.BmSecondaryGrey);
   }
-
   return "".concat(_colors.BmSecondaryGrey);
 });
-
-var BmInputField = _styledComponents.default.input(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 0.786rem 1.143rem;\n  letter-spacing: -0.02em;\n  color: ", ";\n  border: none;\n  letter-spacing: -0.02em;\n  text-align: left;\n  margin: 0rem; /*added */\n\n  ::placeholder {\n    color: ", ";\n  }\n  background: ", ";\n  &:visited,\n  &:active,\n  &:hover,\n  &:focus {\n    outline: none !important;\n    text-decoration: none;\n    color: ", ";\n  }\n  }\n"])), function (_ref2) {
+var BmInputField = _styledComponents.default.input(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\n  padding: 0.7rem 1rem;\n  color: ", ";\n  border: none;\n  text-align: left;\n  margin: 0rem; /*added */\n\n  ::placeholder {\n    color: ", ";\n  }\n  background: ", ";\n  &:visited,\n  &:active,\n  &:hover,\n  &:focus {\n    outline: none !important;\n    text-decoration: none;\n    color: ", ";\n  }\n  }\n"])), function (_ref2) {
   var state = _ref2.state;
-
   if (state) {
     if (state === 'disabled') return "".concat(_colors.BmGrey400);
     return "".concat(_colors.BmPrimaryBlack);
   }
-
   return "".concat(_colors.BmPrimaryBlack);
 }, _colors.BmSecondaryGrey, function (_ref3) {
   var state = _ref3.state;
-
   if (state) {
     if (state === 'pressed') return "".concat(_colors.BmGrey50); // TODO: to be reviewed
-
     if (state === 'positive') return "".concat(_colors.BmSecondaryGreen15);
     if (state === 'negative') return "".concat(_colors.BmSecondaryRed15);
     if (state === 'disabled') return "".concat(_colors.BmGrey100);
     return "".concat(_colors.BmPrimaryWhite);
   }
-
   return "".concat(_colors.BmPrimaryWhite);
 }, _colors.BmPrimaryBlack);
-
 exports.BmInputField = BmInputField;
-
-var BmInputWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: center;\n  align-items: center;\n  height: 2.929rem;\n  border-radius: 0.25rem;\n  padding: 0rem;\n  background: ", ";\n\n  border: ", ";\n  &:visited,\n  &:active,\n  &:hover,\n  &:focus {\n    border: 0.071rem solid ", ";\n  }\n"])), function (_ref4) {
+var BmInputWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: inline-flex;\n  flex-direction: center;\n  align-items: center;\n  border-radius: 0.25rem;\n  padding: 0rem;\n  background: ", ";\n\n  border: ", ";\n  &:visited,\n  &:active,\n  &:hover,\n  &:focus {\n    border: 0.071rem solid ", ";\n  }\n  > * {\n    margin-right: 0.5rem;\n  }\n"])), function (_ref4) {
   var state = _ref4.state;
-
   if (state) {
     if (state === 'pressed') return "".concat(_colors.BmGrey50);
     if (state === 'positive') return "".concat(_colors.BmSecondaryGreen15);
     if (state === 'disabled') return "".concat(_colors.BmGrey100);
-    return "".concat(_colors.BmPrimaryWhite);
+    return 'transparent';
   }
-
-  return "".concat(_colors.BmPrimaryWhite);
+  return 'transparent';
 }, function (_ref5) {
   var state = _ref5.state;
-
   if (state) {
     if (state === 'positive') return "0.071rem solid ".concat(_colors.BmSecondaryDarkGreen);
     if (state === 'negative') return "0.071rem solid ".concat(_colors.BmSecondaryRed);
     if (state === 'disabled') return "0.071rem solid ".concat(_colors.BmGrey100);
     return "0.071rem solid ".concat(_colors.BmGrey400);
   }
-
   return "0.071rem solid ".concat(_colors.BmGrey400);
 }, _colors.BmPrimaryBlack);
-
 var BmInput = function BmInput(_ref6) {
   var id = _ref6.id,
-      iconSize = _ref6.iconSize,
-      label = _ref6.label,
-      state = _ref6.state,
-      rest = _objectWithoutProperties(_ref6, _excluded);
-
+    iconSize = _ref6.iconSize,
+    label = _ref6.label,
+    state = _ref6.state,
+    action = _ref6.action,
+    rest = _objectWithoutProperties(_ref6, _excluded);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(BmInputWrapper, _extends({
     state: state
   }, rest), /*#__PURE__*/_react.default.createElement(BmInputField, _extends({
@@ -104,16 +76,21 @@ var BmInput = function BmInput(_ref6) {
   }, rest, {
     state: state,
     disabled: state === 'disabled'
-  })), state && state === 'complete' && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, {
+  })), action && action === 'complete' && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, {
     icon: /*#__PURE__*/_react.default.createElement(_icons.ErrorOutline, null),
-    size: "small"
-  }), state && state === 'incomplete' && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, {
+    size: iconSize || 'small',
+    color: _colors.BmSecondaryDarkGreen
+  }), action && action === 'incomplete' && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, {
+    size: iconSize || 'small',
     icon: /*#__PURE__*/_react.default.createElement(_icons.Done, null),
-    size: "small"
+    color: _colors.BmSecondaryRed
+  }), action && action === 'pending' && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, {
+    size: iconSize || 'small',
+    icon: /*#__PURE__*/_react.default.createElement(_icons.Update, null),
+    color: _colors.BmPrimaryGold
   })), label && /*#__PURE__*/_react.default.createElement(BmInputLabel, _extends({
     htmlFor: id,
     state: state
   }, rest), label));
 };
-
 exports.BmInput = BmInput;

package/dist/components/logo.js

@@ -4,38 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Logo = exports.BmLogo = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _excluded = ["src"];
-
 var _templateObject;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var Logo = _styledComponents.default.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 45;\n  width: 9.857rem;\n  ", "\n  box-sizing: border-box;\n"])), ""
-/* border: 0.071rem solid #33B1BA; */
-);
-
+var Logo = _styledComponents.default.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 45;\n  width: 9.857rem;\n  ", "\n  box-sizing: border-box;\n"])), "" /* border: 0.071rem solid #33B1BA; */);
 exports.Logo = Logo;
-
 var BmLogo = function BmLogo(_ref) {
   var src = _ref.src,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    rest = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(Logo, _extends({
     src: src
   }, rest));
 };
-
 exports.BmLogo = BmLogo;

package/dist/components/navbar.js

@@ -4,43 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.OldBmNavbar = exports.GlobalNavbarWrapper = exports.BmNavbarSearch = exports.BmNavbarLogo = exports.BmNavbarItems = exports.BmNavbar = exports.BmNavBarProfile = void 0;
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _colors = require("./colors");
-
 var _search = require("./search");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 // Old with NavbarContent Main wrapper for navbar
-var BmNavbar = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    background: ", ";\n    box-shadow:  0rem 0.286rem 0.214rem rgba(0, 0, 0, 0.25);\n    padding: 0rem 2.5rem !important;\n    flex-wrap: wrap;\n    ", "\n  }\n"])), _colors.BmPrimaryWhite, ""
-/* width: 100vw; */
-); //  Spacing between the contents of navbar
-
+var BmNavbar = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    background: ", ";\n    box-shadow:  0rem 0.286rem 0.214rem rgba(0, 0, 0, 0.25);\n    padding: 0rem 2.5rem !important;\n    flex-wrap: wrap;\n    ", "\n  }\n"])), _colors.BmPrimaryWhite, "" /* width: 100vw; */);
 
+//  Spacing between the contents of navbar
 exports.BmNavbar = BmNavbar;
-
 var BmNavbarItems = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  padding: 1.429rem 0rem !important;\n  flex-wrap: wrap;\n"])));
-
 exports.BmNavbarItems = BmNavbarItems;
+var GlobalNavbarWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n"])));
 
-var GlobalNavbarWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n"]))); // Main wrapper for navbar
-
-
+// Main wrapper for navbar
 exports.GlobalNavbarWrapper = GlobalNavbarWrapper;
-var OldBmNavbar = (0, _styledComponents.default)(GlobalNavbarWrapper)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    flex-direction: row;\n    padding: 1.429rem 2.5rem !important;\n    background: ", ";\n    box-shadow:  0rem 0.286rem 0.214rem rgba(0, 0, 0, 0.25);\n  }\n"])), _colors.BmPrimaryWhite); // Navbar Profile Icon Wrapper
+var OldBmNavbar = (0, _styledComponents.default)(GlobalNavbarWrapper)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    flex-direction: row;\n    padding: 1.429rem 2.5rem !important;\n    background: ", ";\n    box-shadow:  0rem 0.286rem 0.214rem rgba(0, 0, 0, 0.25);\n  }\n"])), _colors.BmPrimaryWhite);
 
+// Navbar Profile Icon Wrapper
 exports.OldBmNavbar = OldBmNavbar;
-var BmNavBarProfile = (0, _styledComponents.default)(GlobalNavbarWrapper)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  @media (max-width: 768px) {\n   display: none !important;\n  }\n"]))); // Navbar Search Icon Wrapper
+var BmNavBarProfile = (0, _styledComponents.default)(GlobalNavbarWrapper)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  @media (max-width: 768px) {\n   display: none !important;\n  }\n"])));
 
+// Navbar Search Icon Wrapper
 exports.BmNavBarProfile = BmNavBarProfile;
-var BmNavbarSearch = (0, _styledComponents.default)(_search.BmSearch)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 30vw;\n  @media (max-width: 768px) {\n    display: none !important;\n  }\n"]))); // Navbar Logo Icon Wrapper
+var BmNavbarSearch = (0, _styledComponents.default)(_search.BmSearch)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 30vw;\n  @media (max-width: 768px) {\n    display: none !important;\n  }\n"])));
 
+// Navbar Logo Icon Wrapper
 exports.BmNavbarSearch = BmNavbarSearch;
 var BmNavbarLogo = (0, _styledComponents.default)(GlobalNavbarWrapper)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral([""])));
 exports.BmNavbarLogo = BmNavbarLogo;