contentoh-components-library 21.0.61 → 21.0.64

package/dist/components/molecules/LoginPasswordStrength/index.js

@@ -77,7 +77,7 @@ var LoginPasswordStrength = function LoginPasswordStrength(_ref) {
       }), emptyPassword && /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
         children: "La contrase\xF1a debe ser minimo de 8 caracteres"
       })]
-    }, "3"), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "divPasswordStrength",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.ItemPasswordStrength, {
         paso: 1,
@@ -112,7 +112,7 @@ var LoginPasswordStrength = function LoginPasswordStrength(_ref) {
           children: "Fuerte"
         })]
       })]
-    }, "4"), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "user",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
         inputType: "password",
@@ -124,7 +124,7 @@ var LoginPasswordStrength = function LoginPasswordStrength(_ref) {
       }), !emptyConfirmPassword && !emptyPassword && !matchPasswords && /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
         children: "La contrase\xF1a no coincide"
       })]
-    }, "5")]
+    })]
   });
 };
 

package/dist/components/molecules/LoginPasswordStrength/styles.js

@@ -15,7 +15,7 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject, _templateObject2, _templateObject3;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  .divPasswordStrength {\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-top: 30px;\n    & + * {\n      margin-top: 40px;\n    }\n  }\n  label {\n    color: red;\n    margin-top: 3px;\n    margin-left: 15px;\n    font-family: ", ";\n    font-size: 11px;\n  }\n  & + *{\n    margin-top: 20px;\n  }\n"])), _variables.FontFamily.Raleway_700);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  margin-bottom: 15px;\n  .divPasswordStrength {\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-top: 30px;\n    & + * {\n      margin-top: 40px;\n    }\n  }\n  label {\n    color: red;\n    margin-top: 3px;\n    margin-left: 15px;\n    font-family: ", ";\n    font-size: 11px;\n  }\n  & + * {\n    margin-top: 20px;\n  }\n"])), _variables.FontFamily.Raleway_700);
 
 exports.Container = Container;
 

package/dist/components/molecules/RegistrationSecondStep/index.js

@@ -58,10 +58,11 @@ var RegistrationSecondStep = function RegistrationSecondStep(props) {
   var validateForm = function validateForm(evt, valid) {
     evt.preventDefault();
     var password = document.querySelector("#newPasswordInput").value;
+    !termsCheck && (valid = false);
+    !privacyCheck && (valid = false);
 
     if (valid) {
-      !termsCheck && (valid = false);
-      !privacyCheck && (valid = false);
+      console.log(valid);
       nuevoUsuario.password = password;
       sessionStorage.setItem("nuevoRegistro", JSON.stringify(nuevoUsuario));
       valid && props.setPaso(3);
@@ -125,16 +126,19 @@ var RegistrationSecondStep = function RegistrationSecondStep(props) {
       text: "Todos los datos estan protegidos.",
       headerType: "date-header"
     })]
-  }, "7"), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+  }, "7"), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "button-end",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+    children: [(!termsCheck || !privacyCheck) && /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
+      className: "terms",
+      children: "*Aceptar los t\xE9rminos y condiciones y el aviso de privacidad"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
       buttonType: "general-default-button",
       label: "Enviar",
       onClick: function onClick(e) {
         var flag = validate(e);
         validateForm(e, flag);
       }
-    })
+    })]
   }, "8"), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "progress-bar",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/dist/components/molecules/RegistrationSecondStep/styles.js

@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 50%;\n  height: 100vh;\n  .button-end {\n    text-align: end;\n    .general-default-button {\n      width: 160px;\n    }\n    & + * {\n      margin-top: 10px;\n    }\n  }\n  .progress-bar {\n    width: 100%;\n    height: 8px;\n    display: flex;\n    justify-content: space-between;\n    .progress-bar-first-step-check {\n      width: 33.33%;\n      background-color: ", ";\n    }\n    .progress-bar-second-step {\n      width: 33.33%;\n      background-color: rgb(196, 196, 196);\n    }\n    .progress-bar-registration {\n      background-color: rgb(226, 226, 226);\n      width: 33.33%;\n    }\n  }\n  .date-header {\n    margin-left: 33.33%;\n  }\n  .checkbox-terms {\n    display: flex;\n    margin-bottom: 5px;\n    input {\n      cursor: pointer;\n      & + * {\n        margin-left: 15px;\n      }\n    }\n  }\n  .label-terms {\n    color: rgb(129, 115, 147);\n    font-size: 13px;\n    line-height: 24px;\n    font-weight: 700;\n    cursor: pointer;\n    margin-left: 25px;\n    & + * {\n      margin-top: 5px;\n    }\n  }\n"])), _variables.GlobalColors.exported);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 50%;\n  height: 100vh;\n  .button-end {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    .general-default-button {\n      width: 160px;\n    }\n    .terms{\n      margin-bottom: 5px;\n    }\n    & + * {\n      margin-top: 10px;\n    }\n  }\n  .progress-bar {\n    width: 100%;\n    height: 8px;\n    display: flex;\n    justify-content: space-between;\n    .progress-bar-first-step-check {\n      width: 33.33%;\n      background-color: ", ";\n    }\n    .progress-bar-second-step {\n      width: 33.33%;\n      background-color: rgb(196, 196, 196);\n    }\n    .progress-bar-registration {\n      background-color: rgb(226, 226, 226);\n      width: 33.33%;\n    }\n  }\n  .date-header {\n    margin-left: 33.33%;\n  }\n  .checkbox-terms {\n    display: flex;\n    margin-bottom: 5px;\n    input {\n      cursor: pointer;\n      & + * {\n        margin-left: 15px;\n      }\n    }\n  }\n  .label-terms {\n    color: rgb(129, 115, 147);\n    font-size: 13px;\n    line-height: 24px;\n    font-weight: 700;\n    cursor: pointer;\n    margin-left: 25px;\n    & + * {\n      margin-top: 5px;\n    }\n  }\n"])), _variables.GlobalColors.exported);
 
 exports.Container = Container;

package/dist/components/molecules/VerificationCodeResetPasswordLogin/index.js

@@ -96,22 +96,23 @@ var VerificationCodeResetPasswordLogin = function VerificationCodeResetPasswordL
               sessionStorage.setItem("email", JSON.stringify(email));
               sessionStorage.setItem("resetPasswordProcess", JSON.stringify("true"));
               props.setPaso(5);
+              setEmptyVerificationCode(false);
               setResend(true);
-              _context.next = 15;
+              _context.next = 16;
               break;
 
-            case 11:
-              _context.prev = 11;
+            case 12:
+              _context.prev = 12;
               _context.t0 = _context["catch"](2);
               setAwsError(_context.t0.code);
               console.log(_context.t0.message);
 
-            case 15:
+            case 16:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[2, 11]]);
+      }, _callee, null, [[2, 12]]);
     }));
 
     return function validateResend(_x) {

package/dist/components/molecules/VerificationCodeResetPasswordLogin/styles.js

@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  height: 100vh;\n  width: 50%;\n  align-items: center;\n  justify-content: center;\n  .button-center {\n    text-align: center;\n    .general-default-button {\n      width: 160px;\n    }\n  }\n  .reset-password {\n    text-align: center;\n    margin: 15px !important;\n    color: ", ";\n    cursor: pointer;\n    font-weight: bold;\n    font-family: ", ";\n    font-size: 13px;\n  }\n  .resend-code {\n    margin-top: 8px !important;\n    color: ", ";\n    font-family: ", ";\n    font-size: 11px;\n    text-decoration: underline rgb(228, 81, 172);\n    cursor: pointer;\n    & + * {\n      margin-top: 30px;\n    }\n  }\n  .verification-code {\n    display: flex;\n    text-align: center;\n    margin: auto;\n    margin-top: 10px;\n    input[type=\"number\"]::-webkit-inner-spin-button,\n    input[type=\"number\"]::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n    input {\n      width: 70%;\n      text-align: center;\n    }\n  }\n"])), _variables.GlobalColors.secondary_magenta, _variables.FontFamily.Raleway, _variables.GlobalColors.magenta_s2, _variables.FontFamily.AvenirNext);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  height: 100vh;\n  width: 50%;\n  align-items: center;\n  justify-content: center;\n  .button-center {\n    text-align: center;\n    .general-default-button {\n      width: 160px;\n    }\n  }\n  .reset-password {\n    text-align: center;\n    margin: 15px !important;\n    color: ", ";\n    cursor: pointer;\n    font-weight: bold;\n    font-family: ", ";\n    font-size: 13px;\n  }\n  .resend-code {\n    margin-top: 8px !important;\n    color: ", ";\n    font-family: ", ";\n    font-size: 11px;\n    text-decoration: underline rgb(228, 81, 172);\n    cursor: pointer;\n    & + * {\n      margin-top: 30px;\n    }\n  }\n  .verification-code {\n    display: flex;\n    text-align: center;\n    margin: auto;\n    margin-top: 10px;\n    input[type=\"number\"]::-webkit-inner-spin-button,\n    input[type=\"number\"]::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n    input {\n      width: 70%;\n      text-align: center;\n    }\n  }\n  .resendTrue{\n    color: ", ";\n  }\n"])), _variables.GlobalColors.secondary_magenta, _variables.FontFamily.Raleway, _variables.GlobalColors.magenta_s2, _variables.FontFamily.AvenirNext, _variables.GlobalColors.exported);
 
 exports.Container = Container;

package/dist/components/organisms/ChangePassword/index.js

@@ -67,16 +67,17 @@ var ChangePassword = function ChangePassword(props) {
               }
 
               valid = true;
-              emptyPassword && (valid = false);
-              emptyConfirmPassword && (valid = false);
-              !matchPasswords && (valid = false);
+
+              if (password.length < 8 || confirmPassword === "" || password !== confirmPassword) {
+                valid = false;
+              }
 
               if (valid) {
                 sessionStorage.setItem("newPassword", JSON.stringify(password));
                 !sessionStorage.getItem("resetPasswordProcess") ? props.setPaso(9) : props.setPaso(11);
               }
 
-            case 11:
+            case 9:
             case "end":
               return _context.stop();
           }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.0.61",
+  "version": "21.0.64",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",

package/src/components/molecules/LoginPasswordStrength/index.js

@@ -46,7 +46,7 @@ export const LoginPasswordStrength = ({
 
   return (
     <Container>
-      <div className="user" key={"3"}>
+      <div className="user">
         <TagAndInput
           inputType={"password"}
           inputId={"newPasswordInput"}
@@ -57,7 +57,7 @@ export const LoginPasswordStrength = ({
           <label>La contraseña debe ser minimo de 8 caracteres</label>
         )}
       </div>
-      <div className="divPasswordStrength" key={"4"}>
+      <div className="divPasswordStrength">
         <ItemPasswordStrength paso={1}>
           <Password level={1} passwordStrength={passwordStrength} />
           {passwordStrength === 1 && <p>Baja</p>}
@@ -75,7 +75,7 @@ export const LoginPasswordStrength = ({
           {passwordStrength === 4 && <p>Fuerte</p>}
         </ItemPasswordStrength>
       </div>
-      <div className="user" key={"5"}>
+      <div className="user">
         <TagAndInput
           inputType={"password"}
           inputId={"confirmPasswordInput"}

package/src/components/molecules/LoginPasswordStrength/styles.js

@@ -3,6 +3,7 @@ import { FontFamily, GlobalColors } from "../../../global-files/variables";
 
 export const Container = styled.div`
   width: 100%;
+  margin-bottom: 15px;
   .divPasswordStrength {
     width: 100%;
     display: flex;
@@ -20,7 +21,7 @@ export const Container = styled.div`
     font-family: ${FontFamily.Raleway_700};
     font-size: 11px;
   }
-  & + *{
+  & + * {
     margin-top: 20px;
   }
 `;
@@ -87,4 +88,4 @@ export const ItemPasswordStrength = styled.div`
       }
     }};
   }
-`;
+`;

package/src/components/molecules/RegistrationSecondStep/index.js

@@ -18,9 +18,10 @@ export const RegistrationSecondStep = (props) => {
   const validateForm = (evt, valid) => {
     evt.preventDefault();
     const password = document.querySelector("#newPasswordInput").value;
+    !termsCheck && (valid = false);
+    !privacyCheck && (valid = false);
     if (valid) {
-      !termsCheck && (valid = false);
-      !privacyCheck && (valid = false);
+      console.log(valid)
       nuevoUsuario.password = password;
       sessionStorage.setItem("nuevoRegistro", JSON.stringify(nuevoUsuario));
       valid && props.setPaso(3);
@@ -92,6 +93,11 @@ export const RegistrationSecondStep = (props) => {
       />
     </div>,
     <div className="button-end" key="8">
+      {(!termsCheck || !privacyCheck) && (
+        <label className="terms">
+          *Aceptar los términos y condiciones y el aviso de privacidad
+        </label>
+      )}
       <Button
         buttonType={"general-default-button"}
         label={"Enviar"}

package/src/components/molecules/RegistrationSecondStep/styles.js

@@ -6,10 +6,15 @@ export const Container = styled.div`
   width: 50%;
   height: 100vh;
   .button-end {
-    text-align: end;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
     .general-default-button {
       width: 160px;
     }
+    .terms{
+      margin-bottom: 5px;
+    }
     & + * {
       margin-top: 10px;
     }

package/src/components/molecules/VerificationCodeResetPasswordLogin/index.js

@@ -54,6 +54,7 @@ export const VerificationCodeResetPasswordLogin = (props) => {
       sessionStorage.setItem("email", JSON.stringify(email));
       sessionStorage.setItem("resetPasswordProcess", JSON.stringify("true"));
       props.setPaso(5);
+      setEmptyVerificationCode(false);
       setResend(true);
     } catch (err) {
       setAwsError(err.code);

package/src/components/molecules/VerificationCodeResetPasswordLogin/styles.js

@@ -48,4 +48,7 @@ export const Container = styled.div`
       text-align: center;
     }
   }
+  .resendTrue{
+    color: ${GlobalColors.exported};
+  }
 `;

package/src/components/organisms/ChangePassword/index.js

@@ -8,7 +8,6 @@ import { GlobalColors, FontFamily } from "../../../global-files/variables";
 import { GradientPanel } from "../../atoms/GradientPanel";
 
 export const ChangePassword = (props) => {
-  
   const [emptyPassword, setEmptyPassword] = useState(false);
   const [emptyConfirmPassword, setEmptyConfirmPassword] = useState(false);
   const [matchPasswords, setMatchPasswords] = useState(true);
@@ -17,9 +16,7 @@ export const ChangePassword = (props) => {
     e.preventDefault();
     let password = document.querySelector("#newPasswordInput").value;
     password.length < 8 ? setEmptyPassword(true) : setEmptyPassword(false);
-    let confirmPassword = document.querySelector(
-      "#confirmPasswordInput"
-    ).value;
+    let confirmPassword = document.querySelector("#confirmPasswordInput").value;
     confirmPassword === ""
       ? setEmptyConfirmPassword(true)
       : setEmptyConfirmPassword(false);
@@ -29,14 +26,18 @@ export const ChangePassword = (props) => {
       setMatchPasswords(false);
     }
     let valid = true;
-    emptyPassword && (valid = false);
-    emptyConfirmPassword && (valid = false);
-    !matchPasswords && (valid = false);
+    if (
+      password.length < 8 ||
+      confirmPassword === "" ||
+      password !== confirmPassword
+    ) {
+      valid = false;
+    }
     if (valid) {
       sessionStorage.setItem("newPassword", JSON.stringify(password));
       !sessionStorage.getItem("resetPasswordProcess")
         ? props.setPaso(9)
-        : props.setPaso(11);
+         : props.setPaso(11); 
     }
   };
 
@@ -66,11 +67,11 @@ export const ChangePassword = (props) => {
   ];
   return (
     <Container>
-        <GradientPanel
-          panelColor={GlobalColors.white}
-          componentsArray={loginRight}
-          panelType={"home-login"}
-        ></GradientPanel>
+      <GradientPanel
+        panelColor={GlobalColors.white}
+        componentsArray={loginRight}
+        panelType={"home-login"}
+      ></GradientPanel>
     </Container>
   );
 };