contentoh-components-library 19.0.0 → 21.0.1

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 (7) hide show
  1. package/dist/components/atoms/GenericModal/styles.js +1 -1
  2. package/dist/components/atoms/StatusTag/styles.js +1 -1
  3. package/dist/components/pages/RetailerProductEdition/index.js +22 -21
  4. package/package.json +1 -1
  5. package/src/components/atoms/GenericModal/styles.js +3 -2
  6. package/src/components/atoms/StatusTag/styles.js +5 -2
  7. package/src/components/pages/RetailerProductEdition/index.js +16 -14
package/dist/components/atoms/GenericModal/styles.js CHANGED
@@ -17,6 +17,6 @@ var _genericModalClose = _interopRequireDefault(require("../../../assets/images/
17
17
 
18
18
  var _templateObject;
19
19
 
20
- var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n position: fixed;\n background-color: rgba(59, 59, 59, 0.53);\n backdrop-filter: blur(4px);\n top: 0;\n left: 0;\n z-index: 100;\n\n .global-styles {\n background-color: ", ";\n height: auto;\n width: auto;\n position: relative;\n border-radius: 15px;\n padding: 40px;\n text-align: center;\n .close-button {\n background-image: url(", ");\n background-color: transparent;\n width: 14px;\n height: 14px;\n cursor: pointer;\n border: none;\n position: absolute;\n right: 20px;\n top: 20px;\n }\n .general-white-button {\n width: 160px;\n height: 40px;\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n & + * {\n margin-left: 45px;\n height: 40px;\n width: 161px;\n }\n }\n\n &.log-out {\n padding-bottom: 60px;\n img {\n & + * {\n margin-top: 20px;\n }\n }\n .with-bold-text {\n font-size: 24px;\n & + * {\n margin-top: 20px;\n }\n }\n }\n\n &.delete-product {\n img {\n height: 50px;\n width: 56px;\n & + * {\n margin-top: 30px;\n }\n }\n .product-name-header {\n & + * {\n margin-bottom: 30px;\n }\n }\n }\n\n &.product-edition {\n padding-top: 50px;\n .product-name-header {\n & + * {\n margin-top: 25px;\n }\n }\n }\n\n &.send-invitation {\n width: 604px;\n img {\n & + * {\n margin-top: 40px;\n }\n }\n p {\n font-family: ", ";\n font-style: normal;\n font-size: 24px;\n color: ", ";\n line-height: 28px;\n span {\n font-family: ", ";\n }\n }\n }\n\n &.upload-image {\n width: 430px;\n padding: 50px;\n img {\n & + * {\n margin-top: 33px;\n }\n }\n .input-name-header {\n & + * {\n margin-top: 20px;\n }\n }\n .list-container {\n & + .general-button-default {\n margin-top: 40px;\n }\n }\n }\n }\n"])), _variables.GlobalColors.white, _variables.GlobalColors.deep_gray, _genericModalClose.default, _variables.GlobalColors.s2, _variables.GlobalColors.white, _variables.FontFamily.Raleway_500, _variables.GlobalColors.white, _variables.FontFamily.Raleway_700);
20
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n position: fixed;\n background-color: rgba(59, 59, 59, 0.53);\n backdrop-filter: blur(4px);\n top: 0;\n left: 0;\n z-index: 100;\n\n .global-styles {\n background-color: ", ";\n height: auto;\n width: auto;\n position: relative;\n border-radius: 15px;\n padding: 40px;\n text-align: center;\n .close-button {\n background-image: url(", ");\n background-color: transparent;\n width: 14px;\n height: 14px;\n cursor: pointer;\n border: none;\n position: absolute;\n right: 20px;\n top: 20px;\n }\n .general-white-button {\n width: 160px;\n height: 40px;\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n & + * {\n margin-left: 45px;\n height: 40px;\n width: 161px;\n }\n }\n\n &.log-out {\n padding-bottom: 60px;\n img {\n & + * {\n margin-top: 20px;\n }\n }\n .with-bold-text {\n font-size: 24px;\n & + * {\n margin-top: 20px;\n }\n }\n }\n\n &.delete-product {\n img {\n height: 50px;\n width: 56px;\n & + * {\n margin-top: 30px;\n }\n }\n .product-name-header,\n .retailer-name-header {\n & + * {\n margin-top: 30px;\n }\n }\n }\n\n &.product-edition {\n padding-top: 50px;\n .product-name-header {\n & + * {\n margin-top: 25px;\n }\n }\n }\n\n &.send-invitation {\n width: 604px;\n img {\n & + * {\n margin-top: 40px;\n }\n }\n p {\n font-family: ", ";\n font-style: normal;\n font-size: 24px;\n color: ", ";\n line-height: 28px;\n span {\n font-family: ", ";\n }\n }\n }\n\n &.upload-image {\n width: 430px;\n padding: 50px;\n img {\n & + * {\n margin-top: 33px;\n }\n }\n .input-name-header {\n & + * {\n margin-top: 20px;\n }\n }\n .list-container {\n & + .general-button-default {\n margin-top: 40px;\n }\n }\n }\n }\n"])), _variables.GlobalColors.white, _variables.GlobalColors.deep_gray, _genericModalClose.default, _variables.GlobalColors.s2, _variables.GlobalColors.white, _variables.FontFamily.Raleway_500, _variables.GlobalColors.white, _variables.FontFamily.Raleway_700);
21
21
 
22
22
  exports.Container = Container;
package/dist/components/atoms/StatusTag/styles.js CHANGED
@@ -15,6 +15,6 @@ 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: 30px;\n height: 20px;\n background-color: ", ";\n border-radius: 3px;\n\n p {\n text-align: center;\n color: ", ";\n font-family: ", ";\n font-size: 12px;\n line-height: 20px;\n }\n\n &.status-As,\n &.status-P {\n background-color: ", ";\n }\n\n &.status-Pr,\n &.status-Rr {\n background-color: ", ";\n }\n\n &.status-AA,\n &.status-AP,\n &.status-AC {\n background-color: ", ";\n }\n\n &.status-RA,\n &.status-RF,\n &.status-RP,\n &.status-RC {\n background-color: ", ";\n }\n\n &.status-Dat,\n &.status-Dsc,\n &.status-Imgs {\n background-color: ", ";\n }\n\n &.status-Ex {\n background-color: ", ";\n }\n\n &.status-DDI {\n background-color: ", ";\n }\n\n &.status-GLD {\n background-color: ", ";\n }\n\n &.status-TAB {\n background-color: ", ";\n }\n\n &.status-Pt {\n background-color: ", ";\n color: ", ";\n }\n\n &.oval-form {\n border-radius: 10px;\n }\n"])), _variables.GlobalColors.s3, _variables.GlobalColors.white, _variables.FontFamily.Lato, _variables.GlobalColors.in_progress, _variables.GlobalColors.reception, _variables.GlobalColors.finished, _variables.GlobalColors.rejected_status, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.original_purpura, _variables.GlobalColors.in_progress, _variables.GlobalColors.deep_gray, _variables.GlobalColors.s2, _variables.GlobalColors.s4);
18
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: fit-content;\n padding: 0 10px;\n height: 20px;\n background-color: ", ";\n border-radius: 3px;\n\n p {\n text-align: center;\n color: ", ";\n font-family: ", ";\n font-size: 12px;\n line-height: 20px;\n }\n\n &.status-As,\n &.status-P,\n &.status-IN_PROGRESS,\n &.status-QF {\n background-color: ", ";\n }\n\n &.status-Pr,\n &.status-Rr {\n background-color: ", ";\n }\n\n &.status-AA,\n &.status-AP,\n &.status-AC {\n background-color: ", ";\n }\n\n &.status-RA,\n &.status-RF,\n &.status-RP,\n &.status-RC {\n background-color: ", ";\n }\n\n &.status-Dat,\n &.status-Dsc,\n &.status-Imgs {\n background-color: ", ";\n }\n\n &.status-Ex {\n background-color: ", ";\n }\n\n &.status-DDI {\n background-color: ", ";\n }\n\n &.status-GLD {\n background-color: ", ";\n }\n\n &.status-TAB {\n background-color: ", ";\n }\n\n &.status-Pt {\n background-color: ", ";\n color: ", ";\n }\n\n &.oval-form {\n border-radius: 10px;\n }\n"])), _variables.GlobalColors.s3, _variables.GlobalColors.white, _variables.FontFamily.Lato, _variables.GlobalColors.in_progress, _variables.GlobalColors.reception, _variables.GlobalColors.finished, _variables.GlobalColors.rejected_status, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.original_purpura, _variables.GlobalColors.in_progress, _variables.GlobalColors.deep_gray, _variables.GlobalColors.s2, _variables.GlobalColors.s4);
19
19
 
20
20
  exports.Container = Container;
package/dist/components/pages/RetailerProductEdition/index.js CHANGED
@@ -119,7 +119,7 @@ var myBucket = new _awsSdk.default.S3({
119
119
  });
120
120
 
121
121
  var RetailerProductEdition = function RetailerProductEdition(_ref) {
122
- var _productSelected$reta, _servicesData$filter$, _servicesData$filter$2, _product$services, _datasheets$, _datasheets$$data, _product$services2, _product$article4, _product$services3;
122
+ var _productSelected$reta, _product$services, _datasheets$, _datasheets$$data, _product$services2, _product$article4, _product$services3;
123
123
 
124
124
  var tabsSections = _ref.tabsSections,
125
125
  _ref$productSelected = _ref.productSelected,
@@ -656,20 +656,21 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
656
656
  });
657
657
 
658
658
  case 4:
659
- _context6.next = 9;
659
+ setMessage("Descripciones guardadas con éxito");
660
+ _context6.next = 10;
660
661
  break;
661
662
 
662
- case 6:
663
- _context6.prev = 6;
663
+ case 7:
664
+ _context6.prev = 7;
664
665
  _context6.t0 = _context6["catch"](1);
665
666
  console.log(_context6.t0);
666
667
 
667
- case 9:
668
+ case 10:
668
669
  case "end":
669
670
  return _context6.stop();
670
671
  }
671
672
  }
672
- }, _callee6, null, [[1, 6]]);
673
+ }, _callee6, null, [[1, 7]]);
673
674
  }));
674
675
 
675
676
  return function saveDescriptions() {
@@ -699,20 +700,21 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
699
700
  });
700
701
 
701
702
  case 4:
702
- _context7.next = 9;
703
+ setMessage("Fichas técnicas guardadas con éxito");
704
+ _context7.next = 10;
703
705
  break;
704
706
 
705
- case 6:
706
- _context7.prev = 6;
707
+ case 7:
708
+ _context7.prev = 7;
707
709
  _context7.t0 = _context7["catch"](1);
708
710
  console.log(_context7.t0);
709
711
 
710
- case 9:
712
+ case 10:
711
713
  case "end":
712
714
  return _context7.stop();
713
715
  }
714
716
  }
715
- }, _callee7, null, [[1, 6]]);
717
+ }, _callee7, null, [[1, 7]]);
716
718
  }));
717
719
 
718
720
  return function saveDatasheets() {
@@ -1416,9 +1418,9 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
1416
1418
  if (selectedImages.length > 0) {
1417
1419
  setMessage("¿Está seguro de eliminar las imágenes seleccionadas?");
1418
1420
  setComponentsArray([/*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
1419
- text: "",
1420
- Paragraph: "¿Está seguro de eliminar las imágenes seleccionadas?",
1421
- headerType: "header-and-paragraph"
1421
+ text: "¿Está seguro de eliminar las imágenes seleccionadas?",
1422
+ headerType: "retailer-name-header",
1423
+ color: "white"
1422
1424
  }, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
1423
1425
  buttonType: "general-white-button",
1424
1426
  label: "Cancelar",
@@ -1475,12 +1477,8 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
1475
1477
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
1476
1478
  tabsSections: tabsSections,
1477
1479
  status: {
1478
- Descripción: (_servicesData$filter$ = servicesData.filter(function (service) {
1479
- return service.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && service.service === "description";
1480
- })[0]) === null || _servicesData$filter$ === void 0 ? void 0 : _servicesData$filter$.status,
1481
- "Ficha técnica": (_servicesData$filter$2 = servicesData.filter(function (service) {
1482
- return service.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && service.service === "datasheet";
1483
- })[0]) === null || _servicesData$filter$2 === void 0 ? void 0 : _servicesData$filter$2.status,
1480
+ Descripción: product === null || product === void 0 ? void 0 : product.description_status,
1481
+ "Ficha técnica": product === null || product === void 0 ? void 0 : product.datasheet_status,
1484
1482
  Imágenes: product === null || product === void 0 ? void 0 : product.images_status
1485
1483
  },
1486
1484
  activeTab: activeTab,
@@ -1608,8 +1606,11 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
1608
1606
  sendToFacilitator: sendToFacilitator,
1609
1607
  approveRejectButtons: approveRejectButtons
1610
1608
  }), message.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
1609
+ buttonType: "delete-product",
1611
1610
  componentsArray: componentsArray.length > 0 ? componentsArray : [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
1612
- text: message
1611
+ headerType: "retailer-name-header",
1612
+ text: message,
1613
+ color: "white"
1613
1614
  }, "1")],
1614
1615
  onClick: function onClick() {
1615
1616
  return setMessage("");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "contentoh-components-library",
3
- "version": "19.0.0",
3
+ "version": "21.0.1",
4
4
  "dependencies": {
5
5
  "@babel/runtime": "^7.17.2",
6
6
  "@storybook/addon-postcss": "^2.0.0",
package/src/components/atoms/GenericModal/styles.js CHANGED
@@ -71,9 +71,10 @@ export const Container = styled.div`
71
71
  margin-top: 30px;
72
72
  }
73
73
  }
74
- .product-name-header {
74
+ .product-name-header,
75
+ .retailer-name-header {
75
76
  & + * {
76
- margin-bottom: 30px;
77
+ margin-top: 30px;
77
78
  }
78
79
  }
79
80
  }
package/src/components/atoms/StatusTag/styles.js CHANGED
@@ -2,7 +2,8 @@ import styled from "styled-components";
2
2
  import { FontFamily, GlobalColors } from "../../../global-files/variables";
3
3
 
4
4
  export const Container = styled.div`
5
- width: 30px;
5
+ width: fit-content;
6
+ padding: 0 10px;
6
7
  height: 20px;
7
8
  background-color: ${GlobalColors.s3};
8
9
  border-radius: 3px;
@@ -16,7 +17,9 @@ export const Container = styled.div`
16
17
  }
17
18
 
18
19
  &.status-As,
19
- &.status-P {
20
+ &.status-P,
21
+ &.status-IN_PROGRESS,
22
+ &.status-QF {
20
23
  background-color: ${GlobalColors.in_progress};
21
24
  }
22
25
 
package/src/components/pages/RetailerProductEdition/index.js CHANGED
@@ -355,6 +355,7 @@ export const RetailerProductEdition = ({
355
355
  },
356
356
  }
357
357
  );
358
+ setMessage("Descripciones guardadas con éxito");
358
359
  } catch (error) {
359
360
  console.log(error);
360
361
  }
@@ -375,6 +376,7 @@ export const RetailerProductEdition = ({
375
376
  },
376
377
  }
377
378
  );
379
+ setMessage("Fichas técnicas guardadas con éxito");
378
380
  } catch (error) {
379
381
  console.log(error);
380
382
  }
@@ -925,9 +927,9 @@ export const RetailerProductEdition = ({
925
927
  setComponentsArray([
926
928
  <ScreenHeader
927
929
  key={"1"}
928
- text={""}
929
- Paragraph={"¿Está seguro de eliminar las imágenes seleccionadas?"}
930
- headerType="header-and-paragraph"
930
+ text={"¿Está seguro de eliminar las imágenes seleccionadas?"}
931
+ headerType="retailer-name-header"
932
+ color={"white"}
931
933
  />,
932
934
  <Button
933
935
  key={"2"}
@@ -982,16 +984,8 @@ export const RetailerProductEdition = ({
982
984
  <FullTabsMenu
983
985
  tabsSections={tabsSections}
984
986
  status={{
985
- Descripción: servicesData.filter(
986
- (service) =>
987
- service.id_retailer === activeRetailer?.id &&
988
- service.service === "description"
989
- )[0]?.status,
990
- "Ficha técnica": servicesData.filter(
991
- (service) =>
992
- service.id_retailer === activeRetailer?.id &&
993
- service.service === "datasheet"
994
- )[0]?.status,
987
+ Descripción: product?.description_status,
988
+ "Ficha técnica": product?.datasheet_status,
995
989
  Imágenes: product?.images_status,
996
990
  }}
997
991
  activeTab={activeTab}
@@ -1145,10 +1139,18 @@ export const RetailerProductEdition = ({
1145
1139
  )}
1146
1140
  {message.length > 0 && (
1147
1141
  <GenericModal
1142
+ buttonType={"delete-product"}
1148
1143
  componentsArray={
1149
1144
  componentsArray.length > 0
1150
1145
  ? componentsArray
1151
- : [<ScreenHeader key="1" text={message} />]
1146
+ : [
1147
+ <ScreenHeader
1148
+ key="1"
1149
+ headerType={"retailer-name-header"}
1150
+ text={message}
1151
+ color={"white"}
1152
+ />,
1153
+ ]
1152
1154
  }
1153
1155
  onClick={() => setMessage("")}
1154
1156
  />