@salesgenterp/ui-components 0.4.70 → 0.4.72

package/dist/index.modern.js

@@ -229,12 +229,12 @@ var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _
 var CardsBox = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  /* min-height: 1000px; */\n  position: relative;\n  max-width: 860px;\n  margin-right: auto;\n  padding: 1em 2em;\n  display: ", ";\n  grid-template-columns: 1fr 1fr;\n  flex-direction: column;\n  align-items: flex-start;\n  grid-gap: 1em;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 20px;\n  @media only screen and (max-width: 960px) {\n    display: flex;\n  }\n  @media only screen and (max-width: 640px) {\n    padding: 1em 0.2em;\n  }\n"])), function (props) {
   return props.retail ? 'grid' : 'flex';
 });
-var CartHeading = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  /* margin-bottom: 2em; */\n  margin-left: 1em;\n\n  h1 {\n    font-weight: 600;\n    font-size: 2.0375em;\n    text-transform: capitalize;\n    color: inherit;\n    /* margin-bottom: 1em; */\n  }\n  p {\n    font-size: 1em;\n    color: black;\n  }\n"])));
+var CartHeading = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  /* margin-bottom: 2em; */\n  margin-left: 2em;\n  margin-top: 1em;\n\n  h1 {\n    font-weight: 600;\n    font-size: 2.0375em;\n    text-transform: capitalize;\n    color: inherit;\n    /* margin-bottom: 1em; */\n  }\n  p {\n    font-size: 0.875em;\n    color: black;\n    margin-top: 0.5em;\n  }\n"])));
 var Loader = styled.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(TableCell)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n  && {\n    padding-bottom: 1em !important;\n    border: none !important;\n    font-size: 0.75rem;\n    background: ", ";\n    font-family: 'karla-fonts';\n  }\n  span {\n    font-size: 0.75rem;\n  }\n"])), function (props) {
   return "" + props.bg;
 });
-var CartTableContainer = styled(TableContainer)(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n  max-height: 580px;\n  min-height: 400px;\n  padding-right: 1.5em;\n\n  &::-webkit-scrollbar {\n    width: ", ";\n  }\n\n  /* Track */\n  &::-webkit-scrollbar-track {\n    background: ", ";\n    background: ", ";\n    border-radius: 16px;\n    width: 100%;\n  }\n\n  /* Handle */\n  &::-webkit-scrollbar-thumb {\n    border-radius: 16px;\n    margin: 5px 2px;\n    background: ", ";\n    border: 3px solid;\n    border-color: #fae8e5;\n  }\n  @media screen and (max-width: 750px) {\n    padding: 0;\n  }\n"])), function (props) {
+var CartTableContainer = styled(TableContainer)(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n  max-height: 580px;\n  min-height: 460px;\n  padding-right: 1.5em;\n\n  &::-webkit-scrollbar {\n    width: ", ";\n  }\n\n  /* Track */\n  &::-webkit-scrollbar-track {\n    background: ", ";\n    background: ", ";\n    border-radius: 16px;\n    width: 100%;\n  }\n\n  /* Handle */\n  &::-webkit-scrollbar-thumb {\n    border-radius: 16px;\n    margin: 5px 2px;\n    background: ", ";\n    border: 3px solid;\n    border-color: #fae8e5;\n  }\n  @media screen and (max-width: 750px) {\n    padding: 0;\n  }\n"])), function (props) {
   return props.retail ? '12px' : '10px';
 }, function (props) {
   return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
@@ -243,7 +243,7 @@ var CartTableContainer = styled(TableContainer)(_templateObject7$1 || (_template
 }, function (props) {
   return props.color || '#ef9687';
 });
-var CartButtonsRow = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  align-items: center;\n  button {\n    background: ", ";\n    color: ", ";\n    padding: 0.5em 1em;\n    margin-right: 2em;\n    font-size: 0.85em;\n    text-transform: uppercase;\n    border: none;\n    cursor: pointer;\n    transition: 0.4s;\n    &:hover {\n      transform: scale(0.9);\n    }\n  }\n"])), function (props) {
+var CartButtonsRow = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  align-items: center;\n  padding-right: 1.85em;\n  button {\n    background: ", ";\n    color: ", ";\n    padding: 0.5em 1em;\n    margin-left: 1em;\n    font-size: 0.85em;\n    text-transform: uppercase;\n    border: none;\n    cursor: pointer;\n    transition: 0.4s;\n    &:hover {\n      transform: scale(0.9);\n    }\n  }\n"])), function (props) {
   return props.bg || 'rgba(253, 0, 21, 1)';
 }, function (props) {
   return props.color || 'white';
@@ -1362,7 +1362,7 @@ var CartTableRow = styled(TableRow)(_templateObject3$3 || (_templateObject3$3 =
   return props.size || '1.19rem';
 });
 var CartTableCell$1 = styled(TableCell)(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n  && {\n    border: none !important;\n    font-family: 'karla-fonts';\n  }\n"])));
-var QuantityBox = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n  height: 1.7em;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  div {\n    /* width:30px; */\n    min-height: 100%;\n    aspect-ratio: 1.15/1;\n    display: grid;\n    place-items: center;\n    font-size: 0.75em;\n    color: white;\n    background-color: #323232;\n    cursor: pointer;\n  }\n  .price {\n    background: transparent;\n    cursor: auto;\n    background: #ffffff;\n    border: 1px solid #ebebeb;\n    p {\n      color: #5e5c5c;\n      font-size: 0.685em;\n      font-weight: 500;\n    }\n  }\n  .add {\n    background-color: #ebebeb;\n    color: #323232;\n  }\n"])));
+var QuantityBox = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n  height: 1.7em;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  div {\n    /* width:30px; */\n    min-height: 100%;\n    aspect-ratio: 1.15/1;\n    display: grid;\n    place-items: center;\n    font-size: 0.65em;\n    color: white;\n    background-color: #323232;\n    cursor: pointer;\n  }\n  .price {\n    background: transparent;\n    cursor: auto;\n    background: #ffffff;\n    border: 1px solid #ebebeb;\n    p {\n      color: #5e5c5c;\n      font-size: 0.685em;\n      font-weight: 500;\n    }\n  }\n  .add {\n    background-color: #ebebeb;\n    color: #323232;\n  }\n"])));
 var DeleteBtn = styled.div(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  border-radius: 50%;\n  width: 20px;\n  height: 20px;\n  background: #eef1f4;\n  color: #393f48;\n  font-size: 0.75em;\n  transition: 0.4s;\n  &:hover {\n    background: red;\n    color: white;\n  }\n"])));
 
 var CardRow = function CardRow(_ref) {
@@ -1396,6 +1396,7 @@ var CardRow = function CardRow(_ref) {
       background: styles === null || styles === void 0 ? void 0 : (_styles$Btn = styles.Btn) === null || _styles$Btn === void 0 ? void 0 : _styles$Btn.background
     }
   }), /*#__PURE__*/React__default.createElement(Checkbox, {
+    size: "small",
     color: "primary",
     checked: isItemSelected,
     inputProps: {
@@ -1432,7 +1433,11 @@ var CardRow = function CardRow(_ref) {
       if (loading) return;
       handleIncrementDecrement('decrement', row);
     }
-  }, /*#__PURE__*/React__default.createElement(AiOutlineMinus, null)), /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(AiOutlineMinus, {
+    style: {
+      fontSize: 'inherit'
+    }
+  })), /*#__PURE__*/React__default.createElement("div", {
     className: "price"
   }, /*#__PURE__*/React__default.createElement("p", null, row === null || row === void 0 ? void 0 : row.quantity)), /*#__PURE__*/React__default.createElement("div", {
     className: "add",
@@ -1441,7 +1446,11 @@ var CardRow = function CardRow(_ref) {
       if (loading) return;
       handleIncrementDecrement('increment', row);
     }
-  }, /*#__PURE__*/React__default.createElement(AiOutlinePlus, null)))), /*#__PURE__*/React__default.createElement(CartTableCell$1, {
+  }, /*#__PURE__*/React__default.createElement(AiOutlinePlus, {
+    style: {
+      fontSize: 'inherit'
+    }
+  })))), /*#__PURE__*/React__default.createElement(CartTableCell$1, {
     alig: "center",
     className: "CartnoPaddingSm"
   }, /*#__PURE__*/React__default.createElement("p", {
@@ -1526,6 +1535,7 @@ function EnhancedTableHead(props) {
     padding: "checkbox",
     bg: styles.bg
   }, /*#__PURE__*/createElement(Checkbox, {
+    size: "small",
     color: "primary",
     indeterminate: numSelected > 0 && numSelected < rowCount,
     checked: rowCount > 0 && numSelected === rowCount,
@@ -1794,7 +1804,7 @@ var CartPageMainRetail = function CartPageMainRetail(_ref) {
 };
 
 var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$4, _templateObject5$4, _templateObject6$4;
-var CartSummaryContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  width: 26.375em;\n  max-width: ", ";\n  display: flex;\n  flex-direction: column;\n  background: ", ";\n  color: ", ";\n  border-radius: 28px;\n  padding: 2em 1em;\n  align-items: center;\n  margin-top: 3em;\n  p {\n    font-size: 0.89em;\n    font-weight: 300;\n    align-self: flex-start;\n    color: inherit;\n    margin: 0;\n    padding: 0;\n  }\n  .continueShopping {\n    font-size: 0.75em;\n    color: inherit;\n    text-transform: capitalize;\n    height: 20px;\n    border-bottom: 1px solid;\n    border-color: ", ";\n    font-weight: 300;\n    cursor: pointer;\n  }\n"])), function (props) {
+var CartSummaryContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  width: 26.375em;\n  max-width: ", ";\n  display: flex;\n  flex-direction: column;\n  background: ", ";\n  color: ", ";\n  border-radius: 28px;\n  padding: 2em 1em;\n  align-items: center;\n  /* margin-top: 3em; */\n  p {\n    font-size: 1.189em;\n    font-weight: 600;\n    align-self: flex-start;\n    color: inherit;\n    margin: 0;\n    padding: 0;\n  }\n  .continueShopping {\n    font-size: 0.75em;\n    color: inherit;\n    text-transform: capitalize;\n    height: 20px;\n    border-bottom: 1px solid;\n    border-color: ", ";\n    font-weight: 300;\n    cursor: pointer;\n  }\n"])), function (props) {
   return props.maxWidth || '26.375em';
 }, function (props) {
   return props.background || '#667080';
@@ -1830,7 +1840,7 @@ var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4
 }, function (props) {
   return props.Btncolor || 'inherit';
 });
-var CartSummaryCheckoutBtn = styled.button(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n  font-size: 0.95em;\n  font-weight: 700;\n  background: ", ";\n  color: ", ";\n  cursor: pointer;\n  text-transform: uppercase;\n  border: none;\n  outline: none;\n  width: 16.81em;\n  height: 3.75em;\n  display: grid;\n  place-items: center;\n  font-size: 0.75em;\n  border-radius: ", ";\n  padding: 0;\n  font-family: 'karla-fonts';\n  font-size: 0.94em;\n  margin: 1em auto;\n  transition: 0.3s;\n  margin-top: 2em;\n  &:hover {\n    opacity: 0.8;\n  }\n"])), function (props) {
+var CartSummaryCheckoutBtn = styled.button(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n  font-size: 0.95em;\n  font-weight: 700;\n  background: ", ";\n  color: ", ";\n  cursor: pointer;\n  text-transform: uppercase;\n  border: none;\n  outline: none;\n  width: 16.81em;\n  height: 3.4em;\n  display: grid;\n  place-items: center;\n  font-size: 0.75em;\n  border-radius: ", ";\n  padding: 0;\n  font-family: 'karla-fonts';\n  font-size: 0.94em;\n  margin: 1em auto;\n  transition: 0.3s;\n  margin-top: 2em;\n  &:hover {\n    opacity: 0.8;\n  }\n"])), function (props) {
   return props.background || '#393f48';
 }, function (props) {
   return props.color || 'inherit';
@@ -1861,7 +1871,7 @@ var CartSummary = function CartSummary(_ref) {
   return /*#__PURE__*/React__default.createElement(CartSummaryContainer, {
     background: cartSummary.bg,
     color: cartSummary.color
-  }, /*#__PURE__*/React__default.createElement("p", null, "Cart summary"), /*#__PURE__*/React__default.createElement(CartSummaryHr, {
+  }, /*#__PURE__*/React__default.createElement("p", null, "Cart summary:"), /*#__PURE__*/React__default.createElement(CartSummaryHr, {
     color: cartSummary.hr
   }), /*#__PURE__*/React__default.createElement(CartSummaryRow, null, /*#__PURE__*/React__default.createElement("h6", null, "subtotal"), /*#__PURE__*/React__default.createElement("h5", null, "$", subtotal === null || subtotal === void 0 ? void 0 : subtotal.toFixed(2))), /*#__PURE__*/React__default.createElement(CartSummaryHr, {
     color: cartSummary.hr