contentoh-components-library 21.3.97 → 21.3.99

package/dist/index.js

@@ -524,7 +524,7 @@ Object.keys(_index40).forEach(function (key) {
   });
 });
 
-var _index41 = require("./components/molecules/AvatarAndValidation/index");
+var _index41 = require("./components/atoms/RetailerCatalog/index");
 
 Object.keys(_index41).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -537,33 +537,33 @@ Object.keys(_index41).forEach(function (key) {
   });
 });
 
-var _CarouselImagesLogin = require("./components/molecules/CarouselImagesLogin");
+var _index42 = require("./components/molecules/AvatarAndValidation/index");
 
-Object.keys(_CarouselImagesLogin).forEach(function (key) {
+Object.keys(_index42).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CarouselImagesLogin[key]) return;
+  if (key in exports && exports[key] === _index42[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _CarouselImagesLogin[key];
+      return _index42[key];
     }
   });
 });
 
-var _index42 = require("./components/molecules/EditionActiveImage/index");
+var _CarouselImagesLogin = require("./components/molecules/CarouselImagesLogin");
 
-Object.keys(_index42).forEach(function (key) {
+Object.keys(_CarouselImagesLogin).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _index42[key]) return;
+  if (key in exports && exports[key] === _CarouselImagesLogin[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _index42[key];
+      return _CarouselImagesLogin[key];
     }
   });
 });
 
-var _index43 = require("./components/molecules/EmailResetPasswordLogin/index");
+var _index43 = require("./components/molecules/EditionActiveImage/index");
 
 Object.keys(_index43).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -576,7 +576,7 @@ Object.keys(_index43).forEach(function (key) {
   });
 });
 
-var _index44 = require("./components/molecules/FeaturesBar/index");
+var _index44 = require("./components/molecules/EmailResetPasswordLogin/index");
 
 Object.keys(_index44).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -589,7 +589,7 @@ Object.keys(_index44).forEach(function (key) {
   });
 });
 
-var _index45 = require("./components/molecules/GalleryElement/index");
+var _index45 = require("./components/molecules/FeaturesBar/index");
 
 Object.keys(_index45).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -602,7 +602,7 @@ Object.keys(_index45).forEach(function (key) {
   });
 });
 
-var _index46 = require("./components/molecules/HeaderTop/index");
+var _index46 = require("./components/molecules/GalleryElement/index");
 
 Object.keys(_index46).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -615,7 +615,7 @@ Object.keys(_index46).forEach(function (key) {
   });
 });
 
-var _index47 = require("./components/molecules/ImageSelector/index");
+var _index47 = require("./components/molecules/HeaderTop/index");
 
 Object.keys(_index47).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -628,7 +628,7 @@ Object.keys(_index47).forEach(function (key) {
   });
 });
 
-var _index48 = require("./components/molecules/LoginPasswordStrength/index");
+var _index48 = require("./components/molecules/ImageSelector/index");
 
 Object.keys(_index48).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -641,7 +641,7 @@ Object.keys(_index48).forEach(function (key) {
   });
 });
 
-var _index49 = require("./components/molecules/LogoLoading/index");
+var _index49 = require("./components/molecules/LoginPasswordStrength/index");
 
 Object.keys(_index49).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -654,7 +654,7 @@ Object.keys(_index49).forEach(function (key) {
   });
 });
 
-var _index50 = require("./components/molecules/PlanSelection/index");
+var _index50 = require("./components/molecules/LogoLoading/index");
 
 Object.keys(_index50).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -667,7 +667,7 @@ Object.keys(_index50).forEach(function (key) {
   });
 });
 
-var _index51 = require("./components/molecules/ProductNameHeader/index");
+var _index51 = require("./components/molecules/PlanSelection/index");
 
 Object.keys(_index51).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -680,7 +680,7 @@ Object.keys(_index51).forEach(function (key) {
   });
 });
 
-var _index52 = require("./components/molecules/RegistrationFirstStep/index");
+var _index52 = require("./components/molecules/ProductNameHeader/index");
 
 Object.keys(_index52).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -693,7 +693,7 @@ Object.keys(_index52).forEach(function (key) {
   });
 });
 
-var _index53 = require("./components/molecules/RegistrationSecondStep/index");
+var _index53 = require("./components/molecules/RegistrationFirstStep/index");
 
 Object.keys(_index53).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -706,7 +706,7 @@ Object.keys(_index53).forEach(function (key) {
   });
 });
 
-var _index54 = require("./components/molecules/RegistrationThirdStep/index");
+var _index54 = require("./components/molecules/RegistrationSecondStep/index");
 
 Object.keys(_index54).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -719,7 +719,7 @@ Object.keys(_index54).forEach(function (key) {
   });
 });
 
-var _index55 = require("./components/molecules/SignInLogin/index");
+var _index55 = require("./components/molecules/RegistrationThirdStep/index");
 
 Object.keys(_index55).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -732,7 +732,7 @@ Object.keys(_index55).forEach(function (key) {
   });
 });
 
-var _index56 = require("./components/molecules/StatusAsignationInfo/index");
+var _index56 = require("./components/molecules/SignInLogin/index");
 
 Object.keys(_index56).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -745,7 +745,7 @@ Object.keys(_index56).forEach(function (key) {
   });
 });
 
-var _index57 = require("./components/molecules/TableHeader/index");
+var _index57 = require("./components/molecules/StatusAsignationInfo/index");
 
 Object.keys(_index57).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -758,7 +758,7 @@ Object.keys(_index57).forEach(function (key) {
   });
 });
 
-var _index58 = require("./components/molecules/TableRow/index");
+var _index58 = require("./components/molecules/TableHeader/index");
 
 Object.keys(_index58).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -771,7 +771,7 @@ Object.keys(_index58).forEach(function (key) {
   });
 });
 
-var _index59 = require("./components/molecules/TabsMenu/index");
+var _index59 = require("./components/molecules/TableRow/index");
 
 Object.keys(_index59).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -784,7 +784,7 @@ Object.keys(_index59).forEach(function (key) {
   });
 });
 
-var _index60 = require("./components/molecules/TagAndInput/index");
+var _index60 = require("./components/molecules/TabsMenu/index");
 
 Object.keys(_index60).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -797,7 +797,7 @@ Object.keys(_index60).forEach(function (key) {
   });
 });
 
-var _index61 = require("./components/molecules/VerificationCodeResetPasswordLogin/index");
+var _index61 = require("./components/molecules/TagAndInput/index");
 
 Object.keys(_index61).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -810,7 +810,7 @@ Object.keys(_index61).forEach(function (key) {
   });
 });
 
-var _index62 = require("./components/molecules/RetailerSelector/index");
+var _index62 = require("./components/molecules/VerificationCodeResetPasswordLogin/index");
 
 Object.keys(_index62).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -823,7 +823,7 @@ Object.keys(_index62).forEach(function (key) {
   });
 });
 
-var _index63 = require("./components/molecules/CustomSelect/index");
+var _index63 = require("./components/molecules/RetailerSelector/index");
 
 Object.keys(_index63).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -836,7 +836,7 @@ Object.keys(_index63).forEach(function (key) {
   });
 });
 
-var _index64 = require("./components/molecules/ButtonDownloadFile/index");
+var _index64 = require("./components/molecules/CustomSelect/index");
 
 Object.keys(_index64).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -849,7 +849,7 @@ Object.keys(_index64).forEach(function (key) {
   });
 });
 
-var _index65 = require("./components/molecules/ImageTooltip/index");
+var _index65 = require("./components/molecules/ButtonDownloadFile/index");
 
 Object.keys(_index65).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -862,7 +862,7 @@ Object.keys(_index65).forEach(function (key) {
   });
 });
 
-var _index66 = require("./components/molecules/SelectV2/index");
+var _index66 = require("./components/molecules/ImageTooltip/index");
 
 Object.keys(_index66).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -875,7 +875,7 @@ Object.keys(_index66).forEach(function (key) {
   });
 });
 
-var _index67 = require("./components/molecules/Dropdown/index");
+var _index67 = require("./components/molecules/SelectV2/index");
 
 Object.keys(_index67).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -888,7 +888,7 @@ Object.keys(_index67).forEach(function (key) {
   });
 });
 
-var _index68 = require("./components/molecules/StripeCardForm/index");
+var _index68 = require("./components/molecules/Dropdown/index");
 
 Object.keys(_index68).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -901,7 +901,7 @@ Object.keys(_index68).forEach(function (key) {
   });
 });
 
-var _index69 = require("./components/molecules/StripeCardSelector/index");
+var _index69 = require("./components/molecules/StripeCardForm/index");
 
 Object.keys(_index69).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -914,7 +914,7 @@ Object.keys(_index69).forEach(function (key) {
   });
 });
 
-var _index70 = require("./components/molecules/GridItem/index");
+var _index70 = require("./components/molecules/StripeCardSelector/index");
 
 Object.keys(_index70).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -927,7 +927,7 @@ Object.keys(_index70).forEach(function (key) {
   });
 });
 
-var _index71 = require("./components/molecules/HeaderItem/index");
+var _index71 = require("./components/molecules/GridItem/index");
 
 Object.keys(_index71).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -940,7 +940,7 @@ Object.keys(_index71).forEach(function (key) {
   });
 });
 
-var _index72 = require("./components/molecules/RowItem/index");
+var _index72 = require("./components/molecules/HeaderItem/index");
 
 Object.keys(_index72).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -953,7 +953,7 @@ Object.keys(_index72).forEach(function (key) {
   });
 });
 
-var _index73 = require("./components/organisms/ChangePassword/index");
+var _index73 = require("./components/molecules/RowItem/index");
 
 Object.keys(_index73).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -966,7 +966,7 @@ Object.keys(_index73).forEach(function (key) {
   });
 });
 
-var _index74 = require("./components/organisms/Fullplan/index");
+var _index74 = require("./components/organisms/ChangePassword/index");
 
 Object.keys(_index74).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -979,7 +979,7 @@ Object.keys(_index74).forEach(function (key) {
   });
 });
 
-var _index75 = require("./components/organisms/FullProductNameHeader/index");
+var _index75 = require("./components/organisms/Fullplan/index");
 
 Object.keys(_index75).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -992,7 +992,7 @@ Object.keys(_index75).forEach(function (key) {
   });
 });
 
-var _index76 = require("./components/organisms/FullTabsMenu/index");
+var _index76 = require("./components/organisms/FullProductNameHeader/index");
 
 Object.keys(_index76).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1005,7 +1005,7 @@ Object.keys(_index76).forEach(function (key) {
   });
 });
 
-var _index77 = require("./components/organisms/ImageDataTable/index");
+var _index77 = require("./components/organisms/FullTabsMenu/index");
 
 Object.keys(_index77).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1018,7 +1018,7 @@ Object.keys(_index77).forEach(function (key) {
   });
 });
 
-var _index78 = require("./components/organisms/ImagePreviewer/index");
+var _index78 = require("./components/organisms/ImageDataTable/index");
 
 Object.keys(_index78).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1031,7 +1031,7 @@ Object.keys(_index78).forEach(function (key) {
   });
 });
 
-var _index79 = require("./components/organisms/ImagesGroup/index");
+var _index79 = require("./components/organisms/ImagePreviewer/index");
 
 Object.keys(_index79).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1044,7 +1044,7 @@ Object.keys(_index79).forEach(function (key) {
   });
 });
 
-var _index80 = require("./components/organisms/InputGroup/index");
+var _index80 = require("./components/organisms/ImagesGroup/index");
 
 Object.keys(_index80).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1057,7 +1057,7 @@ Object.keys(_index80).forEach(function (key) {
   });
 });
 
-var _index81 = require("./components/organisms/ProductImageModal/index");
+var _index81 = require("./components/organisms/InputGroup/index");
 
 Object.keys(_index81).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1070,7 +1070,7 @@ Object.keys(_index81).forEach(function (key) {
   });
 });
 
-var _index82 = require("./components/organisms/Chat/index");
+var _index82 = require("./components/organisms/ProductImageModal/index");
 
 Object.keys(_index82).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1083,7 +1083,7 @@ Object.keys(_index82).forEach(function (key) {
   });
 });
 
-var _index83 = require("./components/organisms/Modal/index");
+var _index83 = require("./components/organisms/Chat/index");
 
 Object.keys(_index83).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1096,7 +1096,7 @@ Object.keys(_index83).forEach(function (key) {
   });
 });
 
-var _index84 = require("./components/organisms/OrderDetail/index");
+var _index84 = require("./components/organisms/Modal/index");
 
 Object.keys(_index84).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1109,6 +1109,19 @@ Object.keys(_index84).forEach(function (key) {
   });
 });
 
+var _index85 = require("./components/organisms/OrderDetail/index");
+
+Object.keys(_index85).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _index85[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _index85[key];
+    }
+  });
+});
+
 var _RangeCalendar = require("./components/organisms/RangeCalendar");
 
 Object.keys(_RangeCalendar).forEach(function (key) {
@@ -1135,28 +1148,28 @@ Object.keys(_TableResizable).forEach(function (key) {
   });
 });
 
-var _index85 = require("./components/organisms/SideModal/index");
+var _index86 = require("./components/organisms/SideModal/index");
 
-Object.keys(_index85).forEach(function (key) {
+Object.keys(_index86).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _index85[key]) return;
+  if (key in exports && exports[key] === _index86[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _index85[key];
+      return _index86[key];
     }
   });
 });
 
-var _index86 = require("./components/organisms/GridProducts/index");
+var _index87 = require("./components/organisms/GridProducts/index");
 
-Object.keys(_index86).forEach(function (key) {
+Object.keys(_index87).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _index86[key]) return;
+  if (key in exports && exports[key] === _index87[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _index86[key];
+      return _index87[key];
     }
   });
 });

package/package.json

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

package/src/components/atoms/RetailerCatalog/index.js

@@ -16,13 +16,12 @@ export const RetailerCatalog = ({
 
   useEffect(() => {
     setRetLimit(limit);
-    console.log("limit");
   }, [retailers]);
 
   return (
     <Container
-      id={id}
-      onClick={() => {
+      onClick={(e) => {
+        e.stopPropagation();
         setShowRetailers(true);
       }}
     >
@@ -43,7 +42,7 @@ export const RetailerCatalog = ({
         </div>
       )}
       {showRetailers && (
-        <RetailersList retailers={retailers} article={article} />
+        <RetailersList retailers={retailers} article={article} id={id} />
       )}
     </Container>
   );

package/src/components/atoms/RetailersList/index.js

@@ -3,7 +3,7 @@ import { RetailerOption } from "../RetailerOption";
 import { useState, useEffect } from "react";
 import axios from "axios";
 
-export const RetailersList = ({ retailers, article }) => {
+export const RetailersList = ({ retailers, article, id }) => {
   const [services, setServices] = useState({});
 
   useEffect(() => {
@@ -11,7 +11,7 @@ export const RetailersList = ({ retailers, article }) => {
   }, [article]);
 
   return (
-    <Container>
+    <Container id={id}>
       {retailers.map((retailer, i) => (
         <RetailerOption key={i} retailer={retailer} services={services} />
       ))}

package/src/components/atoms/UserCatalog/UserCatalog.stories.js

@@ -8,6 +8,7 @@ export default {
 const Template = (args) => <UserCatalog {...args} />;
 export const UserCatalogDefault = Template.bind({});
 UserCatalogDefault.args = {
+  product: "product",
   datasheet: 54,
   description: 54,
   images: 55,

package/src/components/atoms/UserCatalog/index.js

@@ -2,8 +2,8 @@ import { Container } from "./styles";
 import { Avatar } from "../Avatar";
 import { getProfilePicture } from "../../../global-files/data";
 import { UserOption } from "../UserOption";
-import { useState } from "react";
 import { useCloseModal } from "../../../global-files/customHooks";
+import { useState } from "react";
 import { useEffect } from "react";
 
 export const UserCatalog = ({
@@ -15,11 +15,18 @@ export const UserCatalog = ({
   textSpecialists = [],
   imagesSpecialists = [],
   id = "list-modal",
+  onAssign,
+  product,
 }) => {
   const [showList, setShowList] = useCloseModal(id);
 
   return (
-    <Container onClick={() => setShowList(true)} id={id}>
+    <Container
+      id={id}
+      onClick={() => {
+        setShowList(true);
+      }}
+    >
       {datasheet && (
         <Avatar
           image={getProfilePicture(datasheet, 26, 26)}
@@ -51,24 +58,36 @@ export const UserCatalog = ({
       {showList && (
         <div className="users-assigned-list">
           <UserOption
+            onAssign={onAssign}
+            product={product}
             userId={datasheet}
             usersArray={textSpecialists}
             id={id + "-" + datasheet}
+            index={"datasheet"}
           />
           <UserOption
+            onAssign={onAssign}
+            product={product}
             userId={description}
             usersArray={textSpecialists}
             id={id + "-" + description}
+            index={"description"}
           />
           <UserOption
+            onAssign={onAssign}
+            product={product}
             userId={images}
             usersArray={imagesSpecialists}
             id={id + "-" + images}
+            index={"image"}
           />
           <UserOption
+            onAssign={onAssign}
+            product={product}
             userId={auditor}
             usersArray={auditors}
             id={id + "-" + auditor}
+            index={"auditor"}
           />
         </div>
       )}

package/src/components/atoms/UserOption/index.js

@@ -7,9 +7,20 @@ import { servicesCodeIcon } from "../../organisms/OrderDetail/utils/Table/utils"
 import { UserSelector } from "../UserSelector";
 import { useCloseModal } from "../../../global-files/customHooks";
 
-export const UserOption = ({ userId, index, usersArray, id }) => {
+export const UserOption = ({
+  userId,
+  index,
+  usersArray,
+  id,
+  onAssign,
+  product,
+}) => {
   const [userAssigned, setUserAssigned] = useState({});
   const [showSelector, setShowSelector] = useCloseModal(id);
+  const [assignationTarget, setAssignationTarget] = useState("");
+  const [concept, setConcept] = useState("");
+  const [target, setTarget] = useState("");
+
   const icons = servicesCodeIcon;
 
   useEffect(() => {
@@ -22,6 +33,29 @@ export const UserOption = ({ userId, index, usersArray, id }) => {
     }
   }, [userId, usersArray]);
 
+  useEffect(() => {
+    switch (index) {
+      case "datasheet":
+      case "description":
+        setAssignationTarget(`id_${index}_specialist`);
+        setConcept(index);
+        setTarget("specialist");
+        break;
+      case "image":
+        setAssignationTarget(`id_${index}s_specialist`);
+        setConcept(index + "s");
+        setTarget("specialist");
+        break;
+      case "auditor":
+        setAssignationTarget(`id_${index}`);
+        setConcept(index);
+        setTarget(index);
+        break;
+      default:
+        break;
+    }
+  }, [index]);
+
   return (
     <Container onClick={() => setShowSelector(true)}>
       <div className="image-and-name">
@@ -42,6 +76,11 @@ export const UserOption = ({ userId, index, usersArray, id }) => {
           index={index}
           usersArray={usersArray}
           position="absolute"
+          onAssign={onAssign}
+          product={product}
+          assignationTarget={assignationTarget}
+          target={target}
+          concept={concept}
         />
       )}
     </Container>

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

@@ -14,7 +14,6 @@ export const Container = styled.div`
   cursor: pointer;
   position: relative;
   background-color: white;
-  width: 217px;
 
   .image-and-name {
     display: flex;
@@ -22,6 +21,11 @@ export const Container = styled.div`
 
     div + p {
       margin-left: 10px;
+      white-space: nowrap;
+    }
+
+    & + * {
+      margin-left: 10px;
     }
   }
 
@@ -38,6 +42,9 @@ export const Container = styled.div`
         top: 50%;
         transform: translateY(-50%);
         white-space: nowrap;
+        border: 1px solid #f0f0f0;
+        padding: 5px;
+        background-color: white;
       }
 
       &:hover {