contentoh-components-library 21.4.129 → 21.4.131

package/dist/assets/images/Icons/save-white-gray.svg

@@ -1,4 +1,4 @@
-<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect width="34" height="34" rx="17" fill="#F0F0F0"/>
 <mask id="mask0_346_670" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="10" y="10" width="14" height="14">
 <rect x="10" y="10" width="14" height="14" fill="#D9D9D9"/>

package/dist/assets/images/Icons/save-white.svg

@@ -1,4 +1,4 @@
-<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect width="34" height="34" rx="17" fill="#E33AA9"/>
 <mask id="mask0_346_670" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="10" y="10" width="14" height="14">
 <rect x="10" y="10" width="14" height="14" fill="#D9D9D9"/>

package/dist/components/atoms/GeneralInput/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: 100%;\n\n  > div {\n    label {\n      &:before {\n        outline: 1px solid ", ";\n      }\n    }\n  }\n\n  input,\n  textarea {\n    width: 100%;\n    border: 1px solid\n      ", ";\n\n    font-family: ", ";\n    color: ", ";\n    font-weight: normal;\n    font-size: 12px;\n    line-height: 15px;\n    padding: 10px;\n    outline: none;\n    border-radius: 2px;\n    resize: none;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  select {\n    background: #fafafa;\n    outline: none;\n    border: 1px solid\n      ", ";\n    width: 100%;\n    cursor: pointer;\n    font-family: ", ";\n    color: ", ";\n    font-size: 12px;\n    line-height: 21px;\n    padding: 10px;\n    border-right: 2px solid #e33aa9;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  p {\n    font-family: ", ";\n    font-size: 12px;\n    color: ", ";\n  }\n\n  &.audit-class {\n    input,\n    .quill {\n      border: 1px solid #8a6caa;\n      background-color: #ededfc;\n    }\n  }\n\n  .btnReviewState {\n    display: \"flex\";\n    flex-direction: \"column\";\n    border: 1px solid lightgray;\n    border-radius: 3px;\n    z-index: 1000;\n    /* position: absolute; */\n  }\n\n  .btnReviewState button {\n    border: none;\n    background: white;\n    border-radius: 3px;\n  }\n  .btnReviewState button:hover {\n    background: lightgray;\n  }\n"])), function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n\n  > div {\n    label {\n      &:before {\n        outline: 1px solid ", ";\n      }\n    }\n  }\n\n  input,\n  textarea {\n    width: 100%;\n    border: 1px solid\n      ", ";\n\n    font-family: ", ";\n    color: ", ";\n    font-weight: normal;\n    font-size: 12px;\n    line-height: 15px;\n    padding: 10px;\n    outline: none;\n    border-radius: 5px;\n    resize: none;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  select {\n    background: #fafafa;\n    outline: none;\n    border: 1px solid\n      ", ";\n    width: 100%;\n    cursor: pointer;\n    font-family: ", ";\n    color: ", ";\n    font-size: 12px;\n    line-height: 21px;\n    padding: 10px;\n    border-right: 2px solid #e33aa9;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  p {\n    font-family: ", ";\n    font-size: 12px;\n    color: ", ";\n  }\n\n  &.audit-class {\n    input,\n    .quill {\n      border: 1px solid #8a6caa;\n      background-color: #ededfc;\n    }\n  }\n\n  .btnReviewState {\n    display: \"flex\";\n    flex-direction: \"column\";\n    border: 1px solid lightgray;\n    border-radius: 3px;\n    z-index: 1000;\n    /* position: absolute; */\n  }\n\n  .btnReviewState button {\n    border: none;\n    background: white;\n    border-radius: 3px;\n  }\n  .btnReviewState button:hover {\n    background: lightgray;\n  }\n"])), function (_ref) {
   var isRequired = _ref.isRequired;
   return isRequired ? "red" : "none";
 }, function (_ref2) {

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

@@ -21,12 +21,16 @@ var _CheckBox = require("../../atoms/CheckBox");
 
 var _styles = require("./styles");
 
+var _Tooltip = require("../../atoms/Tooltip");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var Table = function Table(_ref) {
   var columns = _ref.columns,
       data = _ref.data,
-      withCheckbox = _ref.withCheckbox;
+      withCheckbox = _ref.withCheckbox,
+      _ref$withTooltip = _ref.withTooltip,
+      withTooltip = _ref$withTooltip === void 0 ? false : _ref$withTooltip;
 
   var _useState = (0, _react.useState)([]),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -73,7 +77,17 @@ var Table = function Table(_ref) {
             return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TH, (0, _objectSpread2.default)((0, _objectSpread2.default)({
               withCheckbox: withCheckbox
             }, column), {}, {
-              children: column.Header
+              children: column.description && withTooltip ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.Tooltip, {
+                componentTooltip: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  children: column.description
+                }),
+                position: "topCenter",
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  children: column.Header
+                })
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                children: column.Header
+              })
             }), "".concat(column.accessor).concat(i));
           })]
         })

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

@@ -15,34 +15,40 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: #fff;\n  box-sizing: border-box;\n  height: 100%;\n  overflow-x: auto;\n  width: 100%;\n  margin-right: 30px;\n  .checkbox_fixed {\n    left: 0px;\n    position: sticky;\n    z-index: 5;\n  }\n\n  .custom-table {\n    border-collapse: collapse;\n    box-sizing: border-box;\n    width: 100%;\n    & > thead {\n      top: 0;\n      height: 45px;\n      position: sticky;\n      z-index: 5;\n      & > tr {\n        background-color: #f7f7fc;\n        border-radius: 5px 5px 0px 0px;\n        height: 45px;\n      }\n    }\n    & > tbody > tr {\n      height: 70px;\n      &:last-child {\n        border-radius: 0px 0px 5px 5px;\n      }\n    }\n  }\n\n  .custom-table th,\n  .custom-table td {\n    padding: 8px;\n    border: 0;\n  }\n\n  .custom-table th {\n    border-radius: 5px 0 0 5px;\n    border: 0;\n    color: var(--black-main, #262626);\n    font-family: Roboto;\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 500;\n    line-height: normal;\n    text-align: left;\n  }\n\n  .custom-table tr {\n    background: var(--white-main, #fff);\n    border-bottom: 1px solid var(--grey-light, #f0f0f0);\n    border-left: 1px solid var(--grey-light, #f0f0f0);\n    border-right: 1px solid var(--grey-light, #f0f0f0);\n    & > td {\n      color: var(--grey-main, #707070);\n      font-family: Roboto;\n      font-size: 12px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: normal;\n    }\n    display: flex;\n    align-items: center;\n    ", "\n  }\n"])), function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: #fff;\n  box-sizing: border-box;\n  height: 100%;\n  overflow-x: auto;\n  width: 100%;\n  margin-right: 30px;\n  .checkbox_fixed {\n    left: 0px;\n    position: sticky;\n    z-index: 5;\n  }\n\n  .custom-table {\n    border-collapse: collapse;\n    box-sizing: border-box;\n    width: 100%;\n    & > thead {\n      top: 0;\n      height: 45px;\n      position: sticky;\n      z-index: 10;\n      & > tr {\n        background-color: #f7f7fc;\n        border-radius: 5px 5px 0px 0px;\n        height: 45px;\n      }\n    }\n    & > tbody > tr {\n      height: 70px;\n      &:last-child {\n        border-radius: 0px 0px 5px 5px;\n      }\n    }\n  }\n\n  .custom-table th,\n  .custom-table td {\n    padding: 8px;\n    border: 0;\n  }\n\n  .custom-table th {\n    border-radius: 5px 0 0 5px;\n    border: 0;\n    color: var(--black-main, #262626);\n    font-family: Roboto;\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 500;\n    line-height: normal;\n    text-align: left;\n  }\n\n  .custom-table tr {\n    background: var(--white-main, #fff);\n    border-bottom: 1px solid var(--grey-light, #f0f0f0);\n    border-left: 1px solid var(--grey-light, #f0f0f0);\n    border-right: 1px solid var(--grey-light, #f0f0f0);\n    & > td {\n      color: var(--grey-main, #707070);\n      font-family: Roboto;\n      font-size: 12px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: normal;\n      gap:5px;\n    }\n    display: flex;\n    align-items: center;\n    ", "\n  }\n"])), function (_ref) {
   var withCheckbox = _ref.withCheckbox;
   return withCheckbox && "padding-left: 10px;";
 });
 
 exports.Container = Container;
 
-var TH = _styledComponents.default.th(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: inherit;\n  min-height: ", ";\n  min-width: ", ";\n  position: sticky;\n  left: 20px;\n  ", "\n"])), function (_ref2) {
+var TH = _styledComponents.default.th(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: inherit;\n  min-height: ", ";\n  min-width: ", ";\n  position: sticky;\n  left: ", ";\n  ", "\n"])), function (_ref2) {
   var height = _ref2.height;
   return height !== null && height !== void 0 ? height : "auto";
 }, function (_ref3) {
   var width = _ref3.width;
   return width !== null && width !== void 0 ? width : "auto";
 }, function (_ref4) {
-  var fixedToLeft = _ref4.fixedToLeft,
-      withCheckbox = _ref4.withCheckbox;
-  return fixedToLeft >= 0 && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n      left: ", "px;\n      z-index: 5;\n    "])), withCheckbox ? 20 + fixedToLeft : fixedToLeft);
+  var fixedToLeft = _ref4.fixedToLeft;
+  return fixedToLeft >= 0 ? "".concat(fixedToLeft, "px") : "20px";
+}, function (_ref5) {
+  var fixedToLeft = _ref5.fixedToLeft,
+      withCheckbox = _ref5.withCheckbox;
+  return fixedToLeft >= 0 && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n      left: ", "px;\n      z-index: 10;\n    "])), withCheckbox ? 20 + fixedToLeft : fixedToLeft);
 });
 
 exports.TH = TH;
 
-var TD = _styledComponents.default.td(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: inherit;\n  box-sizing: border-box;\n  display: flex;\n  height: 100%;\n  min-width: ", ";\n  text-align: center;\n  vertical-align: middle;\n  z-index: 5;\n  position: sticky;\n  left: 20px;\n  .content {\n    white-space: nowrap;\n    overflow: hidden;\n    /* text-overflow: ellipsis; */\n  }\n  ", "\n"])), function (_ref5) {
-  var width = _ref5.width;
+var TD = _styledComponents.default.td(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: inherit;\n  box-sizing: border-box;\n  display: flex;\n  height: 100%;\n  min-width: ", ";\n  text-align: center;\n  vertical-align: middle;\n  z-index: 5;\n  position: sticky;\n  left: ", ";\n  .content {\n    white-space: nowrap;\n    overflow: hidden;\n    /* text-overflow: ellipsis; */\n  }\n  ", "\n"])), function (_ref6) {
+  var width = _ref6.width;
   return width !== null && width !== void 0 ? width : "auto";
-}, function (_ref6) {
-  var fixedToLeft = _ref6.fixedToLeft,
-      withCheckbox = _ref6.withCheckbox;
-  return fixedToLeft >= 0 && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n      left: ", "px;\n      z-index: 5;\n    "])), withCheckbox ? 20 + fixedToLeft : fixedToLeft);
+}, function (_ref7) {
+  var fixedToLeft = _ref7.fixedToLeft;
+  return fixedToLeft >= 0 ? "".concat(fixedToLeft, "px") : "20px";
+}, function (_ref8) {
+  var fixedToLeft = _ref8.fixedToLeft,
+      withCheckbox = _ref8.withCheckbox;
+  return fixedToLeft >= 0 && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n      left: ", "px;\n      z-index: 10;\n    "])), withCheckbox ? 20 + fixedToLeft : fixedToLeft);
 });
 
 exports.TD = TD;

package/dist/components/pages/MultipleEdition/MultipleEdition.stories.js

@@ -26,10 +26,10 @@ var Template = function Template(args) {
 var MultipleEditionDefault = Template.bind({});
 exports.MultipleEditionDefault = MultipleEditionDefault;
 MultipleEditionDefault.args = {
-  articles: [121151, 121152],
+  articles: [121161, 121165],
   //[216, 238, 239],
   versions: [1, 1],
   //token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiIxZmFjNjY2Ny1hMDMzLTQ1NjAtOWU5ZC01MTQwMDc2MmI2MWYiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjFmYWM2NjY3LWEwMzMtNDU2MC05ZTlkLTUxNDAwNzYyYjYxZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJjM2FlNjRiMC0yNDcxLTQ1MmQtOGExYi04OGFkNWIxNjRjOWQiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNjU0ODk3OCwibmFtZSI6IlJhZGlvc2NoYWNrIE9uYm9hcmRpbmciLCJwaG9uZV9udW1iZXIiOiIrNTIxMjM0NTY3ODk4IiwiZXhwIjoxNzA2NTUyNTc4LCJpYXQiOjE3MDY1NDg5NzgsImVtYWlsIjoicmFkaW9zaGFja2Ryb3BzaGlwQGFsbGZyZWVtYWlsLm5ldCJ9.RPiGAf-R2eEqdsfAbKKC7uX57t1JTEIZ3rgJZZNQ6wnJm8hfDKk1aa1fOqGZMDVw_peoq_XyZQWvmsJ8pRexWxO05oLZchn1n_gml6rapq2WqVap1CYyj2k2aBEGJo5CZzWGFp8VVXn9nl9pm8AsFjjfCAQGFaKB_5iMeNCPYt_vXXQ-LAOwkjzoAP6ujmlpJMVMsXoCaabWH7t5Z8akNO0eS0KAscL5EPDl_MmjqV_2PeBXl1KYAU-uJbdSG1xRiSV_nqJ23B4TAkERDfouCfd3ysLMrlRxkcsQd9xOvrt9fQMlrJqrCuf6RoD12pgqSRIxk_cOa4NFm6SKwCwRnw"
-  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmZTVlNWI4YS03N2ZjLTRmNmQtYWY0Yy0yZjVmZmY0ZjQ4ZGUiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6ImZlNWU1YjhhLTc3ZmMtNGY2ZC1hZjRjLTJmNWZmZjRmNDhkZSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJhNDkxNjFjNC0yZTE5LTQ0N2YtYWUwNy1hNTQ3YzU1MTM3NmMiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNTk2ODExNywibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTcwNTk3MTcxNywiaWF0IjoxNzA1OTY4MTE3LCJlbWFpbCI6InJldGFpbGVybWVyY2hhbnRzY29udGVudG9oQGFsbGZyZWVtYWlsLm5ldCJ9.fAOa4nlswhCyYsznuS2YBPGluqd6ok7V_TR1tdu6v9KBbN0Q5AJQZFVVJz2F4P8629_FAPjKybbz0gkv7-YHu0z7dqwDOIyve4Agr8YCgoPJi4Fw4whzcULBI122IejHZqSE6YnA2Ry6VOnxkBOJRetBu6oYwGUxfLJ5s2wTGkxStzA8VTDp9QH9kFNt2AUR7yyjMmzK3QT9E7Hvi60IjfWQbKBQpkn2VKkb2ClfJFi81LeFV5vmH9a8OiK7PyHvW82ascs-n3QuV8HgByR-Sgl8sX9CjZArmPGxeLNxS3MaYkLpx1vieOJaG2hotXyQXkx2eTNJUAYnnT10Ixskfg" //token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJkMzE0ODYyYy02OTYxLTQ5YjktODMwOC1hMDM3Mzg1MjUwYzAiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwMjQxMTc0MSwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTcwMjQxNTM0MSwiaWF0IjoxNzAyNDExNzQxLCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.O4Lr5HZLuueNNY1FxqrRBaQZKMgnTXY9IG7KAMkhWO20Dxnfj253sqOme36AbqIAsCQBy77GmnZtTAFs0uF9QBfEDzZXRQ1xcctboGZ9U235LlLdz-BNGoH5QCRXeZsZdXJ1M7yL8IvIdEnXkFC0WYcUMWMRUc6K6vgOvmCCQhzOr-uW-2nsLBGjBb7Tj_okViYvT0Lupo5Z0Z9Xc20oOWnVmrSuaYa1-b4AjOjEOnETA9usnRa6blOVOkHqi5fX8u11ejczINxNBtoizMPOQROuzuuPTvHrl17ae8JkNoxVCJe5ZdfRrUN1lwUXnOZim7QhNg8YR_uvPs_EJRIwfw",
+  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiIxZmFjNjY2Ny1hMDMzLTQ1NjAtOWU5ZC01MTQwMDc2MmI2MWYiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjFmYWM2NjY3LWEwMzMtNDU2MC05ZTlkLTUxNDAwNzYyYjYxZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIzM2FiNjQ5My0yZjIwLTQyYjgtOTNkMC1hYWFhMDI5OWZmY2EiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNzg0NjU4NywibmFtZSI6IlJhZGlvc2NoYWNrIE9uYm9hcmRpbmciLCJwaG9uZV9udW1iZXIiOiIrNTIxMjM0NTY3ODk4IiwiZXhwIjoxNzA3ODUwMTg3LCJpYXQiOjE3MDc4NDY1ODcsImVtYWlsIjoicmFkaW9zaGFja2Ryb3BzaGlwQGFsbGZyZWVtYWlsLm5ldCJ9.Ki0oE2Z12-Dg-AAEP8SwdKkDbGk2kxqHTqdGkC1jVa79WL4MnvaPSG0eaQOLSwTtInVCBFyV9TAY1MZO6_wyMfLooe5DK6Xv99fY4ejWtu7ICtpdcTApXBHuZG9Hx5v5GoW8YxAr2Zb618nTTs-A-J4TxrwOxVTvlaxKouoX-eYA-EL-dBttzUPZqDHaoYKwCUhZx7Dh0ab8ej1lBOpy1DaOVKvXI0Hzd6yNKiKFMPFvr9x4L6S9FT-zdPOT41pJ_7wg9HGxHxpxyMzoq5FHTBYaiuGZsIVb60arpGbHBednDKgU3y5-CN9yuga_r-h69QT67iD4jVXhq54x2u1rQA" //token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJkMzE0ODYyYy02OTYxLTQ5YjktODMwOC1hMDM3Mzg1MjUwYzAiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwMjQxMTc0MSwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTcwMjQxNTM0MSwiaWF0IjoxNzAyNDExNzQxLCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.O4Lr5HZLuueNNY1FxqrRBaQZKMgnTXY9IG7KAMkhWO20Dxnfj253sqOme36AbqIAsCQBy77GmnZtTAFs0uF9QBfEDzZXRQ1xcctboGZ9U235LlLdz-BNGoH5QCRXeZsZdXJ1M7yL8IvIdEnXkFC0WYcUMWMRUc6K6vgOvmCCQhzOr-uW-2nsLBGjBb7Tj_okViYvT0Lupo5Z0Z9Xc20oOWnVmrSuaYa1-b4AjOjEOnETA9usnRa6blOVOkHqi5fX8u11ejczINxNBtoizMPOQROuzuuPTvHrl17ae8JkNoxVCJe5ZdfRrUN1lwUXnOZim7QhNg8YR_uvPs_EJRIwfw",
 
 };

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

@@ -182,7 +182,8 @@ var MultipleEdition = function MultipleEdition(_ref) {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.Table, {
         withCheckbox: true,
         columns: currentData.columns,
-        data: currentData.data
+        data: currentData.data,
+        withTooltip: true
       }), " "]
     }), " ", modalFromTable, " ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, (0, _objectSpread2.default)({}, modal)), " ", showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
       title: "Agregar mensaje de rechazo",

package/dist/components/pages/MultipleEdition/styles.js

@@ -15,9 +15,9 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: grid;\n  grid-template-columns: 75% 25%;\n  grid-template-rows: 75px 1fr;\n  grid-template-areas:\n    \"tabs action_buttons\"\n    \"table table\";\n  margin: 0 30px;\n  body{\n    font-family: Roboto;\n  }\n\n  .tabs {\n    grid-area: tabs;\n    display: flex;\n    align-items: center;\n    gap: 0 10px;\n  }\n  .action_buttons {\n    grid-area: action_buttons;\n    display: flex;\n    align-items: center;\n    justify-content: end;\n    gap: 0 10px;\n    & > * {\n      cursor: pointer;\n    }\n  }\n  .table {\n    grid-area: table;\n    background: red;\n    height: 100%;\n    font-family: Raleway;\n  }\n  \n  .buttons-container{\n    background: white;\n    width: max-content;\n    padding: 8px;\n    border: 1px solid ", ";\n    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);\n    border-radius: 3px;\n    position: absolute;\n    top: -10%;\n    left: 50px;\n    z-index: 100;\n  }\n\n  .validation-button{\n    width: 30px;\n    height: 20px;\n    display: flex;\n    align-items: center;\n    border: none;\n    cursor: pointer;\n    color: black;\n    font-weight: 400;\n    font-size: 13px;\n    line-height: 18px;\n    background-color: white;\n\n    img {\n      & + p {\n        margin-left: 7px;\n      }\n    }\n\n    &:hover {\n      border-radius: 10px;\n    }\n\n    & + * {\n      margin-top: 8px;\n    }\n  }\n\n  .validation-option {\n    width: 82px;\n    height: 20px;\n    display: flex;\n    align-items: center;\n    border: none;\n    cursor: pointer;\n    color: black;\n    font-weight: 400;\n    font-size: 13px;\n    line-height: 18px;\n    background-color: white;\n    left: 7px;\n\n    img {\n      & + p {\n        margin-left: 7px;\n      }\n    }\n\n    &:hover {\n      border-radius: 10px;\n    }\n\n    & + * {\n      margin-top: 8px;\n    }\n  }\n\n  td{\n    margin:0;\n  }\n  \n  textarea {\n    width: 100%;\n    border: 1px solid\n      ", ";\n\n    font-family: ", ";\n    color: ", ";\n    font-weight: normal;\n    font-size: 12px;\n    line-height: 15px;\n    padding: 10px;\n    outline: none;\n    border-radius: 2px;\n    resize: none;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  .tooltip {\n    position: relative;\n    display: inline-block;\n  }\n  \n  .tooltiptext {\n    visibility: hidden;\n    width: 200px;\n    background-color: #ffffff;\n    color: #000000;\n    text-align: center;\n    border-radius: 6px;\n    position: absolute;\n    z-index: 6 important!;\n    bottom: 100%;\n    left: 20%;\n    margin-left: -80px;\n    opacity: 0;\n    transition: opacity 0.3s;\n    box-shadow: 0px 2px 4px 0px #00000040;\n    font-family: Roboto;\n    font-size: 12px;\n    padding: 10px;\n    text-align: justify;\n  }\n  \n\n  \n  .tooltip:hover .tooltiptext {\n    visibility: visible;\n    opacity: 1;\n  }\n"])), _variables.GlobalColors.s3, function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: grid;\n  grid-template-columns: 75% 25%;\n  grid-template-rows: 75px 1fr;\n  grid-template-areas:\n    \"tabs action_buttons\"\n    \"table table\";\n  margin: 0 30px;\n  body{\n    font-family: Roboto;\n  }\n\n  .tabs {\n    grid-area: tabs;\n    display: flex;\n    align-items: center;\n    gap: 0 10px;\n  }\n  .action_buttons {\n    grid-area: action_buttons;\n    display: flex;\n    align-items: center;\n    justify-content: end;\n    gap: 0 10px;\n    & > * {\n      cursor: pointer;\n    }\n  }\n  .table {\n    grid-area: table;\n    background: red;\n    height: 100%;\n    font-family: Raleway;\n  }\n  \n  .buttons-container{\n    background: white;\n    width: max-content;\n    padding: 8px;\n    border: 1px solid ", ";\n    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);\n    border-radius: 3px;\n    position: absolute;\n    top: -10%;\n    left: 50px;\n    z-index: 100;\n  }\n\n  .validation-button{\n    width: 30px;\n    height: 20px;\n    display: flex;\n    align-items: center;\n    border: none;\n    cursor: pointer;\n    color: black;\n    font-weight: 400;\n    font-size: 13px;\n    line-height: 18px;\n    background-color: white;\n\n    img {\n      & + p {\n        margin-left: 7px;\n      }\n    }\n\n    &:hover {\n      border-radius: 10px;\n    }\n  }\n\n  .validation-option {\n    width: 82px;\n    height: 20px;\n    align-items: center;\n    border: none;\n    cursor: pointer;\n    color: black;\n    font-weight: 400;\n    font-size: 13px;\n    line-height: 18px;\n    background-color: white;\n    left: 7px;\n\n    img {\n      & + p {\n        margin-left: 7px;\n      }\n    }\n\n    &:hover {\n      border-radius: 10px;\n    }\n\n    & + * {\n      margin-top: 8px;\n    }\n  }\n\n  td{\n    margin:0;\n  }\n  \n  textarea {\n    width: 100%;\n    border: 1px solid\n      ", ";\n\n    font-family: ", ";\n    color: ", ";\n    font-weight: normal;\n    font-size: 12px;\n    line-height: 15px;\n    padding: 10px;\n    outline: none;\n    border-radius: 5px;\n    resize: none;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  .general-input {\n    width: 100%;\n    height:27px;\n    max-height:100px;\n  }\n\n  .select-edition-multiple {\n    padding: 5px 10px;\n    border-radius: 5px;\n    gap: 10px;\n    border:1px solid ", ";\n    border-width: 1px 2px 1px 1px;\n    outline: none;\n    border-image: initial;\n    width: 100%;\n    min-height:27px;\n    cursor: pointer;\n    color: ", ";\n    font-size: 12px;\n    line-height: 21px;\n    overflow:hidden; \n    white-space:nowrap; \n    text-overflow:ellipsis;\n    :focus{\n      border:1px solid ", ";\n    }\n  }\n\n  .tooltip {\n    position: relative;\n    display: inline-block;\n  }\n  \n  .tooltiptext {\n    visibility: hidden;\n    width: 200px;\n    background-color: #ffffff;\n    color: #000000;\n    text-align: center;\n    border-radius: 6px;\n    position: absolute;\n    z-index: 6 important!;\n    bottom: 100%;\n    left: 20%;\n    margin-left: -80px;\n    opacity: 0;\n    transition: opacity 0.3s;\n    box-shadow: 0px 2px 4px 0px #00000040;\n    font-family: Roboto;\n    font-size: 12px;\n    padding: 10px;\n    text-align: justify;\n  }\n  \n\n  \n  .tooltip:hover .tooltiptext {\n    visibility: visible;\n    opacity: 1;\n  }\n"])), _variables.GlobalColors.s3, function (_ref) {
   var isRequired = _ref.isRequired;
   return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
-}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2);
+}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, _variables.GlobalColors.gray_light, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2);
 
 exports.Container = Container;

package/dist/components/pages/MultipleEdition/utils.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 Object.defineProperty(exports, "__esModule", {
@@ -48,6 +50,8 @@ var _saveWhiteGray = _interopRequireDefault(require("../../../assets/images/Icon
 
 var _iconsMaterial = require("@mui/icons-material");
 
+var _react = _interopRequireWildcard(require("react"));
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 // variables
@@ -532,16 +536,50 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
               Header: rules[attributeId].name,
               accessor: "".concat(attributeId + "-" + ret.id),
               width: "200px",
-              style: styleData
+              style: styleData,
+              description: rules[attributeId].description
             });
           }
         });
+
+        var inputTypeValue = function inputTypeValue(type) {
+          switch (type) {
+            case "Booleano":
+              return "checkbox";
+
+            case "Numérico":
+              return "number";
+
+            default:
+              return "text";
+          }
+        };
+
         Object.values(item.attributes).forEach(function (des) {
           var props = {
             inputId: item.id + "_" + rules[des.attributeId].attributeId + "_" + item.version,
             name: item.id + "-" + rules[des.attributeId].attributeId + "-" + item.version,
-            value: des.value
+            value: des.value,
+            inputType: inputTypeValue(des.type)
           };
+          var inputComponent;
+
+          if (des.option_list.length > 0) {
+            inputComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)("select", {
+              id: item.id + "_" + rules[des.attributeId].attributeId + "_" + item.version,
+              name: item.id + "-" + rules[des.attributeId].attributeId + "-" + item.version,
+              className: "select-edition-multiple",
+              children: des.option_list.map(function (option, index) {
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
+                  value: option,
+                  children: option
+                }, index);
+              })
+            });
+          } else {
+            inputComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, (0, _objectSpread3.default)({}, props));
+          }
+
           if (!attributesReviewed.find(function (e) {
             return e.articleId == item.id && e.attributeId == des.attributeId && e.versionId == item.version;
           })) attributesReviewed.push({
@@ -613,7 +651,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
               }), " "]
             }), " ", des.comment && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               class: "tooltip",
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, (0, _objectSpread3.default)({}, props)), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+              children: [inputComponent, /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
                 class: "tooltiptext",
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
                   children: /*#__PURE__*/(0, _jsxRuntime.jsx)("b", {
@@ -624,7 +662,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
                 })]
               })]
             }), !des.comment && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, (0, _objectSpread3.default)({}, props))
+              children: inputComponent
             })]
           });
         });
@@ -670,7 +708,8 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
               Header: rules[ret.id][descriptionId].name,
               accessor: "".concat(descriptionId),
               width: "250px",
-              style: styleData
+              style: styleData,
+              description: rules[ret.id][descriptionId].description
             });
           }
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.4.129",
+  "version": "21.4.131",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",

package/src/assets/images/Icons/save-white-gray.svg

@@ -1,4 +1,4 @@
-<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect width="34" height="34" rx="17" fill="#F0F0F0"/>
 <mask id="mask0_346_670" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="10" y="10" width="14" height="14">
 <rect x="10" y="10" width="14" height="14" fill="#D9D9D9"/>

package/src/assets/images/Icons/save-white.svg

@@ -1,4 +1,4 @@
-<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect width="34" height="34" rx="17" fill="#E33AA9"/>
 <mask id="mask0_346_670" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="10" y="10" width="14" height="14">
 <rect x="10" y="10" width="14" height="14" fill="#D9D9D9"/>

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

@@ -25,7 +25,7 @@ export const Container = styled.div`
     line-height: 15px;
     padding: 10px;
     outline: none;
-    border-radius: 2px;
+    border-radius: 5px;
     resize: none;
 
     &:focus {

package/src/components/organisms/Table/index.js

@@ -1,8 +1,9 @@
 import React, { useState } from "react";
 import { CheckBox } from "../../atoms/CheckBox";
 import { Container, TH, TD } from "./styles";
+import { Tooltip } from "../../atoms/Tooltip";
 
-export const Table = ({ columns, data, withCheckbox }) => {
+export const Table = ({ columns, data, withCheckbox, withTooltip=false }) => {
   const [rowsChecked, setRowsChecked] = useState([]);
 
   function handlerSelectAll(evt) {
@@ -40,7 +41,16 @@ export const Table = ({ columns, data, withCheckbox }) => {
                 withCheckbox={withCheckbox}
                 {...column}
               >
-                {column.Header}
+              {column.description && withTooltip ? (
+                  <Tooltip
+                    componentTooltip={<span>{column.description}</span>}
+                    position="topCenter"
+                  >
+                    <span>{column.Header}</span>
+                  </Tooltip>
+                ) : (
+                  <span>{column.Header}</span>
+                )}
               </TH>
             ))}
           </tr>

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

@@ -21,7 +21,7 @@ export const Container = styled.div`
       top: 0;
       height: 45px;
       position: sticky;
-      z-index: 5;
+      z-index: 10;
       & > tr {
         background-color: #f7f7fc;
         border-radius: 5px 5px 0px 0px;
@@ -66,6 +66,7 @@ export const Container = styled.div`
       font-style: normal;
       font-weight: 400;
       line-height: normal;
+      gap:5px;
     }
     display: flex;
     align-items: center;
@@ -78,12 +79,12 @@ export const TH = styled.th`
   min-height: ${({ height }) => height ?? "auto"};
   min-width: ${({ width }) => width ?? "auto"};
   position: sticky;
-  left: 20px;
+  left: ${({ fixedToLeft }) => (fixedToLeft >= 0 ? `${fixedToLeft}px` : "20px")};
   ${({ fixedToLeft, withCheckbox }) =>
     fixedToLeft >= 0 &&
     css`
       left: ${withCheckbox ? 20 + fixedToLeft : fixedToLeft}px;
-      z-index: 5;
+      z-index: 10;
     `}
 `;
 
@@ -98,7 +99,7 @@ export const TD = styled.td`
   vertical-align: middle;
   z-index: 5;
   position: sticky;
-  left: 20px;
+  left: ${({ fixedToLeft }) => (fixedToLeft >= 0 ? `${fixedToLeft}px` : "20px")};
   .content {
     white-space: nowrap;
     overflow: hidden;
@@ -108,6 +109,6 @@ export const TD = styled.td`
     fixedToLeft >= 0 &&
     css`
       left: ${withCheckbox ? 20 + fixedToLeft : fixedToLeft}px;
-      z-index: 5;
+      z-index: 10;
     `}
 `;

package/src/components/pages/MultipleEdition/MultipleEdition.stories.js

@@ -9,9 +9,9 @@ const Template = (args) => <MultipleEdition {...args} />;
 export const MultipleEditionDefault = Template.bind({});
 
 MultipleEditionDefault.args = {
-  articles: [121151,121152],//[216, 238, 239],
+  articles: [121161,121165],//[216, 238, 239],
   versions: [1,1],
   //token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiIxZmFjNjY2Ny1hMDMzLTQ1NjAtOWU5ZC01MTQwMDc2MmI2MWYiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjFmYWM2NjY3LWEwMzMtNDU2MC05ZTlkLTUxNDAwNzYyYjYxZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJjM2FlNjRiMC0yNDcxLTQ1MmQtOGExYi04OGFkNWIxNjRjOWQiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNjU0ODk3OCwibmFtZSI6IlJhZGlvc2NoYWNrIE9uYm9hcmRpbmciLCJwaG9uZV9udW1iZXIiOiIrNTIxMjM0NTY3ODk4IiwiZXhwIjoxNzA2NTUyNTc4LCJpYXQiOjE3MDY1NDg5NzgsImVtYWlsIjoicmFkaW9zaGFja2Ryb3BzaGlwQGFsbGZyZWVtYWlsLm5ldCJ9.RPiGAf-R2eEqdsfAbKKC7uX57t1JTEIZ3rgJZZNQ6wnJm8hfDKk1aa1fOqGZMDVw_peoq_XyZQWvmsJ8pRexWxO05oLZchn1n_gml6rapq2WqVap1CYyj2k2aBEGJo5CZzWGFp8VVXn9nl9pm8AsFjjfCAQGFaKB_5iMeNCPYt_vXXQ-LAOwkjzoAP6ujmlpJMVMsXoCaabWH7t5Z8akNO0eS0KAscL5EPDl_MmjqV_2PeBXl1KYAU-uJbdSG1xRiSV_nqJ23B4TAkERDfouCfd3ysLMrlRxkcsQd9xOvrt9fQMlrJqrCuf6RoD12pgqSRIxk_cOa4NFm6SKwCwRnw"
-  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmZTVlNWI4YS03N2ZjLTRmNmQtYWY0Yy0yZjVmZmY0ZjQ4ZGUiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6ImZlNWU1YjhhLTc3ZmMtNGY2ZC1hZjRjLTJmNWZmZjRmNDhkZSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJhNDkxNjFjNC0yZTE5LTQ0N2YtYWUwNy1hNTQ3YzU1MTM3NmMiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNTk2ODExNywibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTcwNTk3MTcxNywiaWF0IjoxNzA1OTY4MTE3LCJlbWFpbCI6InJldGFpbGVybWVyY2hhbnRzY29udGVudG9oQGFsbGZyZWVtYWlsLm5ldCJ9.fAOa4nlswhCyYsznuS2YBPGluqd6ok7V_TR1tdu6v9KBbN0Q5AJQZFVVJz2F4P8629_FAPjKybbz0gkv7-YHu0z7dqwDOIyve4Agr8YCgoPJi4Fw4whzcULBI122IejHZqSE6YnA2Ry6VOnxkBOJRetBu6oYwGUxfLJ5s2wTGkxStzA8VTDp9QH9kFNt2AUR7yyjMmzK3QT9E7Hvi60IjfWQbKBQpkn2VKkb2ClfJFi81LeFV5vmH9a8OiK7PyHvW82ascs-n3QuV8HgByR-Sgl8sX9CjZArmPGxeLNxS3MaYkLpx1vieOJaG2hotXyQXkx2eTNJUAYnnT10Ixskfg"
+  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiIxZmFjNjY2Ny1hMDMzLTQ1NjAtOWU5ZC01MTQwMDc2MmI2MWYiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjFmYWM2NjY3LWEwMzMtNDU2MC05ZTlkLTUxNDAwNzYyYjYxZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIzM2FiNjQ5My0yZjIwLTQyYjgtOTNkMC1hYWFhMDI5OWZmY2EiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNzg0NjU4NywibmFtZSI6IlJhZGlvc2NoYWNrIE9uYm9hcmRpbmciLCJwaG9uZV9udW1iZXIiOiIrNTIxMjM0NTY3ODk4IiwiZXhwIjoxNzA3ODUwMTg3LCJpYXQiOjE3MDc4NDY1ODcsImVtYWlsIjoicmFkaW9zaGFja2Ryb3BzaGlwQGFsbGZyZWVtYWlsLm5ldCJ9.Ki0oE2Z12-Dg-AAEP8SwdKkDbGk2kxqHTqdGkC1jVa79WL4MnvaPSG0eaQOLSwTtInVCBFyV9TAY1MZO6_wyMfLooe5DK6Xv99fY4ejWtu7ICtpdcTApXBHuZG9Hx5v5GoW8YxAr2Zb618nTTs-A-J4TxrwOxVTvlaxKouoX-eYA-EL-dBttzUPZqDHaoYKwCUhZx7Dh0ab8ej1lBOpy1DaOVKvXI0Hzd6yNKiKFMPFvr9x4L6S9FT-zdPOT41pJ_7wg9HGxHxpxyMzoq5FHTBYaiuGZsIVb60arpGbHBednDKgU3y5-CN9yuga_r-h69QT67iD4jVXhq54x2u1rQA"
   //token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJkMzE0ODYyYy02OTYxLTQ5YjktODMwOC1hMDM3Mzg1MjUwYzAiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwMjQxMTc0MSwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTcwMjQxNTM0MSwiaWF0IjoxNzAyNDExNzQxLCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.O4Lr5HZLuueNNY1FxqrRBaQZKMgnTXY9IG7KAMkhWO20Dxnfj253sqOme36AbqIAsCQBy77GmnZtTAFs0uF9QBfEDzZXRQ1xcctboGZ9U235LlLdz-BNGoH5QCRXeZsZdXJ1M7yL8IvIdEnXkFC0WYcUMWMRUc6K6vgOvmCCQhzOr-uW-2nsLBGjBb7Tj_okViYvT0Lupo5Z0Z9Xc20oOWnVmrSuaYa1-b4AjOjEOnETA9usnRa6blOVOkHqi5fX8u11ejczINxNBtoizMPOQROuzuuPTvHrl17ae8JkNoxVCJe5ZdfRrUN1lwUXnOZim7QhNg8YR_uvPs_EJRIwfw",
 };

package/src/components/pages/MultipleEdition/index.js

@@ -119,6 +119,7 @@ export const MultipleEdition = ({ articles, versions, onClose, token }) => {
           withCheckbox
           columns={currentData.columns}
           data={currentData.data}
+          withTooltip={true}
         />{" "}
       </div>{" "}
       {modalFromTable} <Modal {...modal} />{" "}

package/src/components/pages/MultipleEdition/styles.js

@@ -71,16 +71,11 @@ export const Container = styled.div`
     &:hover {
       border-radius: 10px;
     }
-
-    & + * {
-      margin-top: 8px;
-    }
   }
 
   .validation-option {
     width: 82px;
     height: 20px;
-    display: flex;
     align-items: center;
     border: none;
     cursor: pointer;
@@ -122,7 +117,7 @@ export const Container = styled.div`
     line-height: 15px;
     padding: 10px;
     outline: none;
-    border-radius: 2px;
+    border-radius: 5px;
     resize: none;
 
     &:focus {
@@ -130,6 +125,34 @@ export const Container = styled.div`
     }
   }
 
+  .general-input {
+    width: 100%;
+    height:27px;
+    max-height:100px;
+  }
+
+  .select-edition-multiple {
+    padding: 5px 10px;
+    border-radius: 5px;
+    gap: 10px;
+    border:1px solid ${GlobalColors.gray_light};
+    border-width: 1px 2px 1px 1px;
+    outline: none;
+    border-image: initial;
+    width: 100%;
+    min-height:27px;
+    cursor: pointer;
+    color: ${GlobalColors.deep_gray};
+    font-size: 12px;
+    line-height: 21px;
+    overflow:hidden; 
+    white-space:nowrap; 
+    text-overflow:ellipsis;
+    :focus{
+      border:1px solid ${GlobalColors.magenta_s2};
+    }
+  }
+
   .tooltip {
     position: relative;
     display: inline-block;

package/src/components/pages/MultipleEdition/utils.js

@@ -11,6 +11,7 @@ import infoIcon from "../../../assets/images/Icons/info.svg";
 import saveWhite from "../../../assets/images/Icons/save-white.svg";
 import saveWhiteGray from "../../../assets/images/Icons/save-white-gray.svg";
 import { DockSharp } from "@mui/icons-material";
+import React, { useState } from 'react';
 
 // variables
 export const optionsSelect = [
@@ -500,9 +501,21 @@ export function setDataColumns(
               accessor: `${attributeId + "-" + ret.id}`,
               width: "200px",
               style: styleData,
+              description:rules[attributeId].description,
             });
           }
         });
+        
+        const inputTypeValue = (type) => {
+          switch (type) {
+            case "Booleano":
+              return "checkbox";
+            case "Numérico":
+              return "number";
+            default:
+              return "text";
+          }
+        };
         Object.values(item.attributes).forEach((des) => {
           const props = {
             inputId:
@@ -518,7 +531,29 @@ export function setDataColumns(
               "-" +
               item.version,
             value: des.value,
+            inputType:inputTypeValue(des.type),
           };
+        
+
+          let inputComponent;
+          if (des.option_list.length>0) {
+            inputComponent = (
+              <select id={item.id + "_" + rules[des.attributeId].attributeId + "_" + item.version}
+                name={item.id + "-" + rules[des.attributeId].attributeId + "-" + item.version}
+                className="select-edition-multiple"
+              >
+                {des.option_list.map((option, index) => (
+                  <option key={index} value={option}>
+                    {option}
+                  </option>
+                ))}
+              </select>
+            );
+            
+          } else {
+            inputComponent = <TagAndInput {...props} />;
+          }
+        
           if (
             !attributesReviewed.find(
               (e) =>
@@ -630,11 +665,11 @@ export function setDataColumns(
                   </div>
                 )}{" "}
               {des.comment && <div class="tooltip">
-               <TagAndInput {...props} />
+              {inputComponent}
                 <span class="tooltiptext"><p><b>Comentarios del rechazo</b></p><p>{des.comment}</p></span>
               </div>}
               {!des.comment && <div>
-               <TagAndInput {...props} />
+                {inputComponent}
                </div>}
             </>
           );
@@ -674,9 +709,11 @@ export function setDataColumns(
               accessor: `${descriptionId}`,
               width: "250px",
               style: styleData,
+              description:rules[ret.id][descriptionId].description
             });
           }
         });
+        
         currentData[`retailer${ret.id}-save`] = (
           <button
             onClick={() => {

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

@@ -1,29 +0,0 @@
-"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  width: 100%;\n\n  > div {\n    label {\n      &:before {\n        outline: 1px solid ", ";\n      }\n    }\n  }\n\n  input,\n  textarea {\n    width: 100%;\n    border: 1px solid\n      ", ";\n\n    font-family: ", ";\n    color: ", ";\n    font-weight: normal;\n    font-size: 12px;\n    line-height: 15px;\n    padding: 10px;\n    outline: none;\n    border-radius: 2px;\n    resize: none;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  select {\n    background: #fafafa;\n    outline: none;\n    border: 1px solid\n      ", ";\n    width: 100%;\n    cursor: pointer;\n    font-family: ", ";\n    color: ", ";\n    font-size: 12px;\n    line-height: 21px;\n    padding: 10px;\n    border-right: 2px solid #e33aa9;\n\n    &:focus {\n      border: 1px solid ", ";\n    }\n  }\n\n  p {\n    font-family: ", ";\n    font-size: 12px;\n    color: ", ";\n  }\n\n  &.audit-class {\n    input,\n    .quill {\n      border: 1px solid #8a6caa;\n      background-color: #ededfc;\n    }\n  }\n"])), function (_ref) {
-  var isRequired = _ref.isRequired;
-  return isRequired ? "red" : "none";
-}, function (_ref2) {
-  var isRequired = _ref2.isRequired;
-  return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
-}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, function (_ref3) {
-  var isRequired = _ref3.isRequired;
-  return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
-}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, _variables.FontFamily.Raleway, _variables.GlobalColors.deep_gray);
-
-exports.Container = Container;