odaptos_design_system 1.2.4 → 1.2.6

package/src/Icons/Miscellaneous/ClipIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function ClipIcon({
   stroke,

package/src/Icons/Miscellaneous/CreditCardIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function CreditCardIcon({
   stroke,

package/src/Icons/Miscellaneous/DownloadIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function DownloadIcon({
   stroke,

package/src/Icons/Miscellaneous/EarthIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function EarthIcon({
   stroke,

package/src/Icons/Miscellaneous/FaceCenterIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function FaceCenterIcon({
   stroke,

package/src/Icons/Miscellaneous/FaceRecognitionIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function FaceRecognitionIcon({
   stroke,

package/src/Icons/Miscellaneous/FilesIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function FilesIcon({
   stroke,

package/src/Icons/Miscellaneous/FillRecordIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function FillRecordIcon({
   stroke,

package/src/Icons/Miscellaneous/FolderIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function FolderIcon({
   stroke,

package/src/Icons/Miscellaneous/GoogleIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function GoogleIcon({
   stroke = 'none',

package/src/Icons/Miscellaneous/HardDriveIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function HardDriveIcon({
   stroke,

package/src/Icons/Miscellaneous/HelpIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function HelpIcon({
   stroke,

package/src/Icons/Miscellaneous/LanguageIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function LanguageIcon({
   stroke,

package/src/Icons/Miscellaneous/LinkIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function LinkIcon({
   stroke,

package/src/Icons/Miscellaneous/MetaAnalyseIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function MetaAnalyseIcon({
   stroke,

package/src/Icons/Miscellaneous/ModeratedIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function ModeratedIcon({
   stroke,

package/src/Icons/Miscellaneous/NbOfUsersIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function NbOfUsersIcon({
   stroke,

package/src/Icons/Miscellaneous/NeutralBackgroudIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function NeutralBackgroudIcon({
   stroke,

package/src/Icons/Miscellaneous/ReportIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function ReportIcon({
   stroke,

package/src/Icons/Miscellaneous/SeatIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function SeatIcon({
   stroke,

package/src/Icons/Miscellaneous/SendEmailIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function SendEmailIcon({
   stroke,

package/src/Icons/Miscellaneous/SendIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function SendIcon({
   stroke,

package/src/Icons/Miscellaneous/SmartBrainIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function SmartBrainIcon({
   stroke,

package/src/Icons/Miscellaneous/TasksIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function TasksIcon({
   stroke,

package/src/Icons/Miscellaneous/TestDetailsIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function TestDetailsIcon({
   stroke,

package/src/Icons/Miscellaneous/TestIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function TestIcon({
   stroke,

package/src/Icons/Miscellaneous/UnmoderatedIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function UnmoderatedIcon({
   stroke,

package/src/Icons/Notifications/AlamBellIdleIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function CopyPasteIcon({
   stroke,

package/src/Icons/Notifications/AlarmBellStatusIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function AlarmBellStatusIcon({
   stroke,

package/src/Icons/Notifications/NotifAlertIcon.tsx

@@ -1,4 +1,5 @@
 import { SvgIcon, SvgIconProps } from '@mui/material';
+import React from 'react';
 
 export default function NotifAlertIcon({
   stroke,

package/src/Interviews/Chat.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Chat.modules.scss';
 import {
   Text,

package/src/Interviews/ChatInput.tsx

@@ -1,5 +1,7 @@
 import { SendEmailIcon } from '../';
 import styles from './ChatInput.modules.scss';
+import React from 'react';
+
 interface ChatInputProps {
   className?: string;
   value: string;

package/src/Interviews/CircledIconButton.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './CircleIconButton.modules.scss';
 import { MeetingIcon, NotifAlertIcon } from '../';
 

package/src/Interviews/ControlsBar.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './ControlsBar.modules.scss';
 import {
   CircledIconButton,
@@ -36,6 +36,7 @@ export const ControlsBar = ({
   enableMicrophone,
   enableCamera,
   displayTasks,
+  displayChat,
   isChatOpen,
   areTasksOpen,
   isNewTask,
@@ -44,16 +45,20 @@ export const ControlsBar = ({
 }: ControlsBarProps) => {
   return (
     <div className={`${styles.control_bar} ${className ?? ''}`} {...props}>
-      <CircledIconButton
-        icon={<MicrophoneIcon />}
-        onClick={() => enableMicrophone()}
-      />
-      <CircledIconButton
-        icon={<MeetingIcon />}
-        onClick={() => enableCamera()}
-      />
+      {enableMicrophone && (
+        <CircledIconButton
+          icon={<MicrophoneIcon />}
+          onClick={() => enableMicrophone()}
+        />
+      )}
+      {enableCamera && (
+        <CircledIconButton
+          icon={<MeetingIcon />}
+          onClick={() => enableCamera()}
+        />
+      )}
       <div className={styles.separator} />
-      {isInterviewer && (
+      {isInterviewer && endInterview && (
         <InterviewButton
           text="End Interview"
           variant="end-interview"
@@ -61,7 +66,7 @@ export const ControlsBar = ({
           icon={<HangUpIcon />}
         />
       )}
-      {!isInterviewer && !isScreenShare && (
+      {!isInterviewer && !isScreenShare && enableScreenSharing && (
         <InterviewButton
           text="ScreenShare"
           variant="screenshare"
@@ -75,7 +80,9 @@ export const ControlsBar = ({
           text="Protocol"
           variant="protocol"
           icon={<TasksIcon />}
-          onClick={() => displayTasks()}
+          onClick={() => {
+            if (displayTasks) return displayTasks();
+          }}
           isActive={areTasksOpen}
           isNotif={isNewTask}
         />
@@ -84,18 +91,22 @@ export const ControlsBar = ({
           text="My Tasks"
           variant="protocol"
           icon={<TasksIcon />}
-          onClick={() => displayTasks()}
+          onClick={() => {
+            if (displayTasks) return displayTasks();
+          }}
           isActive={areTasksOpen}
           isNotif={isNewTask}
         />
       )}
-      <CircledIconButton
-        icon={<ChatBubbleIcon />}
-        className={styles.chatBubbleIcon}
-        onClick={() => displayChat()}
-        isActive={isChatOpen}
-        isNotif={isNewMessage}
-      />
+      {displayChat && (
+        <CircledIconButton
+          icon={<ChatBubbleIcon />}
+          className={styles.chatBubbleIcon}
+          onClick={() => displayChat()}
+          isActive={isChatOpen}
+          isNotif={isNewMessage}
+        />
+      )}
     </div>
   );
 };

package/src/Interviews/GoBack.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './GoBack.modules.scss';
 import { ArrowLineLeftIcon, Text } from '../';
 

package/src/Interviews/InterviewButton.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './InterviewButton.modules.scss';
 import { MeetingIcon, NotifAlertIcon, Text } from '../';
 

package/src/Interviews/MarkUpBar.tsx

@@ -1,8 +1,7 @@
-import { HTMLAttributes } from 'react';
+import React from 'react';
 import styles from './MarkUpBar.modules.scss';
-import { MeetingIcon } from '../';
 
-export interface MarkUpBarProps extends HTMLAttributes<HTMLButtonElement> {
+export interface MarkUpBarProps {
   className?: string;
   onClick: (code: string) => void;
 }
@@ -10,7 +9,7 @@ export interface MarkUpBarProps extends HTMLAttributes<HTMLButtonElement> {
 /**
  * TODO : Be sure that we want to keep the 'QWERTY' selection system
  */
-export const MarkUpBar = ({ className, onClick, ...props }: MarkUpBarProps) => {
+export const MarkUpBar = ({ className, onClick }: MarkUpBarProps) => {
   return (
     <div className={`${styles.markup_bar} ${className ?? ''}`}>
       <div className={styles.smiley_list}>

package/src/Interviews/StartInterview.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './StartInterview.modules.scss';
 import { Button, Text, SendIcon } from '../';
 

package/src/Interviews/Task.tsx

@@ -1,8 +1,7 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Task.modules.scss';
 import { Button, CheckedIcon, IconButton, Text, SendIcon } from '../';
 import Popover from '@mui/material/Popover';
-import * as React from 'react';
 import { styled } from '@mui/material/styles';
 
 const CustomPopover = styled(Popover)({

package/src/Interviews/WelcomeMessage.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './WelcomeMessage.modules.scss';
 import { Text } from '../';
 

package/src/LateralMenu/LateralMenu.tsx

@@ -1,6 +1,8 @@
 import styles from './LateralMenu.modules.scss';
 import { LogoNormal as Logo } from '../Icons';
 import Grid from '@mui/material/Grid';
+import React from 'react';
+
 interface LateralMenuProps {
   content: JSX.Element;
   isLogoDisplay?: boolean;

package/src/Modal/Modal.tsx

@@ -5,7 +5,7 @@ import { Title } from '../Typography/Title';
 import { Button } from '../Buttons/Button';
 import { IconButton } from '../Buttons/IconButton';
 import styles from './Modal.modules.scss';
-import { useEffect } from 'react';
+import React, { useEffect } from 'react';
 
 interface ModalProps {
   className?: string;

package/src/Notifications/Banner.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import { AlertCircledIcon, CheckedCircled, InfoCircledIcon } from '../Icons';
 import { TextWithLink } from '../Typography/TextWithLink';
 import { Text } from '../Typography/Text';

package/src/Notifications/NotificationIcon.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import { AlarmBellStatusIcon, AlamBellIdleIcon } from '../Icons';
 
 interface TagProps extends HTMLAttributes<HTMLDivElement> {

package/src/Notifications/Toast.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import { AddIcon } from '../Icons';
 import { Link } from '../Typography/Link';
 import { Text } from '../Typography/Text';

package/src/Radio/Radio.tsx

@@ -2,6 +2,7 @@ import { styled } from '@mui/material/styles';
 import { Radio as MuiRadio } from '@mui/material';
 import { Text } from '../Typography/Text';
 import styles from './Radio.module.scss';
+import React from 'react';
 
 const BpIcon = styled('span')(() => ({
   borderRadius: '50%',

package/src/Search/Search.tsx

@@ -1,5 +1,6 @@
 import { SearchCircledIcon } from '../Icons';
 import { TextInput } from '../TextInput/TextInput';
+import React from 'react';
 
 interface RadioProps {
   searchInput: string | number;

package/src/Step/Step.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Step.module.scss';
 import { AlertCircledIcon, CheckedCircled } from '../Icons';
 import { Text } from '../Typography/Text';

package/src/Switch/Switch.tsx

@@ -2,7 +2,7 @@ import { Switch as MuiSwitch } from '@mui/material';
 import { Title } from '../Typography/Title';
 import styles from './Switch.module.scss';
 import { alpha, styled } from '@mui/system';
-
+import React from 'react';
 interface SwitchProps {
   label?: string;
   checked: boolean;

package/src/Table/header.tsx

@@ -2,6 +2,7 @@ import { Checkbox } from '../Checkbox/Checkbox';
 import { Tooltip } from '../Tooltip/Tooltip';
 import { Text } from '../Typography/Text';
 import styles from './header.modules.scss';
+import React from 'react';
 
 interface HeaderItem {
   name: string;

package/src/Table/index.tsx

@@ -1,5 +1,6 @@
 import { TableHeader } from './header';
 import { TableRows } from './rows';
+import React from 'react';
 
 interface HeaderItem {
   name: string;

package/src/Table/rows.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Checkbox } from '../Checkbox/Checkbox';
 import styles from './rows.modules.scss';
 import { TableCell } from './table-cell';

package/src/Table/table-cell.tsx

@@ -1,6 +1,7 @@
 import { Checkbox } from '../Checkbox/Checkbox';
 import { Text } from '../Typography/Text';
 import styles from './table-cell.modules.scss';
+import React from 'react';
 
 interface TableCellProps {
   text: string;

package/src/Tabs/Tabs.tsx

@@ -1,6 +1,6 @@
 import { Tabs as MuiTabs } from '@mui/material';
 import Tab from '@mui/material/Tab';
-import { useState } from 'react';
+import React, { useState } from 'react';
 import { Text } from '../../src/Typography/Text';
 import styles from './tabs.modules.scss';
 

package/src/Tabs/TabsUnderLine.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import React, { useState } from 'react';
 import Tabs from '@mui/material/Tabs';
 import Tab from '@mui/material/Tab';
 import { Text } from '../Typography/Text';

package/src/Tag/Tag.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Tag.modules.scss';
 import { Text } from '../Typography/Text';
 

package/src/TextInput/TextInput.tsx

@@ -2,6 +2,7 @@ import { InputAdornment, TextField } from '@mui/material';
 import { Text } from '../Typography/Text';
 import './TextInput.scss';
 import { styled } from '@mui/material/styles';
+import React from 'react';
 
 const CssTextField = styled(TextField)({
   '& .MuiInputBase-input': {

package/src/Textarea/Textarea.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { TextInput } from '../TextInput/TextInput';
 import { Text } from '../Typography/Text';
-
+import React from 'react';
 import styles from './Textarea.module.scss';
 
 interface TextareaProps {

package/src/Tooltip/Layout/TooltipCustomLayout.tsx

@@ -2,6 +2,7 @@ import { Button } from '../../Buttons/Button';
 import { IconButton } from '../../Buttons/IconButton';
 import { Text } from '../../Typography/Text';
 import { Title } from '../../Typography/Title';
+import React from 'react';
 
 import styles from './TooltipCustomLayout.module.scss';
 

package/src/Tooltip/Tooltip.tsx

@@ -4,7 +4,7 @@ import { styled } from '@mui/material/styles';
 
 import { TooltipLayout } from './Layout/TooltipCustomLayout';
 
-import { useState } from 'react';
+import React, { useState } from 'react';
 
 const StyledTooltip = styled(MTooltip)({
   [`& .${tooltipClasses.tooltip}`]: {

package/src/Typography/Caption.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Caption.modules.scss';
 
 interface CaptionProps extends HTMLAttributes<HTMLParagraphElement> {

package/src/Typography/Link.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Link.modules.scss';
 
 interface LinkProps extends HTMLAttributes<HTMLParagraphElement> {

package/src/Typography/Text.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Text.modules.scss';
 
 interface TextProps extends HTMLAttributes<HTMLParagraphElement> {

package/src/Typography/TextForButton.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './TextForButton.modules.scss';
 
 interface TextForButtonProps extends HTMLAttributes<HTMLParagraphElement> {

package/src/Typography/TextForDropDownItem.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './TextForDropDownItem.modules.scss';
 
 interface TextForDropDownItemProps

package/src/Typography/TextWithLink.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './TextWithLink.modules.scss';
 
 interface TextWithLinkProps extends HTMLAttributes<HTMLParagraphElement> {

package/src/Typography/Title.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import React, { HTMLAttributes } from 'react';
 import styles from './Title.modules.scss';
 
 interface TitleProps extends HTMLAttributes<HTMLParagraphElement> {