contentoh-components-library 21.4.102 → 21.4.104

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

@@ -1,36 +1,43 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageTooltip = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
+
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
+
 var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
+
 var _react = require("react");
+
 var _Tooltip = require("../../atoms/Tooltip");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const ImageTooltip = props => {
-  const {
-    className,
-    // string
-    sizeLoading,
-    // number
-    colorLoading,
-    // string
-    classNameLoading,
-    // string
-    src,
-    // imagen a cargar (string)
-    componentDefault,
-    // componente a mostrar en caso de que no cargue src (JSX)
-    classNameImg,
-    // string
-    classNameTooltip,
-    componentTooltip,
-    position // (string) posicion del contenedor tooltip (values en object positions)
-  } = props;
-  const [imgLoad, setImgLoad] = (0, _react.useState)();
+
+var ImageTooltip = function ImageTooltip(props) {
+  var className = props.className,
+      sizeLoading = props.sizeLoading,
+      colorLoading = props.colorLoading,
+      classNameLoading = props.classNameLoading,
+      src = props.src,
+      componentDefault = props.componentDefault,
+      classNameImg = props.classNameImg,
+      classNameTooltip = props.classNameTooltip,
+      componentTooltip = props.componentTooltip,
+      position = props.position;
+
+  var _useState = (0, _react.useState)(),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      imgLoad = _useState2[0],
+      setImgLoad = _useState2[1];
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Tooltip.Tooltip, {
     position: position !== null && position !== void 0 ? position : "topCenter",
     addArrow: false,
@@ -50,10 +57,15 @@ const ImageTooltip = props => {
     }), (!src || imgLoad === false) && componentDefault, /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Img, {
       className: classNameImg,
       src: "".concat(src, "?").concat(new Date().getMilliseconds()),
-      onLoad: () => setImgLoad(true),
-      onError: () => setImgLoad(false),
+      onLoad: function onLoad() {
+        return setImgLoad(true);
+      },
+      onError: function onError() {
+        return setImgLoad(false);
+      },
       show: imgLoad === true
     })]
   });
 };
+
 exports.ImageTooltip = ImageTooltip;

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

@@ -1,28 +1,33 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Img = exports.ContainerLoading = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _variables = require("../../../global-files/variables");
+
 var _templateObject, _templateObject2;
-const ContainerLoading = exports.ContainerLoading = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  display: grid;\n  place-items: center;\n  min-width: min-content;\n  font-size: ", "px;\n  color: ", ";\n  padding: 5px;\n"])), _ref => {
-  let {
-    sizeLoading
-  } = _ref;
+
+var ContainerLoading = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  display: grid;\n  place-items: center;\n  min-width: min-content;\n  font-size: ", "px;\n  color: ", ";\n  padding: 5px;\n"])), function (_ref) {
+  var sizeLoading = _ref.sizeLoading;
   return sizeLoading ? sizeLoading : "30";
-}, _ref2 => {
-  let {
-    colorLoading
-  } = _ref2;
+}, function (_ref2) {
+  var colorLoading = _ref2.colorLoading;
   return colorLoading ? colorLoading : "#9e2674";
 });
-const Img = exports.Img = _styledComponents.default.img(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: ", ";\n  width: 100%;\n  object-fit: contain;\n"])), _ref3 => {
-  let {
-    show
-  } = _ref3;
+
+exports.ContainerLoading = ContainerLoading;
+
+var Img = _styledComponents.default.img(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: ", ";\n  width: 100%;\n  object-fit: contain;\n"])), function (_ref3) {
+  var show = _ref3.show;
   return show ? "grid" : "none";
-});
+});
+
+exports.Img = Img;

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

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

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

@@ -1,40 +1,65 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LoginPasswordStrength = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
+
 var _react = require("react");
+
 var _TagAndInput = require("../TagAndInput");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const LoginPasswordStrength = _ref => {
-  let {
-    emptyPassword,
-    emptyConfirmPassword,
-    matchPasswords,
-    required
-  } = _ref;
-  const [passwordStrength, setPasswordStrength] = (0, _react.useState)(0);
-  let upperCaseLetters = /[A-Z]/g;
-  let numbers = /[0-9]/g;
-  let specialChar = /[‘!’,‘@’,‘#’,‘$’,‘%’,‘^’,‘&’,‘*’]/g;
-  const updateInfo = e => {
+
+var LoginPasswordStrength = function LoginPasswordStrength(_ref) {
+  var emptyPassword = _ref.emptyPassword,
+      emptyConfirmPassword = _ref.emptyConfirmPassword,
+      matchPasswords = _ref.matchPasswords,
+      required = _ref.required;
+
+  var _useState = (0, _react.useState)(0),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      passwordStrength = _useState2[0],
+      setPasswordStrength = _useState2[1];
+
+  var upperCaseLetters = /[A-Z]/g;
+  var numbers = /[0-9]/g;
+  var specialChar = /[‘!’,‘@’,‘#’,‘$’,‘%’,‘^’,‘&’,‘*’]/g;
+
+  var updateInfo = function updateInfo(e) {
     switch (e.target.id) {
       case "newPasswordInput":
         setPasswordStrength(0);
+
         if (e.target.value.length >= 8) {
-          setPasswordStrength(passwordStrength => passwordStrength + 1);
-        }
-        //Verificar si la contraseña contiene mayuscula, numeros y un caracter especial
-        e.target.value.match(upperCaseLetters) && setPasswordStrength(passwordStrength => passwordStrength + 1);
-        e.target.value.match(numbers) && setPasswordStrength(passwordStrength => passwordStrength + 1);
-        e.target.value.match(specialChar) && setPasswordStrength(passwordStrength => passwordStrength + 1);
+          setPasswordStrength(function (passwordStrength) {
+            return passwordStrength + 1;
+          });
+        } //Verificar si la contraseña contiene mayuscula, numeros y un caracter especial
+
+
+        e.target.value.match(upperCaseLetters) && setPasswordStrength(function (passwordStrength) {
+          return passwordStrength + 1;
+        });
+        e.target.value.match(numbers) && setPasswordStrength(function (passwordStrength) {
+          return passwordStrength + 1;
+        });
+        e.target.value.match(specialChar) && setPasswordStrength(function (passwordStrength) {
+          return passwordStrength + 1;
+        });
         break;
+
       default:
         return;
     }
   };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "user",
@@ -97,4 +122,5 @@ const LoginPasswordStrength = _ref => {
     })]
   });
 };
+
 exports.LoginPasswordStrength = LoginPasswordStrength;

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

@@ -1,56 +1,78 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Password = exports.ItemPasswordStrength = exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _variables = require("../../../global-files/variables");
+
 var _templateObject, _templateObject2, _templateObject3;
-const Container = exports.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);
-const Password = exports.Password = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  height: 8px;\n  width: 100%;\n  background-color: ", ";\n"])), props => {
+
+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;
+
+var Password = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  height: 8px;\n  width: 100%;\n  background-color: ", ";\n"])), function (props) {
   switch (props.passwordStrength) {
     case 0:
       return "#F0F0F0";
+
     case 1:
       if (props.level === 1) {
         return "#E67432";
       } else {
         return "#F0F0F0";
       }
+
     case 2:
       if (props.level <= 2) {
         return "#EDD34D";
       } else {
         return "#F0F0F0";
       }
+
     case 3:
       if (props.level <= 3) {
         return "#71DE56";
       } else {
         return "#F0F0F0";
       }
+
     case 4:
       if (props.level <= 4) {
         return "#71DE56";
       } else {
         return "#F0F0F0";
       }
+
     default:
       return;
   }
 });
-const ItemPasswordStrength = exports.ItemPasswordStrength = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: 24%;\n  position: relative;\n  p {\n    margin-top: 1.5%;\n    font-weight: 700;\n    display: flex;\n    justify-content: flex-end;\n    font-size: 11px;\n    position: absolute;\n    right: 0;\n    top: 100%;\n    color: ", ";\n  }\n"])), props => {
+
+exports.Password = Password;
+
+var ItemPasswordStrength = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: 24%;\n  position: relative;\n  p {\n    margin-top: 1.5%;\n    font-weight: 700;\n    display: flex;\n    justify-content: flex-end;\n    font-size: 11px;\n    position: absolute;\n    right: 0;\n    top: 100%;\n    color: ", ";\n  }\n"])), function (props) {
   switch (props.paso) {
     case 1:
       return "#E67432";
+
     case 2:
       return "#EDD34D";
+
     case 3:
       return "#71DE56";
+
     case 4:
       return "#71DE56";
   }
-});
+});
+
+exports.ItemPasswordStrength = ItemPasswordStrength;

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

@@ -1,17 +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 = exports.default = {
+
+var _default = {
   title: "Components/molecules/LogoLoading",
   component: _index.LogoLoading
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.LogoLoading, {
-  ...args
-});
-const LogoLoadingDefault = exports.LogoLoadingDefault = Template.bind({});
+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

@@ -4,13 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LogoLoading = void 0;
+
 var _styles = require("./styles");
+
 var _Loading = require("../../atoms/Loading");
+
 var _LogoImage = require("../../atoms/LogoImage");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const LogoLoading = () => {
+
+var LogoLoading = function LogoLoading() {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LogoImage.LogoImage, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {})]
   });
 };
+
 exports.LogoLoading = LogoLoading;

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

@@ -1,11 +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;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 100vh;\n  width: 50%;\n  padding-top: 25%;\n  .logo {\n    text-align: center;\n    img {\n      width: 65%;\n    }\n  }\n  .loading {\n    height: 10%;\n  }\n"])));
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 100vh;\n  width: 50%;\n  padding-top: 25%;\n  .logo {\n    text-align: center;\n    img {\n      width: 65%;\n    }\n  }\n  .loading {\n    height: 10%;\n  }\n"])));
+
+exports.Container = Container;

package/dist/components/molecules/ParentComponent/ParentComponent.stories.js

@@ -1,20 +1,33 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ParentComponentDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/molecules/ParentComponent",
   component: _index.ParentComponent,
-  decorators: [Story => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ParentComponent, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Story, {})
-  })]
+  decorators: [function (Story) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ParentComponent, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Story, {})
+    });
+  }]
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ParentComponent, {
-  ...args
-});
-const ParentComponentDefault = exports.ParentComponentDefault = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ParentComponent, (0, _objectSpread2.default)({}, args));
+};
+
+var ParentComponentDefault = Template.bind({});
+exports.ParentComponentDefault = ParentComponentDefault;
 ParentComponentDefault.args = {};

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

@@ -1,18 +1,31 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ParentComponent = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
+
 var _index = require("../SidebarNotification/index");
+
 var _react = require("react");
+
 var _defaultProfileImage = _interopRequireDefault(require("../../../assets/images/defaultImages/defaultProfileImage.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
-const ParentComponent = () => {
-  const [showSidebar, setShowSidebar] = (0, _react.useState)(true);
-  const array = [{
+
+var ParentComponent = function ParentComponent() {
+  var _useState = (0, _react.useState)(true),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      showSidebar = _useState2[0],
+      setShowSidebar = _useState2[1];
+
+  var array = [{
     dates: "2/16/2022",
     notifications: [{
       profilePicture: _defaultProfileImage.default,
@@ -54,4 +67,5 @@ const ParentComponent = () => {
     })
   });
 };
+
 exports.ParentComponent = ParentComponent;

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

@@ -1,11 +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;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  height: 100vh;\n  width: 100%;\n"])));
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  height: 100vh;\n  width: 100%;\n"])));
+
+exports.Container = Container;

package/dist/components/molecules/PayMethod/PayMethod.stories.js

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

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

@@ -1,19 +1,30 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PayMethod = void 0;
+
+var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectDestructuringEmpty"));
+
 var _styles = require("./styles");
+
 var _index = require("../../atoms/ScreenHeader/index");
+
 var _variables = require("../../../global-files/variables");
+
 var _Card = require("../../atoms/Card");
+
 var _TagAndInput = require("../TagAndInput");
+
 var _masterCardIcon = _interopRequireDefault(require("../../../assets/images/card/masterCardIcon.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
-const PayMethod = _ref => {
-  let {} = _ref;
+
+var PayMethod = function PayMethod(_ref) {
+  (0, _objectDestructuringEmpty2.default)(_ref);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "master",
@@ -51,4 +62,5 @@ const PayMethod = _ref => {
     })]
   }, "pay");
 };
+
 exports.PayMethod = PayMethod;

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

@@ -1,12 +1,20 @@
 "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 _variables = require("../../../global-files/variables");
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  border: 2px solid ", ";\n  border-radius: 7px;\n  padding: 15px 25px;\n\n  .card-number{ \n    & + * {\n        margin-top: 5px;\n      }\n  }\n  .master {\n    display: flex;\n    justify-content: space-between;\n  }\n  .card-data {\n    display: flex;\n    justify-content: space-between;\n    .input-container {\n      flex: 1;\n      &:first-child {\n        flex: 3;\n      }\n      & + * {\n        margin-left: 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.s2);
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  border: 2px solid ", ";\n  border-radius: 7px;\n  padding: 15px 25px;\n\n  .card-number{ \n    & + * {\n        margin-top: 5px;\n      }\n  }\n  .master {\n    display: flex;\n    justify-content: space-between;\n  }\n  .card-data {\n    display: flex;\n    justify-content: space-between;\n    .input-container {\n      flex: 1;\n      &:first-child {\n        flex: 3;\n      }\n      & + * {\n        margin-left: 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.s2);
+
+exports.Container = Container;

package/dist/components/molecules/Phase/Phase.stories.js

@@ -1,21 +1,33 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PhaseDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _variables = require("../../../global-files/variables");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/molecules/Phase",
   component: _index.Phase,
   argTypes: {}
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Phase, {
-  ...args
-});
-const PhaseDefault = exports.PhaseDefault = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Phase, (0, _objectSpread2.default)({}, args));
+};
+
+var PhaseDefault = Template.bind({});
+exports.PhaseDefault = PhaseDefault;
 PhaseDefault.args = {
   id: 0,
   phases: [{