@salesgenterp/ui-components 0.4.186 → 0.4.188

package/dist/index.css

@@ -68,6 +68,7 @@ input[type='number'] {
   /* background: #fff0ec; //orlando */
   background: rgba(240, 249, 240, 1);
   border-radius: 10px;
+  border: 1px solid gray;
 }
 ._1vD5N ._yC7t2 {
   /* background: #fff0ec; //orlando */

package/dist/index.js

@@ -268,7 +268,6 @@ var CartHeading = styled__default.div(_templateObject4$1 || (_templateObject4$1
   return props.h1 || 'inherit';
 });
 var Loader = styled__default.div(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 40%;\n  left: 47%;\n  display: grid;\n  place-items: center;\n  z-index: 3;\n"])));
-
 var CartTableCell = styled__default(material.TableCell)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n  && {\n    padding-bottom: 1em !important;\n    border: none !important;\n    /* font-size: 0.75em; */\n    font-size: 1em;\n    color: rgba(98, 95, 95, 1);\n    background: ", ";\n    color: ", ";\n    font-family: 'karla-fonts';\n  }\n  &.bg-transparent {\n    background-color: transparent !important;\n    text-transform: uppercase;\n    z-index: 3 !important;\n    span {\n      font-size: 0.75em;\n      font-weight: 600;\n    }\n    svg {\n      color: ", ";\n    }\n    .MuiTableSortLabel-root {\n      color: ", "!important;\n    }\n  }\n"])), function (props) {
   return "" + props.bg;
 }, function (props) {
@@ -1459,8 +1458,7 @@ var CardRow = function CardRow(_ref) {
     id: row === null || row === void 0 ? void 0 : row.labelId,
     scope: "row",
     padding: "none"
-  }, /*#__PURE__*/React__default.createElement(ProductName
-  , null, row.productName), row.quantity > row.availableQuantity && /*#__PURE__*/React__default.createElement("p", {
+  }, /*#__PURE__*/React__default.createElement(ProductName, null, row.productName), row.quantity > row.availableQuantity && /*#__PURE__*/React__default.createElement("p", {
     className: "outOfStock"
   }, "out of stock")), /*#__PURE__*/React__default.createElement(CartTableCell$1, {
     align: "center",
@@ -1552,7 +1550,6 @@ var headCells = [{
   filter: false,
   noBelowSm: true
 }];
-
 function EnhancedTableHead(props) {
   var _styles$cartSummary, _styles$cartSummary2;
   var onSelectAllClick = props.onSelectAllClick,
@@ -1599,8 +1596,7 @@ function EnhancedTableHead(props) {
       className: "bg-transparent " + ((headCell === null || headCell === void 0 ? void 0 : headCell.noBelowSm) && 'CartnoBelowSm'),
       bg: styles === null || styles === void 0 ? void 0 : styles.bg,
       color: styles === null || styles === void 0 ? void 0 : (_styles$cartSummary3 = styles.cartSummary) === null || _styles$cartSummary3 === void 0 ? void 0 : _styles$cartSummary3.color
-    }, headCell.filter ? /*#__PURE__*/React.createElement(TableSortLabel
-    , {
+    }, headCell.filter ? /*#__PURE__*/React.createElement(TableSortLabel, {
       active: true,
       direction: orderBy === headCell.id ? order : 'asc',
       IconComponent: function IconComponent() {
@@ -1619,7 +1615,6 @@ EnhancedTableHead.propTypes = {
   orderBy: propTypes.string.isRequired,
   rowCount: propTypes.number.isRequired
 };
-
 function EnhancedTable(_ref) {
   var _styles$scroll, _styles$scroll2, _styles$cartSummary4, _styles$Btn;
   var cartData = _ref.cartData,
@@ -1646,7 +1641,6 @@ function EnhancedTable(_ref) {
   var _React$useState4 = React.useState(cartList),
     cartArray = _React$useState4[0],
     setCartArray = _React$useState4[1];
-
   var Sort = function Sort() {
     var newArray = cartArray || [];
     var li = orderBy;
@@ -1664,13 +1658,11 @@ function EnhancedTable(_ref) {
   React.useEffect(function () {
     Sort();
   }, [order, orderBy]);
-
   var handleRequestSort = function handleRequestSort(event, property) {
     var isAsc = orderBy === property && order === 'asc';
     setOrder(isAsc ? 'desc' : 'asc');
     setOrderBy(property);
   };
-
   var handleSelectAllClick = function handleSelectAllClick(event) {
     if (selected.length < (cartArray === null || cartArray === void 0 ? void 0 : cartArray.length)) {
       var newSelected = [];
@@ -1752,7 +1744,6 @@ function EnhancedTable(_ref) {
 }
 
 var _templateObject$4, _templateObject2$4, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3, _templateObject7$2;
-
 var CartPageCard = styled__default.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n  width: min(97%, 485px);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding: 1em;\n  background: #ffffff;\n  box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05);\n  border-radius: 20px;\n  position: relative;\n"])));
 var CartPageImg = styled__default.img(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n  /* width: 95px; */\n  width: ", ";\n  height: ", ";\n  position: relative;\n  margin-right: 1em;\n"])), function (props) {
   return props.width || 'auto';
@@ -2188,10 +2179,8 @@ var DeliveryOption = styled__default.div(_templateObject11 || (_templateObject11
 }, function (props) {
   return props.hovered ? '800' : '700';
 });
-
 var CreditCard = styled__default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n  width: 70px;\n  min-height: 48px;\n  max-height: 50px;\n  background-color: white;\n  border: 3px solid rgba(217, 217, 217, 0.1);\n  display: grid;\n  place-items: center;\n  margin: auto;\n  cursor: pointer;\n  overflow: hidden;\n  border-radius: 5px;\n  transition: 0.1s;\n  border: 1px solid transparent;\n  text-align: center;\n  p {\n    font-size: 10px;\n  }\n"])));
 var PaymentLi = styled__default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  margin-bottom: 1.5em;\n  cursor: pointer;\n  .circle {\n    /* background: #323232; */\n    width: 16px;\n    height: 16px;\n    display: grid;\n    place-items: center;\n    border-radius: 50%;\n    border: 1px solid #323232;\n    margin-right: 1em;\n  }\n  .innerCircle {\n    background: #323232;\n    border-radius: 50%;\n    width: 6px;\n    height: 6px;\n  }\n  p {\n    font-size: 1em;\n    color: black;\n    text-transform: capitalize;\n    font-weight: 500;\n  }\n"])));
-
 var StyledTableRow = styled__default(material.TableRow)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n  && {\n    box-shadow: none;\n    border: none;\n    background-color: ", ";\n    p {\n      font-size: 0.9em;\n      font-family: 'karla-fonts';\n    }\n    .max {\n      min-width: max-content;\n    }\n    .red {\n      color: ", "\n      font-weight: inherit;\n    }\n    .light {\n      font-weight: 300;\n    }\n    .price {\n      font-weight: 600;\n    }\n    .sm {\n      font-weight: 500;\n    }\n    .bolder {\n      font-weight: 700;\n      font-size: 1em;\n    }\n    @media only screen and (max-width: 640px) {\n      p {\n        font-size: 12px;\n      }\n      .sm {\n        font-size: 10px;\n      }\n      .price,\n      .red {\n        font-size: 10px;\n      }\n      .total {\n        font-size: 14px;\n      }\n      .bolder {\n        font-size: 12px;\n      }\n    }\n  }\n"])), function (props) {
   return props.colored ? props.bg || "'rgba(255, 240, 236, 1)'" : 'white';
 }, function (props) {
@@ -2228,8 +2217,7 @@ var CheckoutInput = function CheckoutInput(_ref) {
       return /*#__PURE__*/React__default.createElement(material.TextField, _extends({
         placeholder: placeholder,
         variant: "outlined",
-        required: true
-        ,
+        required: true,
         InputProps: showIcon ? {
           startAdornment: /*#__PURE__*/React__default.createElement(material.InputAdornment, {
             position: "start"
@@ -2661,13 +2649,11 @@ var Step1 = function Step1(_ref) {
     addStore(data);
     setSelectedStore((_stores$ = stores[0]) === null || _stores$ === void 0 ? void 0 : _stores$.id);
   };
-
   var addAddress = function addAddress(data) {
     var _addressList$2;
     addStoreAddress(data);
     setAddress((_addressList$2 = addressList[0]) === null || _addressList$2 === void 0 ? void 0 : _addressList$2.id);
   };
-
   var next = function next() {
     setBilling(address);
     setShipping(showShipping);
@@ -2761,8 +2747,7 @@ var Step1 = function Step1(_ref) {
     checked: showShipping,
     icon: /*#__PURE__*/React__default.createElement(md.MdOutlineCircle, null),
     checkedIcon: /*#__PURE__*/React__default.createElement(gr.GrRadialSelected, null)
-  }), /*#__PURE__*/React__default.createElement("p", null, "Ship to a different address ")), /*#__PURE__*/React__default.createElement(ButtonRow
-  , {
+  }), /*#__PURE__*/React__default.createElement("p", null, "Ship to a different address ")), /*#__PURE__*/React__default.createElement(ButtonRow, {
     color: styles === null || styles === void 0 ? void 0 : (_styles$button3 = styles.button) === null || _styles$button3 === void 0 ? void 0 : _styles$button3.bg,
     backDisabled: true,
     handleNext: function handleNext() {
@@ -2813,7 +2798,6 @@ var Step2 = function Step2(_ref) {
   var _useState = React.useState((_addressList$ = addressList[0]) === null || _addressList$ === void 0 ? void 0 : _addressList$.id),
     address = _useState[0],
     setAddress = _useState[1];
-
   var onSubmit = function onSubmit(data) {
     addShipping(data);
     resetField('shippingAddress');
@@ -2901,10 +2885,17 @@ var CreditCardForm = function CreditCardForm(_ref) {
     handleSave = _ref.handleSave,
     showError = _ref.showError,
     data = _ref.data;
-  var name = data.name,
-    number = data.number,
-    cvc = data.cvc,
-    expiry = data.expiry;
+  var firstName = data.firstName,
+    lastName = data.lastName,
+    cardNumber = data.cardNumber,
+    cvv = data.cvv,
+    expirationMonth = data.expirationMonth,
+    expirationYear = data.expirationYear,
+    address = data.address,
+    countryId = data.countryId,
+    stateId = data.stateId,
+    city = data.city,
+    zipcode = data.zipcode;
   return /*#__PURE__*/React__default.createElement(material.Grid, {
     container: true,
     rowSpacing: 2,
@@ -2921,37 +2912,57 @@ var CreditCardForm = function CreditCardForm(_ref) {
   }, /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
     xs: 12,
-    md: 10
+    md: 6
   }, /*#__PURE__*/React__default.createElement(material.TextField, {
     required: true,
     fullWidth: true,
     onChange: handleChange,
     onFocus: handleFocus,
-    name: "name",
+    name: "firstName",
     type: "text",
-    value: name,
-    placeholder: "Card Holder's Name*"
-  }), showError && name.length < 3 ? /*#__PURE__*/React__default.createElement("p", {
+    value: firstName,
+    placeholder: "Card Holder's First Name*"
+  }), showError && (firstName === null || firstName === void 0 ? void 0 : firstName.length) < 3 ? /*#__PURE__*/React__default.createElement("p", {
     style: {
       color: 'red',
       marginLeft: '.5em',
       paddingTop: '.4em',
       fontSize: '.95em'
     }
-  }, "Please enter a valid Card Holder's Name") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+  }, "Please enter a valid Card Holder's First Name") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
     xs: 12,
-    md: 10
+    md: 6
   }, /*#__PURE__*/React__default.createElement(material.TextField, {
     required: true,
     fullWidth: true,
     onChange: handleChange,
     onFocus: handleFocus,
-    name: "number",
+    name: "lastName",
+    type: "text",
+    value: lastName,
+    placeholder: "Card Holder's Last Name*"
+  }), showError && (lastName === null || lastName === void 0 ? void 0 : lastName.length) < 3 ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a valid Card Holder's Last Name") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    md: 12
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "cardNumber",
     type: "number",
-    value: number,
+    value: cardNumber,
     placeholder: "Card Nubmers   xxxx-xxxx-xxxx-xxxx"
-  }), showError && number.length < 14 || showError && number.length > 16 ? /*#__PURE__*/React__default.createElement("p", {
+  }), showError && (cardNumber === null || cardNumber === void 0 ? void 0 : cardNumber.length) < 14 || showError && (cardNumber === null || cardNumber === void 0 ? void 0 : cardNumber.length) > 16 ? /*#__PURE__*/React__default.createElement("p", {
     style: {
       color: 'red',
       marginLeft: '.5em',
@@ -2961,37 +2972,57 @@ var CreditCardForm = function CreditCardForm(_ref) {
   }, "Please enter a valid card Number") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
     xs: 12,
-    sm: 5
+    sm: 4
   }, /*#__PURE__*/React__default.createElement(material.TextField, {
     required: true,
     fullWidth: true,
     onChange: handleChange,
     onFocus: handleFocus,
-    name: "expiry",
+    name: "expirationMonth",
     type: "number",
-    value: expiry,
-    placeholder: "Expiration Date  MM/YYYY "
-  }), showError && expiry.length < 4 || showError && expiry.length > 6 ? /*#__PURE__*/React__default.createElement("p", {
+    value: expirationMonth,
+    placeholder: "Expiration Month  MM "
+  }), showError && (expirationMonth === null || expirationMonth === void 0 ? void 0 : expirationMonth.length) !== 2 ? /*#__PURE__*/React__default.createElement("p", {
     style: {
       color: 'red',
       marginLeft: '.5em',
       paddingTop: '.4em',
       fontSize: '.95em'
     }
-  }, "Please enter a valid date.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+  }, "Please enter a valid Month.") : ''), ' ', /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
     xs: 12,
-    sm: 3.5
+    sm: 4
   }, /*#__PURE__*/React__default.createElement(material.TextField, {
     required: true,
     fullWidth: true,
     onChange: handleChange,
     onFocus: handleFocus,
-    name: "cvc",
+    name: "expirationYear",
+    type: "number",
+    value: expirationYear,
+    placeholder: "Expiration Year YY "
+  }), showError && (expirationYear === null || expirationYear === void 0 ? void 0 : expirationYear.length) !== 2 ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a valid year.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    sm: 4
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "cvv",
     type: "number",
     placeholder: "CVC/CVV  ***",
-    value: cvc
-  }), showError && cvc.length < 3 || showError && cvc.length > 4 ? /*#__PURE__*/React__default.createElement("p", {
+    value: cvv
+  }), showError && (cvv === null || cvv === void 0 ? void 0 : cvv.length) < 3 || showError && (cvv === null || cvv === void 0 ? void 0 : cvv.length) > 4 ? /*#__PURE__*/React__default.createElement("p", {
     style: {
       color: 'red',
       marginLeft: '.5em',
@@ -2999,6 +3030,106 @@ var CreditCardForm = function CreditCardForm(_ref) {
       fontSize: '.95em'
     }
   }, "Please enter a valid cvv.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    md: 12
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "address",
+    type: "text",
+    value: address,
+    placeholder: "Address"
+  }), showError && (address === null || address === void 0 ? void 0 : address.length) < 1 ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a valid Address") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    sm: 3
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "countryId",
+    type: "number",
+    value: countryId,
+    placeholder: "Country"
+  }), showError && !countryId ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a country.") : ''), ' ', /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    sm: 3
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "stateId",
+    type: "number",
+    value: stateId,
+    placeholder: "State"
+  }), showError && !stateId ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a State.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    sm: 3
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "city",
+    type: "text",
+    placeholder: "CIty",
+    value: city
+  }), showError && (city === null || city === void 0 ? void 0 : city.length) < 1 ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a valid cvv.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
+    item: true,
+    xs: 12,
+    sm: 3
+  }, /*#__PURE__*/React__default.createElement(material.TextField, {
+    required: true,
+    fullWidth: true,
+    onChange: handleChange,
+    onFocus: handleFocus,
+    name: "zipcode",
+    type: "number",
+    placeholder: "Zip code",
+    value: zipcode
+  }), showError && (zipcode === null || zipcode === void 0 ? void 0 : zipcode.length) < 1 ? /*#__PURE__*/React__default.createElement("p", {
+    style: {
+      color: 'red',
+      marginLeft: '.5em',
+      paddingTop: '.4em',
+      fontSize: '.95em'
+    }
+  }, "Please enter a Zip code.") : ''), /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
     xs: 12
   }, /*#__PURE__*/React__default.createElement(SaveButton, {
@@ -3025,11 +3156,17 @@ var PaymentForm = /*#__PURE__*/function (_React$Component) {
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
     _this.state = {
-      cvc: '',
-      expiry: '',
-      focus: '',
-      name: '',
-      number: '',
+      firstName: '',
+      lastName: '',
+      cardNumber: '',
+      cvv: '',
+      expirationMonth: '',
+      expirationYear: '',
+      address: '',
+      countryId: '',
+      stateId: '',
+      city: '',
+      zipcode: '',
       showError: false
     };
     _this.handleInputFocus = function (e) {
@@ -3042,27 +3179,9 @@ var PaymentForm = /*#__PURE__*/function (_React$Component) {
       var _e$target = e.target,
         name = _e$target.name,
         value = _e$target.value;
-      console.log(name);
       _this.setState((_this$setState = {}, _this$setState[name] = value, _this$setState));
     };
     _this.handleSave = function (e) {
-      var _this$state = _this.state,
-        name = _this$state.name,
-        number = _this$state.number,
-        cvc = _this$state.cvc,
-        expiry = _this$state.expiry;
-      if (name.length < 3) return _this.setState({
-        showError: true
-      });
-      if (number.length < 14 || number.length > 16) return _this.setState({
-        showError: true
-      });
-      if (cvc.length < 3 || cvc.length > 4) return _this.setState({
-        showError: true
-      });
-      if (expiry.length < 4 || expiry.length > 6) return _this.setState({
-        showError: true
-      });
       _this.props.handleSave(_this.state);
     };
     return _this;
@@ -3074,10 +3193,10 @@ var PaymentForm = /*#__PURE__*/function (_React$Component) {
       id: "PaymentForm"
     }, /*#__PURE__*/React__default.createElement(Cards, {
       cvc: this.state.cvc,
-      expiry: this.state.expiry,
+      expiry: "" + this.state.expirationMonth + this.state.expirationYear,
       focused: this.state.focus,
-      name: this.state.name,
-      number: this.state.number
+      name: this.state.firstName + " " + this.state.lastName,
+      number: this.state.cardNumber
     }), /*#__PURE__*/React__default.createElement(CreditCardForm, {
       handleChange: this.handleInputChange,
       handleFocus: this.handleInputFocus,
@@ -3351,8 +3470,7 @@ var Step4 = function Step4(_ref) {
     xs: 11,
     sm: 11,
     md: 11.5
-  }, /*#__PURE__*/React__default.createElement(material.Box
-  , null, /*#__PURE__*/React__default.createElement("textarea", {
+  }, /*#__PURE__*/React__default.createElement(material.Box, null, /*#__PURE__*/React__default.createElement("textarea", {
     rows: "3",
     cols: "4",
     placeholder: "Comments for the order....",
@@ -3589,8 +3707,7 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
       handleNext: handleNext,
       setShipping: setShowShipping,
       setBilling: setBilling,
-      stores: userStores
-      ,
+      stores: userStores,
       addStore: addStore,
       selectedStore: selectedStore,
       setSelectedStore: setSelectedStore,
@@ -3612,8 +3729,7 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
       setShipping: setShipping,
       showShipping: showShipping,
       selectedStore: selectedStore,
-      stores: userStores
-      ,
+      stores: userStores,
       addShipping: addStoreAddress,
       setSelectedCountry: setSelectedCountry,
       styles: styles
@@ -3809,7 +3925,6 @@ var SideMenuItemComponent = function SideMenuItemComponent(props) {
     primaryColor = props.primaryColor,
     list = props.list,
     onTabChange = props.onTabChange;
-
   if (!link || typeof link !== 'string') {
     return /*#__PURE__*/React__default.createElement(material.ListItem, {
       button: true,
@@ -3819,7 +3934,6 @@ var SideMenuItemComponent = function SideMenuItemComponent(props) {
       primaryColor: primaryColor
     });
   }
-
   return /*#__PURE__*/React__default.createElement(material.ListItem, {
     button: true,
     className: className,
@@ -3909,9 +4023,7 @@ var SideMenuItemComponentContainer = styles.styled(SideMenuItemComponent)(functi
     '& .MuiTypography-root': {
       fontWeight: '600 '
     },
-    '&:hover': {
-    },
-
+    '&:hover': {},
     '& svg': {
       fontSize: 22,
       color: list ? active ? "#fff" : '#fff' : primaryColor
@@ -4432,7 +4544,6 @@ var APITable = React.forwardRef(function (_ref, ref) {
     }));
     handleTableChange(pagination);
   };
-
   var setTableDataOnRef = function setTableDataOnRef() {
     if (ref) {
       ref.current = {
@@ -7241,7 +7352,7 @@ var AccountDetails = function AccountDetails(_ref) {
   var _ref$apiEndPoint = _ref.apiEndPoint,
     apiEndPoint = _ref$apiEndPoint === void 0 ? 'https://dev.salesgent.xyz/api' : _ref$apiEndPoint,
     _ref$token = _ref.token,
-    token = _ref$token === void 0 ? 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJzYWxlc2dlbnRlcnBAZ21haWwuY29tIiwidGllciI6MiwidXNlclR5cGUiOiJDdXN0b21lciIsInRva2VuVHlwZSI6ImFjY2VzcyIsInN0b3JlSWQiOjIsImV4cCI6MTY2OTE1MjMxNSwidXNlcklkIjoyNDU1LCJpYXQiOjE2NjkxMTYzMTUsInJlc2V0UGFzc3dvcmRSZXF1aXJlZCI6ZmFsc2V9.LBAhktVAWcjT3z4mc_gVaWyzm6MRi2lu6YFaJf4FAXI' : _ref$token,
+    token = _ref$token === void 0 ? 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJzYWxlc2dlbnRlcnBAZ21haWwuY29tIiwidGllciI6MiwidXNlclR5cGUiOiJDdXN0b21lciIsInRva2VuVHlwZSI6ImFjY2VzcyIsInN0b3JlSWQiOjIsImV4cCI6MTY3MDI2ODk4OSwidXNlcklkIjoyNDU1LCJpYXQiOjE2NzAyMzI5ODksInJlc2V0UGFzc3dvcmRSZXF1aXJlZCI6ZmFsc2V9.-SdkA9CatCY-g4ln5ZU9hKsYvBfoTPspZV_hSQHo8wI' : _ref$token,
     _ref$primaryColor = _ref.primaryColor,
     primaryColor = _ref$primaryColor === void 0 ? '#D2122E' : _ref$primaryColor,
     secondaryColor = _ref.secondaryColor,
@@ -7442,7 +7553,7 @@ var AccountDetails = function AccountDetails(_ref) {
     image: storeData === null || storeData === void 0 ? void 0 : (_storeData$ = storeData[0]) === null || _storeData$ === void 0 ? void 0 : _storeData$.logoUrl,
     alt: "image",
     style: {
-      marginBottom: '1rem'
+      padding: '0 3rem 1rem'
     }
   }), /*#__PURE__*/React__default.createElement(SideMenu, {
     primaryColor: colors.primaryColor,
@@ -7486,8 +7597,7 @@ var AccountDetails = function AccountDetails(_ref) {
       textTransform: 'capitalize',
       fontSize: '1.4rem'
     }
-  },
-  tabValue)), /*#__PURE__*/React__default.createElement(material.IconButton, {
+  }, tabValue)), /*#__PURE__*/React__default.createElement(material.IconButton, {
     color: "inherit",
     "aria-label": "open drawer",
     onClick: function onClick() {