@salesgenterp/ui-components 0.4.42 → 0.4.44

package/dist/index.modern.js

@@ -1956,14 +1956,14 @@ var CartPageComponent = function CartPageComponent(_ref) {
 };
 
 var _templateObject$6, _templateObject2$6, _templateObject3$6, _templateObject4$5, _templateObject5$5, _templateObject6$5;
-var CheckoutPageContainer = styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  max-width: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: flex-start;\n  background-color: ", ";\n  margin: 0 auto;\n  padding: 3.5em 3.5em 2.5em 4.5em;\n  padding-left: min(4.5em, 2.5vw);\n  font-family: 'karla-fonts';\n  color: rgba(50, 50, 50, 1);\n  max-height: 90vh;\n  overflow: hidden;\n  background: gainsboro;\n  background: #fff8f6;\n  border-radius: 28px;\n  @media only screen and (max-width: 1488px) {\n    flex-direction: column;\n    align-items: center;\n    max-height: max-content;\n  }\n  @media only screen and (max-width: 788px) {\n    padding: 0.5em;\n  }\n  .icon {\n    font-size: 12px;\n  }\n"])), function (props) {
+var CheckoutPageContainer = styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  max-width: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: flex-start;\n  background-color: ", ";\n  margin: 0 auto;\n  padding: 2.375em 3.5em 2.5em 4.5em;\n  padding-left: min(4.5em, 2.5vw);\n  font-family: 'karla-fonts';\n  color: rgba(50, 50, 50, 1);\n  max-height: 90vh;\n  overflow: hidden;\n  background: gainsboro;\n  background: #fff8f6;\n  border-radius: 28px;\n  @media only screen and (max-width: 1488px) {\n    flex-direction: column;\n    align-items: center;\n    max-height: max-content;\n  }\n  @media only screen and (max-width: 788px) {\n    padding: 0.5em;\n  }\n  .icon {\n    font-size: 12px;\n  }\n"])), function (props) {
   return props.maxWidth || '1605px';
 }, function (props) {
   return props.bg || 'rgba(255, 248, 246, 1)';
 });
 var Row = styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n"])));
 var CheckoutMain = styled.div(_templateObject3$6 || (_templateObject3$6 = _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  /* width */\n  ::-webkit-scrollbar {\n    width: 10px;\n    background: rgba(245, 197, 189, 0.5);\n    border-radius: 16px;\n  }\n\n  /* Track */\n  ::-webkit-scrollbar-track {\n    background: rgba(245, 197, 189, 0.5);\n    border-radius: 16px;\n  }\n\n  /* Handle */\n  ::-webkit-scrollbar-thumb {\n    background: #ef9687;\n    border-radius: 16px;\n    border: 3px solid rgba(245, 197, 189, 0.5);\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: 92vw;\n    min-width: 90vw;\n  }\n  /* overflow: hidden; */\n"])));
-var CheckoutHeading = styled.div(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n  margin-left: 2.5em;\n  margin-bottom: 2em;\n  h5 {\n    font-size: 2.735em;\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  }\n"])));
+var CheckoutHeading = styled.div(_templateObject4$5 || (_templateObject4$5 = _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  }\n"])));
 var CheckoutHeader = styled(Row)(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n  justify-content: space-around;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\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: 2em;\n  margin-right: 0.35em;\n  color: #7d7b7b;\n  padding: 0 2em;\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: 1646px) {\n    margin-right: 1em;\n  }\n  @media only screen and (max-width: 788px) {\n    width: 100%;\n    padding: 2em 0.5em;\n    margin-right: -0.2em;\n    .row {\n      margin-right: 4.5%;\n      p {\n        font-size: 12px;\n      }\n      span {\n        display: none;\n      }\n    }\n  }\n"])));
 var CheckoutStepIcon = styled.div(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteralLoose(["\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  font-size: 5px;\n  display: grid;\n  place-items: center;\n  margin: auto;\n  padding: 0;\n  margin-left: 2px;\n  .circle {\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    font-size: 5px;\n    display: grid;\n    place-items: center;\n    margin: auto;\n    padding: 0;\n  }\n  .ic {\n    font-size: 8px;\n  }\n"])));
 
@@ -2184,7 +2184,8 @@ var StepsHeaderComponent = function StepsHeaderComponent(_ref) {
 var Step0 = function Step0(_ref) {
   var loading = _ref.loading,
       userName = _ref.userName,
-      handleLogin = _ref.handleLogin;
+      handleLogin = _ref.handleLogin,
+      clickRedirect = _ref.clickRedirect;
 
   var _useForm = useForm(),
       control = _useForm.control,
@@ -2200,7 +2201,11 @@ var Step0 = function Step0(_ref) {
     icon: 1
   }), /*#__PURE__*/React__default.createElement(StepsContent, null, /*#__PURE__*/React__default.createElement("p", null, "Please choose how you want to proceed"), /*#__PURE__*/React__default.createElement("p", {
     className: "bold"
-  }, /*#__PURE__*/React__default.createElement("span", null, "register"), " | ", /*#__PURE__*/React__default.createElement("span", {
+  }, /*#__PURE__*/React__default.createElement("span", {
+    onClick: function onClick() {
+      return clickRedirect('account/register');
+    }
+  }, "register"), ' ', "| ", /*#__PURE__*/React__default.createElement("span", {
     className: "red"
   }, "login")), /*#__PURE__*/React__default.createElement(Grid, {
     container: true,
@@ -3164,7 +3169,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
       userName: userName,
       handleBack: handleBack,
       handleNext: handleNext,
-      handleLogin: handleLogin
+      handleLogin: handleLogin,
+      clickRedirect: clickRedirect
     })), index === 1 && /*#__PURE__*/React__default.createElement(StepContent, {
       sx: {
         padding: 0