@salesgenterp/ui-components 0.4.229 → 0.4.231

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1189,7 +1189,8 @@ var Dashboard = function Dashboard(_ref) {
1189
1189
  sectionLeftImageSection = _ref.sectionLeftImageSection,
1190
1190
  sectionRightImageSection = _ref.sectionRightImageSection,
1191
1191
  discountImageSection = _ref.discountImageSection,
1192
- hideDiscountImage = _ref.hideDiscountImage;
1192
+ hideDiscountImage = _ref.hideDiscountImage,
1193
+ imgNotFoundUrl = _ref.imgNotFoundUrl;
1193
1194
  var _useState = React.useState({}),
1194
1195
  customerData = _useState[0],
1195
1196
  setCustomerData = _useState[1];
@@ -1548,7 +1549,7 @@ var Dashboard = function Dashboard(_ref) {
1548
1549
  }
1549
1550
  })), /*#__PURE__*/React__default.createElement(CardMediaContainer, {
1550
1551
  component: "img",
1551
- image: "/images/imgnotfound.jpeg",
1552
+ image: imgNotFoundUrl || '/images/imgnotfound.jpeg',
1552
1553
  alt: "image"
1553
1554
  }), /*#__PURE__*/React__default.createElement(material.Grid, {
1554
1555
  container: true,
@@ -1797,7 +1798,8 @@ var MyProfile = function MyProfile(_ref) {
1797
1798
  token = _ref.token,
1798
1799
  primaryColor = _ref.primaryColor,
1799
1800
  secondaryColor = _ref.secondaryColor,
1800
- fontColor = _ref.fontColor;
1801
+ fontColor = _ref.fontColor,
1802
+ imgNotFoundUrl = _ref.imgNotFoundUrl;
1801
1803
  var _useState = React.useState(false),
1802
1804
  isLoading = _useState[0],
1803
1805
  setIsLoading = _useState[1];
@@ -1867,7 +1869,7 @@ var MyProfile = function MyProfile(_ref) {
1867
1869
  item: true
1868
1870
  }, /*#__PURE__*/React__default.createElement(CardMediaContainer$1, {
1869
1871
  component: "img",
1870
- image: "/images/imgnotfound.jpeg",
1872
+ image: imgNotFoundUrl || '/images/imgnotfound.jpeg',
1871
1873
  alt: "image"
1872
1874
  })), /*#__PURE__*/React__default.createElement(material.Grid, {
1873
1875
  item: true,
@@ -3750,7 +3752,8 @@ var AccountDetails = function AccountDetails(_ref) {
3750
3752
  sectionLeftImageSection = _ref.sectionLeftImageSection,
3751
3753
  sectionRightImageSection = _ref.sectionRightImageSection,
3752
3754
  discountImageSection = _ref.discountImageSection,
3753
- hideDiscountImage = _ref.hideDiscountImage;
3755
+ hideDiscountImage = _ref.hideDiscountImage,
3756
+ imgNotFoundUrl = _ref.imgNotFoundUrl;
3754
3757
  var serviceApiEndPoint = apiEndPoint.replace('/api', '/services/pdf');
3755
3758
  var isMobile = useMediaQuery('(max-width:800px)');
3756
3759
  var _useState = React.useState(true),
@@ -3864,7 +3867,8 @@ var AccountDetails = function AccountDetails(_ref) {
3864
3867
  sectionLeftImageSection: sectionLeftImageSection,
3865
3868
  sectionRightImageSection: sectionRightImageSection,
3866
3869
  discountImageSection: discountImageSection,
3867
- hideDiscountImage: hideDiscountImage
3870
+ hideDiscountImage: hideDiscountImage,
3871
+ imgNotFoundUrl: imgNotFoundUrl
3868
3872
  });
3869
3873
  case 'My Profile':
3870
3874
  return /*#__PURE__*/React__default.createElement(MyProfile, {
@@ -3876,7 +3880,8 @@ var AccountDetails = function AccountDetails(_ref) {
3876
3880
  backgroundColor: colors.backgroundColor,
3877
3881
  fontColor: colors.fontColor,
3878
3882
  storeIdList: storeIdList,
3879
- defaultStoreId: defaultStoreId
3883
+ defaultStoreId: defaultStoreId,
3884
+ imgNotFoundUrl: imgNotFoundUrl
3880
3885
  });
3881
3886
  case 'Store List':
3882
3887
  return /*#__PURE__*/React__default.createElement(StoreList, {
@@ -4207,7 +4212,7 @@ var CartPageSection = styled__default.section(_templateObject$o || (_templateObj
4207
4212
  }, function (props) {
4208
4213
  return props.bg || '#FAE8E5';
4209
4214
  });
4210
- var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 2em 2.5em;\n padding-bottom: 3em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n border-color: #fae8e5;\n /* border-color: ", "; */\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\n\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
4215
+ var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 2em 2.5em;\n padding-bottom: 3em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\n\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
4211
4216
  return props.maxWidth || '1620px';
4212
4217
  }, function (props) {
4213
4218
  return "min(" + (props.maxWidth || '1620px') + ",100%)";
@@ -4218,9 +4223,7 @@ var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObje
4218
4223
  }, function (props) {
4219
4224
  return props.ScrollBg || 'rgba(102, 112, 128, 0.5)';
4220
4225
  }, function (props) {
4221
- return props.retail ? '#BFC3CA' : '#EDEDED';
4222
- }, function (props) {
4223
- return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
4226
+ return props.color || '#BFC3CA';
4224
4227
  });
4225
4228
  var CardsBox = styled__default.div(_templateObject3$a || (_templateObject3$a = _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) {
4226
4229
  return props.retail ? 'grid' : 'flex';
@@ -4231,7 +4234,7 @@ var CartHeading = styled__default.div(_templateObject4$7 || (_templateObject4$7
4231
4234
  return props.h1 || 'inherit';
4232
4235
  });
4233
4236
  var Loader$1 = styled__default.div(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
4234
- var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_templateObject6$4 = _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) {
4237
+ var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_templateObject6$4 = _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) {
4235
4238
  return "" + props.bg;
4236
4239
  }, function (props) {
4237
4240
  return "" + props.color || 'inherit';
@@ -4240,14 +4243,12 @@ var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_
4240
4243
  }, function (props) {
4241
4244
  return "" + props.color || 'inherit';
4242
4245
  });
4243
- var CartTableContainer = styled__default(material.TableContainer)(_templateObject7$3 || (_templateObject7$3 = _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) {
4246
+ var CartTableContainer = styled__default(material.TableContainer)(_templateObject7$3 || (_templateObject7$3 = _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 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 }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
4244
4247
  return props.retail ? '12px' : '10px';
4245
4248
  }, function (props) {
4246
- return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
4247
- }, function (props) {
4248
- return props.bg || '#fdccc480';
4249
+ return 'rgba(102, 112, 128, 0.5)';
4249
4250
  }, function (props) {
4250
- return props.color || '#ef9687';
4251
+ return props.color;
4251
4252
  });
4252
4253
  var CartButtonsRow = styled__default.div(_templateObject8$2 || (_templateObject8$2 = _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) {
4253
4254
  return props.bg || 'rgba(253, 0, 21, 1)';
@@ -5490,7 +5491,7 @@ var headCells = [{
5490
5491
  }, {
5491
5492
  id: 'name',
5492
5493
  numeric: false,
5493
- disablePadding: true,
5494
+ disablePadding: false,
5494
5495
  label: 'Name',
5495
5496
  filter: false
5496
5497
  }, {
@@ -5672,7 +5673,7 @@ function EnhancedTable(_ref) {
5672
5673
  paddingBottom: "2em"
5673
5674
  }, /*#__PURE__*/React.createElement(CartTableContainer, {
5674
5675
  bg: styles === null || styles === void 0 ? void 0 : (_styles$scroll = styles.scroll) === null || _styles$scroll === void 0 ? void 0 : _styles$scroll.bg,
5675
- color: styles === null || styles === void 0 ? void 0 : (_styles$scroll2 = styles.scroll) === null || _styles$scroll2 === void 0 ? void 0 : _styles$scroll2.background
5676
+ color: styles === null || styles === void 0 ? void 0 : (_styles$scroll2 = styles.scroll) === null || _styles$scroll2 === void 0 ? void 0 : _styles$scroll2.color
5676
5677
  }, /*#__PURE__*/React.createElement(Table, {
5677
5678
  "aria-labelledby": "tableTitle",
5678
5679
  size: 'small',
@@ -6034,6 +6035,7 @@ var CartSummary = function CartSummary(_ref) {
6034
6035
  };
6035
6036
 
6036
6037
  var CartPageComponent = function CartPageComponent(_ref) {
6038
+ var _styles$input;
6037
6039
  var apiEndPoint = _ref.apiEndPoint,
6038
6040
  token = _ref.token,
6039
6041
  retail = _ref.retail,
@@ -6084,7 +6086,8 @@ var CartPageComponent = function CartPageComponent(_ref) {
6084
6086
  h1: styles === null || styles === void 0 ? void 0 : styles.h1
6085
6087
  }, /*#__PURE__*/React__default.createElement("h1", null, "Shopping Cart"), /*#__PURE__*/React__default.createElement("p", null, "You have ", cartData === null || cartData === void 0 ? void 0 : cartData.totalCartQuantity, " items in your cart")), /*#__PURE__*/React__default.createElement(CartPageContainer, {
6086
6088
  retail: retail,
6087
- loading: loading
6089
+ loading: loading,
6090
+ color: styles === null || styles === void 0 ? void 0 : (_styles$input = styles.input) === null || _styles$input === void 0 ? void 0 : _styles$input.color
6088
6091
  }, retail ? /*#__PURE__*/React__default.createElement(CartPageMainRetail, {
6089
6092
  retail: retail,
6090
6093
  cartData: cartData,
@@ -6748,7 +6751,7 @@ var CartPageSection$1 = styled__default.section(_templateObject$v || (_templateO
6748
6751
  }, function (props) {
6749
6752
  return props.bg || '#FAE8E5';
6750
6753
  });
6751
- var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 2em 2.5em;\n padding-bottom: 3em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n border-color: #fae8e5;\n /* border-color: ", "; */\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\n\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
6754
+ var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 2em 2.5em;\n padding-bottom: 3em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\n\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
6752
6755
  return props.maxWidth || '1620px';
6753
6756
  }, function (props) {
6754
6757
  return "min(" + (props.maxWidth || '1620px') + ",100%)";
@@ -6759,9 +6762,7 @@ var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateOb
6759
6762
  }, function (props) {
6760
6763
  return props.ScrollBg || 'rgba(102, 112, 128, 0.5)';
6761
6764
  }, function (props) {
6762
- return props.retail ? '#BFC3CA' : '#EDEDED';
6763
- }, function (props) {
6764
- return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
6765
+ return props.color || '#BFC3CA';
6765
6766
  });
6766
6767
  var CardsBox$1 = styled__default.div(_templateObject3$f || (_templateObject3$f = _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) {
6767
6768
  return props.retail ? 'grid' : 'flex';
@@ -6772,7 +6773,7 @@ var CartHeading$1 = styled__default.div(_templateObject4$c || (_templateObject4$
6772
6773
  return props.h1 || 'inherit';
6773
6774
  });
6774
6775
  var Loader$2 = styled__default.div(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
6775
- var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 || (_templateObject6$9 = _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 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) {
6776
+ var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 || (_templateObject6$9 = _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 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) {
6776
6777
  return "" + props.bg;
6777
6778
  }, function (props) {
6778
6779
  return "" + props.color || 'inherit';
@@ -6781,14 +6782,14 @@ var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 ||
6781
6782
  }, function (props) {
6782
6783
  return "" + props.color || 'inherit';
6783
6784
  });
6784
- var CartTableContainer$1 = styled__default(material.TableContainer)(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right: 1.5em;\n overflow: inherit !important;\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) {
6785
+ var CartTableContainer$1 = styled__default(material.TableContainer)(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right: 1.5em;\n overflow: inherit !important;\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 }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
6785
6786
  return props.retail ? '12px' : '10px';
6786
6787
  }, function (props) {
6787
6788
  return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
6788
6789
  }, function (props) {
6789
6790
  return props.bg || '#fdccc480';
6790
6791
  }, function (props) {
6791
- return props.color || '#ef9687';
6792
+ return props.color || 'red';
6792
6793
  });
6793
6794
  var CartButtonsRow$1 = styled__default.div(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding-right: 1.85em;\n button {\n display: flex;\n align-items: center;\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 font-size: 1rem;\n font-weight: 600;\n svg {\n margin-right: 0.4rem;\n }\n &:hover {\n transform: scale(0.95);\n }\n }\n"])), function (props) {
6794
6795
  return props.bg || 'rgba(253, 0, 21, 1)';
@@ -6806,7 +6807,7 @@ var headCells$1 = [{
6806
6807
  }, {
6807
6808
  id: 'name',
6808
6809
  numeric: false,
6809
- disablePadding: true,
6810
+ disablePadding: false,
6810
6811
  label: 'Name',
6811
6812
  filter: false
6812
6813
  }, {
@@ -6989,7 +6990,7 @@ function ProductTable(_ref) {
6989
6990
  paddingBottom: "2em"
6990
6991
  }, /*#__PURE__*/React.createElement(CartTableContainer$1, {
6991
6992
  bg: styles === null || styles === void 0 ? void 0 : (_styles$scroll = styles.scroll) === null || _styles$scroll === void 0 ? void 0 : _styles$scroll.bg,
6992
- color: styles === null || styles === void 0 ? void 0 : (_styles$scroll2 = styles.scroll) === null || _styles$scroll2 === void 0 ? void 0 : _styles$scroll2.background
6993
+ color: styles === null || styles === void 0 ? void 0 : (_styles$scroll2 = styles.scroll) === null || _styles$scroll2 === void 0 ? void 0 : _styles$scroll2.color
6993
6994
  }, /*#__PURE__*/React.createElement(Table, {
6994
6995
  "aria-labelledby": "tableTitle",
6995
6996
  size: 'small',
@@ -7434,14 +7435,12 @@ var CheckoutPageContainer = styled__default.div(_templateObject$A || (_templateO
7434
7435
  });
7435
7436
  var Row = styled__default.div(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n"])));
7436
7437
  var CheckoutMainWithHeader = styled__default(material.Stack)(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose([""])));
7437
- var CheckoutMain = styled__default.div(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: 1008px;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n margin-right: 2em;\n max-height: 65vh;\n padding-right: 2em;\n overflow-y: auto;\n position: relative;\n padding-top: 2em;\n padding-bottom: 3em;\n /* width */\n ::-webkit-scrollbar {\n width: 10px;\n background: ", ";\n border-radius: 16px;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 3px solid ", ";\n /* border: 3px solid black; */\n }\n @media only screen and (max-width: 1488px) {\n margin-bottom: 3em;\n min-height: max-content;\n max-height: max-content;\n margin-right: 0;\n overflow: visible;\n }\n @media only screen and (max-width: 788px) {\n max-width: 100vw;\n padding-right: 0;\n width: 98vw;\n min-width: 90vw;\n padding-top: 1em;\n }\n /* overflow: hidden; */\n"])), function (props) {
7438
- return props.bg || 'rgba(245, 197, 189, 0.5)';
7439
- }, function (props) {
7440
- return props.bg || 'rgba(245, 197, 189, 0.5)';
7438
+ var CheckoutMain = styled__default.div(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: 1008px;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n margin-right: 2em;\n max-height: 65vh;\n padding-right: 2em;\n overflow-y: auto;\n position: relative;\n padding-top: 2em;\n padding-bottom: 3em;\n /* width */\n ::-webkit-scrollbar {\n width: 10px;\n background: ", ";\n border-radius: 16px;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n }\n @media only screen and (max-width: 1488px) {\n margin-bottom: 3em;\n min-height: max-content;\n max-height: max-content;\n margin-right: 0;\n overflow: visible;\n }\n @media only screen and (max-width: 788px) {\n max-width: 100vw;\n padding-right: 0;\n width: 98vw;\n min-width: 90vw;\n padding-top: 1em;\n }\n /* overflow: hidden; */\n"])), function (props) {
7439
+ return props.bg || 'rgba(102,112,128,0.5)';
7441
7440
  }, function (props) {
7442
- return props.color || '#ef9687';
7441
+ return props.bg || 'rgba(102,112,128,0.5)';
7443
7442
  }, function (props) {
7444
- return props.bg || 'rgba(245, 197, 189, 0.5)';
7443
+ return props.color;
7445
7444
  });
7446
7445
  var CheckoutHeading = styled__default.div(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteralLoose(["\n margin-left: 2.5em;\n margin-bottom: 2em;\n h5 {\n font-size: 2.3em;\n font-weight: 600;\n text-transform: capitalize;\n }\n p {\n font-size: 0.875em;\n font-weight: 300;\n margin-top: 0.5em;\n }\n @media only screen and (max-width: 788px) {\n margin-left: 0;\n padding-left: 1em;\n }\n"])));
7447
7446
  var CheckoutHeader = styled__default(Row)(_templateObject6$a || (_templateObject6$a = _taggedTemplateLiteralLoose(["\n justify-content: space-around;\n display: flex;\n flex-direction: row;\n align-items: center;\n position: sticky;\n top: 0;\n background-color: white;\n z-index: 1;\n justify-content: flex-start;\n min-height: 4.18em;\n max-height: 4.1875em;\n max-width: 57.43em;\n width: 98%;\n background: #ffffff;\n border-radius: 20px;\n margin-bottom: 1em;\n margin-right: 0.35em;\n color: #7d7b7b;\n padding: 0 2em;\n margin-right: 5em;\n .row {\n display: flex;\n color: inherit;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n text-transform: capitalize;\n margin-right: 2.4%;\n .icon {\n font-size: 14px;\n font-weight: 400;\n display: grid;\n place-items: center;\n margin-right: 6px;\n color: inherit;\n }\n p,\n span {\n font-size: 0.95em;\n color: inherit;\n font-weight: 300;\n }\n }\n .checked {\n p,\n span {\n color: #323232;\n }\n .icon {\n color: #249937;\n }\n }\n @media only screen and (max-width: 1508px) {\n margin-right: 2em;\n }\n @media only screen and (max-width: 788px) {\n width: 100%;\n padding: 2em 1em;\n margin: 1.4em 0;\n .row {\n margin-right: 4.5%;\n p {\n font-size: 12px;\n }\n span {\n display: none;\n }\n }\n }\n"])));
@@ -7453,7 +7452,7 @@ var CheckoutSummaryContainer = styled__default.div(_templateObject$B || (_templa
7453
7452
  }, function (props) {
7454
7453
  return props.color || ' rgba(50, 50, 50, 1)';
7455
7454
  });
7456
- var TextRow = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 90%;\n margin-bottom: 1em;\n padding-bottom: 1em;\n width: 90%;\n border-bottom: 1px solid rgba(250, 232, 229, 1);\n .text {\n font-size: 1.1em;\n font-weight: 300;\n text-transform: capitalize;\n }\n .total {\n font-size: 1.65em;\n font-weight: 800;\n }\n"])));
7455
+ var TextRow = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 90%;\n margin-bottom: 1em;\n padding-bottom: 1em;\n width: 90%;\n border-bottom: 1px solid #f7f7f7;\n .text {\n font-size: 1.1em;\n font-weight: 300;\n text-transform: capitalize;\n }\n .total {\n font-size: 1.65em;\n font-weight: 800;\n }\n"])));
7457
7456
  var FilledInfo = styled__default.div(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteralLoose(["\n margin-bottom: 2em;\n .heading {\n font-size: 1.25em;\n font-weight: 800;\n margin-bottom: 0.8em;\n }\n\n p {\n font-size: 0.875em;\n font-weight: 300;\n text-transform: capitalize;\n max-width: 60%;\n }\n .bold {\n font-weight: 700;\n margin-bottom: 0.8em;\n max-width: 300px;\n width: fit-content;\n }\n .payment {\n width: 70px;\n height: 48px;\n background: #ffffff;\n border-radius: 15.875px;\n display: grid;\n place-items: center;\n overflow: hidden;\n }\n .blank {\n padding-bottom: 2em;\n opacity: 0;\n }\n"])));
7458
7457
 
7459
7458
  var CheckoutSummary = function CheckoutSummary(_ref) {
@@ -7510,10 +7509,12 @@ var CheckoutSummary = function CheckoutSummary(_ref) {
7510
7509
 
7511
7510
  var _templateObject$C, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$c, _templateObject6$b, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject10$2, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1;
7512
7511
  var StepContainer = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n width: 100%;\n min-width: 57.43em;\n max-width: 57.43em;\n background: white;\n padding: 1em 2em;\n background: #ffffff;\n border-radius: 20px;\n margin-left: 2em;\n margin-top: -2em;\n margin-bottom: 1em;\n @media screen and (max-width: 1305px) {\n width: 80vw;\n min-width: 0;\n }\n @media screen and (max-width: 768px) {\n width: 96%;\n margin-left: 1em;\n padding: 0.8em;\n }\n @media screen and (max-width: 540px) {\n width: 94%;\n margin-left: 1.2em;\n }\n"])));
7513
- var StepsContent = styled__default.div(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose(["\n padding-left: 1.565em;\n min-height: max-content;\n .MuiOutlinedInput-root {\n background: ", ";\n }\n\n p {\n font-size: 0.75em;\n }\n .bold {\n text-transform: uppercase;\n word-spacing: 5px;\n margin-top: 0.95em;\n span {\n font-weight: 600;\n cursor: pointer;\n font-size: 0.94rem;\n }\n .red {\n color: red;\n }\n }\n @media screen and (max-width: 768px) {\n padding: 0;\n width: 100%;\n }\n"])), function (props) {
7514
- return (props.bg || 'transparent') + '!important';
7512
+ var StepsContent = styled__default.div(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose(["\n padding-left: 1.565em;\n min-height: max-content;\n .MuiOutlinedInput-root {\n background: ", ";\n }\n\n p {\n font-size: 0.75em;\n }\n .bold {\n text-transform: uppercase;\n word-spacing: 5px;\n margin-top: 0.95em;\n span {\n font-weight: 600;\n cursor: pointer;\n font-size: 0.94rem;\n }\n .red {\n color: ", ";\n }\n }\n @media screen and (max-width: 768px) {\n padding: 0;\n width: 100%;\n }\n"])), function (props) {
7513
+ return 'transparent' + '!important';
7514
+ }, function (props) {
7515
+ return props.bg || 'red';
7515
7516
  });
7516
- var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n font-family: 'karla-fonts';\n color: #323232;\n /* padding: ", "; */\n margin-bottom: ", ";\n margin-top: ", ";\n margin-left: ", ";\n /* color: grey; */\n border-bottom: 1px solid #fff0ec;\n background: #ffffff;\n border-radius: 20px;\n max-width: 919px;\n\n min-height: 4.35em;\n max-height: 4.35em;\n padding: ", ";\n h5 {\n font-size: 16px;\n font-weight: 600;\n text-transform: capitalize;\n margin-left: 0.6em;\n }\n .icon {\n font-size: 1.3em;\n margin-right: 8px;\n }\n .dropIcon {\n font-size: 1.4em;\n cursor: pointer;\n transform: rotate(-90deg);\n transition: 0.3s;\n color: rgba(50, 50, 50, 0.75);\n cursor: ", ";\n }\n .red {\n font-weight: 600;\n color: #fd0015;\n font-size: inherit;\n }\n @media screen and (max-width: 768px) {\n max-width: 97%;\n margin-left: 0.5em;\n padding-right: 1em;\n h5 {\n font-size: 12px;\n }\n }\n"])), function (props) {
7517
+ var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n font-family: 'karla-fonts';\n color: #323232;\n /* padding: ", "; */\n margin-bottom: ", ";\n margin-top: ", ";\n margin-left: ", ";\n /* color: grey; */\n border-bottom: 1px solid #f6f6f6;\n background: #ffffff;\n border-radius: 20px;\n max-width: 900px;\n\n min-height: 4.35em;\n max-height: 4.35em;\n padding: ", ";\n h5 {\n font-size: 16px;\n font-weight: 600;\n text-transform: capitalize;\n margin-left: 0.6em;\n }\n .icon {\n font-size: 1.3em;\n margin-right: 8px;\n }\n .dropIcon {\n font-size: 1.4em;\n cursor: pointer;\n transform: rotate(-90deg);\n transition: 0.3s;\n color: rgba(50, 50, 50, 0.75);\n cursor: ", ";\n }\n .red {\n font-weight: 600;\n color: #fd0015;\n font-size: inherit;\n }\n @media screen and (max-width: 768px) {\n max-width: 97%;\n margin-left: 0.5em;\n padding-right: 1em;\n h5 {\n font-size: 12px;\n }\n }\n"])), function (props) {
7517
7518
  return props.single ? '1.8em 2em' : '1em 0';
7518
7519
  }, function (props) {
7519
7520
  return props.single ? '-1.56em' : '1em';
@@ -7527,7 +7528,7 @@ var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateO
7527
7528
  return props.username ? 'not-allowed' : 'pointer';
7528
7529
  });
7529
7530
  var TextFeildContainer = styled__default.div(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n && {\n input {\n font-size: 0.875em !important;\n\n color: rgba(107, 106, 106, 1);\n color: black;\n &::placeholder {\n font-size: 0.975em !important;\n }\n }\n .icon {\n color: black;\n font-size: 1em;\n }\n }\n"])));
7530
- var CommonCheckoutBtn = styled__default.button(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: ", ";\n height: ", ";\n\n background: ", ";\n display: grid;\n place-items: center;\n color: white;\n margin: 0 1em;\n font-weight: 500;\n letter-spacing: 1px;\n text-transform: ", ";\n transition: 0.4s;\n cursor: ", ";\n &:hover,\n &:focus {\n opacity: 0.7;\n }\n"])), function (props) {
7531
+ var CommonCheckoutBtn = styled__default.button(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: ", ";\n height: ", ";\n background: ", ";\n display: grid;\n place-items: center;\n color: white;\n margin: 0 1em;\n font-weight: 500;\n letter-spacing: 1px;\n text-transform: ", ";\n transition: 0.4s;\n cursor: ", ";\n &:hover,\n &:focus {\n opacity: 0.7;\n }\n"])), function (props) {
7531
7532
  return props.width || '8.05em';
7532
7533
  }, function (props) {
7533
7534
  return props.height || '2.25em';
@@ -7543,7 +7544,7 @@ var Select = styled__default.div.attrs({
7543
7544
  })(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 54px;\n border-radius: 10px;\n background: ", ";\n outline: none;\n border: none;\n padding: 0 1em;\n cursor: pointer;\n select {\n width: 100%;\n height: 100%;\n border: none;\n outline: none;\n padding: 0.5em 0;\n color: rgba(107, 106, 106, 0.6);\n background: ", ";\n }\n"])), function (props) {
7544
7545
  return props.bg || 'transparent';
7545
7546
  }, function (props) {
7546
- return props.bg || 'transparent';
7547
+ return 'transparent';
7547
7548
  });
7548
7549
  var SaveButton = styled__default.button.attrs({
7549
7550
  className: 'checkout-btn'
@@ -7582,15 +7583,15 @@ var DeliveryOptionContainer = styled__default.div(_templateObject12$1 || (_templ
7582
7583
  var DeliveryOption = styled__default.div(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: 691px;\n height: 40px;\n padding: 0 1em;\n border: 1px solid transparent;\n transition: 0.3s;\n cursor: pointer;\n background-color: ", ";\n border: ", ";\n border-bottom: ", ";\n border-radius: 5px;\n &:last-child {\n border-bottom: ", ";\n }\n &:hover {\n background-color: ", ";\n border: ", ";\n border-radius: 5px;\n }\n p {\n font-weight: 500;\n color: black;\n font-size: 0.95em;\n text-transform: capitalize;\n }\n .circle {\n border-radius: 50%;\n display: grid;\n place-items: center;\n background: linear-gradient(345.48deg, #3c332a -131.29%, #ffffff 124.82%);\n margin-right: 1em;\n width: 14px;\n height: 14px;\n min-width: 14px;\n min-height: 14px;\n cursor: pointer;\n .inner {\n width: 10px;\n height: 10px;\n border-radius: 50%;\n display: grid;\n place-items: center;\n background: linear-gradient(\n 326.37deg,\n rgba(67, 58, 42, 0.9) -219.66%,\n rgba(255, 255, 255, 0.9) 90.45%\n );\n box-shadow: inset -1px -1px 1px rgba(255, 255, 255, 0.45),\n inset 0px 0px 10px rgba(0, 0, 0, 0.2);\n }\n .fill {\n width: 6px;\n height: 6px;\n background: radial-gradient(\n 15.79% 15.79% at 36.84% 31.58%,\n #ffffff 0%,\n rgba(255, 255, 255, 0) 100%\n )\n /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */,\n linear-gradient(\n 358.85deg,\n rgba(157, 18, 30, 0.2) -19.81%,\n rgba(12, 96, 157, 0) 64.74%\n ),\n radial-gradient(50% 50% at 50% 50%, #fab0b6 0%, #fd0015 100%), #fd0015;\n background-blend-mode: normal, multiply, normal, normal;\n box-shadow: 0px 0.5px 0px rgba(253, 0, 21, 0.25),\n 0px 1px 1px rgba(253, 0, 21, 0.2);\n border-radius: 50%;\n background: ", ";\n }\n }\n .amount {\n margin-left: auto;\n color: ", ";\n font-weight: ", ";\n font-size: 0.95em;\n }\n"])), function (props) {
7583
7584
  return props.hovered ? props.bg : '';
7584
7585
  }, function (props) {
7585
- return props.hovered ? "1px solid " + props.border : '1px solid #fce1d9';
7586
+ return props.hovered ? "1px solid " + props.border : "1px solid" + props.bg;
7586
7587
  }, function (props) {
7587
7588
  return !props.hovered && "none";
7588
7589
  }, function (props) {
7589
- return props.hovered ? "1px solid " + props.border : '1px solid #fce1d9';
7590
+ return props.hovered ? "1px solid " + props.border : "1px solid" + props.bg;
7590
7591
  }, function (props) {
7591
7592
  return props.bg || '#fff0ec';
7592
7593
  }, function (props) {
7593
- return props.border ? "1px solid " + props.border : '1px solid #fce1d9';
7594
+ return props.border ? "1px solid " + props.border : "1px solid" + props.bg;
7594
7595
  }, function (props) {
7595
7596
  return props.color || '#fd0015';
7596
7597
  }, function (props) {
@@ -7732,10 +7733,12 @@ var StepsHeaderComponent = function StepsHeaderComponent(_ref) {
7732
7733
  };
7733
7734
 
7734
7735
  var Step0 = function Step0(_ref) {
7736
+ var _styles$button, _styles$button2;
7735
7737
  var loading = _ref.loading,
7736
7738
  userName = _ref.userName,
7737
7739
  handleLogin = _ref.handleLogin,
7738
- clickRedirect = _ref.clickRedirect;
7740
+ clickRedirect = _ref.clickRedirect,
7741
+ styles = _ref.styles;
7739
7742
  var _useForm = reactHookForm.useForm(),
7740
7743
  control = _useForm.control,
7741
7744
  handleSubmit = _useForm.handleSubmit;
@@ -7746,7 +7749,9 @@ var Step0 = function Step0(_ref) {
7746
7749
  text: 'welcome',
7747
7750
  username: userName,
7748
7751
  icon: 1
7749
- }), /*#__PURE__*/React__default.createElement(StepsContent, null, /*#__PURE__*/React__default.createElement("p", null, "Please choose how you want to proceed"), /*#__PURE__*/React__default.createElement("p", {
7752
+ }), /*#__PURE__*/React__default.createElement(StepsContent, {
7753
+ bg: styles === null || styles === void 0 ? void 0 : (_styles$button = styles.button) === null || _styles$button === void 0 ? void 0 : _styles$button.bg
7754
+ }, /*#__PURE__*/React__default.createElement("p", null, "Please choose how you want to proceed"), /*#__PURE__*/React__default.createElement("p", {
7750
7755
  className: "bold"
7751
7756
  }, /*#__PURE__*/React__default.createElement("span", {
7752
7757
  onClick: function onClick() {
@@ -7801,7 +7806,8 @@ var Step0 = function Step0(_ref) {
7801
7806
  padding: ".8em 3em",
7802
7807
  uppercase: true,
7803
7808
  type: "submit",
7804
- className: "primaryBgColor"
7809
+ className: "primaryBgColor",
7810
+ color: styles === null || styles === void 0 ? void 0 : (_styles$button2 = styles.button) === null || _styles$button2 === void 0 ? void 0 : _styles$button2.bg
7805
7811
  }, loading ? /*#__PURE__*/React__default.createElement(material.CircularProgress, {
7806
7812
  color: "inherit",
7807
7813
  size: 15
@@ -9366,7 +9372,7 @@ var steps = [{
9366
9372
  }
9367
9373
  }];
9368
9374
  var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
9369
- var _styles$scroll, _styles$scroll2, _styles$checkoutSumma, _styles$checkoutSumma2;
9375
+ var _styles$input, _styles$checkoutSumma, _styles$checkoutSumma2;
9370
9376
  var apiEndPoint = _ref.apiEndPoint,
9371
9377
  token = _ref.token,
9372
9378
  authoriseDotNet = _ref.authoriseDotNet,
@@ -9428,8 +9434,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
9428
9434
  className: "icon"
9429
9435
  }, /*#__PURE__*/React__default.createElement(ai.AiOutlineCheckCircle, null)), ' ', /*#__PURE__*/React__default.createElement("p", null, words[0], " ", /*#__PURE__*/React__default.createElement("span", null, words[1])));
9430
9436
  })), /*#__PURE__*/React__default.createElement(CheckoutMain, {
9431
- color: styles === null || styles === void 0 ? void 0 : (_styles$scroll = styles.scroll) === null || _styles$scroll === void 0 ? void 0 : _styles$scroll.color,
9432
- bg: styles === null || styles === void 0 ? void 0 : (_styles$scroll2 = styles.scroll) === null || _styles$scroll2 === void 0 ? void 0 : _styles$scroll2.bg
9437
+ color: styles === null || styles === void 0 ? void 0 : styles.primaryColor,
9438
+ bg: styles === null || styles === void 0 ? void 0 : (_styles$input = styles.input) === null || _styles$input === void 0 ? void 0 : _styles$input.bg
9433
9439
  }, /*#__PURE__*/React__default.createElement(material.Stepper, {
9434
9440
  activeStep: currStep,
9435
9441
  orientation: "vertical",
@@ -9450,18 +9456,16 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
9450
9456
  color: 'white',
9451
9457
  padding: 0
9452
9458
  } : {
9453
- background: '#FAE8E5',
9459
+ background: styles === null || styles === void 0 ? void 0 : (_styles$stepperIcon2 = styles.stepperIcon) === null || _styles$stepperIcon2 === void 0 ? void 0 : _styles$stepperIcon2.opened,
9454
9460
  color: 'inherit',
9455
9461
  padding: 0
9456
9462
  }
9457
9463
  }, /*#__PURE__*/React__default.createElement("div", {
9458
9464
  className: "circle",
9459
9465
  style: currStep >= index ? {
9460
- background: styles === null || styles === void 0 ? void 0 : styles.primaryColor,
9461
9466
  color: 'white',
9462
9467
  padding: 0
9463
9468
  } : {
9464
- background: styles === null || styles === void 0 ? void 0 : (_styles$stepperIcon2 = styles.stepperIcon) === null || _styles$stepperIcon2 === void 0 ? void 0 : _styles$stepperIcon2.opened,
9465
9469
  color: 'inherit',
9466
9470
  padding: 0
9467
9471
  }
@@ -9492,7 +9496,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
9492
9496
  handleBack: handleBack,
9493
9497
  handleNext: handleNext,
9494
9498
  handleLogin: handleLogin,
9495
- clickRedirect: clickRedirect
9499
+ clickRedirect: clickRedirect,
9500
+ styles: styles
9496
9501
  })), index === 1 && /*#__PURE__*/React__default.createElement(material.StepContent, {
9497
9502
  sx: {
9498
9503
  padding: 0