contentoh-components-library 21.5.3 → 21.5.4

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

@@ -235,7 +235,7 @@ var InputGroup = function InputGroup(_ref) {
               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,
-              disabled: input === null || input === void 0 ? void 0 : input.isApproved,
+              disabled: input.id === 44186 || input.id === 44187 ? false : input === null || input === void 0 ? void 0 : input.isApproved,
               maxChar: input.max_chars,
               inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
               updatedDescriptions: updatedDescriptions,

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

@@ -15,7 +15,7 @@ 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: 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 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: 2;\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;";
 });

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

@@ -5,8 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = saveData;
 exports.deleteImage = deleteImage;
+exports.saveData = saveData;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
@@ -43,15 +43,15 @@ function saveData(_x) {
 
 function _saveData() {
   _saveData = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(params) {
-    var section, data, token, callbackToInitData, setModal;
+    var section, data, token;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:
-            section = params.section, data = params.data, token = params.token, callbackToInitData = params.callbackToInitData, setModal = params.setModal;
+            section = params.section, data = params.data, token = params.token;
 
             if (!(section === "images")) {
-              _context.next = 7;
+              _context.next = 5;
               break;
             }
 
@@ -60,25 +60,14 @@ function _saveData() {
 
           case 4:
             if (!_context.sent) {
-              _context.next = 7;
+              _context.next = 5;
               break;
             }
 
-            callbackToInitData();
-            setModal({
-              type: "saved successfully",
-              functions: {
-                setModal: setModal
-              },
-              payload: {
-                service: "imágenes"
-              }
-            }); // aquí va modal de que todo salío bien y actualiza la data
-
-          case 7:
-            return _context.abrupt("return", false);
+          case 5:
+            return _context.abrupt("return", true);
 
-          case 8:
+          case 6:
           case "end":
             return _context.stop();
         }
@@ -103,6 +92,7 @@ function _saveImagesData() {
             articles.data.forEach(function (article) {
               var images = article.images,
                   version = article.version;
+              console.log(images);
               var imagesToAdd = Object.values(images).filter(function (f) {
                 return f.value && !f.value.src.startsWith("id-");
               });

package/dist/components/pages/MultipleEdition/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  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    display: flex;\n    flex-direction: column;\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: 0;\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    display: flex;\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 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    display: flex;\n    flex-direction: column;\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: 0;\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    margin-right:5px;\n    img {\n      & + p {\n        margin-left: 7px;\n      }\n    }\n\n    &:hover {\n      border-radius: 10px;\n    }\n  }\n\n  .validation-option {\n    display: flex;\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    background: #ffffff !important;\n  }\n\n  th{\n    border-radius: 0 0 0 0 !important;\n    padding: 15px !important;\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.GlobalColors.gray_light, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2);

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

@@ -52,6 +52,10 @@ var _iconsMaterial = require("@mui/icons-material");
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _nullIcon = _interopRequireDefault(require("../../../assets/images/generalButton/nullIcon.svg"));
+
+var _Tooltip = require("../../atoms/Tooltip");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 // variables
@@ -150,7 +154,8 @@ function dataReducer(state, action) {
 
     var _action$payload = action.payload,
         articleId = _action$payload.articleId,
-        imageId = _action$payload.imageId;
+        imageId = _action$payload.imageId,
+        token = _action$payload.token;
     var newImageData = state.images.data.slice();
     var articleIndex = newImageData.findIndex(function (f) {
       return f.id === articleId;
@@ -159,6 +164,14 @@ function dataReducer(state, action) {
     newImageData[articleIndex].images[imageId].value = (0, _objectSpread3.default)((0, _objectSpread3.default)({}, action.payload), {}, {
       id: id
     });
+    var data = newImageData;
+    (0, _saveData.saveData)({
+      section: "images",
+      data: {
+        data: data
+      },
+      token: token
+    });
     return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state), {}, {
       images: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state.images), {}, {
         data: newImageData
@@ -172,7 +185,7 @@ function dataReducer(state, action) {
     var _action$payload2 = action.payload,
         _articleId = _action$payload2.articleId,
         _imageId = _action$payload2.imageId,
-        token = _action$payload2.token;
+        _token = _action$payload2.token;
 
     var _newImageData = state.images.data.slice();
 
@@ -183,14 +196,13 @@ function dataReducer(state, action) {
     var _id = (_newImageData$_articl = _newImageData[_articleIndex]) === null || _newImageData$_articl === void 0 ? void 0 : (_newImageData$_articl2 = _newImageData$_articl.images[_imageId]) === null || _newImageData$_articl2 === void 0 ? void 0 : (_newImageData$_articl3 = _newImageData$_articl2.value) === null || _newImageData$_articl3 === void 0 ? void 0 : _newImageData$_articl3.id;
 
     (_newImageData$_articl4 = _newImageData[_articleIndex]) === null || _newImageData$_articl4 === void 0 ? true : (_newImageData$_articl5 = _newImageData$_articl4.images[_imageId]) === null || _newImageData$_articl5 === void 0 ? true : delete _newImageData$_articl5.value;
-    console.log(_newImageData[_articleIndex]);
-    var data = {
+    var _data = {
       articleId: _articleId,
       deleteImages: [{
         id: _id
       }]
     };
-    (0, _saveData.deleteImage)(data, _newImageData[_articleIndex].version, token);
+    (0, _saveData.deleteImage)(_data, _newImageData[_articleIndex].version, _token);
     return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state), {}, {
       images: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state.images), {}, {
         data: _newImageData
@@ -274,6 +286,13 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
     display: "flex",
     justifyContent: "center"
   };
+  var styleApprovalAttributes = {
+    textAlign: "center",
+    display: "flex",
+    justifyContent: "center",
+    border: "1px solid #ECDD1D",
+    background: "#ECDD1D"
+  };
   var retailersAdded = {
     id: [],
     attr: []
@@ -323,17 +342,15 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
             });
           }
         });
-        var saveAvailable = imagesReviewed.filter(function (e) {
-          return e.articleId === item.id;
-        }).every(function (e) {
-          return e.isReviewed === true;
-        });
-
-        if (imagesReviewed.filter(function (e) {
-          return e.articleId === item.id;
-        }).length == 0) {
-          saveAvailable = false;
-        }
+        var saveAvailable = true;
+        /**var saveAvailable = imagesReviewed
+        .filter((e) => e.articleId === item.id)
+        .every((e) => e.isReviewed === true);
+        if (
+        imagesReviewed.filter((e) => e.articleId === item.id).length == 0
+        ) {
+        saveAvailable = false;
+        }**/
 
         currentData["retailer".concat(ret.id, "-save")] = /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
           onClick: function onClick() {
@@ -393,62 +410,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
             return e.articleId === item.id && e.imageId === imageId && e.versionId === item.version;
           });
           currentData["img".concat(imageId)] = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-              onClick: function onClick() {
-                setShowValidationPanel(true);
-                setAttributeSelected({
-                  articleId: item.id,
-                  attributeId: imageId,
-                  versionId: item.version
-                });
-              },
-              className: "validation-button",
-              children: [imagesReviewed[index].isReviewed && imagesReviewed[index].isApproved && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + imageId + "_" + item.version,
-                src: _acceptIcon.default,
-                alt: "accept button"
-              }), " ", imagesReviewed[index].isReviewed && !imagesReviewed[index].isApproved && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + imageId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
-              }), " ", !imagesReviewed[index].isReviewed && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + imageId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
-              })]
-            }), " ", showValidationPanel && attributeSelected.articleId === item.id && attributeSelected.attributeId === imageId && attributeSelected.versionId === item.version && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-              className: "buttons-container",
-              style: {
-                left: "70px"
-              },
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-                onClick: function onClick() {
-                  imagesReviewed[index].isApproved = true;
-                  imagesReviewed[index].isReviewed = true; //document.getElementById(item.id+'_'+des.attributeId+'_'+item.version).style.borderColor="#71DE56";
-
-                  setShowValidationPanel(false);
-                },
-                className: "validation-option",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                  src: _acceptIcon.default,
-                  alt: "accept button"
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                  children: " Validar "
-                }), " "]
-              }), " ", /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-                onClick: function onClick() {
-                  setShowValidationPanel(false);
-                  setShowRejectModal(true);
-                },
-                className: "validation-option",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                  src: _rejectIcon.default,
-                  alt: "reject button"
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                  children: " Rechazar "
-                }), " "]
-              }), " "]
-            }), " ", comment && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            children: [comment && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               class: "tooltip",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageVisor.ImageVisor, (0, _objectSpread3.default)({}, props)), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
                 class: "tooltiptext",
@@ -506,13 +468,19 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
             var articleAttributes = attributesReviewed.filter(function (e) {
               return e.articleId === item.id && e.versionId === item.version;
             });
+            var value;
             articleAttributes.forEach(function (articleAttribute) {
-              var value = document.getElementById(articleAttribute.articleId + "_" + articleAttribute.attributeId + "_" + articleAttribute.versionId).value;
+              if (articleAttribute.attributeId == 6700 || articleAttribute.attributeId == 6701) {
+                value = document.getElementById(articleAttribute.articleId + "_" + articleAttribute.attributeId + "_" + articleAttribute.versionId).checked;
+              } else {
+                value = document.getElementById(articleAttribute.articleId + "_" + articleAttribute.attributeId + "_" + articleAttribute.versionId).value;
+              }
+
               articlesAtributesUpdateBody.push({
                 articleId: articleAttribute.articleId,
                 versionId: articleAttribute.versionId,
                 attributeId: articleAttribute.attributeId,
-                value: value ? value : "",
+                value: value != undefined ? value : "",
                 isApproved: articleAttribute.isApproved,
                 comment: articleAttribute.comment
               });
@@ -536,7 +504,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
               Header: rules[attributeId].name,
               accessor: "".concat(attributeId + "-" + ret.id),
               width: "200px",
-              style: styleData,
+              style: attributeId == 6700 || attributeId == 6701 ? styleApprovalAttributes : styleData,
               description: rules[attributeId].description
             });
           }
@@ -582,7 +550,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
           var inputComponent;
 
           if (des.option_list.length > 0) {
-            inputComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)("select", {
+            inputComponent = /*#__PURE__*/(0, _jsxRuntime.jsxs)("select", {
               id: item.id + "_" + rules[des.attributeId].attributeId + "_" + item.version,
               name: item.id + "-" + rules[des.attributeId].attributeId + "-" + item.version,
               className: "select-edition-multiple",
@@ -590,12 +558,17 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
               onChange: function onChange(e) {
                 handleChangeOptions(des.attributeId, e.target.value);
               },
-              children: des.option_list.map(function (option, index) {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
+                value: "",
+                selected: true,
+                disabled: true,
+                children: "Selecciona una opci\xF3n"
+              }), 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));
@@ -629,16 +602,32 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
                 id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
                 src: _acceptIcon.default,
                 alt: "accept button"
-              }), " ", attributesReviewed[index].isReviewed && !attributesReviewed[index].isApproved && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
-              }), " ", typeof des.isApproved === "undefined" && !attributesReviewed[index].isReviewed && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
+              }), attributesReviewed[index].isReviewed && !attributesReviewed[index].isApproved &&
+              /*#__PURE__*/
+
+              /**<Tooltip position="topCenter" componentTooltip={<span>Debes aprobar o rechazar para continuar</span>}>**/
+              (0, _jsxRuntime.jsx)("div", {
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                  id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
+                  src: _rejectIcon.default,
+                  alt: "reject icon"
+                })
+              })
+              /*</Tooltip>*/
+              , typeof des.isApproved === "undefined" && !attributesReviewed[index].isReviewed && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.Tooltip, {
+                position: "topCenter",
+                componentTooltip: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  children: "Debes aprobar o rechazar para continuar"
+                }),
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                    id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
+                    src: _nullIcon.default,
+                    alt: "null button"
+                  })
+                })
               })]
-            }), " ", showValidationPanel && attributeSelected.articleId === item.id && attributeSelected.attributeId === des.attributeId && attributeSelected.versionId === item.version && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            }), showValidationPanel && attributeSelected.articleId === item.id && attributeSelected.attributeId === des.attributeId && attributeSelected.versionId === item.version && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: "buttons-container",
               style: {
                 left: "35px"
@@ -707,17 +696,15 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
           });
         }
 
-        var saveAvailable = descriptionsReviewed.filter(function (e) {
-          return e.articleId === item.id;
-        }).every(function (e) {
-          return e.isReviewed === true;
-        });
-
-        if (descriptionsReviewed.filter(function (e) {
-          return e.articleId === item.id;
-        }).length == 0) {
-          saveAvailable = false;
-        }
+        var saveAvailable = true;
+        /**var saveAvailable = descriptionsReviewed
+        .filter((e) => e.articleId === item.id)
+        .every((e) => e.isReviewed === true);
+        if (
+        descriptionsReviewed.filter((e) => e.articleId === item.id).length == 0
+        ) {
+        saveAvailable = false;
+        }**/
 
         currentData["retailer".concat(ret.id)] = /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
           children: [" ", ret.name, " "]
@@ -785,61 +772,7 @@ function setDataColumns(section, dataService, token, setModalFromTable, setDataS
             return e.articleId === item.id && e.attributeId === des.attributeId && e.versionId === item.version;
           });
           currentData["".concat(des.attributeId)] = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-              onClick: function onClick() {
-                setShowValidationPanel(true);
-                setAttributeSelected({
-                  articleId: item.id,
-                  attributeId: des.attributeId,
-                  versionId: item.version
-                });
-              },
-              className: "validation-button",
-              children: [descriptionsReviewed[index].isReviewed && descriptionsReviewed[index].isApproved && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
-                src: _acceptIcon.default,
-                alt: "accept button"
-              }), " ", descriptionsReviewed[index].isReviewed && !descriptionsReviewed[index].isApproved && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
-              }), " ", typeof des.isApproved === "undefined" && !descriptionsReviewed[index].isReviewed && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                id: "button_" + item.id + "_" + des.attributeId + "_" + item.version,
-                src: _rejectIcon.default,
-                alt: "reject button"
-              })]
-            }), " ", showValidationPanel && attributeSelected.articleId === item.id && attributeSelected.attributeId === des.attributeId && attributeSelected.versionId === item.version && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-              className: "buttons-container",
-              style: {
-                left: "35px"
-              },
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-                onClick: function onClick() {
-                  descriptionsReviewed[index].isApproved = true;
-                  descriptionsReviewed[index].isReviewed = true;
-                  setShowValidationPanel(false);
-                },
-                className: "validation-option",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                  src: _acceptIcon.default,
-                  alt: "accept button"
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                  children: " Validar "
-                }), " "]
-              }), " ", /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-                onClick: function onClick() {
-                  setShowValidationPanel(false);
-                  setShowRejectModal(true);
-                },
-                className: "validation-option",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                  src: _rejectIcon.default,
-                  alt: "reject button"
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                  children: " Rechazar "
-                }), " "]
-              }), " "]
-            }), " ", des.comment && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            children: [des.comment && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               class: "tooltip",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("textarea", (0, _objectSpread3.default)({}, props)), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
                 class: "tooltiptext",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.5.3",
+  "version": "21.5.4",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",
@@ -27,9 +27,12 @@
     "babel-preset-react-app": "^10.0.1",
     "caniuse-lite": "^1.0.30001472",
     "chart.js": "^3.7.1",
+    "contentoh-components-library": "^21.4.75",
     "draft-js": "^0.11.7",
     "file-saver": "^2.0.5",
+    "infinite-react-carousel": "^1.2.11",
     "js-base64": "^3.7.2",
+    "mapbox-gl": "^1.13.3",
     "moment": "^2.29.4",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",

package/src/assets/images/Icons/addv2.svg

@@ -0,0 +1,8 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_343_348" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="14" height="14">
+<rect width="14" height="14" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_343_348)">
+<path d="M6.25 7.75H0V6.25H6.25V0H7.75V6.25H14V7.75H7.75V14H6.25V7.75Z" fill="#E33AA9"/>
+</g>
+</svg>

package/src/assets/images/Icons/beenhere.svg

@@ -0,0 +1,9 @@
+<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="33" height="33" rx="16.5" fill="white" stroke="#E33AA9"/>
+<mask id="mask0_387_1148" 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"/>
+</mask>
+<g mask="url(#mask0_387_1148)">
+<path d="M17.0833 24L12.15 20.3C12.025 20.2083 11.9271 20.0917 11.8563 19.95C11.7854 19.8083 11.75 19.6583 11.75 19.5V11C11.75 10.7333 11.85 10.5 12.05 10.3C12.25 10.1 12.4833 10 12.75 10H21.4167C21.6833 10 21.9167 10.1 22.1167 10.3C22.3167 10.5 22.4167 10.7333 22.4167 11V19.5C22.4167 19.6583 22.3813 19.8083 22.3104 19.95C22.2396 20.0917 22.1417 20.2083 22.0167 20.3L17.0833 24ZM17.0833 22.75L21.4167 19.4167V11H12.75V19.4167L17.0833 22.75ZM16.3833 18.6667L20.15 14.9L19.4333 14.2L16.3667 17.2667L14.7167 15.6167L14.0167 16.3167L16.3833 18.6667Z" fill="#E33AA9"/>
+</g>
+</svg>

package/src/assets/images/Icons/checkv2.svg

@@ -0,0 +1,8 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_372_2690" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="48" height="48">
+<rect width="48" height="48" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_372_2690)">
+<path d="M20.46 34.92L37.44 17.94L34.68 15.24L20.46 29.46L13.26 22.26L10.56 24.96L20.46 34.92ZM24 48C20.72 48 17.62 47.37 14.7 46.11C11.78 44.85 9.23 43.13 7.05 40.95C4.87 38.77 3.15 36.22 1.89 33.3C0.63 30.38 0 27.28 0 24C0 20.68 0.63 17.56 1.89 14.64C3.15 11.72 4.87 9.18 7.05 7.02C9.23 4.86 11.78 3.15 14.7 1.89C17.62 0.63 20.72 0 24 0C27.32 0 30.44 0.63 33.36 1.89C36.28 3.15 38.82 4.86 40.98 7.02C43.14 9.18 44.85 11.72 46.11 14.64C47.37 17.56 48 20.68 48 24C48 27.28 47.37 30.38 46.11 33.3C44.85 36.22 43.14 38.77 40.98 40.95C38.82 43.13 36.28 44.85 33.36 46.11C30.44 47.37 27.32 48 24 48ZM24 44.4C29.68 44.4 34.5 42.41 38.46 38.43C42.42 34.45 44.4 29.64 44.4 24C44.4 18.32 42.42 13.5 38.46 9.54C34.5 5.58 29.68 3.6 24 3.6C18.36 3.6 13.55 5.58 9.57 9.54C5.59 13.5 3.6 18.32 3.6 24C3.6 29.64 5.59 34.45 9.57 38.43C13.55 42.41 18.36 44.4 24 44.4Z" fill="#85BC5B"/>
+</g>
+</svg>

package/src/assets/images/Icons/close-magenta.svg

@@ -0,0 +1,9 @@
+<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="33" height="33" rx="16.5" fill="white" stroke="#E33AA9"/>
+<mask id="mask0_346_668" 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"/>
+</mask>
+<g mask="url(#mask0_346_668)">
+<path d="M11.077 24L10 22.9231L15.9231 17L10 11.0769L11.077 10L17 15.9231L22.9231 10L24 11.0769L18.077 17L24 22.9231L22.9231 24L17 18.0769L11.077 24Z" fill="#E33AA9"/>
+</g>
+</svg>

package/src/assets/images/Icons/close.svg

@@ -0,0 +1,8 @@
+<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_731_2487" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
+<rect width="10" height="10" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_731_2487)">
+<path d="M0.769231 10L0 9.23077L4.23077 5L0 0.769231L0.769231 0L5 4.23077L9.23077 0L10 0.769231L5.76923 5L10 9.23077L9.23077 10L5 5.76923L0.769231 10Z" fill="#B64545"/>
+</g>
+</svg>

package/src/assets/images/Icons/closeCircle.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none">
+  <mask id="mask0_336_331" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
+    <rect x="0.0588379" y="0.0588226" width="9.88235" height="9.88235" fill="#D9D9D9"/>
+  </mask>
+  <g mask="url(#mask0_336_331)">
+    <path d="M0.819019 9.94121L0.0588379 9.18103L4.23983 5.00003L0.0588379 0.819034L0.819019 0.0588531L5.00001 4.23985L9.18101 0.0588531L9.94119 0.819034L5.7602 5.00003L9.94119 9.18103L9.18101 9.94121L5.00001 5.76021L0.819019 9.94121Z" fill="white"/>
+  </g>
+</svg>

package/src/assets/images/Icons/delete-forever-red.svg

@@ -0,0 +1,9 @@
+<svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="33" height="33" rx="16.5" fill="white" stroke="#B64545"/>
+<mask id="mask0_346_669" 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"/>
+</mask>
+<g mask="url(#mask0_346_669)">
+<path d="M14.7833 20.5194L17.0972 18.1667L19.4306 20.5194L20.3444 19.5861L18.0306 17.2333L20.3444 14.8806L19.4306 13.9472L17.0972 16.3L14.7833 13.9472L13.85 14.8806L16.1833 17.2333L13.85 19.5861L14.7833 20.5194ZM12.8389 24C12.5278 24 12.2556 23.8833 12.0222 23.65C11.7889 23.4167 11.6722 23.1444 11.6722 22.8333V11.75H10.875V10.5833H14.5306V10H19.6639V10.5833H23.3194V11.75H22.5222V22.8333C22.5222 23.1444 22.4056 23.4167 22.1722 23.65C21.9389 23.8833 21.6667 24 21.3556 24H12.8389ZM21.3556 11.75H12.8389V22.8333H21.3556V11.75Z" fill="#B64545"/>
+</g>
+</svg>

package/src/assets/images/Icons/delete-forever-white.svg

@@ -0,0 +1,10 @@
+<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="delete-forever-white">
+<mask id="mask0_498_688" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
+<rect id="Bounding box" x="0.0588379" y="0.0588379" width="9.88235" height="9.88235" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_498_688)">
+<path id="delete-forever" d="M3.43534 7.48433L5.06867 5.82354L6.71573 7.48433L7.36083 6.8255L5.72749 5.16472L7.36083 3.50394L6.71573 2.84511L5.06867 4.5059L3.43534 2.84511L2.77651 3.50394L4.42357 5.16472L2.77651 6.8255L3.43534 7.48433ZM2.06279 9.94119C1.84318 9.94119 1.65102 9.85884 1.48632 9.69413C1.32161 9.52943 1.23926 9.33727 1.23926 9.11766V1.29413H0.676514V0.470603H3.25691V0.0588379H6.88044V0.470603H9.46083V1.29413H8.89808V9.11766C8.89808 9.33727 8.81573 9.52943 8.65102 9.69413C8.48632 9.85884 8.29416 9.94119 8.07455 9.94119H2.06279ZM8.07455 1.29413H2.06279V9.11766H8.07455V1.29413Z" fill="white"/>
+</g>
+</g>
+</svg>

package/src/assets/images/Icons/edit.svg

@@ -0,0 +1,8 @@
+<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_731_2312" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="12" height="12">
+<rect width="12" height="12" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_731_2312)">
+<path d="M1.40041 10.5996H2.06071L8.70873 3.95157L8.04843 3.29127L1.40041 9.93929V10.5996ZM10.6146 3.30628L8.69372 1.3854L9.32401 0.755116C9.49409 0.585039 9.70418 0.5 9.9543 0.5C10.2044 0.5 10.4145 0.585039 10.5846 0.755116L11.2449 1.41542C11.415 1.58549 11.5 1.79559 11.5 2.0457C11.5 2.29582 11.415 2.50591 11.2449 2.67599L10.6146 3.30628ZM9.98431 3.93656L2.42087 11.5H0.5V9.57913L8.06344 2.01569L9.98431 3.93656Z" fill="#E33AA9"/>
+</g>
+</svg>

package/src/assets/images/Icons/fullscreen.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
+  <path d="M0 12V7.71111H1.33333V10.6667H4.28889V12H0ZM7.71111 12V10.6667H10.6667V7.71111H12V12H7.71111ZM0 4.28889V0H4.28889V1.33333H1.33333V4.28889H0ZM10.6667 4.28889V1.33333H7.71111V0H12V4.28889H10.6667Z" fill="white"/>
+</svg>

package/src/assets/images/Icons/infoNR.svg

@@ -0,0 +1,8 @@
+<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_37_379" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="8" height="8">
+<rect width="8" height="8" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_37_379)">
+<path d="M3.63807 5.98825H4.40893V3.62867H3.63807V5.98825ZM3.99596 3.07403C4.124 3.07403 4.2311 3.03169 4.31727 2.947C4.40345 2.86232 4.44653 2.75738 4.44653 2.6322C4.44653 2.49463 4.40331 2.38347 4.31685 2.29871C4.2304 2.21394 4.12327 2.17156 3.99547 2.17156C3.86061 2.17156 3.75166 2.21394 3.66863 2.29871C3.58559 2.38347 3.54407 2.49307 3.54407 2.6275C3.54407 2.7566 3.58737 2.8633 3.67398 2.94759C3.7606 3.03188 3.86792 3.07403 3.99596 3.07403ZM3.9991 8C3.44212 8 2.92156 7.89633 2.43741 7.68899C1.95324 7.48165 1.52964 7.19646 1.16659 6.83341C0.803541 6.47036 0.518349 6.04696 0.311013 5.5632C0.103671 5.07943 0 4.5588 0 4.0013C0 3.44379 0.103671 2.92273 0.311013 2.4381C0.518349 1.95348 0.803049 1.53104 1.16511 1.1708C1.52718 0.810554 1.95032 0.525358 2.43455 0.315215C2.91877 0.105072 3.43989 0 3.99792 0C4.55595 0 5.07764 0.10483 5.56301 0.314491C6.04837 0.524146 6.47094 0.80868 6.83072 1.16809C7.1905 1.52751 7.47533 1.95015 7.6852 2.43603C7.89507 2.92191 8 3.44396 8 4.0022C8 4.56004 7.89493 5.08098 7.68479 5.56504C7.47464 6.04909 7.18945 6.47169 6.8292 6.83282C6.46896 7.19395 6.04646 7.47876 5.56169 7.68726C5.07694 7.89575 4.55607 8 3.9991 8ZM4 7.11633C4.86173 7.11633 5.59499 6.81435 6.19977 6.21037C6.80454 5.60639 7.10693 4.8696 7.10693 4C7.10693 3.13827 6.80513 2.40501 6.20153 1.80024C5.59793 1.19546 4.86095 0.893067 3.9906 0.893067C3.12887 0.893067 2.39561 1.19487 1.79083 1.79847C1.18606 2.40207 0.883666 3.13905 0.883666 4.0094C0.883666 4.87113 1.18565 5.60439 1.78963 6.20917C2.39361 6.81394 3.1304 7.11633 4 7.11633Z" fill="#707070"/>
+</g>
+</svg>

package/src/assets/images/Icons/options.svg

@@ -0,0 +1,3 @@
+<svg width="6" height="17" viewBox="0 0 6 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3 14.25C2.5875 14.25 2.23438 14.1031 1.94063 13.8094C1.64688 13.5156 1.5 13.1625 1.5 12.75C1.5 12.3375 1.64688 11.9844 1.94063 11.6906C2.23438 11.3969 2.5875 11.25 3 11.25C3.4125 11.25 3.76562 11.3969 4.05938 11.6906C4.35313 11.9844 4.5 12.3375 4.5 12.75C4.5 13.1625 4.35313 13.5156 4.05938 13.8094C3.76562 14.1031 3.4125 14.25 3 14.25ZM3 9.75C2.5875 9.75 2.23438 9.60313 1.94063 9.30938C1.64688 9.01563 1.5 8.6625 1.5 8.25C1.5 7.8375 1.64688 7.48438 1.94063 7.19063C2.23438 6.89687 2.5875 6.75 3 6.75C3.4125 6.75 3.76562 6.89687 4.05938 7.19063C4.35313 7.48438 4.5 7.8375 4.5 8.25C4.5 8.6625 4.35313 9.01563 4.05938 9.30938C3.76562 9.60313 3.4125 9.75 3 9.75ZM3 5.25C2.5875 5.25 2.23438 5.10313 1.94063 4.80938C1.64688 4.51562 1.5 4.1625 1.5 3.75C1.5 3.3375 1.64688 2.98438 1.94063 2.69063C2.23438 2.39688 2.5875 2.25 3 2.25C3.4125 2.25 3.76562 2.39688 4.05938 2.69063C4.35313 2.98438 4.5 3.3375 4.5 3.75C4.5 4.1625 4.35313 4.51562 4.05938 4.80938C3.76562 5.10313 3.4125 5.25 3 5.25Z" fill="#CBCBCB"/>
+</svg>