contentoh-components-library 21.3.82 → 21.3.84

package/.env.development

@@ -24,10 +24,6 @@ REACT_APP_PENDING_INVITATIONS=https://fc069ovhuk.execute-api.us-east-1.amazonaws
 REACT_APP_PRODUCTS_CHAT_ENDPOINT=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/products-chat
 REACT_APP_TICKETS_CHAT_ENDPOINT=https://ocqbzaa4a2.execute-api.us-east-1.amazonaws.com/dev/ticket-chat
 REACT_APP_GET_AUDIT=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/version-manager
-REACT_APP_READ_MESSAGES=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/read-messages
-REACT_APP_CREATE_MESSAGES=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/create-messages
-REACT_APP_CARDS_ENDPOINT=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/cards
-REACT_APP_PAYMENTS=https://fc069ovhuk.execute-api.us-east-1.amazonaws.com/dev/payments
 
 REACT_APP_IMAGES_ENDPOINT=https://content-management-images.s3.amazonaws.com
 REACT_APP_IMAGES_BUCKET=content-management-images
@@ -36,4 +32,3 @@ REACT_APP_KUTS3=AKIA5CPHLQTTS22HCGHW
 REACT_APP_AKUTS3=RSpwEaM0fsLEgN7BJzRyCKqyU0lNExTsPUvxyNXm
 REACT_APP_USER_POOL_ID=us-east-1_XMZQdqkGj
 REACT_APP_USER_POOL_WEB_CLIENT_ID=5ac8tpgs6gbsq13frvrpieep40
-REACT_APP_KEY_STRIPE=pk_test_51J0bb0HCkqMP7wBlGPoEHU6bVLszHT5qHa1uPZp4ThgaMFYbvOAcKfI8q1fsWhbiO02Zn78lgYwuElcwfrA9rnaF00fA4q5zcs

package/.env.production

@@ -24,7 +24,6 @@ REACT_APP_PENDING_INVITATIONS=https://3v43slee1m.execute-api.us-east-1.amazonaws
 REACT_APP_PRODUCTS_CHAT_ENDPOINT=https://3v43slee1m.execute-api.us-east-1.amazonaws.com/prod/products-chat
 REACT_APP_TICKETS_CHAT_ENDPOINT=https://0g5ugr1kzl.execute-api.us-east-1.amazonaws.com/prod/ticket-chat
 REACT_APP_GET_AUDIT=https://3v43slee1m.execute-api.us-east-1.amazonaws.com/prod/version-manager
-REACT_APP_CARDS_ENDPOINT=https://3v43slee1m.execute-api.us-east-1.amazonaws.com/prod/cards
 
 REACT_APP_IMAGES_ENDPOINT=https://content-management-images.s3.amazonaws.com
 REACT_APP_IMAGES_BUCKET=content-management-images-prod
@@ -33,5 +32,3 @@ REACT_APP_KUTS3=AKIA5CPHLQTTS22HCGHW
 REACT_APP_AKUTS3=RSpwEaM0fsLEgN7BJzRyCKqyU0lNExTsPUvxyNXm
 REACT_APP_USER_POOL_ID=us-east-1_XMZQdqkGj
 REACT_APP_USER_POOL_WEB_CLIENT_ID=5ac8tpgs6gbsq13frvrpieep40
-
-REACT_APP_KEY_STRIPE=pk_live_51J0bb0HCkqMP7wBlz50UUsw9MCwMrIUKyRVE5tTBLMLm4Tz44FWckOfeJ41kj3NEyX6EvPqti1kMFSWrP7SFj6UX00dJ2D3xsm

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

@@ -15,7 +15,7 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  padding: 0px;\n  cursor: ", ";\n  border-radius: ", ";\n  border: none;\n\n  .button {\n    --size: ", "px;\n    width: 100%;\n    min-width: min-content;\n    cursor: inherit;\n    display: flex;\n    flex-direction: ", ";\n    gap: 7px;\n    align-items: center;\n    justify-content: center;\n    padding: ", ";\n    border-radius: inherit;\n    border: ", ";\n    font-family: ", ", sans-serif;\n    font-size: var(--size);\n    line-height: 1.2;\n    text-transform: none;\n\n    // tipos de botones fill\n    &.fill {\n      &.white {\n        background-color: white;\n        color: #e33aa9;\n        border-color: #e33aa9;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS2 {\n        background-color: white;\n        color: #7b7979;\n        border-color: #f0f0f0;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS3 {\n        background-color: white;\n        color: #262626;\n        border-color: #f0f0f0;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS4 {\n        background-color: white;\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #e0e0f1;\n        }\n      }\n      &.pink {\n        background-color: #e33aa9;\n        color: white;\n        border-color: #e33aa9;\n        &:hover {\n          background-color: #b42983;\n        }\n      }\n      &.gray {\n        background-color: #e8e5e5;\n        color: #262626;\n        border-color: #7b7979;\n        .icon,\n        .iconLoading {\n          color: #7b7979;\n        }\n        &:hover {\n          background-color: #d6d3d3;\n        }\n      }\n      &.purple {\n        background-color: #f7f7fc;\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #e0e0f1;\n        }\n      }\n      &.purpleS2 {\n        background-color: #8a6caa;\n        color: white;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #61467e;\n        }\n      }\n    }\n\n    // tipos de botones transparent\n    &.transparent {\n      &:hover {\n        background-color: transparent;\n      }\n      &.white {\n        color: white;\n        border-color: #e33aa9;\n        &:hover {\n          color: #d6d4d4;\n        }\n      }\n      &.pink {\n        color: #e33aa9;\n        border-color: #e33aa9;\n        &:hover {\n          color: #b42983;\n        }\n      }\n      &.gray {\n        color: #262626;\n        border-color: #7b7979;\n        .icon,\n        .iconLoading {\n          color: #7b7979;\n          transition: inherit;\n        }\n        &:hover {\n          color: #7b7979;\n          .icon,\n          .iconLoading {\n            color: #bdbbbb;\n          }\n        }\n      }\n      &.purple {\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          color: #714f95;\n        }\n      }\n      &.black {\n        color: #262626;\n        border-color: #262626;\n        &:hover {\n          color: #7b7979;\n        }\n      }\n    }\n\n    .icon,\n    .iconLoading {\n      display: grid;\n      place-items: center;\n      color: inherit;\n      font-size: ", ";\n    }\n    .iconLoading {\n      font-size: ", ";\n    }\n\n    // mismo estilo desabilitado para cualquier tipo de boton\n    &:disabled {\n      background-color: #fcebf7 !important;\n      color: #7b7979 !important;\n      border-color: #7b7979 !important;\n\n      .icon {\n        color: #9e9c9c !important;\n      }\n      .iconLoading {\n        color: #9e2674 !important;\n      }\n\n      &:hover {\n        background-color: #fcebf7 !important;\n      }\n    }\n  }\n"])), function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  padding: 0px;\n  cursor: ", ";\n  border-radius: ", ";\n  border: none;\n\n  .button {\n    --size: ", "px;\n    width: 100%;\n    min-width: min-content;\n    cursor: inherit;\n    display: flex;\n    flex-direction: ", ";\n    gap: 7px;\n    align-items: center;\n    justify-content: center;\n    padding: ", ";\n    border-radius: inherit;\n    border: ", ";\n    font-family: ", ", sans-serif;\n    font-size: var(--size);\n    line-height: 1.2;\n    text-transform: none;\n\n    // tipos de botones fill\n    &.fill {\n      &.white {\n        background-color: white;\n        color: #e33aa9;\n        border-color: #e33aa9;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS2 {\n        background-color: white;\n        color: #7b7979;\n        border-color: #f0f0f0;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS3 {\n        background-color: white;\n        color: #262626;\n        border-color: #f0f0f0;\n        &:hover {\n          background-color: #f4f4f4;\n        }\n      }\n      &.whiteS4 {\n        background-color: white;\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #e0e0f1;\n        }\n      }\n      &.pink {\n        background-color: #e33aa9;\n        color: red;\n        border-color: #e33aa9;\n        &:hover {\n          background-color: #b42983;\n        }\n      }\n      &.gray {\n        background-color: #e8e5e5;\n        color: #262626;\n        border-color: #7b7979;\n        .icon,\n        .iconLoading {\n          color: #7b7979;\n        }\n        &:hover {\n          background-color: #d6d3d3;\n        }\n      }\n      &.purple {\n        background-color: #f7f7fc;\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #e0e0f1;\n        }\n      }\n      &.purpleS2 {\n        background-color: #8a6caa;\n        color: white;\n        border-color: #8a6caa;\n        &:hover {\n          background-color: #61467e;\n        }\n      }\n    }\n\n    // tipos de botones transparent\n    &.transparent {\n      &:hover {\n        background-color: transparent;\n      }\n      &.white {\n        color: white;\n        border-color: #e33aa9;\n        &:hover {\n          color: #d6d4d4;\n        }\n      }\n      &.pink {\n        color: #e33aa9;\n        border-color: #e33aa9;\n        &:hover {\n          color: #b42983;\n        }\n      }\n      &.gray {\n        color: #262626;\n        border-color: #7b7979;\n        .icon,\n        .iconLoading {\n          color: #7b7979;\n          transition: inherit;\n        }\n        &:hover {\n          color: #7b7979;\n          .icon,\n          .iconLoading {\n            color: #bdbbbb;\n          }\n        }\n      }\n      &.purple {\n        color: #8a6caa;\n        border-color: #8a6caa;\n        &:hover {\n          color: #714f95;\n        }\n      }\n      &.black {\n        color: #262626;\n        border-color: #262626;\n        &:hover {\n          color: #7b7979;\n        }\n      }\n    }\n\n    .icon,\n    .iconLoading {\n      display: grid;\n      place-items: center;\n      color: inherit;\n      font-size: ", ";\n    }\n    .iconLoading {\n      font-size: ", ";\n    }\n\n    // mismo estilo desabilitado para cualquier tipo de boton\n    &:disabled {\n      background-color: #fcebf7 !important;\n      color: #7b7979 !important;\n      border-color: #7b7979 !important;\n\n      .icon {\n        color: #9e9c9c !important;\n      }\n      .iconLoading {\n        color: #9e2674 !important;\n      }\n\n      &:hover {\n        background-color: #fcebf7 !important;\n      }\n    }\n  }\n"])), function (_ref) {
   var disabled = _ref.disabled,
       isLoading = _ref.isLoading;
   return disabled || isLoading ? "not-allowed" : "pointer";

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

@@ -1,62 +1,21 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Card = void 0;
 
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-
 var _styles = require("./styles");
 
-var _CheckBox = require("../CheckBox");
-
-var _reactStripeJs = require("@stripe/react-stripe-js");
-
 var _jsxRuntime = require("react/jsx-runtime");
 
 var Card = function Card(_ref) {
-  var _ref$card = _ref.card,
-      card = _ref$card === void 0 ? {} : _ref$card,
-      selectedCard = _ref.selectedCard,
-      setSelectedCard = _ref.setSelectedCard,
-      setCard = _ref.setCard,
-      setStripe = _ref.setStripe;
-  var stripe = (0, _reactStripeJs.useStripe)();
-
-  var handleOnChange = function handleOnChange(e, cardId) {
-    if (e.target.checked) {
-      setCard && setCard((0, _objectSpread2.default)((0, _objectSpread2.default)({}, card), {}, {
-        isNew: 0
-      }));
-      setStripe && setStripe(stripe);
-      setSelectedCard && setSelectedCard(cardId);
-    } else {
-      setSelectedCard && setSelectedCard("");
-      setCard && setCard(null);
-    }
-  };
-
+  var cardIcon = _ref.cardIcon,
+      altText = _ref.altText;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "card-details",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckBox.CheckBox, {
-        id: card.id,
-        label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "brand-card",
-            children: card.brand
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            children: "**** **** **** ".concat(card.last4)
-          })]
-        }),
-        checked: selectedCard === card.id,
-        onChange: function onChange(e) {
-          return handleOnChange(e, card.id);
-        }
-      })
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      src: cardIcon,
+      alt: altText
     })
   });
 };

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

@@ -11,10 +11,8 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _variables = require("../../../global-files/variables");
-
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  cursor: pointer;\n\n  .card-details {\n    label {\n      cursor: pointer;\n      height: 25px;\n      p {\n        margin-left: 40px;\n        span {\n          & + * {\n            margin-left: 20px;\n          }\n        }\n      }\n    }\n    & + * {\n      margin-left: 20px;\n    }\n  }\n\n  .cvc-input {\n    display: flex;\n    align-items: center;\n    color: ", ";\n    font-family: ", ";\n    font-size: 13px;\n\n    .card-input {\n      border: 1px solid #f0f0f0 !important;\n      border-radius: 5px;\n      padding: 3px;\n      width: 50px;\n    }\n  }\n\n  & + * {\n    margin-top: 15px;\n  }\n"])), _variables.GlobalColors.s4, _variables.FontFamily.AvenirNext);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\nimg {\n    width: 100%;\n    margin:auto;\n}\n"])));
 
 exports.Container = Container;

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

@@ -16,8 +16,7 @@ var CheckBox = function CheckBox(_ref) {
       isFilter = _ref.isFilter,
       defaultChecked = _ref.defaultChecked,
       _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      checked = _ref.checked;
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
       type: "checkbox",
@@ -25,8 +24,7 @@ var CheckBox = function CheckBox(_ref) {
       id: id,
       onChange: onChange,
       defaultChecked: defaultChecked,
-      disabled: disabled,
-      checked: checked
+      disabled: disabled
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
       htmlFor: id,
       children: label && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {

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

@@ -23,8 +23,7 @@ var GeneralInput = function GeneralInput(_ref) {
   var inputType = _ref.inputType,
       inputId = _ref.inputId,
       inputName = _ref.inputName,
-      _ref$inputValue = _ref.inputValue,
-      inputValue = _ref$inputValue === void 0 ? "" : _ref$inputValue,
+      inputValue = _ref.inputValue,
       inputPlaceholder = _ref.inputPlaceholder,
       validateInput = _ref.validateInput,
       position = _ref.position,
@@ -67,6 +66,7 @@ var GeneralInput = function GeneralInput(_ref) {
       var generalValue;
 
       if ((optionList === null || optionList === void 0 ? void 0 : optionList.length) > 0) {
+        var index = evt.target.selectedIndex;
         var valueSelected = evt.target.value;
         generalValue = valueSelected;
         setTextValue({
@@ -80,31 +80,27 @@ var GeneralInput = function GeneralInput(_ref) {
       }
 
       var dataSave = updatedDatasheets === null || updatedDatasheets === void 0 ? void 0 : updatedDatasheets.slice();
-
-      if ((dataSave === null || dataSave === void 0 ? void 0 : dataSave.length) > 0) {
-        var index = dataSave.findIndex(function (e) {
-          return e.attributeId === inputId;
+      if (dataSave.length === 0) dataSave.push({
+        articleId: articleId,
+        versionId: version,
+        attributeId: inputId,
+        value: generalValue
+      });else if (dataSave.some(function (e) {
+        return e.attributeId === inputId;
+      })) {
+        dataSave.forEach(function (e) {
+          if (e.attributeId === inputId) {
+            e.value = generalValue;
+          }
         });
-
-        if (index !== -1) {
-          if (generalValue !== inputValue) dataSave[index].value = generalValue;else dataSave.splice(index, 1);
-        } else {
-          dataSave.push({
-            articleId: articleId,
-            attributeId: inputId,
-            value: generalValue
-          });
-        }
       } else {
-        if (generalValue !== inputValue) {
-          dataSave.push({
-            articleId: articleId,
-            attributeId: inputId,
-            value: generalValue
-          });
-        }
+        dataSave.push({
+          articleId: articleId,
+          versionId: version,
+          attributeId: inputId,
+          value: generalValue
+        });
       }
-
       setUpdatedDatasheets(dataSave);
     } else {
       setTextValue({

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

@@ -26,6 +26,8 @@ var InputFormatter = function InputFormatter(_ref) {
       articleId = _ref.articleId,
       updatedDescriptions = _ref.updatedDescriptions,
       setUpdatedDescriptions = _ref.setUpdatedDescriptions,
+      addTextAreaToArray = _ref.addTextAreaToArray,
+      name = _ref.name,
       isRequired = _ref.isRequired,
       maxChar = _ref.maxChar;
 
@@ -75,7 +77,7 @@ var InputFormatter = function InputFormatter(_ref) {
     return value.replace(/<\/p><p>/gm, "\n").replace(/<\/?br>|<\/?p>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
   };
 
-  var _onChange = function onChange(valueInput, h) {
+  var _onChange = function onChange(valueInput, delta, user, h) {
     var value = "";
 
     try {
@@ -102,12 +104,14 @@ var InputFormatter = function InputFormatter(_ref) {
       var dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
 
       if ((dataSave === null || dataSave === void 0 ? void 0 : dataSave.length) > 0) {
-        var index = dataSave.findIndex(function (e) {
+        if (dataSave.filter(function (e) {
           return e.attributeId === idInput;
-        });
-
-        if (index !== -1) {
-          if (value !== mainValue) dataSave[index].value = value;else dataSave.splice(index, 1);
+        }).length > 0) {
+          dataSave.forEach(function (e) {
+            if (e.attributeId === idInput) {
+              e.value = value;
+            }
+          });
         } else {
           dataSave.push({
             articleId: articleId,
@@ -116,13 +120,11 @@ var InputFormatter = function InputFormatter(_ref) {
           });
         }
       } else {
-        if (value !== mainValue) {
-          dataSave.push({
-            articleId: articleId,
-            attributeId: idInput,
-            value: value
-          });
-        }
+        dataSave.push({
+          articleId: articleId,
+          attributeId: idInput,
+          value: value
+        });
       }
 
       setUpdatedDescriptions(dataSave);
@@ -172,7 +174,7 @@ var InputFormatter = function InputFormatter(_ref) {
         }
       },
       onChange: function onChange(valueInput, user, range, h) {
-        return _onChange(valueInput, h);
+        _onChange(valueInput, user, range, h);
       },
       onChangeSelection: getSelection
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {

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

@@ -15,7 +15,7 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 2px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n    }\n  }\n  .description-limit {\n    font-size: 12px;\n    font-family: ", ";\n    color: ", ";\n    text-align: right;\n    margin-top: 5px;\n  }\n"])), _variables.GlobalColors.white, function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 2px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n    }\n  }\n  .description-limit {\n    font-size: 12px;\n    font-family: ", ";\n    color: ", ";\n    text-align: right;\n  }\n"])), _variables.GlobalColors.white, function (_ref) {
   var focus = _ref.focus,
       isRequired = _ref.isRequired;
   return focus ? _variables.GlobalColors.magenta_s2 : isRequired ? "red" : _variables.GlobalColors.s3;

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

@@ -47,7 +47,7 @@ var CarouselImagesLogin = function CarouselImagesLogin(_ref) {
       Array.from(circulos).forEach(function (cir) {
         return cir.classList.remove("resaltado");
       });
-      circulo_actual === null || circulo_actual === void 0 ? void 0 : circulo_actual.classList.add("resaltado");
+      circulo_actual.classList.add("resaltado");
       img1.classList.add("right");
       img2.classList.add("active");
       i++;

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

@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.HeaderTop = void 0;
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-
 var _styles = require("./styles");
 
 var _index = require("../../atoms/ScreenHeader/index");
@@ -21,14 +19,11 @@ var _Chat = require("../../organisms/Chat");
 
 var _IconoAB = _interopRequireDefault(require("../../../../src/assets/images/generalButton/Icono AB.svg"));
 
-var _react2 = require("@testing-library/react");
-
 var _jsxRuntime = require("react/jsx-runtime");
 
 var HeaderTop = function HeaderTop(_ref) {
   var setHeaderTop = _ref.setHeaderTop,
       withChat = _ref.withChat,
-      chatType = _ref.chatType,
       productSelected = _ref.productSelected,
       token = _ref.token,
       auditableVersion = _ref.auditableVersion,
@@ -36,78 +31,26 @@ var HeaderTop = function HeaderTop(_ref) {
       isAuditor = _ref.isAuditor,
       activeRetailer = _ref.activeRetailer;
   var headerTop = (0, _react.useRef)();
-
-  var _useState = (0, _react.useState)(null),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      chat = _useState2[0],
-      setChat = _useState2[1];
-
-  var _useState3 = (0, _react.useState)(null),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      chatData = _useState4[0],
-      setChatData = _useState4[1];
-
-  (0, _react.useEffect)(function () {
-    if (activeRetailer.id && productSelected && token.length) {
-      var _productSelected$arti;
-
-      setChatData({
-        id: (productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti = productSelected.article) === null || _productSelected$arti === void 0 ? void 0 : _productSelected$arti.id_article) || (productSelected === null || productSelected === void 0 ? void 0 : productSelected.id_article),
-        version: productSelected === null || productSelected === void 0 ? void 0 : productSelected.version,
-        retailerId: activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id,
-        status: productSelected === null || productSelected === void 0 ? void 0 : productSelected.status,
-        userToken: token
-      });
-    }
-  }, [activeRetailer, productSelected, token]);
-  (0, _react.useEffect)(function () {
-    if (chatType) renderChat(chatType);
-  }, [chatData, chatType]);
   (0, _react.useEffect)(function () {
     setHeaderTop && setHeaderTop(headerTop.current.clientHeight);
   }, []);
-
-  var renderChat = function renderChat(chatType) {
-    switch (chatType) {
-      case "product_status":
-        chatData && setChat( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chat.Chat, {
-          chatType: "product_status",
-          chatContainerType: "popUp",
-          chatData: {
-            id: chatData === null || chatData === void 0 ? void 0 : chatData.id,
-            version: chatData === null || chatData === void 0 ? void 0 : chatData.version,
-            retailerId: chatData === null || chatData === void 0 ? void 0 : chatData.retailerId,
-            status: chatData === null || chatData === void 0 ? void 0 : chatData.status,
-            userToken: chatData === null || chatData === void 0 ? void 0 : chatData.userToken
-          },
-          size: 18,
-          activeRetailer: activeRetailer
-        }));
-        break;
-
-      default:
-        setChat( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chat.Chat, {
-          chatType: "merchant_product",
-          chatContainerType: "popUp",
-          chatData: {
-            userToken: token,
-            id: productSelected.id_article,
-            version: productSelected.version
-          },
-          size: 18,
-          activeRetailer: activeRetailer
-        }));
-        break;
-    }
-  };
-
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     ref: headerTop,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
       text: "Edici\xF3n de producto"
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "buttons-container",
-      children: [withChat && chat, isAuditor && auditableVersion && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Button, {
+      children: [withChat && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chat.Chat, {
+        chatType: "merchant_product",
+        chatContainerType: "popUp",
+        chatData: {
+          userToken: token,
+          id: productSelected.id_article,
+          version: productSelected.version
+        },
+        size: 18,
+        activeRetailer: activeRetailer
+      }), isAuditor && auditableVersion && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Button, {
         buttonType: "general-white-button circular-button",
         onClick: function onClick() {
           setCompare(function (current) {

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

@@ -27,9 +27,18 @@ var TabsMenu = function TabsMenu(_ref) {
       setImagesSection = _ref.setImagesSection,
       setActiveTab = _ref.setActiveTab,
       activeTab = _ref.activeTab,
+      desc = _ref.desc,
+      setDesc = _ref.setDesc,
+      fich = _ref.fich,
+      setFich = _ref.setFich,
+      imag = _ref.imag,
+      setImag = _ref.setImag,
       updatedDescriptions = _ref.updatedDescriptions,
       updatedDatasheets = _ref.updatedDatasheets,
-      images = _ref.images;
+      selectedImages = _ref.selectedImages,
+      setUpdatedDescriptions = _ref.setUpdatedDescriptions,
+      setUpdatedDatasheets = _ref.setUpdatedDatasheets,
+      setSelectedImages = _ref.setSelectedImages;
 
   var _useState = (0, _react.useState)(tabsSections),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -41,20 +50,30 @@ var TabsMenu = function TabsMenu(_ref) {
       modal = _useState4[0],
       setModal = _useState4[1];
 
-  var _useState5 = (0, _react.useState)(""),
+  var _useState5 = (0, _react.useState)(true),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      cancelAccept = _useState6[0],
-      setCancelAccept = _useState6[1];
+      isFirstExecution = _useState6[0],
+      setIsFirstExecution = _useState6[1];
 
-  var _useState7 = (0, _react.useState)(""),
+  var _useState7 = (0, _react.useState)(''),
       _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      llave = _useState8[0],
-      setLlave = _useState8[1];
+      detectaTab = _useState8[0],
+      setDetectaTab = _useState8[1];
 
-  var _useState9 = (0, _react.useState)(),
+  var _useState9 = (0, _react.useState)(''),
       _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      objeto = _useState10[0],
-      setObjeto = _useState10[1];
+      cancelAccept = _useState10[0],
+      setCancelAccept = _useState10[1];
+
+  var _useState11 = (0, _react.useState)(''),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      llave = _useState12[0],
+      setLlave = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      objeto = _useState14[0],
+      setObjeto = _useState14[1];
 
   var activeSection = function activeSection(key) {
     var array = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -62,31 +81,38 @@ var TabsMenu = function TabsMenu(_ref) {
     setImagesSection(key === "Imágenes");
     Object.keys(array).forEach(function (section) {
       tempArray[section] = section === key;
-      if (section === key) return setActiveTab(key);
+
+      if (section === key) {
+        setUpdatedDatasheets([]);
+        setUpdatedDescriptions([]);
+        setSelectedImages([]);
+        setDesc([]);
+        setFich([]);
+        setImag([]);
+        return setActiveTab(key);
+      }
+
+      ;
     });
     setSections(tempArray);
   };
 
   (0, _react.useEffect)(function () {
-    if (cancelAccept === "Aceptar" & llave !== "") {
-      setCancelAccept("");
+    if (cancelAccept === 'Aceptar' & llave !== '') {
+      setCancelAccept('');
       setModal(false);
       activeSection(llave, objeto);
-    } else if (cancelAccept === "Cancelar" & llave !== "") {
+    } else if (cancelAccept === 'Cancelar' & llave !== '') {
       setModal(false);
-      setCancelAccept("");
+      setCancelAccept('');
     }
   }, [cancelAccept]);
 
-  var detectClickFunction = function detectClickFunction(e, key, sections) {
-    var _images$values, _images$values$filter;
-
+  function detectClickFunction(e, key, sections) {
     var targetIsTheCurrentTab = e.target.innerHTML === activeTab;
     var descriptionsWereUpdated = updatedDescriptions.length > 0;
     var datasheetWereUpdated = updatedDatasheets.length > 0;
-    var imagesWereUpdated = (images === null || images === void 0 ? void 0 : (_images$values = images.values) === null || _images$values === void 0 ? void 0 : (_images$values$filter = _images$values.filter(function (f) {
-      return !f.id;
-    })) === null || _images$values$filter === void 0 ? void 0 : _images$values$filter.length) > 0;
+    var imagesWereUpdated = selectedImages.length > 0;
     var dataWereUpdated = descriptionsWereUpdated || datasheetWereUpdated || imagesWereUpdated;
 
     if (!targetIsTheCurrentTab && !dataWereUpdated) {
@@ -98,7 +124,7 @@ var TabsMenu = function TabsMenu(_ref) {
       setLlave(key);
       setObjeto(sections);
     }
-  };
+  }
 
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [activeTab && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {

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

@@ -11,6 +11,8 @@ var _index = require("../../atoms/ScreenHeader/index");
 
 var _index2 = require("../../atoms/GeneralInput/index");
 
+var _react = require("react");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var TagAndInput = function TagAndInput(_ref) {
@@ -43,7 +45,7 @@ var TagAndInput = function TagAndInput(_ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     inputType: inputType,
     className: "input-container",
-    children: [(label === null || label === void 0 ? void 0 : label.length) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "title-container",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
         text: label,

package/dist/components/organisms/Chat/Chat.stories.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.chatTicket_userTECH = exports.chatTicket_userNORMAL = exports.chatProduct_status = exports.chatPROV_orderProduct = exports.chatFAB_orderProduct_user49 = exports.chatFAB_orderProduct_user37 = exports.chatCAD_orderProduct = exports.chatCAD_merchantsProductProvider = exports.chatCAD_merchantsProduct = void 0;
+exports.default = exports.chatTicket_userTECH = exports.chatTicket_userNORMAL = exports.chatPROV_orderProduct = exports.chatFAB_orderProduct_user49 = exports.chatFAB_orderProduct_user37 = exports.chatCAD_orderProduct = exports.chatCAD_merchantsProductProvider = exports.chatCAD_merchantsProduct = void 0;
 
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 
@@ -160,35 +160,16 @@ chatTicket_userTECH.args = {
   chatType: "ticket",
   chatContainerType: "fixed",
   chatData: {
-    id: 171,
-    ticketOwnerUserId: 52,
-    statusTicket: "IN_PROGRESS",
+    id: 130,
+    ticketOwnerUserId: 194,
+    ticketCompany: undefined,
+    statusTicket: "PENDING",
     currentUser: {
-      token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI3M2NjOGQ0MC1jODQxLTQyMmEtYTJmMi1lNjlkN2ZlMjZlYmYiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjczY2M4ZDQwLWM4NDEtNDIyYS1hMmYyLWU2OWQ3ZmUyNmViZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIwYWNiYTdlYy01OGJhLTQyNGYtOTM5OC02ZGMxOGI1YTRkODYiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4ODk0MzcxNywibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTY4ODk0NzMxNywiaWF0IjoxNjg4OTQzNzE3LCJlbWFpbCI6Im9hcmVuYXNAY29udGVudG9oLmNvbSJ9.SHeA5EMqLdqlTuDBTpJ3l_lAAqjMlOT2Dm9U9yf-Y3-4FR-3cwQ_16sdsmGCjJpwkhdYBEyuQbFkY1xnQHOBLMow0izWD4CDlhlNXkWBE_3DjgCspyPMlz31Lfik2ddnkHp3HQeLwucC4uyum3N-roQA7HkuWQHSBIplp6b-Xd44OmN9X-V_kseN3QOX6o7kxNFjwZL_DUzTJUdMDOtIXXIKYO2FLkR1eWJDNdvee5FEIWAxJXfaSZ__Awawfi5k93ILXrPX7QVt78lOH3THMyiPTtfiOOwMhoSQz_k5DIuofE8FM_1-nLNajM18pI49wPQ_-k3ltCjChjqy-OlERQ",
-      id: 65,
-      companyId: 2,
+      token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJlYTRlZmQ1Zi1mYTg4LTRjNDEtYTM3Ny02MWVkNmY0YTMyOTciLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4MDA1Njg2NSwibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2ODAwNjA0NjUsImlhdCI6MTY4MDA1Njg2NSwiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.oRuv3LkdvctEMUjmeGw0-XefzV_Aoh1O2hFMik4RxpkkCUeP1O7AjA7lJI6sgoqa9Nwa2fCPRXk6ufi84UbgxGEgkupQmAvXTHQCw_uwCUVAZitlNGXSBl-VSisMuXSnckxdZQ1MvLV5BgLmiw4mu6HxKDN-Uw0xc7yL_yDtGu3NWxoO0Cm2zbej8jYLE9DV9wG297bjfzVQ7hzpEfEcB52I5Tg6nF2VDTx-8_m4mVVrpisbV5uBoYokbFyyOFVLZzUU7Je5uHukscHS5dje9IMTY8DE5S8xUWJubHjf_ktcy7Y2-F2cG5dI5oSdrBNU-wNNW5-OtRLgclSJLmbPCw",
+      id: 28,
+      companyId: 1,
       isUserTech: true
     }
   },
   classNameContainerFixed: "chatTicket"
-}; // ejemplo del chat para los cambios de status del producto.
-
-var chatProduct_status = Template.bind({});
-exports.chatProduct_status = chatProduct_status;
-chatProduct_status.args = {
-  chatType: "product_status",
-  chatContainerType: "popUp",
-  chatData: {
-    id: 37414,
-    version: 7,
-    retailerId: 70,
-    status: "AA",
-    orderId: 15189,
-    userToken: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJhOWFhMDQ4Zi05YzRjLTQxODMtYWUzMS03OWVjNjBhY2NjZGYiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4MzU4ODM4OSwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTY4MzU5MTk4OSwiaWF0IjoxNjgzNTg4Mzg5LCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.k9FQfRR02XC3WWfOzWhrbJGmp69AmCHJEIrgtXKhIwC69trdphSm1AKkZnDJMsEdkpUgjF_zAOsa_xYRxO6goXy7WXVc_p7N-yFHlkhZrRyn3LEFKaLzD8vVqlWx4kgfSERm7KhI1AxPmrA-lw8eF6Axvqn3PvuszAw89_WhPOcnOt8vU0MxAVhLgS8oM6vyHFmHEHWQ2FnSYYed9sEvAxGh_B44aIgWeDteQGeGdYhsm6rUcxgkrskywZJp9FW5VgYXuDcC5NpvomMMRy_v95UV897JzCHl__sK2Z9ahm0eczVN3tAc0GbKnlN96ZrGTQ_nmNHbuMDPQBPXH5HXZQ",
-    currentUser: {
-      id: 37,
-      companyId: 2,
-      isUserTech: false
-    }
-  }
 };