npm - contentoh-components-library - Versions diffs - 8.0.0 → 10.0.1 - Mend

contentoh-components-library 8.0.0 → 10.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (408) hide show

package/dist/components/molecules/VerificationCodeResetPasswordLogin/utils.js ADDED Viewed

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validateInput = exports.validate = void 0;
+/**
+ *
+ * @param {event} e event received triggered by verification code input
+ * @param {number} index index position from the verification code(VC) input array (i.e. digit 1,2,3 etc...)
+ * @param {array<html nodes>} inputsArray array which contains every VC digit input (used to change focus on input change)
+ */
+var validateInput = function validateInput(e, index, inputsArray) {
+  var isValid = false;
+  var inputNotEmpty = e.target.value.length > 0;
+  if (inputNotEmpty) {
+    if (validateInputNumber(e) !== null) {
+      isValid = true;
+      nextInputFocus(inputsArray, index++);
+    }
+  }
+  return isValid ? e.target.value : "";
+};
+/**
+ *
+ * @param {event} e event received triggered by verification code input
+ * @returns {boolean} if digit is a number
+ */
+exports.validateInput = validateInput;
+var validateInputNumber = function validateInputNumber(e) {
+  return (e.target.value || String.fromCharCode(e.keyCode)).match(/[0-9]{1}/);
+};
+/**
+ *
+ * @param {array<html nodes>} inputsArray array which contains every VC digit input (used to change focus on input change)
+ * @param {number} index index position from the verification code(VC) input array (i.e. digit 1,2,3 etc...)
+ * changes focus to next input if digit typed is a number and there wasn't any before
+ */
+var nextInputFocus = function nextInputFocus(inputsArray, index) {
+  var _inputsArray$index;
+  var button = document.getElementsByClassName("general-default-button");
+  inputsArray !== null && inputsArray !== void 0 && inputsArray.length && index === (inputsArray === null || inputsArray === void 0 ? void 0 : inputsArray.length) ? button[0].focus() : (_inputsArray$index = inputsArray[index]) === null || _inputsArray$index === void 0 ? void 0 : _inputsArray$index.focus();
+};
+/**
+ *
+ * @param {array<html nodes>} inputsArray array which contains every VC digit input (used to check if there's any empty)
+ * @param {function} setEmptyVerificationCode function to update flag which handles if there's an empty char
+ * updates emptyVerificationFlag from father component
+ */
+var validate = function validate(inputsArray) {
+  var contInputEmpty = 0;
+  inputsArray.forEach(function (element) {
+    element.value === "" ? 0 : contInputEmpty++;
+  });
+  return contInputEmpty !== inputsArray.length;
+};
+exports.validate = validate;

package/dist/components/organisms/ChangePassword/ChangePassword.stories.js ADDED Viewed

@@ -0,0 +1,28 @@
+"use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ChangePasswordDefault = 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/organisms/ChangePassword",
+  component: _index.ChangePassword
+};
+exports.default = _default;
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChangePassword, (0, _objectSpread2.default)({}, args));
+};
+var ChangePasswordDefault = Template.bind({});
+exports.ChangePasswordDefault = ChangePasswordDefault;
+ChangePasswordDefault.args = {};

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

@@ -0,0 +1,124 @@
+"use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChangePassword = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _styles = require("./styles");
+var _LoginPasswordStrength = require("../../molecules/LoginPasswordStrength");
+var _react = require("react");
+var _GeneralButton = require("../../atoms/GeneralButton");
+var _LogoImage = require("../../atoms/LogoImage");
+var _ScreenHeader = require("../../atoms/ScreenHeader");
+var _variables = require("../../../global-files/variables");
+var _GradientPanel = require("../../atoms/GradientPanel");
+var _jsxRuntime = require("react/jsx-runtime");
+var ChangePassword = function ChangePassword(props) {
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      emptyPassword = _useState2[0],
+      setEmptyPassword = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      emptyConfirmPassword = _useState4[0],
+      setEmptyConfirmPassword = _useState4[1];
+  var _useState5 = (0, _react.useState)(true),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      matchPasswords = _useState6[0],
+      setMatchPasswords = _useState6[1];
+  var validate = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(e) {
+      var password, confirmPassword, valid;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              e.preventDefault();
+              password = document.querySelector("#newPasswordInput").value;
+              password.length < 8 ? setEmptyPassword(true) : setEmptyPassword(false);
+              confirmPassword = document.querySelector("#confirmPasswordInput").value;
+              confirmPassword === "" ? setEmptyConfirmPassword(true) : setEmptyConfirmPassword(false);
+              if (password === confirmPassword) {
+                setMatchPasswords(true);
+              } else {
+                setMatchPasswords(false);
+              }
+              valid = true;
+              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 9:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+    return function validate(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var loginRight = [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LogoImage.LogoImage, {}, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "credenciales",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+      fontFamily: _variables.FontFamily.AvenirNext,
+      color: _variables.GlobalColors.s5,
+      text: "Ingresa tus credenciales"
+    })
+  }, "2"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoginPasswordStrength.LoginPasswordStrength, {
+    emptyPassword: emptyPassword,
+    emptyConfirmPassword: emptyConfirmPassword,
+    matchPasswords: matchPasswords,
+    textTittle: "Ingresa tus credenciales"
+  }, "3"), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "button-center",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+      buttonType: "general-default-button",
+      label: "Enviar",
+      onClick: function onClick(e) {
+        return validate(e);
+      }
+    })
+  }, "4")];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GradientPanel.GradientPanel, {
+      panelColor: _variables.GlobalColors.white,
+      componentsArray: loginRight,
+      panelType: "home-login"
+    })
+  });
+};
+exports.ChangePassword = ChangePassword;

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

@@ -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  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/dist/components/organisms/FullProductNameHeader/FullProductNameHeader.stories.js CHANGED Viewed

@@ -1,12 +1,18 @@
 "use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.FullProductNameHeaderDefault = 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/organisms/FullProductNameHeader",
   component: _index.FullProductNameHeader
@@ -14,7 +20,7 @@ var _default = {
 exports.default = _default;
 var Template = function Template(args) {
-  return /*#__PURE__*/React.createElement(_index.FullProductNameHeader, args);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.FullProductNameHeader, (0, _objectSpread2.default)({}, args));
 };
 var FullProductNameHeaderDefault = Template.bind({});

package/dist/components/organisms/FullProductNameHeader/index.js CHANGED Viewed

@@ -1,10 +1,14 @@
 "use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FullProductNameHeader = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _styles = require("./styles");
 var _ProductNameHeader = require("../../molecules/ProductNameHeader");
@@ -13,6 +17,10 @@ var _FeaturesBar = require("../../molecules/FeaturesBar");
 var _AvatarAndValidation = require("../../molecules/AvatarAndValidation");
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
 var FullProductNameHeader = function FullProductNameHeader(_ref) {
   var _headerData$article, _headerData$article2, _headerData$article3, _headerData$article4, _headerData$article5;
@@ -20,40 +28,68 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
       percent = _ref.percent,
       activeRetailer = _ref.activeRetailer,
       setActiveRetailer = _ref.setActiveRetailer,
-      approveRejectButtons = _ref.approveRejectButtons,
-      sendToFacilitator = _ref.sendToFacilitator,
-      auditorAssigned = _ref.auditorAssigned,
-      userAssigned = _ref.userAssigned;
-  return /*#__PURE__*/React.createElement(_styles.Container, null, /*#__PURE__*/React.createElement(_ProductNameHeader.ProductNameHeader, {
-    productName: headerData === null || headerData === void 0 ? void 0 : (_headerData$article = headerData.article) === null || _headerData$article === void 0 ? void 0 : _headerData$article.name,
-    statusType: headerData === null || headerData === void 0 ? void 0 : headerData.status,
-    percent: percent,
-    priority: headerData === null || headerData === void 0 ? void 0 : headerData.prio,
-    date: new Date(headerData === null || headerData === void 0 ? void 0 : (_headerData$article2 = headerData.article) === null || _headerData$article2 === void 0 ? void 0 : _headerData$article2.timestamp).toLocaleDateString()
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "features-bar-container"
-  }, /*#__PURE__*/React.createElement(_FeaturesBar.FeaturesBar, {
-    features: [{
-      feature: "Categoría",
-      value: headerData === null || headerData === void 0 ? void 0 : (_headerData$article3 = headerData.article) === null || _headerData$article3 === void 0 ? void 0 : _headerData$article3.category
-    }, {
-      feature: "Prov",
-      value: headerData === null || headerData === void 0 ? void 0 : (_headerData$article4 = headerData.article) === null || _headerData$article4 === void 0 ? void 0 : _headerData$article4.company_name
-    }, {
-      feature: "UPC",
-      value: headerData === null || headerData === void 0 ? void 0 : (_headerData$article5 = headerData.article) === null || _headerData$article5 === void 0 ? void 0 : _headerData$article5.upc
-    }]
-  }), /*#__PURE__*/React.createElement(_AvatarAndValidation.AvatarAndValidation, {
-    retailers: headerData === null || headerData === void 0 ? void 0 : headerData.retailers,
-    avatarData: headerData === null || headerData === void 0 ? void 0 : headerData.avatarData,
-    validation: headerData === null || headerData === void 0 ? void 0 : headerData.validation,
-    activeRetailer: activeRetailer,
-    setActiveRetailer: setActiveRetailer,
-    approveRejectButtons: approveRejectButtons,
-    sendToFacilitator: sendToFacilitator,
-    auditorAssigned: auditorAssigned,
-    userAssigned: userAssigned
-  })));
+      showValidationButtons = _ref.showValidationButtons,
+      approve = _ref.approve,
+      reject = _ref.reject,
+      approveAll = _ref.approveAll,
+      rejectAll = _ref.rejectAll,
+      servicesData = _ref.servicesData,
+      showApproveRejectAll = _ref.showApproveRejectAll;
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      retailers = _useState2[0],
+      setRetailers = _useState2[1];
+  (0, _react.useEffect)(function () {
+    var rtls = (headerData === null || headerData === void 0 ? void 0 : headerData.retailers) || (headerData === null || headerData === void 0 ? void 0 : headerData.retailersAvailable);
+    servicesData && rtls.forEach(function (rt) {
+      var element = [];
+      servicesData.forEach(function (sd) {
+        if (sd.id_retailer === rt.id) {
+          element.push(sd.status ? sd.status : "RECEIVED");
+        } else element.push("NA");
+        rt["services"] = element;
+      });
+    });
+    setRetailers(rtls);
+  }, [servicesData]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductNameHeader.ProductNameHeader, {
+      productName: (headerData === null || headerData === void 0 ? void 0 : (_headerData$article = headerData.article) === null || _headerData$article === void 0 ? void 0 : _headerData$article.name) || (headerData === null || headerData === void 0 ? void 0 : headerData.name),
+      statusType: (headerData === null || headerData === void 0 ? void 0 : headerData.version_status) || (headerData === null || headerData === void 0 ? void 0 : headerData.status) || (headerData === null || headerData === void 0 ? void 0 : headerData.article_status),
+      percent: percent === null || percent === void 0 ? void 0 : percent.toFixed(0),
+      priority: headerData === null || headerData === void 0 ? void 0 : headerData.prio,
+      date: new Date((headerData === null || headerData === void 0 ? void 0 : (_headerData$article2 = headerData.article) === null || _headerData$article2 === void 0 ? void 0 : _headerData$article2.timestamp) || (headerData === null || headerData === void 0 ? void 0 : headerData.timestamp)).toLocaleDateString()
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "features-bar-container",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FeaturesBar.FeaturesBar, {
+        features: [{
+          feature: "Categoría",
+          value: (headerData === null || headerData === void 0 ? void 0 : (_headerData$article3 = headerData.article) === null || _headerData$article3 === void 0 ? void 0 : _headerData$article3.category) || (headerData === null || headerData === void 0 ? void 0 : headerData.categoryName)
+        }, {
+          feature: "Prov",
+          value: headerData === null || headerData === void 0 ? void 0 : (_headerData$article4 = headerData.article) === null || _headerData$article4 === void 0 ? void 0 : _headerData$article4.company_name
+        }, {
+          feature: "UPC",
+          value: (headerData === null || headerData === void 0 ? void 0 : (_headerData$article5 = headerData.article) === null || _headerData$article5 === void 0 ? void 0 : _headerData$article5.upc) || (headerData === null || headerData === void 0 ? void 0 : headerData.upc)
+        }]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AvatarAndValidation.AvatarAndValidation, {
+        retailers: retailers,
+        avatarData: headerData === null || headerData === void 0 ? void 0 : headerData.avatarData,
+        validation: headerData === null || headerData === void 0 ? void 0 : headerData.validation,
+        activeRetailer: activeRetailer,
+        setActiveRetailer: setActiveRetailer,
+        showValidationButtons: showValidationButtons,
+        showApproveRejectAll: showApproveRejectAll,
+        approve: approve,
+        reject: reject,
+        approveAll: approveAll,
+        rejectAll: rejectAll
+      })]
+    })]
+  });
 };
 exports.FullProductNameHeader = FullProductNameHeader;

package/dist/components/organisms/FullTabsMenu/FullTabsMenu.stories.js CHANGED Viewed

@@ -1,12 +1,18 @@
 "use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.FullTabsMenuDefault = 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/organisms/FullTabsMenu",
   component: _index.FullTabsMenu
@@ -14,7 +20,7 @@ var _default = {
 exports.default = _default;
 var Template = function Template(args) {
-  return /*#__PURE__*/React.createElement(_index.FullTabsMenu, args);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.FullTabsMenu, (0, _objectSpread2.default)({}, args));
 };
 var FullTabsMenuDefault = Template.bind({});

package/dist/components/organisms/FullTabsMenu/index.js CHANGED Viewed

@@ -17,40 +17,47 @@ var _index2 = require("../../molecules/StatusAsignationInfo/index");
 var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
 var FullTabsMenu = function FullTabsMenu(_ref) {
   var tabsSections = _ref.tabsSections,
       _ref$status = _ref.status,
       status = _ref$status === void 0 ? "" : _ref$status,
-      profileImage = _ref.profileImage,
       activeTab = _ref.activeTab,
       setActiveTab = _ref.setActiveTab,
       setImageLayout = _ref.setImageLayout,
-      saveDatasheets = _ref.saveDatasheets,
-      saveDescriptions = _ref.saveDescriptions,
-      updateImages = _ref.updateImages,
-      assignations = _ref.assignations;
+      assig = _ref.assig,
+      setAssignation = _ref.setAssignation,
+      isRetailer = _ref.isRetailer,
+      downloadImages = _ref.downloadImages,
+      askToDeleteImages = _ref.askToDeleteImages,
+      onClickSave = _ref.onClickSave,
+      showSaveButton = _ref.showSaveButton;
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       imagesSection = _useState2[0],
-      setImagesSection = _useState2[1]; //console.log(status);
-  return /*#__PURE__*/React.createElement(_styles.Container, null, /*#__PURE__*/React.createElement(_index.TabsMenu, {
-    tabsSections: tabsSections,
-    setImagesSection: setImagesSection,
-    setActiveTab: setActiveTab
-  }), /*#__PURE__*/React.createElement(_index2.StatusAsignationInfo, {
-    status: status[activeTab],
-    activeTab: activeTab,
-    image: profileImage,
-    setImageLayout: setImageLayout,
-    imagesSection: imagesSection,
-    saveDatasheets: saveDatasheets,
-    saveDescriptions: saveDescriptions,
-    updateImages: updateImages,
-    assignationsImages: assignations[activeTab]
-  }));
+      setImagesSection = _useState2[1];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TabsMenu, {
+      tabsSections: tabsSections,
+      setImagesSection: setImagesSection,
+      setActiveTab: setActiveTab
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StatusAsignationInfo, {
+      status: status,
+      activeTab: activeTab,
+      setImageLayout: setImageLayout,
+      imagesSection: imagesSection,
+      assignationsImages: assig,
+      setAssignation: setAssignation,
+      isRetailer: isRetailer,
+      downloadImages: downloadImages,
+      onClickSave: onClickSave,
+      askToDeleteImages: askToDeleteImages,
+      showSaveButton: showSaveButton
+    })]
+  });
 };
 exports.FullTabsMenu = FullTabsMenu;

package/dist/components/organisms/Fullplan/FullPlan.stories.js CHANGED Viewed

@@ -1,12 +1,18 @@
 "use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.FullPlanDefault = 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/organisms/FullPlan",
   component: _index.FullPlan
@@ -14,7 +20,7 @@ var _default = {
 exports.default = _default;
 var Template = function Template(args) {
-  return /*#__PURE__*/React.createElement(_index.FullPlan, args);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.FullPlan, (0, _objectSpread2.default)({}, args));
 };
 var FullPlanDefault = Template.bind({});

package/dist/components/organisms/Fullplan/index.js CHANGED Viewed

@@ -21,6 +21,8 @@ var _GeneralButton = require("../../atoms/GeneralButton");
 var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
 var FullPlan = function FullPlan(_ref) {
   var title = _ref.title,
       textGeneral = _ref.textGeneral,
@@ -31,21 +33,27 @@ var FullPlan = function FullPlan(_ref) {
       buttonActive = _useState2[0],
       setbuttonActive = _useState2[1];
-  return /*#__PURE__*/React.createElement(_styles.Container, null, /*#__PURE__*/React.createElement("div", {
-    className: "title"
-  }, /*#__PURE__*/React.createElement(_ScreenHeader.ScreenHeader, {
-    headerType: "product-name-header",
-    text: title,
-    color: _variables.GlobalColors.original_purpura
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "general-text"
-  }, /*#__PURE__*/React.createElement("p", null, textGeneral)), /*#__PURE__*/React.createElement(_PlanSelection.PlanSelection, {
-    planSelection: containerData,
-    setbuttonActive: setbuttonActive
-  }), /*#__PURE__*/React.createElement(_GeneralButton.Button, {
-    buttonType: buttonActive ? "general-default-button" : "general-transparent-button",
-    label: "Continuar"
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "title",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        headerType: "product-name-header",
+        text: title,
+        color: _variables.GlobalColors.original_purpura
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "general-text",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+        children: textGeneral
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PlanSelection.PlanSelection, {
+      planSelection: containerData,
+      setbuttonActive: setbuttonActive
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+      buttonType: buttonActive ? "general-default-button" : "general-transparent-button",
+      label: "Continuar"
+    })]
+  });
 };
 exports.FullPlan = FullPlan;

package/dist/components/organisms/GlobalModal/index.js ADDED Viewed

@@ -0,0 +1,73 @@
+"use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GlobalModal = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactImageFallback = _interopRequireDefault(require("react-image-fallback"));
+var _styles = require("./styles");
+var _yellowAlert = _interopRequireDefault(require("../../../assets/images/genericModal/yellowAlert.svg"));
+var _closeWhite = _interopRequireDefault(require("../../../assets/images/genericModal/closeWhite.svg"));
+var _jsxRuntime = require("react/jsx-runtime");
+/*
+props (* required):
+  - *close: function to quit pop up e.g close={() => setShow(!show)}
+  - button1/button2: name and action button e.g. button1={{ name: 'Cancelar', action: () => console.log('Cancelar') }}
+  - img: source image
+  - *message: message to show (like title)
+  - detail: message detail
+  - withoutImg: if the value is "true" the icon will not be displayed, if this attribute is ignored or has the value of "false" the icon will be displayed
+  - customComponent: contains a custom component
+*/
+var GlobalModal = function GlobalModal(props) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MainContainer, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.MessageContainer, {
+      height: props.button1 || props.button2,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Header, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Icon, {
+          widthImg: props.widthImg,
+          heightImg: props.heightImg,
+          children: !props.withoutImg && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageFallback.default, {
+            src: props.img,
+            fallbackImage: _yellowAlert.default,
+            alt: ""
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Close, {
+          onClick: props.close,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+            src: _closeWhite.default,
+            alt: "Cerrar"
+          })
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Message, {
+        children: [props.bold && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.BoldText, {
+          children: props.bold
+        }), " ", props.message]
+      }), props.detail && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Detail, {
+        children: "".concat(props.detail, " ")
+      }), props.textArea && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TextArea, {
+        id: "area"
+      }), props.customComponent && props.customComponent, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.ContainerButtons, {
+        children: [props.button1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.FirstButton, {
+          onClick: props.button1.action,
+          children: props.button1.name
+        }), props.button2 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Button, {
+          onClick: props.button2.action,
+          children: props.button2.name
+        })]
+      })]
+    })
+  });
+};
+exports.GlobalModal = GlobalModal;