contentoh-components-library 21.3.64 → 21.3.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/components/atoms/ButtonV2/styles.js +1 -1
  2. package/dist/components/atoms/InputFormatter/styles.js +1 -1
  3. package/dist/components/molecules/TagAndInput/index.js +1 -1
  4. package/dist/components/organisms/Modal/styles.js +1 -1
  5. package/dist/components/organisms/SideModal/index.js +3 -2
  6. package/dist/components/organisms/SideModal/styles.js +1 -1
  7. package/dist/components/pages/ProviderProductEdition/index.js +7 -53
  8. package/dist/components/pages/RetailerProductEdition/index.js +1 -2
  9. package/package.json +1 -1
  10. package/src/components/atoms/ButtonV2/styles.js +1 -1
  11. package/src/components/atoms/InputFormatter/styles.js +2 -1
  12. package/src/components/molecules/TagAndInput/index.js +10 -8
  13. package/src/components/organisms/Modal/styles.js +4 -1
  14. package/src/components/organisms/SideModal/index.js +2 -1
  15. package/src/components/organisms/SideModal/styles.js +2 -1
  16. package/src/components/pages/ProviderProductEdition/index.js +28 -75
  17. package/src/components/pages/RetailerProductEdition/index.js +1 -2
package/dist/components/atoms/ButtonV2/styles.js CHANGED
@@ -15,7 +15,7 @@ var _variables = require("../../../global-files/variables");
15
15
 
16
16
  var _templateObject;
17
17
 
18
- var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: fit-content;\n padding: 0px;\n cursor: ", ";\n border-radius: ", ";\n border: none;\n\n .button {\n --size: ", "px;\n width: 100%;\n min-width: min-content;\n cursor: inherit;\n display: flex;\n flex-direction: ", ";\n gap: 7px;\n align-items: center;\n justify-content: center;\n padding: ", ";\n border-radius: inherit;\n border: ", ";\n font-family: ", ", sans-serif;\n font-size: var(--size);\n line-height: 1.2;\n text-transform: none;\n\n // tipos de botones fill\n &.fill {\n &.white {\n background-color: white;\n color: #e33aa9;\n border-color: #e33aa9;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS2 {\n background-color: white;\n color: #7b7979;\n border-color: #f0f0f0;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS3 {\n background-color: white;\n color: #262626;\n border-color: #f0f0f0;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS4 {\n background-color: white;\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n background-color: #e0e0f1;\n }\n }\n &.pink {\n background-color: #e33aa9;\n color: red;\n border-color: #e33aa9;\n &:hover {\n background-color: #b42983;\n }\n }\n &.gray {\n background-color: #e8e5e5;\n color: #262626;\n border-color: #7b7979;\n .icon,\n .iconLoading {\n color: #7b7979;\n }\n &:hover {\n background-color: #d6d3d3;\n }\n }\n &.purple {\n background-color: #f7f7fc;\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n background-color: #e0e0f1;\n }\n }\n &.purpleS2 {\n background-color: #8a6caa;\n color: white;\n border-color: #8a6caa;\n &:hover {\n background-color: #61467e;\n }\n }\n }\n\n // tipos de botones transparent\n &.transparent {\n &:hover {\n background-color: transparent;\n }\n &.white {\n color: white;\n border-color: #e33aa9;\n &:hover {\n color: #d6d4d4;\n }\n }\n &.pink {\n color: #e33aa9;\n border-color: #e33aa9;\n &:hover {\n color: #b42983;\n }\n }\n &.gray {\n color: #262626;\n border-color: #7b7979;\n .icon,\n .iconLoading {\n color: #7b7979;\n transition: inherit;\n }\n &:hover {\n color: #7b7979;\n .icon,\n .iconLoading {\n color: #bdbbbb;\n }\n }\n }\n &.purple {\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n color: #714f95;\n }\n }\n &.black {\n color: #262626;\n border-color: #262626;\n &:hover {\n color: #7b7979;\n }\n }\n }\n\n .icon,\n .iconLoading {\n display: grid;\n place-items: center;\n color: inherit;\n font-size: ", ";\n }\n .iconLoading {\n font-size: ", ";\n }\n\n // mismo estilo desabilitado para cualquier tipo de boton\n &:disabled {\n background-color: #fcebf7 !important;\n color: #7b7979 !important;\n border-color: #7b7979 !important;\n\n .icon {\n color: #9e9c9c !important;\n }\n .iconLoading {\n color: #9e2674 !important;\n }\n\n &:hover {\n background-color: #fcebf7 !important;\n }\n }\n }\n"])), function (_ref) {
18
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: fit-content;\n padding: 0px;\n cursor: ", ";\n border-radius: ", ";\n border: none;\n\n .button {\n --size: ", "px;\n width: 100%;\n min-width: min-content;\n cursor: inherit;\n display: flex;\n flex-direction: ", ";\n gap: 7px;\n align-items: center;\n justify-content: center;\n padding: ", ";\n border-radius: inherit;\n border: ", ";\n font-family: ", ", sans-serif;\n font-size: var(--size);\n line-height: 1.2;\n text-transform: none;\n\n // tipos de botones fill\n &.fill {\n &.white {\n background-color: white;\n color: #e33aa9;\n border-color: #e33aa9;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS2 {\n background-color: white;\n color: #7b7979;\n border-color: #f0f0f0;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS3 {\n background-color: white;\n color: #262626;\n border-color: #f0f0f0;\n &:hover {\n background-color: #f4f4f4;\n }\n }\n &.whiteS4 {\n background-color: white;\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n background-color: #e0e0f1;\n }\n }\n &.pink {\n background-color: #e33aa9;\n color: white;\n border-color: #e33aa9;\n &:hover {\n background-color: #b42983;\n }\n }\n &.gray {\n background-color: #e8e5e5;\n color: #262626;\n border-color: #7b7979;\n .icon,\n .iconLoading {\n color: #7b7979;\n }\n &:hover {\n background-color: #d6d3d3;\n }\n }\n &.purple {\n background-color: #f7f7fc;\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n background-color: #e0e0f1;\n }\n }\n &.purpleS2 {\n background-color: #8a6caa;\n color: white;\n border-color: #8a6caa;\n &:hover {\n background-color: #61467e;\n }\n }\n }\n\n // tipos de botones transparent\n &.transparent {\n &:hover {\n background-color: transparent;\n }\n &.white {\n color: white;\n border-color: #e33aa9;\n &:hover {\n color: #d6d4d4;\n }\n }\n &.pink {\n color: #e33aa9;\n border-color: #e33aa9;\n &:hover {\n color: #b42983;\n }\n }\n &.gray {\n color: #262626;\n border-color: #7b7979;\n .icon,\n .iconLoading {\n color: #7b7979;\n transition: inherit;\n }\n &:hover {\n color: #7b7979;\n .icon,\n .iconLoading {\n color: #bdbbbb;\n }\n }\n }\n &.purple {\n color: #8a6caa;\n border-color: #8a6caa;\n &:hover {\n color: #714f95;\n }\n }\n &.black {\n color: #262626;\n border-color: #262626;\n &:hover {\n color: #7b7979;\n }\n }\n }\n\n .icon,\n .iconLoading {\n display: grid;\n place-items: center;\n color: inherit;\n font-size: ", ";\n }\n .iconLoading {\n font-size: ", ";\n }\n\n // mismo estilo desabilitado para cualquier tipo de boton\n &:disabled {\n background-color: #fcebf7 !important;\n color: #7b7979 !important;\n border-color: #7b7979 !important;\n\n .icon {\n color: #9e9c9c !important;\n }\n .iconLoading {\n color: #9e2674 !important;\n }\n\n &:hover {\n background-color: #fcebf7 !important;\n }\n }\n }\n"])), function (_ref) {
19
19
  var disabled = _ref.disabled,
20
20
  isLoading = _ref.isLoading;
21
21
  return disabled || isLoading ? "not-allowed" : "pointer";
package/dist/components/atoms/InputFormatter/styles.js CHANGED
@@ -15,7 +15,7 @@ var _variables = require("../../../global-files/variables");
15
15
 
16
16
  var _templateObject;
17
17
 
18
- var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n .quill {\n background-color: ", ";\n border: 1px solid\n ", ";\n position: relative;\n border-radius: 2px;\n\n .ql-toolbar {\n background-color: ", ";\n position: absolute;\n z-index: 10;\n border: 1px solid ", ";\n width: 45px;\n height: 45px;\n border-radius: 4px;\n visibility: ", ";\n top: ", "px;\n left: ", "px;\n }\n\n .ql-container {\n border: none;\n font-family: ", ";\n color: ", ";\n strong {\n font-family: ", ";\n }\n }\n }\n .description-limit {\n font-size: 12px;\n font-family: ", ";\n color: ", ";\n text-align: right;\n }\n"])), _variables.GlobalColors.white, function (_ref) {
18
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n .quill {\n background-color: ", ";\n border: 1px solid\n ", ";\n position: relative;\n border-radius: 2px;\n\n .ql-toolbar {\n background-color: ", ";\n position: absolute;\n z-index: 10;\n border: 1px solid ", ";\n width: 45px;\n height: 45px;\n border-radius: 4px;\n visibility: ", ";\n top: ", "px;\n left: ", "px;\n }\n\n .ql-container {\n border: none;\n font-family: ", ";\n color: ", ";\n strong {\n font-family: ", ";\n }\n }\n }\n .description-limit {\n font-size: 12px;\n font-family: ", ";\n color: ", ";\n text-align: right;\n margin-top: 5px;\n }\n"])), _variables.GlobalColors.white, function (_ref) {
19
19
  var focus = _ref.focus,
20
20
  isRequired = _ref.isRequired;
21
21
  return focus ? _variables.GlobalColors.magenta_s2 : isRequired ? "red" : _variables.GlobalColors.s3;
package/dist/components/molecules/TagAndInput/index.js CHANGED
@@ -45,7 +45,7 @@ var TagAndInput = function TagAndInput(_ref) {
45
45
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
46
46
  inputType: inputType,
47
47
  className: "input-container",
48
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
48
+ children: [(label === null || label === void 0 ? void 0 : label.length) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
49
49
  className: "title-container",
50
50
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
51
51
  text: label,
package/dist/components/organisms/Modal/styles.js CHANGED
@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
15
15
 
16
16
  var _templateObject;
17
17
 
18
- var ContainerModal = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n overflow: auto;\n display: grid;\n place-items: center;\n background-color: rgba(0, 0, 0, 0.4);\n\n .contentModal {\n width: fit-content;\n max-width: 80%;\n min-width: 80px;\n height: fit-content;\n max-height: 90%;\n min-height: 120px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background-color: white;\n border-radius: 10px;\n padding: 25px 25px 20px 25px;\n box-shadow: 0px 2px 4px 0px #00000040;\n\n header {\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n gap: 6px;\n margin-bottom: 20px;\n\n .label-title {\n width: 100%;\n text-align: center;\n font-family: ", ", sans-serif;\n font-size: 17px;\n line-height: 1.2;\n color: #262626;\n white-space: pre-wrap;\n }\n }\n\n .iconModal {\n width: 50px;\n height: 50px;\n font-size: 30px;\n border-width: 4px;\n margin-bottom: 20px;\n overflow: hidden;\n\n &.iconModal-error {\n background-color: #953737;\n border-color: #953737;\n color: white;\n }\n &.iconModal-warning {\n font-size: 27px;\n padding-bottom: 8px;\n color: #af9647;\n border-color: #af9647;\n }\n &.iconModal-info {\n border-color: #9e3e26;\n color: #9e3e26;\n }\n &.iconModal-success {\n }\n }\n\n .label-message {\n width: 100%;\n text-align: center;\n font-family: ", ", sans-serif;\n font-size: 13px;\n color: #707070;\n white-space: pre-wrap;\n }\n\n .container-customComponent {\n width: 100%;\n max-height: 50vh;\n display: flex;\n flex-direction: column;\n margin-top: 20px;\n padding: 0px 0px;\n //border: 1px solid red;\n }\n\n .container-buttons {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n gap: 12px;\n margin-top: 20px;\n //border: 1px solid red;\n }\n }\n"])), _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular);
18
+ var ContainerModal = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n overflow: auto;\n display: grid;\n place-items: center;\n background-color: rgba(0, 0, 0, 0.4);\n\n .contentModal {\n width: fit-content;\n max-width: 80%;\n min-width: 80px;\n height: fit-content;\n max-height: 90%;\n min-height: 120px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background-color: white;\n border-radius: 10px;\n padding: 25px 25px 20px 25px;\n box-shadow: 0px 2px 4px 0px #00000040;\n\n header {\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n gap: 6px;\n\n .label-title {\n width: 100%;\n text-align: center;\n font-family: ", ", sans-serif;\n font-size: 17px;\n line-height: 1.2;\n color: #262626;\n white-space: pre-wrap;\n }\n\n & + * {\n margin-top: 20px;\n }\n }\n\n .iconModal {\n width: 50px;\n height: 50px;\n font-size: 30px;\n border-width: 4px;\n margin-bottom: 20px;\n overflow: hidden;\n\n &.iconModal-error {\n background-color: #953737;\n border-color: #953737;\n color: white;\n }\n &.iconModal-warning {\n font-size: 27px;\n padding-bottom: 8px;\n color: #af9647;\n border-color: #af9647;\n }\n &.iconModal-info {\n border-color: #9e3e26;\n color: #9e3e26;\n }\n &.iconModal-success {\n }\n }\n\n .label-message {\n width: 100%;\n text-align: center;\n font-family: ", ", sans-serif;\n font-size: 13px;\n color: #707070;\n white-space: pre-wrap;\n }\n\n .container-customComponent {\n width: 100%;\n max-height: 50vh;\n display: flex;\n flex-direction: column;\n margin-top: 20px;\n padding: 0px 0px;\n //border: 1px solid red;\n }\n\n .container-buttons {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n gap: 12px;\n margin-top: 20px;\n //border: 1px solid red;\n }\n }\n"])), _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular);
19
19
 
20
20
  exports.ContainerModal = ContainerModal;
package/dist/components/organisms/SideModal/index.js CHANGED
@@ -9,6 +9,8 @@ var _react = require("react");
9
9
 
10
10
  var _styles = require("./styles");
11
11
 
12
+ var _iconsMaterial = require("@mui/icons-material");
13
+
12
14
  var _jsxRuntime = require("react/jsx-runtime");
13
15
 
14
16
  var SideModal = function SideModal(_ref) {
@@ -22,8 +24,6 @@ var SideModal = function SideModal(_ref) {
22
24
  var modal = (0, _react.useRef)();
23
25
 
24
26
  var closeModal = function closeModal(e) {
25
- console.log("borrado");
26
-
27
27
  if (!e.target.closest("#".concat(id)) && show) {
28
28
  var _modal$current, _modal$current$classL;
29
29
 
@@ -47,6 +47,7 @@ var SideModal = function SideModal(_ref) {
47
47
 
48
48
  document.removeEventListener("click", closeModal, false);
49
49
  modal === null || modal === void 0 ? void 0 : (_modal$current3 = modal.current) === null || _modal$current3 === void 0 ? void 0 : (_modal$current3$class = _modal$current3.classList) === null || _modal$current3$class === void 0 ? void 0 : _modal$current3$class.remove("shown");
50
+ setShow && setShow(false);
50
51
  };
51
52
  }, []);
52
53
  return show && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
package/dist/components/organisms/SideModal/styles.js CHANGED
@@ -13,6 +13,6 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
13
13
 
14
14
  var _templateObject;
15
15
 
16
- var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n z-index: 9999999;\n background-color: transparent;\n top: 0;\n left: 0;\n\n .modal-container {\n width: 600px;\n height: 100%;\n position: absolute;\n right: -600px;\n background-color: #fff;\n display: flex;\n flex-direction: column;\n\n .modal-body {\n flex: 1;\n }\n\n &.shown {\n right: 0;\n }\n }\n"])));
16
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n z-index: 9999999;\n background-color: transparent;\n top: 0;\n left: 0;\n\n .modal-container {\n width: 600px;\n height: 100%;\n position: absolute;\n right: -600px;\n background-color: #fff;\n display: flex;\n flex-direction: column;\n box-shadow: -0.5px 0px 5px #f0f0f0;\n border: 1px solid #f0f0f0;\n .modal-body {\n flex: 1;\n }\n\n &.shown {\n right: 0;\n }\n }\n"])));
17
17
 
18
18
  exports.Container = Container;
package/dist/components/pages/ProviderProductEdition/index.js CHANGED
@@ -2242,52 +2242,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
2242
2242
  headerType: "input-name-header"
2243
2243
  }))]
2244
2244
  })
2245
- }), isRevision() && getSectionStatus() ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
2246
- className: "commentary-box",
2247
- children: !comment ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
2248
- className: "commentary",
2249
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
2250
- label: "Caja de Comentario",
2251
- inputType: "textarea",
2252
- inputCols: 80,
2253
- inputRows: 4,
2254
- inputId: "commentary-box",
2255
- index: 0
2256
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
2257
- className: "buttons-box",
2258
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
2259
- buttonType: "general-transparent-button",
2260
- label: "Enviar comentario",
2261
- onClick: function onClick(e) {
2262
- return createComment(e, document.querySelector("#description-commentary-box-0 .ql-container .ql-editor > p").innerHTML, activeTab);
2263
- }
2264
- })
2265
- })]
2266
- }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
2267
- className: "feedback-box",
2268
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Commentary.Commentary, {
2269
- comment: comment.message,
2270
- reviewed: crossComment
2271
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
2272
- buttonType: "circular-button accept-button",
2273
- onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee21() {
2274
- return _regenerator.default.wrap(function _callee21$(_context21) {
2275
- while (1) {
2276
- switch (_context21.prev = _context21.next) {
2277
- case 0:
2278
- setCrossComment(true);
2279
- commentRevised();
2280
-
2281
- case 2:
2282
- case "end":
2283
- return _context21.stop();
2284
- }
2285
- }
2286
- }, _callee21);
2287
- }))
2288
- })]
2289
- })
2290
- }) : !revision && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
2245
+ }), !(isRevision() && getSectionStatus()) && !revision && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
2291
2246
  className: "required-inputs-message",
2292
2247
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
2293
2248
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
@@ -2351,7 +2306,6 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
2351
2306
  title: "Agregar mensaje de rechazo",
2352
2307
  show: showRejectModal,
2353
2308
  customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
2354
- label: "Caja de Comentario",
2355
2309
  inputType: "textarea",
2356
2310
  inputId: "modal-message-box",
2357
2311
  index: 0,
@@ -2368,18 +2322,18 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
2368
2322
  type: "pink",
2369
2323
  label: "Aceptar",
2370
2324
  size: 12,
2371
- onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee22() {
2325
+ onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee21() {
2372
2326
  var body, messages;
2373
- return _regenerator.default.wrap(function _callee22$(_context22) {
2327
+ return _regenerator.default.wrap(function _callee21$(_context21) {
2374
2328
  while (1) {
2375
- switch (_context22.prev = _context22.next) {
2329
+ switch (_context21.prev = _context21.next) {
2376
2330
  case 0:
2377
2331
  body = document.querySelector("#modal-message-box .ql-container .ql-editor > p").innerHTML;
2378
2332
  messages = [{
2379
2333
  type: "message",
2380
2334
  value: body === null || body === void 0 ? void 0 : body.replace(/<.*?\/?>/gm, "")
2381
2335
  }];
2382
- _context22.next = 4;
2336
+ _context21.next = 4;
2383
2337
  return createComment(messages, activeRetailer.id);
2384
2338
 
2385
2339
  case 4:
@@ -2388,10 +2342,10 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
2388
2342
 
2389
2343
  case 6:
2390
2344
  case "end":
2391
- return _context22.stop();
2345
+ return _context21.stop();
2392
2346
  }
2393
2347
  }
2394
- }, _callee22);
2348
+ }, _callee21);
2395
2349
  }))
2396
2350
  }, "btn-Aceptar")]
2397
2351
  })]
package/dist/components/pages/RetailerProductEdition/index.js CHANGED
@@ -2080,10 +2080,9 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
2080
2080
  setShowVersionSelector: setShowVersionSelector,
2081
2081
  jwt: token
2082
2082
  }), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
2083
- title: "Agregar mensaje de rechazo",
2083
+ title: "Agregar mensaje de rechazo para ".concat(activeTab === null || activeTab === void 0 ? void 0 : activeTab.toLowerCase()),
2084
2084
  show: showRejectModal,
2085
2085
  customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
2086
- label: "Caja de Comentario",
2087
2086
  inputType: "textarea",
2088
2087
  inputId: "modal-message-box",
2089
2088
  index: 0,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "contentoh-components-library",
3
- "version": "21.3.64",
3
+ "version": "21.3.66",
4
4
  "dependencies": {
5
5
  "@aws-amplify/auth": "^4.5.3",
6
6
  "@aws-amplify/datastore": "^3.11.0",
package/src/components/atoms/ButtonV2/styles.js CHANGED
@@ -94,7 +94,7 @@ export const Container = styled.div`
94
94
  }
95
95
  &.pink {
96
96
  background-color: #e33aa9;
97
- color: red;
97
+ color: white;
98
98
  border-color: #e33aa9;
99
99
  &:hover {
100
100
  background-color: #b42983;
package/src/components/atoms/InputFormatter/styles.js CHANGED
@@ -37,5 +37,6 @@ export const Container = styled.div`
37
37
  font-family: ${FontFamily.AvenirNext};
38
38
  color: ${GlobalColors.deep_gray};
39
39
  text-align: right;
40
+ margin-top: 5px;
40
41
  }
41
- `;
42
+ `;
package/src/components/molecules/TagAndInput/index.js CHANGED
@@ -38,14 +38,16 @@ export const TagAndInput = ({
38
38
  className={"input-container"}
39
39
  key={`generalTagInput-${inputType}`}
40
40
  >
41
- <div className="title-container">
42
- <ScreenHeader
43
- text={label}
44
- headerType={"input-name-header"}
45
- color={color}
46
- />
47
- {showTooltip && <span className="tooltip">{label}</span>}
48
- </div>
41
+ {label?.length && (
42
+ <div className="title-container">
43
+ <ScreenHeader
44
+ text={label}
45
+ headerType={"input-name-header"}
46
+ color={color}
47
+ />
48
+ {showTooltip && <span className="tooltip">{label}</span>}
49
+ </div>
50
+ )}
49
51
  <GeneralInput
50
52
  inputId={inputId}
51
53
  inputType={inputType}
package/src/components/organisms/Modal/styles.js CHANGED
@@ -31,7 +31,6 @@ export const ContainerModal = styled.div`
31
31
  align-items: center;
32
32
  justify-content: flex-start;
33
33
  gap: 6px;
34
- margin-bottom: 20px;
35
34
 
36
35
  .label-title {
37
36
  width: 100%;
@@ -42,6 +41,10 @@ export const ContainerModal = styled.div`
42
41
  color: #262626;
43
42
  white-space: pre-wrap;
44
43
  }
44
+
45
+ & + * {
46
+ margin-top: 20px;
47
+ }
45
48
  }
46
49
 
47
50
  .iconModal {
package/src/components/organisms/SideModal/index.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { useRef } from "react";
2
2
  import { Container } from "./styles";
3
3
  import { useEffect } from "react";
4
+ import { PropaneSharp } from "@mui/icons-material";
4
5
 
5
6
  export const SideModal = ({
6
7
  header,
@@ -13,7 +14,6 @@ export const SideModal = ({
13
14
  const modal = useRef();
14
15
 
15
16
  const closeModal = (e) => {
16
- console.log("borrado");
17
17
  if (!e.target.closest(`#${id}`) && show) {
18
18
  document.removeEventListener("click", closeModal, false);
19
19
  modal?.current?.classList?.remove("shown");
@@ -32,6 +32,7 @@ export const SideModal = ({
32
32
  return () => {
33
33
  document.removeEventListener("click", closeModal, false);
34
34
  modal?.current?.classList?.remove("shown");
35
+ setShow && setShow(false);
35
36
  };
36
37
  }, []);
37
38
 
package/src/components/organisms/SideModal/styles.js CHANGED
@@ -17,7 +17,8 @@ export const Container = styled.div`
17
17
  background-color: #fff;
18
18
  display: flex;
19
19
  flex-direction: column;
20
-
20
+ box-shadow: -0.5px 0px 5px #f0f0f0;
21
+ border: 1px solid #f0f0f0;
21
22
  .modal-body {
22
23
  flex: 1;
23
24
  }
package/src/components/pages/ProviderProductEdition/index.js CHANGED
@@ -1515,87 +1515,41 @@ export const ProviderProductEdition = ({
1515
1515
  </>
1516
1516
  )}
1517
1517
  </div>
1518
- {isRevision() && getSectionStatus() ? (
1519
- <div className="commentary-box">
1520
- {!comment ? (
1521
- <div className="commentary">
1522
- <TagAndInput
1523
- label={"Caja de Comentario"}
1524
- inputType={"textarea"}
1525
- inputCols={80}
1526
- inputRows={4}
1527
- inputId={"commentary-box"}
1528
- index={0}
1529
- />
1530
- <div className="buttons-box">
1531
- <Button
1532
- buttonType={"general-transparent-button"}
1533
- label={"Enviar comentario"}
1534
- onClick={(e) =>
1535
- createComment(
1536
- e,
1537
- document.querySelector(
1538
- "#description-commentary-box-0 .ql-container .ql-editor > p"
1539
- ).innerHTML,
1540
- activeTab
1541
- )
1542
- }
1543
- />
1544
- </div>
1545
- </div>
1518
+ {!(isRevision() && getSectionStatus()) && !revision && (
1519
+ <div className="required-inputs-message">
1520
+ <div>
1521
+ <p>
1522
+ Los atributos son requeridos por las plataformas de las
1523
+ cadenas, es muy importante completar los campos requeridos ya
1524
+ que pueden rechazar el producto por falta de información.
1525
+ </p>
1526
+ </div>
1527
+ {inCart ? (
1528
+ <button type="button">
1529
+ <Link to="/checkout">
1530
+ <p>Articulo en carrito</p>
1531
+ <p>Ir a checkout</p>
1532
+ </Link>
1533
+ </button>
1546
1534
  ) : (
1547
- <div className="feedback-box">
1548
- <Commentary
1549
- comment={comment.message}
1550
- reviewed={crossComment}
1535
+ <>
1536
+ <SliderToolTip
1537
+ infoIcon={InfoIcon}
1538
+ slidefront={slidefront}
1539
+ iconSize={"big-image"}
1540
+ slidePosition={"top-slide"}
1551
1541
  />
1552
1542
  <Button
1553
- buttonType={"circular-button accept-button"}
1554
- onClick={async () => {
1555
- setCrossComment(true);
1556
- commentRevised();
1543
+ onClick={() => {
1544
+ setShowContentohRequestModal &&
1545
+ setShowContentohRequestModal(true);
1557
1546
  }}
1547
+ buttonType="general-default-button"
1548
+ label="Enviar a Content-oh!"
1558
1549
  />
1559
- </div>
1550
+ </>
1560
1551
  )}
1561
1552
  </div>
1562
- ) : (
1563
- !revision && (
1564
- <div className="required-inputs-message">
1565
- <div>
1566
- <p>
1567
- Los atributos son requeridos por las plataformas de las
1568
- cadenas, es muy importante completar los campos requeridos
1569
- ya que pueden rechazar el producto por falta de información.
1570
- </p>
1571
- </div>
1572
- {inCart ? (
1573
- <button type="button">
1574
- <Link to="/checkout">
1575
- <p>Articulo en carrito</p>
1576
- <p>Ir a checkout</p>
1577
- </Link>
1578
- </button>
1579
- ) : (
1580
- <>
1581
- <SliderToolTip
1582
- infoIcon={InfoIcon}
1583
- slidefront={slidefront}
1584
- iconSize={"big-image"}
1585
- slidePosition={"top-slide"}
1586
- />
1587
- <Button
1588
- onClick={() => {
1589
- setShowContentohRequestModal &&
1590
- setShowContentohRequestModal(true);
1591
- }}
1592
- buttonType="general-default-button"
1593
- label="Enviar a Content-oh!"
1594
- />
1595
- </>
1596
- )}
1597
- </div>
1598
- )
1599
1553
  )}
1600
1554
  </div>
1601
1555
  </div>
@@ -1644,7 +1598,6 @@ export const ProviderProductEdition = ({
1644
1598
  show={showRejectModal}
1645
1599
  customComponent={
1646
1600
  <TagAndInput
1647
- label={"Caja de Comentario"}
1648
1601
  inputType={"textarea"}
1649
1602
  inputId={"modal-message-box"}
1650
1603
  index={0}
package/src/components/pages/RetailerProductEdition/index.js CHANGED
@@ -1515,11 +1515,10 @@ export const RetailerProductEdition = ({
1515
1515
  )}
1516
1516
  {showRejectModal && (
1517
1517
  <Modal
1518
- title={"Agregar mensaje de rechazo"}
1518
+ title={`Agregar mensaje de rechazo para ${activeTab?.toLowerCase()}`}
1519
1519
  show={showRejectModal}
1520
1520
  customComponent={
1521
1521
  <TagAndInput
1522
- label={"Caja de Comentario"}
1523
1522
  inputType={"textarea"}
1524
1523
  inputId={"modal-message-box"}
1525
1524
  index={0}