odaptos_design_system 1.4.269 → 1.4.270

package/dist/odaptos_design_system.esm.js

@@ -10417,7 +10417,7 @@ const Chat = ({
         taskTitleTooltip: realTask.description,
         url: realTask.url,
         notes: realTask.notes,
-        state: idsTasksAlreadySent.includes(realTask._id) && realCurrentTask._id !== realTask._id || disabledTask ? 'disabled' : realCurrentTask && realCurrentTask._id === realTask._id ? 'active' : 'idle',
+        state: idsTasksAlreadySent.includes(realTask._id) && realCurrentTask._id !== realTask._id ? 'done' : disabledTask ? 'disabled' : realCurrentTask && realCurrentTask._id === realTask._id ? 'active' : 'idle',
         task: realTask,
         sendTask: () => {
           if (realTask.type === 'task' || realTask.type === 'question') sendTask(realTask);else if (startInterview && realTask.type === 'scenario') startInterview(realTask);else return;
@@ -10429,6 +10429,7 @@ const Chat = ({
       const scenario = isInterviewer ? task : JSON.parse(task.body);
       return /*#__PURE__*/React.createElement(Scenario, {
         title: `Scenario #${scenario.index}`,
+        scenarioName: scenario.name,
         description: scenario.description,
         buttonText: scenario.url ? startInterviewBtnTitle : undefined,
         buttonIcon: scenario.url ? startInterviewIcon : undefined,
@@ -10785,12 +10786,13 @@ const MarkUpBar = ({
   }, "\uD83D\uDC4E\uD83C\uDFFC")));
 };
 
-var css_248z$p = ".Scenario-modules_start_interview_container__-ZSxv{align-items:flex-start;align-self:stretch;background:#e5f1ff;border:1px solid #66adff;border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;padding:.5rem .75rem}.Scenario-modules_start_interview_container__-ZSxv a,.Scenario-modules_start_interview_container__-ZSxv a button{width:100%}";
-var styles$p = {"start_interview_container":"Scenario-modules_start_interview_container__-ZSxv"};
+var css_248z$p = ".Scenario-modules_start_interview_container__-ZSxv{align-items:flex-start;align-self:stretch;background:#e5f1ff;border:1px solid #66adff;border-radius:.5rem;display:flex;flex-direction:column;padding:.5rem .75rem}.Scenario-modules_start_interview_container__-ZSxv .Scenario-modules_description__7GYoK,.Scenario-modules_start_interview_container__-ZSxv .Scenario-modules_name__-kP5a{margin-top:.37rem}.Scenario-modules_start_interview_container__-ZSxv button{margin-top:.5rem;width:100%}";
+var styles$p = {"start_interview_container":"Scenario-modules_start_interview_container__-ZSxv","name":"Scenario-modules_name__-kP5a","description":"Scenario-modules_description__7GYoK"};
 styleInject(css_248z$p);
 
 const Scenario = ({
   title,
+  scenarioName,
   description,
   buttonText,
   buttonIcon,
@@ -10803,10 +10805,15 @@ const Scenario = ({
     className: styles$p.start_interview_container
   }, props), /*#__PURE__*/React.createElement(Text, {
     text: title,
-    weight: "bold"
-  }), /*#__PURE__*/React.createElement(Text, {
+    size: "xs"
+  }), scenarioName && /*#__PURE__*/React.createElement(Text, {
+    text: scenarioName,
+    weight: "bold",
+    className: styles$p.name
+  }), description && /*#__PURE__*/React.createElement(Text, {
     text: description,
-    size: "sm"
+    size: "sm",
+    className: styles$p.description
   }), buttonIcon && buttonText && /*#__PURE__*/React.createElement(Button, {
     text: buttonText,
     iconRight: buttonIcon ?? /*#__PURE__*/React.createElement(SendIcon, null),
@@ -10815,20 +10822,10 @@ const Scenario = ({
   }));
 };
 
-var css_248z$q = ".Task-modules_task_container__Iaqc-{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM{max-width:100%}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_left__JJTGR{height:100%}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_left__JJTGR:hover{background:var(--color-neutral-clear-shades-150,#eee);border-radius:.5rem 0 0 .5rem}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_right__AymtU:hover{background:var(--color-neutral-clear-shades-150,#eee);border-radius:0 .5rem .5rem 0}.Task-modules_header__f15OM{align-items:center;display:flex;height:100%;justify-content:space-between;max-width:100%;width:100%}.Task-modules_header_left_interviewer__WHqee{align-items:flex-start;cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-width:calc(100% - 3.5rem);padding:.3125rem .3125rem .3125rem .62rem;width:100%}.Task-modules_header_left_interviewer__WHqee .Task-modules_title__-OmPh{max-width:98%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Task-modules_header_left_interviewee__TmMkM{align-items:flex-start;display:flex;flex-direction:column;justify-content:center;min-width:calc(100% - 3.5rem);padding:.3125rem .3125rem .3125rem .62rem;width:100%}.Task-modules_header_left_interviewee__TmMkM .Task-modules_title__-OmPh{max-width:98%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Task-modules_header_right__AymtU{align-items:center;background:var(--color-neutral-basics-white,#fff);border:none;border-left:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:0 .5rem .5rem 0;display:flex;gap:.5rem;height:100%;justify-content:center;max-width:calc(100% - 3.5rem);padding:1.4rem .75rem}.Task-modules_header_right__AymtU svg{fill:#000;height:1rem;width:1rem}.Task-modules_clickable__BIHxK{cursor:pointer}.Task-modules_disabled_task__NI6LL{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);border-radius:.5rem;cursor:not-allowed;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM{max-width:100%;width:100%}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM .Task-modules_header_left__JJTGR{border-color:var(--color-neutral-clear-shades-300,#d5d5d6);cursor:not-allowed;opacity:.5;width:100%}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM .Task-modules_header_right__AymtU{border-color:var(--color-neutral-clear-shades-300,#d5d5d6);cursor:not-allowed;opacity:.5}.Task-modules_active_task__l-n9Q{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid #07f;border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM{border-bottom:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);max-width:100%;width:100%}.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM .Task-modules_header_left__JJTGR,.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM .Task-modules_header_right__AymtU{border-color:var(--color-neutral-clear-shades-300,#d5d5d6)}.Task-modules_taskContent__v3Cm1{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:.5rem;padding:.5rem .75rem .25rem}.Task-modules_taskPopover__S07XU{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:.5rem;display:flex;flex-direction:column;overflow:hidden;padding:.5rem .75rem .75rem}.Task-modules_notesContainer__dz0Me{align-items:flex-start;align-self:stretch;border-top:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);display:flex;flex-direction:column;gap:.25rem;padding-top:.5rem}.Task-modules_actionBtnsContainer__Dz-1j{align-items:flex-start;align-self:stretch;display:flex;gap:.5rem;justify-content:flex-end;padding-top:8px}.Task-modules_popover_paper__Re-kl .Task-modules_MuiPopover-paper__7p4Tk,.Task-modules_popover_paper__Re-kl .Task-modules_MuiPopover-root__w6O-O{background:transparent;border-radius:.5rem}";
-var styles$q = {"task_container":"Task-modules_task_container__Iaqc-","header":"Task-modules_header__f15OM","header_left":"Task-modules_header_left__JJTGR","header_right":"Task-modules_header_right__AymtU","header_left_interviewer":"Task-modules_header_left_interviewer__WHqee","title":"Task-modules_title__-OmPh","header_left_interviewee":"Task-modules_header_left_interviewee__TmMkM","clickable":"Task-modules_clickable__BIHxK","disabled_task":"Task-modules_disabled_task__NI6LL","active_task":"Task-modules_active_task__l-n9Q","taskContent":"Task-modules_taskContent__v3Cm1","taskPopover":"Task-modules_taskPopover__S07XU","notesContainer":"Task-modules_notesContainer__dz0Me","actionBtnsContainer":"Task-modules_actionBtnsContainer__Dz-1j","popover_paper":"Task-modules_popover_paper__Re-kl","MuiPopover-root":"Task-modules_MuiPopover-root__w6O-O","MuiPopover-paper":"Task-modules_MuiPopover-paper__7p4Tk"};
+var css_248z$q = ".Task-modules_task_container__Iaqc-{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM{max-width:100%}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_left__JJTGR{height:100%}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_left__JJTGR:hover{background:var(--color-neutral-clear-shades-150,#eee);border-radius:.5rem 0 0 .5rem}.Task-modules_task_container__Iaqc- .Task-modules_header__f15OM .Task-modules_header_right__AymtU:hover{background:var(--color-neutral-clear-shades-150,#eee);border-radius:0 .5rem .5rem 0}.Task-modules_header__f15OM{align-items:center;display:flex;height:100%;justify-content:space-between;max-width:100%;width:100%}.Task-modules_header_left_interviewer__WHqee{align-items:flex-start;cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-width:calc(100% - 3.5rem);padding:.3125rem .3125rem .3125rem .62rem;width:100%}.Task-modules_header_left_interviewer__WHqee .Task-modules_title__-OmPh{max-width:98%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Task-modules_header_left_interviewee__TmMkM{align-items:flex-start;display:flex;flex-direction:column;justify-content:center;min-width:calc(100% - 3.5rem);padding:.3125rem .3125rem .3125rem .62rem;width:100%}.Task-modules_header_left_interviewee__TmMkM .Task-modules_title__-OmPh{max-width:98%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Task-modules_header_right__AymtU{align-items:center;background:var(--color-neutral-basics-white,#fff);border:none;border-left:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:0 .5rem .5rem 0;display:flex;gap:.5rem;height:100%;justify-content:center;max-width:calc(100% - 3.5rem);padding:1.1rem .75rem}.Task-modules_header_right__AymtU svg{fill:#000;height:1rem;width:1rem}.Task-modules_clickable__BIHxK{cursor:pointer}.Task-modules_disabled_task__NI6LL{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);border-radius:.5rem;cursor:not-allowed;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM{max-width:100%;width:100%}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM .Task-modules_header_left__JJTGR{border-color:var(--color-neutral-clear-shades-300,#d5d5d6);cursor:not-allowed;opacity:.5;width:100%}.Task-modules_disabled_task__NI6LL .Task-modules_header__f15OM .Task-modules_header_right__AymtU{border-color:var(--color-neutral-clear-shades-300,#d5d5d6);cursor:not-allowed;opacity:.5}.Task-modules_done_task__aVaiY{align-items:flex-start;background:var(--Color-Extended-Green-100,#e8f5ea);border:1px solid var(--Color-Neutral-Dark-Shades-950,#26292e);border-radius:.5rem;cursor:not-allowed;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_done_task__aVaiY .Task-modules_header__f15OM{max-width:100%;width:100%}.Task-modules_done_task__aVaiY .Task-modules_header__f15OM .Task-modules_header_left__JJTGR{border:1px solid var(--Color-Neutral-Dark-Shades-950,#26292e);cursor:not-allowed;width:100%}.Task-modules_done_task__aVaiY .Task-modules_header__f15OM .Task-modules_header_right__AymtU{background:var(--Color-Extended-Green-200,#d5edd8);border-color:#26292e;cursor:not-allowed}.Task-modules_done_task__aVaiY .Task-modules_header__f15OM .Task-modules_header_right__AymtU svg{fill:#000;height:1rem;width:1rem}.Task-modules_active_task__l-n9Q{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid #07f;border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;justify-content:center;max-width:100%;padding:0}.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM{border-bottom:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);max-width:100%;width:100%}.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM .Task-modules_header_left__JJTGR,.Task-modules_active_task__l-n9Q .Task-modules_header__f15OM .Task-modules_header_right__AymtU{border-color:var(--color-neutral-clear-shades-300,#d5d5d6)}.Task-modules_taskContent__v3Cm1{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:.5rem;padding:.5rem .75rem .25rem}.Task-modules_taskPopover__S07XU{align-items:flex-start;background:var(--color-neutral-basics-white,#fff);border:1px solid var(--color-neutral-dark-shades-950,#26292e);border-radius:.5rem;display:flex;flex-direction:column;margin-top:1rem;overflow:hidden;padding:.5rem .75rem .75rem}.Task-modules_notesContainer__dz0Me{align-items:flex-start;align-self:stretch;border-top:1px solid var(--color-neutral-clear-shades-300,#d5d5d6);display:flex;flex-direction:column;gap:.25rem;padding-top:.5rem}.Task-modules_actionBtnsContainer__Dz-1j{align-items:flex-start;align-self:stretch;display:flex;gap:.5rem;justify-content:flex-end;padding-top:8px}.Task-modules_popover_paper__Re-kl .Task-modules_MuiPopover-paper__7p4Tk,.Task-modules_popover_paper__Re-kl .Task-modules_MuiPopover-root__w6O-O{background:transparent;border-radius:.5rem}";
+var styles$q = {"task_container":"Task-modules_task_container__Iaqc-","header":"Task-modules_header__f15OM","header_left":"Task-modules_header_left__JJTGR","header_right":"Task-modules_header_right__AymtU","header_left_interviewer":"Task-modules_header_left_interviewer__WHqee","title":"Task-modules_title__-OmPh","header_left_interviewee":"Task-modules_header_left_interviewee__TmMkM","clickable":"Task-modules_clickable__BIHxK","disabled_task":"Task-modules_disabled_task__NI6LL","done_task":"Task-modules_done_task__aVaiY","active_task":"Task-modules_active_task__l-n9Q","taskContent":"Task-modules_taskContent__v3Cm1","taskPopover":"Task-modules_taskPopover__S07XU","notesContainer":"Task-modules_notesContainer__dz0Me","actionBtnsContainer":"Task-modules_actionBtnsContainer__Dz-1j","popover_paper":"Task-modules_popover_paper__Re-kl","MuiPopover-root":"Task-modules_MuiPopover-root__w6O-O","MuiPopover-paper":"Task-modules_MuiPopover-paper__7p4Tk"};
 styleInject(css_248z$q);
 
-const StyledTooltip$1 = /*#__PURE__*/styled(Tooltip$1)({
-  '& .MuiPopover-root': {
-    borderRadius: '0.5rem',
-    background: 'transparent'
-  },
-  '& .MuiPopover-paper': {
-    borderRadius: '0.5rem',
-    background: 'transparent'
-  }
-});
 const Task = ({
   taskNumber,
   taskTitle,
@@ -10851,16 +10848,15 @@ const Task = ({
   isInterviewer,
   ...props
 }) => {
-  const [open, setOpen] = useState(false);
-  const taskRef = useRef(null);
+  const [isHovered, setIsHovered] = useState(false);
   const handleClose = () => {
-    setOpen(false);
+    setIsHovered(false);
   };
   const handleOpen = () => {
-    setOpen(true);
+    setIsHovered(true);
   };
   const getContainerStyle = () => {
-    if (state === 'active') return styles$q.active_task;else if (state === 'disabled') return styles$q.disabled_task;else return styles$q.task_container;
+    if (state === 'active') return styles$q.active_task;else if (state === 'disabled') return styles$q.disabled_task;else if (state === 'done') return styles$q.done_task;else return styles$q.task_container;
   };
   const areActionsDisplay = iconAction1 || iconAction2 || iconAction3 || action1 || action2 || action3;
   if (state === 'active') return /*#__PURE__*/React.createElement("div", Object.assign({
@@ -10927,63 +10923,12 @@ const Task = ({
     iconRight: /*#__PURE__*/React.createElement(SendIcon, null),
     text: mainActionText,
     onClick: mainAction
-  })))));else return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledTooltip$1, {
-    id: "mouse-over-popover",
-    open: open,
-    onClose: handleClose,
-    onOpen: handleOpen,
-    placement: "bottom-start",
-    title: /*#__PURE__*/React.createElement("div", {
-      className: styles$q.taskPopover,
-      style: {
-        width: taskRef.current ? taskRef.current.getBoundingClientRect().width : 'unset',
-        maxWidth: taskRef.current ? taskRef.current.getBoundingClientRect().width : 'unset'
-      }
-    }, /*#__PURE__*/React.createElement(Text, {
-      text: taskTitleTooltip,
-      size: "sm",
-      weight: "bold"
-    }), url && /*#__PURE__*/React.createElement("div", {
-      className: styles$q.notesContainer
-    }, /*#__PURE__*/React.createElement(Text, {
-      text: "URL",
-      size: "xs",
-      italic: true
-    }), /*#__PURE__*/React.createElement(Text, {
-      text: url,
-      textDecoration: "underline",
-      size: "sm",
-      color: colors.blue_500,
-      style: {
-        cursor: 'pointer !important'
-      },
-      onClick: () => window.open(url.includes('https://') ? url : `https://${url}`, '_blank')
-    })), notes && isInterviewer && /*#__PURE__*/React.createElement("div", {
-      className: styles$q.notesContainer
-    }, /*#__PURE__*/React.createElement(Text, {
-      text: "Notes",
-      size: "xs",
-      italic: true
-    }), /*#__PURE__*/React.createElement(Text, {
-      text: notes,
-      size: "sm"
-    }))),
-    componentsProps: {
-      tooltip: {
-        sx: {
-          bgcolor: 'transparent',
-          padding: 0,
-          borderRadius: '0.5rem',
-          '& .MuiTooltip-arrow': {
-            color: 'transparent'
-          }
-        }
-      }
-    }
-  }, /*#__PURE__*/React.createElement("div", Object.assign({
-    className: `${getContainerStyle()} ${className ?? ''}`,
-    ref: taskRef
-  }, props), /*#__PURE__*/React.createElement("div", {
+  })))));else return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", Object.assign({
+    className: `${getContainerStyle()} ${className ?? ''}`
+  }, props, {
+    onMouseEnter: handleOpen,
+    onMouseLeave: handleClose
+  }), /*#__PURE__*/React.createElement("div", {
     className: styles$q.header
   }, /*#__PURE__*/React.createElement("div", {
     className: isInterviewer ? styles$q.header_left_interviewer : styles$q.header_left_interviewee
@@ -11001,8 +10946,38 @@ const Task = ({
     onClick: () => {
       if (state === 'idle') sendTask(task);
     },
-    disabled: state === 'disabled'
-  }, isDone ? /*#__PURE__*/React.createElement(CheckedIcon, null) : /*#__PURE__*/React.createElement(SendIcon, null))))));
+    disabled: state === 'disabled' || state === 'done'
+  }, isDone ? /*#__PURE__*/React.createElement(CheckedIcon, null) : /*#__PURE__*/React.createElement(SendIcon, null)))), isHovered && /*#__PURE__*/React.createElement("div", {
+    className: styles$q.taskPopover
+  }, /*#__PURE__*/React.createElement(Text, {
+    text: taskTitleTooltip,
+    size: "sm",
+    weight: "bold"
+  }), url && /*#__PURE__*/React.createElement("div", {
+    className: styles$q.notesContainer
+  }, /*#__PURE__*/React.createElement(Text, {
+    text: "URL",
+    size: "xs",
+    italic: true
+  }), /*#__PURE__*/React.createElement(Text, {
+    text: url,
+    textDecoration: "underline",
+    size: "sm",
+    color: colors.blue_500,
+    style: {
+      cursor: 'pointer !important'
+    },
+    onClick: () => window.open(url.includes('https://') ? url : `https://${url}`, '_blank')
+  })), notes && isInterviewer && /*#__PURE__*/React.createElement("div", {
+    className: styles$q.notesContainer
+  }, /*#__PURE__*/React.createElement(Text, {
+    text: "Notes",
+    size: "xs",
+    italic: true
+  }), /*#__PURE__*/React.createElement(Text, {
+    text: notes,
+    size: "sm"
+  }))));
 };
 
 var css_248z$r = ".WelcomeMessage-modules_welcome_container__qLgMv{align-items:flex-start;align-self:stretch;background:var(--color-extended-green-100,#e8f5ea);border:1px solid var(--color-extended-green-300,#9dd6a3);border-radius:.5rem;display:flex;flex-direction:column;padding:.5rem .75rem .75rem}.WelcomeMessage-modules_welcome_container__qLgMv .WelcomeMessage-modules_welcome_title__gX34Q{border-bottom:1px solid var(--color-extended-green-300,#9dd6a3);margin-bottom:.5rem;padding-bottom:.35rem}.WelcomeMessage-modules_welcome_container__qLgMv .WelcomeMessage-modules_welcome_description__a2HnZ{font-family:OpenSans;font-size:.875rem;font-style:normal;font-weight:400;line-height:1.225rem}.WelcomeMessage-modules_welcome_container__qLgMv .WelcomeMessage-modules_welcome_description__a2HnZ ol{letter-spacing:-.0019rem;margin:unset;margin-top:.5625rem;padding-inline-start:1.5rem}";