@salesgenterp/ui-components 0.4.26 → 0.4.28

package/dist/index.js

@@ -1975,12 +1975,23 @@ var TextRow = styled.div(_templateObject2$7 || (_templateObject2$7 = _taggedTemp
 var FilledInfo = styled.div(_templateObject3$7 || (_templateObject3$7 = _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: 50%;\n  }\n  .bold {\n    font-weight: 700;\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  }\n"])));
 
 var CheckoutSummary = function CheckoutSummary(_ref) {
-  var _paymentMethod$name;
+  var _src;
 
   var total = _ref.total,
       billingInformation = _ref.billingInformation,
       shippingInformation = _ref.shippingInformation,
       paymentMethod = _ref.paymentMethod;
+  var src = paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.name;
+  var Images = ['visa', 'mastercard', 'paypal', 'stripe'];
+
+  if ((_src = src) !== null && _src !== void 0 && _src.toLowerCase().includes('card')) {
+    if (src !== 'masterCard') {
+      src = 'visa';
+    }
+  } else if (!Images.includes(src)) {
+    src = 'none';
+  }
+
   return /*#__PURE__*/React__default.createElement(CheckoutSummaryContainer, null, /*#__PURE__*/React__default.createElement(TextRow, null, /*#__PURE__*/React__default.createElement("p", {
     className: "text"
   }, "order total:"), /*#__PURE__*/React__default.createElement("h6", {
@@ -2002,7 +2013,7 @@ var CheckoutSummary = function CheckoutSummary(_ref) {
   }, "Payment Method"), /*#__PURE__*/React__default.createElement("div", {
     className: "payment"
   }, paymentMethod && /*#__PURE__*/React__default.createElement("img", {
-    src: "/images/" + (paymentMethod === null || paymentMethod === void 0 ? void 0 : (_paymentMethod$name = paymentMethod.name) === null || _paymentMethod$name === void 0 ? void 0 : _paymentMethod$name.toLowerCase()) + ".png",
+    src: "/images/" + src + ".png",
     alt: "payment"
   }))));
 };
@@ -2036,11 +2047,11 @@ var CheckBoxRow = styled.div(_templateObject7$3 || (_templateObject7$3 = _tagged
   return props.padding;
 });
 var DeliveryCard = styled.div(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  background: #fd0015;\n  color: white;\n  height: 34px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  padding: 0.5em 1em;\n  margin-right: 1em;\n  margin-bottom: 1em;\n  /* padding: 1em 0.4em; */\n  cursor: pointer;\n  img {\n    width: 38px;\n    height: 17px;\n    margin-bottom: -5px;\n    margin-right: 4px;\n  }\n  p {\n    font-size: 10px;\n  }\n  .circle {\n    width: 10px;\n    height: 10px;\n    border-radius: 1px solid black;\n    background-color: white;\n    display: grid;\n    place-items: center;\n    border-radius: 50%;\n    margin-left: auto;\n    margin-left: 5px;\n    .smallCircle {\n      width: 4px;\n      height: 4px;\n      background: black;\n      border-radius: 50%;\n    }\n  }\n"])));
-var CreditCard = styled.div(_templateObject9 || (_templateObject9 = _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  &:hover,\n  &:focus {\n    border: 1px solid black;\n  }\n"])));
+var CreditCard = styled.div(_templateObject9 || (_templateObject9 = _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  &:hover,\n  &:focus {\n    border: 1px solid black;\n  }\n"])));
 var StyledTableRow = styled(material.TableRow)(_templateObject10 || (_templateObject10 = _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: red;\n      font-weight: inherit;\n    }\n    .price {\n      font-weight: 700;\n    }\n  }\n"])), function (props) {
   return props.colored ? 'rgba(255, 240, 236, 1)' : 'white';
 });
-var StyledTableCell = styled(material.TableCell)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n  && {\n    border: none;\n  }\n"])));
+var StyledTableCell = styled(material.TableCell)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n  && {\n    border: none;\n    font-size: 1em;\n  }\n"])));
 var BottomGrid = styled(material.Grid)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n  .bold {\n    font-weight: 700;\n    text-transform: capitalize;\n    margin: 1em 0;\n    font-size: 1em;\n  }\n  .icon {\n    font-size: 1.6em;\n    color: rgba(253, 0, 21, 1);\n  }\n  textarea {\n    width: 100%;\n    resize: none;\n    background: #fff8f6;\n    border: 1px solid rgba(253, 0, 21, 0.5);\n    border-radius: 4px;\n    margin-bottom: 2em;\n    padding: 1em;\n  }\n  p {\n    font-size: 12px;\n    .ul {\n      text-decoration: underline;\n      font-size: inherit;\n    }\n  }\n  .bottom {\n    margin-left: 3em;\n    font-style: italic;\n    span {\n      font-weight: 700;\n      color: rgba(253, 0, 21, 1);\n\n      cursor: pointer;\n      &:hover {\n        text-decoration: underline;\n      }\n    }\n  }\n"])));
 
 var CheckoutInput = function CheckoutInput(_ref) {
@@ -2295,7 +2306,7 @@ var Step1 = function Step1(_ref) {
       placeholder: 'Please Select your store',
       control: control,
       List: stores,
-      key: 'name'
+      key: 'storeName'
     }
   })), /*#__PURE__*/React__default.createElement(material.Grid, {
     item: true,
@@ -2500,6 +2511,7 @@ var Step3 = function Step3(_ref) {
     });
   }
 
+  var Images = ['visa', 'mastercard', 'paypal', 'stripe'];
   return /*#__PURE__*/React__default.createElement(StepContainer, null, /*#__PURE__*/React__default.createElement(StepsHeaderComponent, {
     text: 'Payments Method',
     Icon: Icon
@@ -2510,6 +2522,18 @@ var Step3 = function Step3(_ref) {
       margin: '1.5em 0'
     }
   }, payments === null || payments === void 0 ? void 0 : payments.map(function (payment, i) {
+    var _src;
+
+    var src = payment === null || payment === void 0 ? void 0 : payment.name;
+
+    if ((_src = src) !== null && _src !== void 0 && _src.toLowerCase().includes('card')) {
+      if (src !== 'masterCard') {
+        src = 'visa';
+      }
+    } else if (!Images.includes(src)) {
+      src = 'none';
+    }
+
     return /*#__PURE__*/React__default.createElement(material.Grid, {
       item: true,
       key: i,
@@ -2517,10 +2541,10 @@ var Step3 = function Step3(_ref) {
       sm: 1.5
     }, /*#__PURE__*/React__default.createElement(CreditCard, {
       tabIndex: 1
-    }, /*#__PURE__*/React__default.createElement("img", {
-      src: "/images/" + (payment === null || payment === void 0 ? void 0 : payment.name) + ".png",
+    }, src !== 'none' ? /*#__PURE__*/React__default.createElement("img", {
+      src: "/images/" + src + ".png",
       alt: payment.name
-    })));
+    }) : /*#__PURE__*/React__default.createElement("p", null, payment.name)));
   })), /*#__PURE__*/React__default.createElement(material.Grid, {
     container: true,
     component: 'form',
@@ -2838,7 +2862,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
       userStores = _ref.userStores,
       userAddresses = _ref.userAddresses,
       showShipping = _ref.showShipping,
-      clickRedirect = _ref.clickRedirect;
+      clickRedirect = _ref.clickRedirect,
+      ordering = _ref.ordering;
   return /*#__PURE__*/React__default.createElement(CheckoutPageContainer, {
     className: "checkout"
   }, /*#__PURE__*/React__default.createElement(CheckoutMain, null, /*#__PURE__*/React__default.createElement(CheckoutHeader, null, steps.map(function (item, i) {
@@ -2853,7 +2878,10 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
     }, /*#__PURE__*/React__default.createElement(ai.AiOutlineCheckCircle, null)), ' ', /*#__PURE__*/React__default.createElement("p", null, words[0], " ", /*#__PURE__*/React__default.createElement("span", null, words[1])));
   })), /*#__PURE__*/React__default.createElement(material.Stepper, {
     activeStep: currStep,
-    orientation: "vertical"
+    orientation: "vertical",
+    sx: {
+      width: '100%'
+    }
   }, steps.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement(material.Step, {
       key: index
@@ -2941,7 +2969,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
       handleNext: handleNext,
       cartData: cartData,
       vat: vat,
-      clickRedirect: clickRedirect
+      clickRedirect: clickRedirect,
+      loading: ordering
     })));
   }))), /*#__PURE__*/React__default.createElement(CheckoutSummary, {
     billingInformation: billingAddress,