contentoh-components-library 21.4.36 → 21.4.38

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

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Box = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _styles = require("./styles");
+
+var _variables = require("../../../global-files/variables");
+
+var _BoxOnboarding = require("../BoxOnboarding");
+
+var _BoxButtons = require("../../molecules/BoxButtons");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var Box = function Box() {
+  var _useState = (0, _react.useState)(true),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      isDeleteDisabled = _useState2[0],
+      setIsDeleteDisabled = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      isEditEnabled = _useState4[0],
+      setIsEditEnabled = _useState4[1];
+
+  var _useState5 = (0, _react.useState)([{
+    showAdd: true
+  }]),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      boxOnboardingList = _useState6[0],
+      setBoxOnboardingList = _useState6[1];
+
+  var handleAddBoxOnboarding = function handleAddBoxOnboarding() {
+    var newBoxOnboarding = {
+      showAdd: false
+    };
+    setBoxOnboardingList([].concat((0, _toConsumableArray2.default)(boxOnboardingList), [newBoxOnboarding]));
+  };
+
+  var handleDeleteBoxOnboarding = function handleDeleteBoxOnboarding(index) {
+    if (index !== 0) {
+      var updatedBoxOnboardingList = (0, _toConsumableArray2.default)(boxOnboardingList);
+      updatedBoxOnboardingList.splice(index, 1);
+      setBoxOnboardingList(updatedBoxOnboardingList);
+    } else {
+      setIsDeleteDisabled(true);
+    }
+  };
+
+  var handleToggleEdit = function handleToggleEdit() {
+    setIsEditEnabled(!isEditEnabled);
+  };
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    fontFamily: _variables.FontFamily.Raleway,
+    color: _variables.GlobalColors.original_magenta,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h1", {
+      fontFamily: _variables.FontFamily.Raleway,
+      children: "Cajas"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "container-box",
+      children: boxOnboardingList.map(function (boxOnboarding, index) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: "container-buttons",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxOnboarding.BoxOnboarding, {
+              showAdd: boxOnboarding.showAdd,
+              isEditEnabled: isEditEnabled
+            }, index), /*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxButtons.BoxButtons, {
+              showAdd: boxOnboarding.showAdd,
+              onAdd: handleAddBoxOnboarding,
+              onDelete: function onDelete() {
+                return handleDeleteBoxOnboarding(index);
+              },
+              isDeleteDisabled: isDeleteDisabled,
+              onToggleEdit: handleToggleEdit,
+              isEditEnabled: isEditEnabled
+            })]
+          })
+        });
+      })
+    })]
+  });
+};
+
+exports.Box = Box;

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

@@ -0,0 +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;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  font-family: ", ", sans-serif;\n  font-weight: 400;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  font-size: var(--size);\n  line-height: 1.2;\n  height: auto;\n  border-radius: 10px;\n  background: white;\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n  text-align: center;\n  .container-buttons {\n    display: flex;\n    gap:10px;\n  }\n  .container-box{\n    display: flex;\n    flex-direction:column-reverse;\n    gap:10px;\n  }\n  #contenedor-caja {\n    display: flex;\n    justify-content: space-between;\n    color: #262626;\n    white-space: nowrap;\n    gap: 10px;\n  }\n  #atr-alto {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 6px;\n  }\n  h1 {\n    font-family: ", ", sans-serif;\n    font-size: 17px;\n    line-height: 1.2;\n    font-weight: 500;\n    text-align: left;\n  }\n"])), _variables.FontFamily.Roboto, _variables.FontFamily.RobotoMedium);
+
+exports.Container = Container;

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

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.BoxOnboardingDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _loginImage = _interopRequireDefault(require("../../../assets/images/carouselImagesLogin/loginImage.svg"));
+
+var _login = _interopRequireDefault(require("../../../assets/images/carouselImagesLogin/login2.svg"));
+
+var _login2 = _interopRequireDefault(require("../../../assets/images/carouselImagesLogin/login3.svg"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/organisms/BoxOnboarding",
+  component: _index.BoxOnboarding
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.BoxOnboarding, (0, _objectSpread2.default)({}, args));
+};
+
+var BoxOnboardingDefault = Template.bind({});
+exports.BoxOnboardingDefault = BoxOnboardingDefault;
+BoxOnboardingDefault.args = {
+  panelImg: [_loginImage.default, _login.default, _login2.default],
+  panelText: "Elige la plataforma que conecta proovedores y retailers"
+};

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

@@ -0,0 +1,69 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BoxOnboarding = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _styles = require("./styles");
+
+var _variables = require("../../../global-files/variables");
+
+var _BoxAttribute = require("../../molecules/BoxAttribute");
+
+var _react = require("react");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var BoxOnboarding = function BoxOnboarding(_ref) {
+  var panelColor = _ref.panelColor,
+      isEditEnabled = _ref.isEditEnabled;
+
+  var _useState = (0, _react.useState)(true),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      boxAttributesActive = _useState2[0],
+      setBoxAttributesActive = _useState2[1];
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    panelColor: panelColor,
+    fontFamily: _variables.FontFamily.Raleway,
+    color: _variables.GlobalColors.original_magenta,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      id: "contenedor-caja",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+        fontFamily: _variables.FontFamily.Raleway,
+        children: "Caja 1, chica"
+      }), boxAttributesActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxAttribute.BoxAttribute, {
+        id: "atr-alto",
+        borderType: "rectangle",
+        className: "caja",
+        text: "Largo",
+        isEditEnabled: isEditEnabled
+      }), boxAttributesActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxAttribute.BoxAttribute, {
+        id: "atr-alto",
+        borderType: "rectangle",
+        className: "caja",
+        text: "Alto",
+        isEditEnabled: isEditEnabled
+      }), boxAttributesActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxAttribute.BoxAttribute, {
+        id: "atr-alto",
+        borderType: "rectangle",
+        className: "caja",
+        text: "Ancho",
+        isEditEnabled: isEditEnabled
+      }), boxAttributesActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BoxAttribute.BoxAttribute, {
+        id: "atr-alto",
+        borderType: "rectangle",
+        className: "caja",
+        text: "Peso",
+        isEditEnabled: isEditEnabled
+      })]
+    })
+  });
+};
+
+exports.BoxOnboarding = BoxOnboarding;

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

@@ -0,0 +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;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  font-family: ", ", sans-serif;\n  font-weight: 400;\n  font-size: var(--size);\n  line-height: 1.2;\n  background: white;\n  position: relative;\n  overflow: hidden;\n  width: 80%;\n  height: 100%;\n  text-align: center;\n  #contenedor-caja {\n    display: flex;\n    justify-content: space-between;\n    color: #262626;\n  }\n  #atr-alto {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n  p {\n    font-family: ", ", sans-serif;\n    font-size: 12px;\n    line-height: 1.2;\n    font-weight: 600;\n    align-self: center;\n  }\n  }\n  .icon-red {\n    color: #B64545;\n    height:18px;\n  }\n  .icon-gray {\n    color: #707070;\n  }\n  .icon-gray-l {\n    color: #707070;\n    height:18px;\n  }\n"])), _variables.FontFamily.Roboto, _variables.FontFamily.RobotoMedium);
+
+exports.Container = Container;

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

@@ -11,6 +11,10 @@ var _ScreenHeader = require("../../atoms/ScreenHeader");
 
 var _TagAndInput = require("../../molecules/TagAndInput");
 
+var _BoxOnboarding = require("../BoxOnboarding");
+
+var _Box = require("../Box");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var InputGroup = function InputGroup(_ref) {
@@ -31,7 +35,9 @@ var InputGroup = function InputGroup(_ref) {
       articleId = _ref.articleId,
       version = _ref.version,
       dinamicHeight = _ref.dinamicHeight,
-      compare = _ref.compare;
+      compare = _ref.compare,
+      _ref$dataGroup = _ref.dataGroup,
+      dataGroup = _ref$dataGroup === void 0 ? 12 : _ref$dataGroup;
 
   var inputTypeValue = function inputTypeValue(type) {
     switch (type) {
@@ -46,58 +52,70 @@ var InputGroup = function InputGroup(_ref) {
     }
   };
 
+  var isOnboarding = function isOnboarding(dataGroup, group) {
+    var result = dataGroup === group;
+    return result;
+  };
+
   var isEquals = function isEquals(dataInputsVal, auditInputsVal) {
     var result = dataInputsVal === auditInputsVal;
     return result;
   };
 
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
-    className: activeSection === "Ficha técnica" ? "datasheets-layout" : "descriptions-layout",
-    children: [(inputGroup === null || inputGroup === void 0 ? void 0 : inputGroup.dataGroup) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-      headerType: "retailer-name-header",
-      text: inputGroup === null || inputGroup === void 0 ? void 0 : inputGroup.dataGroup
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "inputs-container",
-      children: inputGroup === null || inputGroup === void 0 ? void 0 : (_inputGroup$inputs = inputGroup.inputs) === null || _inputGroup$inputs === void 0 ? void 0 : _inputGroup$inputs.map(function (input, index) {
-        var _dataInputs$input, _dataInputs$input2, _dataInputs$input3, _dataInputs$input4, _dataInputs$input5, _dataInputs$input6, _auditInputs$input, _dataInputs$input7, _dataInputs$input8, _dataInputs$input9, _dataInputs$input10, _dataInputs$input11, _dataInputs$input12, _auditInputGroup$inpu, _auditInputGroup$inpu2;
-
-        return activeSection === "Ficha técnica" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
-          //disabled={input === 40001}
-          disabled: false,
-          inputId: (_dataInputs$input3 = dataInputs[input]) === null || _dataInputs$input3 === void 0 ? void 0 : _dataInputs$input3.id,
-          version: version,
-          inputType: inputTypeValue((_dataInputs$input4 = dataInputs[input]) === null || _dataInputs$input4 === void 0 ? void 0 : _dataInputs$input4.type),
-          label: ((_dataInputs$input5 = dataInputs[input]) === null || _dataInputs$input5 === void 0 ? void 0 : _dataInputs$input5.name) + ((_dataInputs$input6 = dataInputs[input]) !== null && _dataInputs$input6 !== void 0 && _dataInputs$input6.required ? "*" : ""),
-          value: compare ? (_auditInputs$input = auditInputs[input]) === null || _auditInputs$input === void 0 ? void 0 : _auditInputs$input.value : (_dataInputs$input7 = dataInputs[input]) === null || _dataInputs$input7 === void 0 ? void 0 : _dataInputs$input7.value,
-          inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
-          articleId: articleId,
-          isRequired: (_dataInputs$input8 = dataInputs[input]) === null || _dataInputs$input8 === void 0 ? void 0 : _dataInputs$input8.required,
-          updatedDatasheets: updatedDatasheets,
-          setUpdatedDatasheets: setUpdatedDatasheets,
-          maxChar: (_dataInputs$input9 = dataInputs[input]) !== null && _dataInputs$input9 !== void 0 && _dataInputs$input9.max_chars ? (_dataInputs$input10 = dataInputs[input]) === null || _dataInputs$input10 === void 0 ? void 0 : _dataInputs$input10.max_chars : 999,
-          optionList: (_dataInputs$input11 = dataInputs[input]) === null || _dataInputs$input11 === void 0 ? void 0 : _dataInputs$input11.option_list,
-          description: (_dataInputs$input12 = dataInputs[input]) === null || _dataInputs$input12 === void 0 ? void 0 : _dataInputs$input12.description,
-          showTooltip: true,
-          auditClass: compare && !isEquals(dataInputs[input].value, auditInputs[input].value) ? "audit-class" : ""
-        }, index + "-" + ((_dataInputs$input = dataInputs[input]) === null || _dataInputs$input === void 0 ? void 0 : _dataInputs$input.value) + "-" + ((_dataInputs$input2 = dataInputs[input]) === null || _dataInputs$input2 === void 0 ? void 0 : _dataInputs$input2.id) + "-" + compare) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
-          inputId: input.id,
-          index: index,
-          inputType: "textarea",
-          label: (input === null || input === void 0 ? void 0 : input.name) + (input.required ? "*" : ""),
-          value: compare ? auditInputGroup === null || auditInputGroup === void 0 ? void 0 : (_auditInputGroup$inpu = auditInputGroup.inputs[index]) === null || _auditInputGroup$inpu === void 0 ? void 0 : _auditInputGroup$inpu.value : input === null || input === void 0 ? void 0 : input.value,
-          isRequired: input.required,
-          maxChar: input.max_chars,
-          inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
-          updatedDescriptions: updatedDescriptions,
-          setUpdatedDescriptions: setUpdatedDescriptions,
-          articleId: articleId,
-          version: version,
-          dinamicHeight: dinamicHeight,
-          description: input === null || input === void 0 ? void 0 : input.description,
-          showTooltip: true,
-          auditClass: compare && !isEquals(input === null || input === void 0 ? void 0 : input.value, auditInputGroup === null || auditInputGroup === void 0 ? void 0 : (_auditInputGroup$inpu2 = auditInputGroup.inputs[index]) === null || _auditInputGroup$inpu2 === void 0 ? void 0 : _auditInputGroup$inpu2.value) ? "audit-class" : ""
-        }, index + "-" + (input === null || input === void 0 ? void 0 : input.value) + "-" + compare);
-      })
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+      className: activeSection === "Ficha técnica" ? "datasheets-layout" : "descriptions-layout",
+      children: [(inputGroup === null || inputGroup === void 0 ? void 0 : inputGroup.dataGroup) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        headerType: "retailer-name-header",
+        text: inputGroup === null || inputGroup === void 0 ? void 0 : inputGroup.dataGroup
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "inputs-container",
+        children: inputGroup === null || inputGroup === void 0 ? void 0 : (_inputGroup$inputs = inputGroup.inputs) === null || _inputGroup$inputs === void 0 ? void 0 : _inputGroup$inputs.map(function (input, index) {
+          var _dataInputs$input, _dataInputs$input2, _dataInputs$input3, _dataInputs$input4, _dataInputs$input5, _dataInputs$input6, _auditInputs$input, _dataInputs$input7, _dataInputs$input8, _dataInputs$input9, _dataInputs$input10, _dataInputs$input11, _dataInputs$input12, _auditInputGroup$inpu, _auditInputGroup$inpu2;
+
+          return activeSection === "Ficha técnica" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
+              //disabled={input === 40001}
+              disabled: false,
+              inputId: (_dataInputs$input3 = dataInputs[input]) === null || _dataInputs$input3 === void 0 ? void 0 : _dataInputs$input3.id,
+              version: version,
+              inputType: inputTypeValue((_dataInputs$input4 = dataInputs[input]) === null || _dataInputs$input4 === void 0 ? void 0 : _dataInputs$input4.type),
+              label: ((_dataInputs$input5 = dataInputs[input]) === null || _dataInputs$input5 === void 0 ? void 0 : _dataInputs$input5.name) + ((_dataInputs$input6 = dataInputs[input]) !== null && _dataInputs$input6 !== void 0 && _dataInputs$input6.required ? "*" : ""),
+              value: compare ? (_auditInputs$input = auditInputs[input]) === null || _auditInputs$input === void 0 ? void 0 : _auditInputs$input.value : (_dataInputs$input7 = dataInputs[input]) === null || _dataInputs$input7 === void 0 ? void 0 : _dataInputs$input7.value,
+              inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
+              articleId: articleId,
+              isRequired: (_dataInputs$input8 = dataInputs[input]) === null || _dataInputs$input8 === void 0 ? void 0 : _dataInputs$input8.required,
+              updatedDatasheets: updatedDatasheets,
+              setUpdatedDatasheets: setUpdatedDatasheets,
+              maxChar: (_dataInputs$input9 = dataInputs[input]) !== null && _dataInputs$input9 !== void 0 && _dataInputs$input9.max_chars ? (_dataInputs$input10 = dataInputs[input]) === null || _dataInputs$input10 === void 0 ? void 0 : _dataInputs$input10.max_chars : 999,
+              optionList: (_dataInputs$input11 = dataInputs[input]) === null || _dataInputs$input11 === void 0 ? void 0 : _dataInputs$input11.option_list,
+              description: (_dataInputs$input12 = dataInputs[input]) === null || _dataInputs$input12 === void 0 ? void 0 : _dataInputs$input12.description,
+              showTooltip: true,
+              auditClass: compare && !isEquals(dataInputs[input].value, auditInputs[input].value) ? "audit-class" : ""
+            }, index + "-" + ((_dataInputs$input = dataInputs[input]) === null || _dataInputs$input === void 0 ? void 0 : _dataInputs$input.value) + "-" + ((_dataInputs$input2 = dataInputs[input]) === null || _dataInputs$input2 === void 0 ? void 0 : _dataInputs$input2.id) + "-" + compare)
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
+            inputId: input.id,
+            index: index,
+            inputType: "textarea",
+            label: (input === null || input === void 0 ? void 0 : input.name) + (input.required ? "*" : ""),
+            value: compare ? auditInputGroup === null || auditInputGroup === void 0 ? void 0 : (_auditInputGroup$inpu = auditInputGroup.inputs[index]) === null || _auditInputGroup$inpu === void 0 ? void 0 : _auditInputGroup$inpu.value : input === null || input === void 0 ? void 0 : input.value,
+            isRequired: input.required,
+            maxChar: input.max_chars,
+            inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
+            updatedDescriptions: updatedDescriptions,
+            setUpdatedDescriptions: setUpdatedDescriptions,
+            articleId: articleId,
+            version: version,
+            dinamicHeight: dinamicHeight,
+            description: input === null || input === void 0 ? void 0 : input.description,
+            showTooltip: true,
+            auditClass: compare && !isEquals(input === null || input === void 0 ? void 0 : input.value, auditInputGroup === null || auditInputGroup === void 0 ? void 0 : (_auditInputGroup$inpu2 = auditInputGroup.inputs[index]) === null || _auditInputGroup$inpu2 === void 0 ? void 0 : _auditInputGroup$inpu2.value) ? "audit-class" : ""
+          }, index + "-" + (input === null || input === void 0 ? void 0 : input.value) + "-" + compare);
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+      className: activeSection === "Ficha técnica" ? "datasheets-layout" : "descriptions-layout",
+      children: isOnboarding && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.Box, {})
     })]
   });
 };

package/dist/components/pages/ProviderProductEdition/index.js

@@ -886,7 +886,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
           switch (_context8.prev = _context8.next) {
             case 0:
               _context8.next = 2;
-              return (0, _data.getRetailerServices)((product === null || product === void 0 ? void 0 : product.id_article) || (product === null || product === void 0 ? void 0 : (_product$article = product.article) === null || _product$article === void 0 ? void 0 : _product$article.id_article), (product === null || product === void 0 ? void 0 : (_product$article2 = product.article) === null || _product$article2 === void 0 ? void 0 : _product$article2.company_name) || (product === null || product === void 0 ? void 0 : product.categoryName), parseInt((product === null || product === void 0 ? void 0 : (_product$article3 = product.article) === null || _product$article3 === void 0 ? void 0 : _product$article3.id_category) || (product === null || product === void 0 ? void 0 : product.id_category)), version);
+              return (0, _data.getRetailerServices)((product === null || product === void 0 ? void 0 : product.id_article) || (product === null || product === void 0 ? void 0 : (_product$article = product.article) === null || _product$article === void 0 ? void 0 : _product$article.id_article), (product === null || product === void 0 ? void 0 : (_product$article2 = product.article) === null || _product$article2 === void 0 ? void 0 : _product$article2.company_name) || (product === null || product === void 0 ? void 0 : product.categoryName), parseInt((product === null || product === void 0 ? void 0 : (_product$article3 = product.article) === null || _product$article3 === void 0 ? void 0 : _product$article3.id_category) || (product === null || product === void 0 ? void 0 : product.id_category)), version, token);
 
             case 2:
               services = _context8.sent;

package/dist/components/pages/ProviderProductEdition1/ProviderProductEdition.stories.js

@@ -0,0 +1,222 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ProviderProductEdition1Default = 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/pages/ProviderProductEdition1",
+  component: _index.ProviderProductEdition1
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ProviderProductEdition1, (0, _objectSpread2.default)({}, args));
+};
+
+var ProviderProductEdition1Default = Template.bind({});
+exports.ProviderProductEdition1Default = ProviderProductEdition1Default;
+ProviderProductEdition1Default.args = {
+  tabsSections: {
+    Descripción: true,
+    "Ficha técnica": false,
+    Imágenes: false
+  },
+  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIyM2Q1NTlmYi1jMzIwLTRhMjItYjJmNy1lOThhYTFhZGEyNmYiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4MzkyNjgyMSwibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2ODM5MzA0MjEsImlhdCI6MTY4MzkyNjgyMSwiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.TvCoaKoctj5mypXWMz3NyV1Vm1ToBV0vJmpVyZSQw4-ikTChkxcZ5tFYvqhk1GdvNCFttfSQIqM-14dAYYBc28YwwKP86gqOuzB1fG41rN5x1Yx3tkJq6hiVRgiBbSHWtThA9c8VnxNQbrJiaRTvvkDiM5KNTEst1oxQHL5Ct9_iKQMJMRFie7Xv0xnyS0qZ6QHK4Q2A9OHsnDkAuumALZJcE19Zh6VgSitgWrZiz3x5Text4Q-U-R48NUAzUFirAzYZzJN_fCme5pGf1AnUaZjeUjPsmrV5TBVzPEYwXO0KG8lYjL8id80D7tbGs28ZIK6B4rf3-eqI_ngmBB4CjQ",
+  articleId: 238,
+  category: 846,
+  version: 2,
+  productSelected: {
+    orderId: 15275,
+    status: "AA",
+    datasheet_status: "AA",
+    prio: "none",
+    version: 3,
+    description_status: "AA",
+    images_status: "AA",
+    brand: null,
+    retailerOrder: 0,
+    missing: {
+      datasheet: null,
+      descriptions: null,
+      images: null
+    },
+    services: {
+      datasheets: 1,
+      descriptions: 1,
+      images: 1
+    },
+    article: {
+      category: "Abarrotes|Abarrotes Secos|Frutos Secos",
+      company_name: "GRUPO BRAHMA",
+      country: "México",
+      id_category: "11",
+      id_datasheet_especialist: 54,
+      id_datasheet_facilitator: 52,
+      id_description_especialist: 54,
+      id_description_facilitator: 52,
+      id_images_especialist: 55,
+      id_images_facilitator: 53,
+      id_order: 15275,
+      id_article: 39485,
+      id_auditor: 37,
+      name: "Mix de nueces",
+      timestamp: "2023-07-14T21:03:19.000Z",
+      upc: "7543453453"
+    },
+    retailers: [{
+      id: 34,
+      name: "San Pablo"
+    }],
+    statusByRetailer: {
+      34: {
+        datasheet: "AA",
+        description: "AA",
+        images: "AA"
+      }
+    },
+    retailersAvailable: [{
+      id: 34,
+      name: "San Pablo"
+    }],
+    categoryName: "Abarrotes|Abarrotes Secos|Frutos Secos",
+    upc: "7543453453",
+    id_article: 39485,
+    id_order: 15275
+  },
+  productToEdit: {
+    ArticleId: 39485,
+    idCategory: "11",
+    product: {
+      orderId: 15275,
+      status: "AA",
+      datasheet_status: "AA",
+      prio: "none",
+      version: 3,
+      description_status: "AA",
+      images_status: "AA",
+      brand: null,
+      retailerOrder: 0,
+      missing: {
+        datasheet: null,
+        descriptions: null,
+        images: null
+      },
+      services: {
+        datasheets: 1,
+        descriptions: 1,
+        images: 1
+      },
+      article: {
+        category: "Abarrotes|Abarrotes Secos|Frutos Secos",
+        company_name: "GRUPO BRAHMA",
+        country: "México",
+        id_category: "11",
+        id_datasheet_especialist: 54,
+        id_datasheet_facilitator: 52,
+        id_description_especialist: 54,
+        id_description_facilitator: 52,
+        id_images_especialist: 55,
+        id_images_facilitator: 53,
+        id_order: 15275,
+        id_article: 39485,
+        id_auditor: 37,
+        name: "Mix de nueces",
+        timestamp: "2023-07-14T21:03:19.000Z",
+        upc: "7543453453"
+      },
+      retailers: [{
+        id: 34,
+        name: "San Pablo"
+      }],
+      statusByRetailer: {
+        34: {
+          datasheet: "AA",
+          description: "AA",
+          images: "AA"
+        }
+      },
+      retailersAvailable: [{
+        id: 34,
+        name: "San Pablo"
+      }],
+      categoryName: "Abarrotes|Abarrotes Secos|Frutos Secos",
+      upc: "7543453453",
+      id_article: 39485,
+      id_order: 15275
+    }
+  },
+  location: {
+    pathname: "/EditProducts",
+    search: "",
+    hash: "",
+    state: {
+      withChat: true,
+      chatType: "product_status",
+      origin: "RequestWithContentoh"
+    },
+    key: "24vwut"
+  },
+  user: {
+    id_user: 28,
+    name: "Ismael",
+    last_name: "López",
+    email: "ilopez@contentoh.com",
+    position: "Test States",
+    telephone: "+523111366336",
+    country: "México",
+    id_company: 1,
+    id_cognito: "f5927f8e-cbf7-4922-9e09-e69ec0b2731a",
+    birth_Date: null,
+    about_me: "",
+    zip_code: "",
+    address: "",
+    job: "",
+    id_stripe: "cus_KuEt6R6vwmN09f",
+    id_role: 0,
+    active: 1,
+    is_retailer: 0,
+    email_notify: 1,
+    is_user_tech: "ADMIN-AS",
+    membership: {
+      id: 76,
+      start_date: "2022-01-18T17:25:35.000Z",
+      end_date: "2023-01-18T17:25:35.000Z",
+      planID: 8,
+      plan: "prod_KtlhECVSFG2iro",
+      name: "Plan Pro",
+      user_limit: "50",
+      products_limit: "5000",
+      type: "Enterprise"
+    },
+    src: "https://content-management-profile.s3.amazonaws.com/id-28/28.png?1693338334183"
+  },
+  company: {
+    id_company: 1,
+    trade_name: "GRUPO BRAHMA",
+    company_name: "GRUPO BRAHMA",
+    rfc: "XAXX010101000",
+    adress: "AA",
+    about_company: "",
+    telephone: "",
+    web_site: "",
+    zip_code: "",
+    email: null,
+    social_link: "",
+    is_retailer: 0,
+    financedRetailers: [],
+    retailers: []
+  },
+  showSurvey: function showSurvey(v) {
+    return v && alert("se muestra");
+  }
+};