contentoh-components-library 21.0.50 → 21.0.54

package/dist/components/atoms/Loading/index.js

@@ -7,14 +7,11 @@ exports.Loading = void 0;
 
 var _styles = require("./styles");
 
-var _LogoImage = require("../LogoImage");
-
 var _jsxRuntime = require("react/jsx-runtime");
 
 var Loading = function Loading() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LogoImage.LogoImage, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "loader",
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Loader, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "first"
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
@@ -22,7 +19,7 @@ var Loading = function Loading() {
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "third"
       })]
-    })]
+    })
   });
 };
 

package/dist/components/atoms/Loading/styles.js

@@ -5,14 +5,18 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Container = void 0;
+exports.Loader = exports.Container = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _templateObject;
+var _templateObject, _templateObject2;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  justify-content: center;\n  align-items: center;\n  height: 100vh;\n  width: 50%;\n  position: relative;\n  img {\n    width: 75% !important;\n    position: absolute;\n    bottom: 55%;\n    left: 10%;\n  }\n  .loader {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 10%;\n    width: 50%;\n    position: absolute;\n    bottom: 45%;\n    left:25%;\n    span {\n      display: inline-block;\n      border-radius: 100%;\n      margin-left: 5px;\n      opacity: 1;\n    }\n    .first {\n      background-color: #ff75cf;\n    }\n    .second {\n      background-color: #e33aa9;\n    }\n    .third {\n      background-color: #b12d84;\n    }\n    span:nth-child(1) {\n      width: 16px;\n      height: 16px;\n      animation: opacitychange 1s ease-in-out infinite;\n    }\n    span:nth-child(2) {\n      width: 18px;\n      height: 18px;\n\n      animation: opacitychange 1s ease-in-out 0.33s infinite;\n    }\n    span:nth-child(3) {\n      width: 20px;\n      height: 20px;\n\n      animation: opacitychange 1s ease-in-out 0.66s infinite;\n    }\n    @keyframes opacitychange {\n      0%,\n      100% {\n        opacity: 0;\n      }\n      60% {\n        opacity: 1;\n      }\n    }\n  }\n"])));
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  width: 100%;\n"])));
 
-exports.Container = Container;
+exports.Container = Container;
+
+var Loader = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  width: 100%;\n  span {\n    display: inline-block;\n    border-radius: 100%;\n    margin: 35px 5px;\n    opacity: 1;\n  }\n  .first {\n    background-color: #ff75cf;\n  }\n  .second {\n    background-color: #e33aa9;\n  }\n  .third {\n    background-color: #b12d84;\n  }\n  span:nth-child(1) {\n    width: 16px;\n    height: 16px;\n    animation: opacitychange 1s ease-in-out infinite;\n  }\n  span:nth-child(2) {\n    width: 18px;\n    height: 18px;\n\n    animation: opacitychange 1s ease-in-out 0.33s infinite;\n  }\n  span:nth-child(3) {\n    width: 20px;\n    height: 20px;\n\n    animation: opacitychange 1s ease-in-out 0.66s infinite;\n  }\n  @keyframes opacitychange {\n    0%,\n    100% {\n      opacity: 0;\n    }\n    60% {\n      opacity: 1;\n    }\n  }\n"])));
+
+exports.Loader = Loader;

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"])), _variables.FontFamily.Raleway_700);
+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);
 
 exports.Container = Container;
 

package/dist/components/molecules/LogoLoading/Loading.stories.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LogoLoadingDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/atoms/LogoLoading",
+  component: _index.LogoLoading
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.LogoLoading, (0, _objectSpread2.default)({}, args));
+};
+
+var LogoLoadingDefault = Template.bind({});
+exports.LogoLoadingDefault = LogoLoadingDefault;
+LogoLoadingDefault.args = {};

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

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LogoLoading = void 0;
+
+var _styles = require("./styles");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var LogoLoading = function LogoLoading() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "loader",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "first"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "second"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "third"
+      })]
+    })
+  });
+};
+
+exports.LogoLoading = LogoLoading;

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

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Container = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  justify-content: center;\n  align-items: center;\n  height: 100vh;\n  width: 50%;\n  position: relative;\n  img {\n    width: 75%;\n    position: absolute;\n    bottom: 55%;\n    left: 10%;\n  }\n"])));
+
+exports.Container = Container;

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

@@ -27,7 +27,7 @@ var _GeneralButton = require("../../atoms/GeneralButton");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var RegistrationThirdStep = function RegistrationThirdStep() {
+var RegistrationThirdStep = function RegistrationThirdStep(props) {
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       emptyCommercialName = _useState2[0],

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

@@ -103,38 +103,39 @@ var SignInLoginCreationApp = function SignInLoginCreationApp(props) {
               }
 
               if (!valid) {
-                _context.next = 33;
+                _context.next = 34;
                 break;
               }
 
               _context.prev = 10;
               setLoading(true);
-              _context.next = 14;
-              return Auth.signIn(email, password);
+              console.log("try");
+              _context.next = 15;
+              return props.Auth.signIn(email, password);
 
-            case 14:
+            case 15:
               session = _context.sent;
 
               if (!(session.challengeName === "NEW_PASSWORD_REQUIRED")) {
-                _context.next = 20;
+                _context.next = 21;
                 break;
               }
 
               props.setUser(session);
               props.setPaso(8);
-              _context.next = 26;
+              _context.next = 27;
               break;
 
-            case 20:
+            case 21:
               userGroup = session.signInUserSession.accessToken.payload["cognito:groups"];
-              _context.next = 23;
+              _context.next = 24;
               return _axios.default.get(process.env.REACT_APP_USER_ENDPOINT, {
                 headers: {
                   Authorization: session.signInUserSession.idToken.jwtToken
                 }
               });
 
-            case 23:
+            case 24:
               response = _context.sent;
               userGroupValue = typeof userGroup === "string" ? userGroup : userGroup[0];
 
@@ -158,12 +159,12 @@ var SignInLoginCreationApp = function SignInLoginCreationApp(props) {
                 setLoading(false);
               }
 
-            case 26:
-              _context.next = 33;
+            case 27:
+              _context.next = 34;
               break;
 
-            case 28:
-              _context.prev = 28;
+            case 29:
+              _context.prev = 29;
               _context.t0 = _context["catch"](10);
               console.log(_context.t0);
               setLoading(false);
@@ -177,12 +178,12 @@ var SignInLoginCreationApp = function SignInLoginCreationApp(props) {
                 setSignInError("Error");
               }
 
-            case 33:
+            case 34:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[10, 28]]);
+      }, _callee, null, [[10, 29]]);
     }));
 
     return function validate(_x) {

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

@@ -13,6 +13,6 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 50%;\n  height: 100vh;\n  .button-center {\n    position: absolute;\n    bottom: 13%;\n    left: 18%;\n    .general-default-button {\n      width: 160px;\n    }\n  }\n"])));
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 50%;\n  height: 100vh;\n  .button-center {\n    display: flex;\n    justify-content: center;\n    .general-default-button {\n      width: 160px;\n    }\n  }\n"])));
 
 exports.Container = Container;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.0.50",
+  "version": "21.0.54",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",
@@ -77,7 +77,7 @@
     "auto": "^10.36.5",
     "babel-loader": "^8.2.3",
     "chromatic": "^6.3.3",
-    "contentoh-components-library": "^21.0.40",
+    "contentoh-components-library": "^21.0.52",
     "cross-env": "^7.0.3",
     "storybook-css-modules-preset": "^1.1.1"
   },

package/src/components/atoms/Loading/index.js

@@ -1,15 +1,13 @@
-import { Container } from "./styles";
-import { LogoImage } from "../LogoImage";
+import { Container,Loader } from "./styles";
 
 export const Loading = () => {
   return (
     <Container >
-      <LogoImage/>
-      <div className="loader">
+      <Loader>
         <span className="first"></span>
         <span className="second"></span>
         <span className="third"></span>
-      </div>
+      </Loader>
     </Container>
   );
 };

package/src/components/atoms/Loading/styles.js

@@ -1,66 +1,57 @@
 import styled from "styled-components";
 
 export const Container = styled.div`
+  display: flex;
   justify-content: center;
   align-items: center;
-  height: 100vh;
-  width: 50%;
-  position: relative;
-  img {
-    width: 75% !important;
-    position: absolute;
-    bottom: 55%;
-    left: 10%;
+  height: 100%;
+  width: 100%;
+`;
+export const Loader = styled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  width: 100%;
+  span {
+    display: inline-block;
+    border-radius: 100%;
+    margin: 35px 5px;
+    opacity: 1;
   }
-  .loader {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 10%;
-    width: 50%;
-    position: absolute;
-    bottom: 45%;
-    left:25%;
-    span {
-      display: inline-block;
-      border-radius: 100%;
-      margin-left: 5px;
-      opacity: 1;
-    }
-    .first {
-      background-color: #ff75cf;
-    }
-    .second {
-      background-color: #e33aa9;
-    }
-    .third {
-      background-color: #b12d84;
-    }
-    span:nth-child(1) {
-      width: 16px;
-      height: 16px;
-      animation: opacitychange 1s ease-in-out infinite;
-    }
-    span:nth-child(2) {
-      width: 18px;
-      height: 18px;
+  .first {
+    background-color: #ff75cf;
+  }
+  .second {
+    background-color: #e33aa9;
+  }
+  .third {
+    background-color: #b12d84;
+  }
+  span:nth-child(1) {
+    width: 16px;
+    height: 16px;
+    animation: opacitychange 1s ease-in-out infinite;
+  }
+  span:nth-child(2) {
+    width: 18px;
+    height: 18px;
 
-      animation: opacitychange 1s ease-in-out 0.33s infinite;
-    }
-    span:nth-child(3) {
-      width: 20px;
-      height: 20px;
+    animation: opacitychange 1s ease-in-out 0.33s infinite;
+  }
+  span:nth-child(3) {
+    width: 20px;
+    height: 20px;
 
-      animation: opacitychange 1s ease-in-out 0.66s infinite;
+    animation: opacitychange 1s ease-in-out 0.66s infinite;
+  }
+  @keyframes opacitychange {
+    0%,
+    100% {
+      opacity: 0;
     }
-    @keyframes opacitychange {
-      0%,
-      100% {
-        opacity: 0;
-      }
-      60% {
-        opacity: 1;
-      }
+    60% {
+      opacity: 1;
     }
   }
 `;

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

@@ -20,6 +20,9 @@ export const Container = styled.div`
     font-family: ${FontFamily.Raleway_700};
     font-size: 11px;
   }
+  & + *{
+    margin-top: 20px;
+  }
 `;
 
 export const Password = styled.div`

package/src/components/molecules/LogoLoading/Loading.stories.js

@@ -0,0 +1,10 @@
+import { LogoLoading } from "./index";
+
+export default {
+  title: "Components/atoms/LogoLoading",
+  component: LogoLoading,
+};
+const Template = (args) => <LogoLoading {...args} />;
+export const LogoLoadingDefault = Template.bind({});
+
+LogoLoadingDefault.args = {};

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

@@ -0,0 +1,13 @@
+import { Container } from "./styles";
+
+export const LogoLoading = () => {
+  return (
+    <Container >
+      <div className="loader">
+        <span className="first"></span>
+        <span className="second"></span>
+        <span className="third"></span>
+      </div>
+    </Container>
+  );
+};

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

@@ -0,0 +1,15 @@
+import styled from "styled-components";
+
+export const Container = styled.div`
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  width: 50%;
+  position: relative;
+  img {
+    width: 75%;
+    position: absolute;
+    bottom: 55%;
+    left: 10%;
+  }
+`;

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

@@ -7,7 +7,7 @@ import { GlobalColors, FontFamily } from "../../../global-files/variables";
 import { TagAndInput } from "../../molecules/TagAndInput";
 import { Button } from "../../atoms/GeneralButton";
 
-export const RegistrationThirdStep = () => {
+export const RegistrationThirdStep = (props) => {
   const [emptyCommercialName, setEmptyCommercialName] = useState(false);
   const [emptyBussinesName, setEmptyBussinesName] = useState(false);
   const [emptyRFC, setEmptyRFC] = useState(false);

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

@@ -18,6 +18,7 @@ export const SignInLoginCreationApp = (props) => {
   const [signInError, setSignInError] = useState("");
   const [loading, setLoading] = useState(false);
   const [upgradePlanRedirect, setUpgradePlanRedirect] = useState(false);
+
   const validate = async (e) => {
     e.preventDefault();
     setSignInError("");
@@ -45,7 +46,8 @@ export const SignInLoginCreationApp = (props) => {
     if (valid) {
       try {
         setLoading(true);
-        const session = await Auth.signIn(email, password);
+        console.log("try")
+        const session = await props.Auth.signIn(email, password);
         if (session.challengeName === "NEW_PASSWORD_REQUIRED") {
           props.setUser(session);
           props.setPaso(8);

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

@@ -1,13 +1,11 @@
 import styled from "styled-components";
 
 export const Container = styled.div`
-  display: flex;
   width: 50%;
   height: 100vh;
   .button-center {
-    position: absolute;
-    bottom: 13%;
-    left: 18%;
+    display: flex;
+    justify-content: center;
     .general-default-button {
       width: 160px;
     }