code7-leia 0.1.118 → 0.1.120

package/dist/code7-leia.esm.js

@@ -443,11 +443,11 @@ Tabs.propTypes = {
   onChange: PropTypes.func.isRequired
 };
 
-var defaultLanguage = {
+var enTranslation = {
   files: 'Files',
   test: 'Test',
   fileArea: {
-    description: 'bla bla bla bla bla',
+    description: 'Manage your files with ease! Add new ones and delete old ones as desired.',
     fileName: 'File name',
     presset: 'Presset',
     actions: 'Actions',
@@ -455,7 +455,7 @@ var defaultLanguage = {
     fileUpload: 'File upload',
     emptyState: {
       title: 'No data',
-      description: 'bla bla bla bla bla'
+      description: 'No files uploaded yet. Start by adding your documents now!'
     },
     modal: {
       descriptionUpload: 'Drag and drop files here or',
@@ -510,140 +510,154 @@ var defaultLanguage = {
     }
   }
 };
-var getLanguage = function getLanguage(language) {
-  var languages = {
-    en: defaultLanguage,
-    'pt-br': {
-      files: 'Arquivos',
-      test: 'Teste',
-      fileArea: _extends({}, defaultLanguage.fileArea, {
-        fileName: 'Nome do arquivo',
-        presset: 'Presset',
-        actions: 'Ações',
-        search: 'Pesquisar',
-        fileUpload: 'Upload de arquivo',
-        emptyState: _extends({}, defaultLanguage.fileArea.emptyState, {
-          title: 'Sem dados'
-        }),
-        modal: _extends({}, defaultLanguage.fileArea.modal, {
-          descriptionUpload: 'Arraste e solte os arquivos aqui ou',
-          chooseFile: 'Escolha um arquivo',
-          uploadFile: 'Enviar um arquivo',
-          deleteFileTitle: 'Deletar um arquivo',
-          deleteFile: 'Importante! Ao deletar esse arquivo você perderá todas as informações dele e não terá como recuperá-las.'
-        })
-      }),
-      buttons: _extends({}, defaultLanguage.buttons, {
-        cancel: 'Cancelar',
-        send: 'Enviar',
-        "delete": 'Excluir',
-        test: 'Testar'
-      }),
-      testArea: _extends({}, defaultLanguage.testArea, {
-        description: 'Digite uma frase para testar a inteligência artificial.',
-        typeSentence: 'Digite uma frase',
-        selectPersona: 'Selecione uma Persona',
-        selectPresset: 'Selecione uma predefinição',
-        emptyState: _extends({}, defaultLanguage.testArea.emptyState, {
-          title: 'Sem dados para análise',
-          description: 'Faça uma pesquisa, clique no botão "Teste".'
-        })
-      }),
-      toast: {
-        deleteFile: {
-          success: {
-            title: 'Sucesso',
-            description: 'Arquivo deletado com sucesso!'
-          },
-          fail: {
-            title: 'Falha',
-            description: 'Erro ao deletar o arquivo!'
-          }
-        },
-        uploadFile: {
-          success: {
-            title: 'Sucesso',
-            description: 'Arquivo enviado com sucesso!'
-          },
-          fail: {
-            title: 'Falha',
-            description: 'Erro ao enviar o arquivo!'
-          }
-        },
-        Test: {
-          fail: {
-            title: 'Falha',
-            description: 'Erro ao testar a Le-IA'
-          }
-        }
+
+var ptTranslation = {
+  files: 'Arquivos',
+  test: 'Teste',
+  fileArea: {
+    description: 'Gerencie seus arquivos com facilidade! Adicione novos e exclua os antigos conforme desejar.',
+    fileName: 'Nome do arquivo',
+    presset: 'Predefinição',
+    actions: 'Ações',
+    search: 'Pesquisar',
+    fileUpload: 'Enviar arquivo',
+    emptyState: {
+      title: 'Sem dados',
+      description: 'Nenhum arquivo enviado ainda. Comece adicionando seus documentos agora!'
+    },
+    modal: {
+      descriptionUpload: 'Arraste e solte os arquivos aqui ou',
+      chooseFile: 'Escolha um arquivo',
+      uploadFile: 'Enviar um arquivo',
+      deleteFileTitle: 'Excluir um arquivo',
+      deleteFile: 'Importante! Ao excluir este arquivo, você perderá todas as suas informações e não poderá recuperá-las.'
+    }
+  },
+  buttons: {
+    cancel: 'Cancelar',
+    send: 'Enviar',
+    "delete": 'Excluir',
+    test: 'Teste'
+  },
+  testArea: {
+    description: 'bla bla bla bla bla',
+    typeSentence: 'Digite uma frase',
+    selectPersona: 'Selecione uma Persona',
+    selectPresset: 'Selecione uma predefinição',
+    emptyState: {
+      title: 'Sem dados para análise',
+      description: 'Faça uma pesquisa, clique no botão "Teste".'
+    }
+  },
+  toast: {
+    deleteFile: {
+      success: {
+        title: 'Sucesso',
+        description: 'Arquivo excluído com sucesso!'
+      },
+      fail: {
+        title: 'Falha',
+        description: 'Erro ao excluir o arquivo!'
       }
     },
-    es: _extends({}, defaultLanguage, {
-      files: 'Archivos',
-      test: 'Prueba',
-      fileArea: _extends({}, defaultLanguage.fileArea, {
-        fileName: 'Nombre del archivo',
-        presset: 'Presset',
-        actions: 'Acciones',
-        search: 'Buscar',
-        fileUpload: 'Carga de archivos',
-        emptyState: _extends({}, defaultLanguage.fileArea.emptyState, {
-          title: 'Sin datos'
-        }),
-        modal: _extends({}, defaultLanguage.fileArea.modal, {
-          descriptionUpload: 'Arrastre y suelte los archivos aquí o',
-          chooseFile: 'Elegir un archivo',
-          deleteFileTitle: 'Eliminar un archivo',
-          deleteFile: '¡Importante! Al borrar este archivo perderás toda la información contenida en él y no podrás recuperarla.'
-        })
-      }),
-      buttons: _extends({}, defaultLanguage.buttons, {
-        cancel: 'Cancelar',
-        send: 'Enviar',
-        "delete": 'Eliminar',
-        test: 'Probar'
-      }),
-      testArea: _extends({}, defaultLanguage.testArea, {
-        description: 'bla bla bla bla bla',
-        typeSentence: 'Escribe una oración',
-        selectPersona: 'Seleccionar una Persona',
-        selectPresset: 'Seleccionar una configuración preestablecida',
-        emptyState: _extends({}, defaultLanguage.testArea.emptyState, {
-          title: 'Sin datos para el análisis',
-          description: 'Realiza una búsqueda, haz clic en el botón "Prueba".'
-        })
-      }),
-      toast: {
-        deleteFile: {
-          success: {
-            title: 'Éxito',
-            description: '¡Archivo eliminado correctamente!'
-          },
-          fail: {
-            title: 'Fallo',
-            description: 'Error al eliminar el archivo!'
-          }
-        },
-        uploadFile: {
-          success: {
-            title: 'Éxito',
-            description: '¡Archivo subido correctamente!'
-          },
-          fail: {
-            title: 'Fallo',
-            description: 'Error al subir el archivo!'
-          }
-        },
-        Test: {
-          fail: {
-            title: 'Fallo',
-            description: 'Error al probar Le-IA'
-          }
-        }
+    uploadFile: {
+      success: {
+        title: 'Sucesso',
+        description: 'Arquivo enviado com sucesso!'
+      },
+      fail: {
+        title: 'Falha',
+        description: 'Erro ao enviar o arquivo!'
       }
-    })
-  };
-  return languages[language] || defaultLanguage;
+    },
+    Test: {
+      fail: {
+        title: 'Falha',
+        description: 'Erro ao testar Le-IA'
+      }
+    }
+  }
+};
+
+var esTranslation = {
+  files: 'Archivos',
+  test: 'Prueba',
+  fileArea: {
+    description: '¡Administre sus archivos fácilmente! Agregue nuevos y elimine los antiguos según desee.',
+    fileName: 'Nombre del archivo',
+    presset: 'Preconfiguración',
+    actions: 'Acciones',
+    search: 'Buscar',
+    fileUpload: 'Subir archivo',
+    emptyState: {
+      title: 'Sin datos',
+      description: 'Aún no se han subido archivos. ¡Comience agregando sus documentos ahora!'
+    },
+    modal: {
+      descriptionUpload: 'Arrastre y suelte los archivos aquí o',
+      chooseFile: 'Elegir un archivo',
+      uploadFile: 'Subir un archivo',
+      deleteFileTitle: 'Eliminar un archivo',
+      deleteFile: '¡Importante! Al eliminar este archivo, perderá toda su información y no podrá recuperarla.'
+    }
+  },
+  buttons: {
+    cancel: 'Cancelar',
+    send: 'Enviar',
+    "delete": 'Eliminar',
+    test: 'Prueba'
+  },
+  testArea: {
+    description: 'bla bla bla bla bla',
+    typeSentence: 'Escribe una oración',
+    selectPersona: 'Seleccionar una Persona',
+    selectPresset: 'Seleccionar una preconfiguración',
+    emptyState: {
+      title: 'Sin datos para el análisis',
+      description: 'Realice una búsqueda, haga clic en el botón "Prueba".'
+    }
+  },
+  toast: {
+    deleteFile: {
+      success: {
+        title: 'Éxito',
+        description: '¡Archivo eliminado correctamente!'
+      },
+      fail: {
+        title: 'Error',
+        description: 'Error al eliminar el archivo!'
+      }
+    },
+    uploadFile: {
+      success: {
+        title: 'Éxito',
+        description: '¡Archivo subido correctamente!'
+      },
+      fail: {
+        title: 'Error',
+        description: 'Error al subir el archivo!'
+      }
+    },
+    Test: {
+      fail: {
+        title: 'Error',
+        description: 'Error al probar Le-IA'
+      }
+    }
+  }
+};
+
+var getLanguage = function getLanguage(language) {
+  switch (language) {
+    case 'en':
+      return enTranslation;
+    case 'pt-br':
+      return ptTranslation;
+    case 'es':
+      return esTranslation;
+    default:
+      return enTranslation;
+  }
 };
 
 var _templateObject$1, _templateObject2$1, _templateObject3;
@@ -698,6 +712,11 @@ Table$1.propTypes = {
   isLoading: PropTypes.bool
 };
 
+var _templateObject$4, _templateObject2$3, _templateObject3$2;
+var InputContainer = /*#__PURE__*/styled.div(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 300px;\n"])));
+var Input = /*#__PURE__*/styled.input(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 40px;\n  border-radius: 5px;\n  border: 1px solid #ccc;\n  height: 40px;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n    box-shadow: 0 0 0 3px #6690ff;\n  }\n"])));
+var IconContainer = /*#__PURE__*/styled.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 10px;\n  left: 10px;\n  pointer-events: none;\n"])));
+
 var SearchInput = function SearchInput(_ref) {
   var placeholder = _ref.placeholder,
     setFiles = _ref.setFiles,
@@ -711,36 +730,17 @@ var SearchInput = function SearchInput(_ref) {
     });
     setFiles(searchTerm !== '' ? newFiles : initialFiles);
   };
-  return React.createElement("div", {
-    style: {
-      position: 'relative',
-      width: '300px'
-    }
-  }, React.createElement("input", {
+  return React.createElement(InputContainer, null, React.createElement(Input, {
     type: "text",
     onChange: function onChange(e) {
       return searchName(e);
     },
-    placeholder: placeholder,
-    style: {
-      paddingLeft: '40px',
-      borderRadius: '5px',
-      border: '1px solid #ccc',
-      height: '40px',
-      width: '100%'
-    }
-  }), React.createElement("div", {
-    style: {
-      position: 'absolute',
-      top: '10px',
-      left: '10px',
-      pointerEvents: 'none'
-    }
-  }, React.createElement(FaSearch, null)));
+    placeholder: placeholder
+  }), React.createElement(IconContainer, null, React.createElement(FaSearch, null)));
 };
 
-var _templateObject$4, _templateObject2$3, _templateObject3$2, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-var FullScreen = /*#__PURE__*/styled.div(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: ", ";\n  cursor: ", ";\n\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  justify-content: center;\n  align-items: center;\n  z-index: ", ";\n  animation: fadeIn 380ms ease-in-out 1;\n  background-color: #2f3845b8;\n  backdrop-filter: blur(2px);\n\n  @keyframes fadeIn {\n    from {\n      background-color: #2f384521;\n    }\n    to {\n      background-color: #2f3845b8;\n    }\n  }\n"])), function (_ref) {
+var _templateObject$5, _templateObject2$4, _templateObject3$3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var FullScreen = /*#__PURE__*/styled.div(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: ", ";\n  cursor: ", ";\n\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  justify-content: center;\n  align-items: center;\n  z-index: ", ";\n  animation: fadeIn 380ms ease-in-out 1;\n  background-color: #2f3845b8;\n  backdrop-filter: blur(2px);\n\n  @keyframes fadeIn {\n    from {\n      background-color: #2f384521;\n    }\n    to {\n      background-color: #2f3845b8;\n    }\n  }\n"])), function (_ref) {
   var isOpen = _ref.isOpen;
   return isOpen === 1 ? 'flex' : 'none';
 }, function (_ref2) {
@@ -750,11 +750,11 @@ var FullScreen = /*#__PURE__*/styled.div(_templateObject$4 || (_templateObject$4
   var zIndex = _ref3.zIndex;
   return zIndex;
 });
-var Modal = /*#__PURE__*/styled.div(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #fff;\n  border-radius: 3px;\n  position: relative;\n  cursor: default;\n  width: 100%;\n  max-width: ", ";\n  animation: slideIn 350ms cubic-bezier(0.42, 0, 0.21, 1) 1;\n\n  @keyframes slideIn {\n    from {\n      transform: translateY(-120px);\n      opacity: 0;\n    }\n\n    20% {\n      opacity: 0;\n    }\n\n    to {\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n"])), function (_ref4) {
+var Modal = /*#__PURE__*/styled.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #fff;\n  border-radius: 3px;\n  position: relative;\n  cursor: default;\n  width: 100%;\n  max-width: ", ";\n  animation: slideIn 350ms cubic-bezier(0.42, 0, 0.21, 1) 1;\n\n  @keyframes slideIn {\n    from {\n      transform: translateY(-120px);\n      opacity: 0;\n    }\n\n    20% {\n      opacity: 0;\n    }\n\n    to {\n      transform: translateY(0);\n      opacity: 1;\n    }\n  }\n"])), function (_ref4) {
   var maxWidth = _ref4.maxWidth;
   return maxWidth;
 });
-var ModalContainer = /*#__PURE__*/styled.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow-y: auto;\n  max-height: ", ";\n"])), function (_ref5) {
+var ModalContainer = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow-y: auto;\n  max-height: ", ";\n"])), function (_ref5) {
   var maxHeight = _ref5.maxHeight;
   return maxHeight;
 });
@@ -889,8 +889,8 @@ Modal$1.defaultProps = {
   zIndex: 9999
 };
 
-var _templateObject$5;
-var Container$1 = /*#__PURE__*/styled.div(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 24px 0;\n  height: 193px;\n\n  background: ", ";\n  background-position: top, right, bottom, left;\n  background-repeat: repeat-x, repeat-y;\n  background-size: 40px 1px, 1px 40px;\n  background-color: ", ";\n\n  & .content {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    & > .icon {\n      background-color: ", ";\n      border-radius: 16px;\n      width: 145px;\n      height: 145px;\n\n      display: flex;\n      justify-content: center;\n\n      & svg {\n        width: 100%;\n        height: 70%;\n        margin: 20px;\n      }\n    }\n\n    & .description {\n      max-width: 600px;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      padding: 8px 0 8px 24px;\n\n      .button-add {\n        cursor: pointer;\n      }\n\n      .start-icon {\n        display: flex;\n        align-items: center;\n      }\n    }\n  }\n"])), function (_ref) {
+var _templateObject$6;
+var Container$1 = /*#__PURE__*/styled.div(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 24px 0;\n  height: 193px;\n\n  background: ", ";\n  background-position: top, right, bottom, left;\n  background-repeat: repeat-x, repeat-y;\n  background-size: 40px 1px, 1px 40px;\n  background-color: ", ";\n\n  & .content {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    & > .icon {\n      background-color: ", ";\n      border-radius: 16px;\n      width: 145px;\n      height: 145px;\n\n      display: flex;\n      justify-content: center;\n\n      & svg {\n        width: 100%;\n        height: 70%;\n        margin: 20px;\n      }\n    }\n\n    & .description {\n      max-width: 600px;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      padding: 8px 0 8px 24px;\n\n      .button-add {\n        cursor: pointer;\n      }\n\n      .start-icon {\n        display: flex;\n        align-items: center;\n      }\n    }\n  }\n"])), function (_ref) {
   var hasBorder = _ref.hasBorder;
   return hasBorder && "linear-gradient(\n        to right,\n        #dadce3 50%,\n        rgba(255, 255, 255, 0) 0%\n      ),\n      linear-gradient(#dadce3 50%, rgba(255, 255, 255, 0) 0%),\n      linear-gradient(to right, #dadce3 50%, rgba(255, 255, 255, 0) 0%),\n      linear-gradient(#dadce3 50%, rgba(255, 255, 255, 0) 0%)";
 }, function (_ref2) {
@@ -950,23 +950,45 @@ EmptyState.defaultProps = {
   hasBorder: true
 };
 
-var _templateObject$6;
-var Container$2 = /*#__PURE__*/styled.div(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 50%;\n  margin-right: 5px;\n  select {\n    padding: 12px;\n    border-radius: 4px;\n    border: 1px solid #979AA5;\n    width: 100%;\n    height: 40px;\n    \n    &:focus {\n      outline: none;\n      box-shadow: 0 0 0 3px #6690ff;\n    }\n\n    option {\n      background: white;\n      font-size: 14px;\n      color: #5a5d68;\n    }\n\n    option:checked, option:hover {\n      background: #6690ff;\n      font-size: 14px;\n      color: white;\n    }\n  }\n"])));
+var _templateObject$7;
+var Container$2 = /*#__PURE__*/styled.div(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 50%;\n  margin-right: 5px;\n  select {\n    padding: 12px;\n    border-radius: 4px;\n    border: 1px solid #979AA5;\n    width: 100%;\n    height: 40px;\n    \n    &:focus {\n      outline: none;\n      box-shadow: 0 0 0 3px #6690ff;\n    }\n\n    option {\n      background: white;\n      font-size: 14px;\n      color: #5a5d68;\n    }\n\n    option:checked, option:hover {\n      background: #6690ff;\n      font-size: 14px;\n      color: white;\n    }\n  }\n"])));
 
 var Select = function Select(_ref) {
   var options = _ref.options,
     onSelect = _ref.onSelect,
-    placeholder = _ref.placeholder;
-  var _useState = useState(''),
-    selectedValue = _useState[0],
-    setSelectedValue = _useState[1];
+    onMultiSelect = _ref.onMultiSelect,
+    placeholder = _ref.placeholder,
+    multiValue = _ref.multiValue;
+  var initialSelectedValue = multiValue ? [] : '';
+  var _useState = useState(initialSelectedValue),
+    selectedValues = _useState[0],
+    setSelectedValues = _useState[1];
   var handleSelectChange = function handleSelectChange(event) {
     var selectedOption = event.target.value;
-    setSelectedValue(selectedOption);
-    onSelect(selectedOption);
+    if (multiValue && onMultiSelect) {
+      // Verifica se onMultiSelect está definido antes de chamá-lo
+      var selectedOptions = Array.from(event.target.selectedOptions).map(function (option) {
+        return option.value;
+      });
+      setSelectedValues(selectedOptions);
+      onMultiSelect(selectedOptions);
+    } else if (onSelect) {
+      // Verifica se onSelect está definido antes de chamá-lo
+      setSelectedValues(selectedOption);
+      onSelect(selectedOption);
+    }
   };
-  return React.createElement(Container$2, null, React.createElement("select", {
-    value: selectedValue,
+  return React.createElement(Container$2, null, multiValue ? React.createElement("select", {
+    multiple: true,
+    value: selectedValues,
+    onChange: handleSelectChange
+  }, options.map(function (option) {
+    return React.createElement("option", {
+      key: option.value,
+      value: String(option.value)
+    }, option.label);
+  })) : React.createElement("select", {
+    value: selectedValues,
     onChange: handleSelectChange
   }, React.createElement("option", {
     value: "",
@@ -975,12 +997,12 @@ var Select = function Select(_ref) {
   }, placeholder), options.map(function (option) {
     return React.createElement("option", {
       key: option.value,
-      value: option.value
+      value: String(option.value)
     }, option.label);
   })));
 };
 
-var _templateObject$7;
+var _templateObject$8;
 var getColor = function getColor(props) {
   if (props.isDragAccept) {
     return '#6690ff';
@@ -993,7 +1015,7 @@ var getColor = function getColor(props) {
   }
   return '#979aa5';
 };
-var Container$3 = /*#__PURE__*/styled.div(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #f3f5f9;\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  padding: 20px;\n  border-width: 2px;\n  border-radius: 4px;\n  border-color: var(", ");\n  border-style: dashed;\n  color: #5a5d68;\n  outline: none;\n  transition: border 0.24s ease-in-out;\n\n  & > span {\n    margin: 8px 10px 0 0;\n    display: flex;\n  }\n\n  button {\n    padding: 8px 16px 8px 16px;\n    border-radius: 4px;\n    border: 2px #102693 solid;\n    margin-top: 10px;\n  }\n"])), function (props) {
+var Container$3 = /*#__PURE__*/styled.div(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #f3f5f9;\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  padding: 20px;\n  border-width: 2px;\n  border-radius: 4px;\n  border-color: var(", ");\n  border-style: dashed;\n  color: #5a5d68;\n  outline: none;\n  transition: border 0.24s ease-in-out;\n\n  & > span {\n    margin: 8px 10px 0 0;\n    display: flex;\n  }\n\n  button {\n    padding: 8px 16px 8px 16px;\n    border-radius: 4px;\n    border: 2px #102693 solid;\n    margin-top: 10px;\n  }\n"])), function (props) {
   return getColor(props);
 });
 
@@ -1322,7 +1344,7 @@ var FileArea = function FileArea() {
   var _useState6 = useState(''),
     fileDelete = _useState6[0],
     setFileDelete = _useState6[1];
-  var _useState7 = useState(''),
+  var _useState7 = useState([]),
     presset = _useState7[0],
     setPresset = _useState7[1];
   var t = getLanguage(language);
@@ -1334,6 +1356,9 @@ var FileArea = function FileArea() {
     return state.isLoading;
   });
   var tags = propTags ? propTags.tags : [];
+  var handleSelectPresset = function handleSelectPresset(value) {
+    setPresset(value);
+  };
   useEffect(function () {
     dispatch(getFilesAction(id));
   }, [id]);
@@ -1358,6 +1383,10 @@ var FileArea = function FileArea() {
     return html;
   };
   var handleOpenModal = function handleOpenModal() {
+    if (modal) {
+      setUploadFile(undefined);
+      setPresset([]);
+    }
     setModal(!modal);
   };
   var handleOpenModalDelete = function handleOpenModalDelete(name) {
@@ -1369,10 +1398,11 @@ var FileArea = function FileArea() {
     setModalDelete(false);
   };
   var handleUploadFile = function handleUploadFile() {
-    dispatch(uploadFilesAction(uploadFile, id, [presset], language));
+    console.log('presset: ', presset);
+    dispatch(uploadFilesAction(uploadFile, id, presset, language));
     setModal(false);
     setUploadFile(undefined);
-    setPresset('');
+    setPresset([]);
   };
   var renderFiles = function renderFiles() {
     return React.createElement(Container, {
@@ -1438,7 +1468,8 @@ var FileArea = function FileArea() {
     }, React.createElement("p", null, "Presset"), React.createElement(Select, {
       placeholder: t.testArea.selectPresset,
       options: optionsPresset,
-      onSelect: setPresset
+      multiValue: true,
+      onMultiSelect: handleSelectPresset
     }))), React.createElement(ModalFooter, null, React.createElement("button", {
       className: 'button cancel',
       onClick: handleOpenModal
@@ -1481,18 +1512,18 @@ var FileArea = function FileArea() {
   }, React.createElement(Container, null, renderFiles()));
 };
 
-var _templateObject$8, _templateObject2$4, _templateObject3$3, _templateObject4$1, _templateObject5$1;
-var Container$4 = /*#__PURE__*/styled.div(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n"])), function (props) {
-  return props.isLoading && css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n      #loading {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        background-color: rgb(151,154,165, 0.7);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        z-index: 9999;\n      }\n\n      #loading::after {\n        content: \"\";\n        border: 4px solid #f3f3f3; /* Cor do s\xEDmbolo de carregamento */\n        border-top: 4px solid #3498db; /* Cor do s\xEDmbolo de carregamento */\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        animation: spin 1s linear infinite;\n      }\n\n      @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n      }\n    "])));
+var _templateObject$9, _templateObject2$5, _templateObject3$4, _templateObject4$1, _templateObject5$1;
+var Container$4 = /*#__PURE__*/styled.div(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n"])), function (props) {
+  return props.isLoading && css(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n      #loading {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        background-color: rgb(151,154,165, 0.7);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        z-index: 9999;\n      }\n\n      #loading::after {\n        content: \"\";\n        border: 4px solid #f3f3f3; /* Cor do s\xEDmbolo de carregamento */\n        border-top: 4px solid #3498db; /* Cor do s\xEDmbolo de carregamento */\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        animation: spin 1s linear infinite;\n      }\n\n      @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n      }\n    "])));
 });
-var Header$1 = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  .infos {\n    display: flex;\n    flex-direction: column;\n    padding: 14px 0;\n\n    h2 {\n      font-size: 20px\n    }\n\n    p {\n      font-size: 14px\n    }\n  }\n"])));
+var Header$1 = /*#__PURE__*/styled.div(_templateObject3$4 || (_templateObject3$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  .infos {\n    display: flex;\n    flex-direction: column;\n    padding: 14px 0;\n\n    h2 {\n      font-size: 20px\n    }\n\n    p {\n      font-size: 14px\n    }\n  }\n"])));
 var Inputs = /*#__PURE__*/styled.div(_templateObject4$1 || (_templateObject4$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 10px;\n\n  button {\n    background: #102693;\n    padding: 10px 20px;\n    color: white;\n    border-radius: 4px;\n    width: 190px;\n    height: 40px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    svg {\n      width: 23px;\n      height: 23px;\n    }\n  }\n"])));
 var Result = /*#__PURE__*/styled.div(_templateObject5$1 || (_templateObject5$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: left;\n  background: #F3F5F9;\n  padding: 15px;\n  border-radius: 5px;\n  margin-top: 15px;\n\n  .text{\n    margin-left: 5px;\n    font-size: 14px;\n    line-height: 1.5;\n  }\n\n  .icon {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-right: 5px;\n\n    svg {\n      width: 35px;\n      height: 35px;\n    }\n  }\n\n"])));
 
-var _templateObject$9, _templateObject2$5, _templateObject3$4, _templateObject4$2;
-var Container$5 = /*#__PURE__*/styled.div(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 100%;\n  margin-right: 5px;\n"])));
-var StyledInput = /*#__PURE__*/styled.input(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 10px;\n  padding-right: 40px;\n  border-radius: 5px;\n  border: 1px solid #ccc;\n  height: 40px;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n    box-shadow: 0 0 0 3px #6690ff;\n  }\n"])));
-var RecordAudioButton = /*#__PURE__*/styled.div(_templateObject3$4 || (_templateObject3$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  cursor: pointer;\n"])));
+var _templateObject$a, _templateObject2$6, _templateObject3$5, _templateObject4$2;
+var Container$5 = /*#__PURE__*/styled.div(_templateObject$a || (_templateObject$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 100%;\n  margin-right: 5px;\n"])));
+var StyledInput = /*#__PURE__*/styled.input(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 10px;\n  padding-right: 40px;\n  border-radius: 5px;\n  border: 1px solid #ccc;\n  height: 40px;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n    box-shadow: 0 0 0 3px #6690ff;\n  }\n"])));
+var RecordAudioButton = /*#__PURE__*/styled.div(_templateObject3$5 || (_templateObject3$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  cursor: pointer;\n"])));
 var StyledMicrophoneIcon = /*#__PURE__*/styled(FaMicrophone)(_templateObject4$2 || (_templateObject4$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  pointer-events: none;\n"])));
 
 var InputTest = function InputTest(_ref) {
@@ -1561,6 +1592,36 @@ var TestArea = function TestArea() {
   var handleTest = function handleTest() {
     dispatch(testAction(search, profile, presset, id));
   };
+  var returnTest = function returnTest() {
+    return React.createElement(Container$4, {
+      isLoading: isLoading
+    }, React.createElement(Header$1, null, React.createElement("div", {
+      className: 'infos'
+    }, React.createElement("h2", null, t.test), React.createElement("p", null, t.testArea.description))), React.createElement(Inputs, null, React.createElement(InputTest, {
+      placeholder: t.testArea.typeSentence,
+      onChange: handleSearch,
+      onRecordAudio: handleRecordAudio
+    }), React.createElement(Select, {
+      placeholder: t.testArea.selectPersona,
+      options: optionsPersona,
+      onSelect: handleSelectPersona
+    }), React.createElement(Select, {
+      placeholder: t.testArea.selectPresset,
+      options: optionsPresset,
+      onSelect: handleSelectPresset
+    }), React.createElement("button", {
+      onClick: handleTest
+    }, React.createElement(PiWaveformBold, null), " ", t.buttons.test)), !results ? React.createElement(EmptyState, {
+      icon: React.createElement(FaList, null),
+      title: t.testArea.emptyState.title,
+      description: t.testArea.emptyState.description,
+      activeButton: false
+    }) : React.createElement(Result, null, React.createElement("div", {
+      className: 'icon'
+    }, React.createElement(MdPerson2, null)), React.createElement("div", {
+      className: 'text'
+    }, results)));
+  };
   return React.createElement(SharedPropsProvider, {
     id: id,
     language: language,
@@ -1568,34 +1629,7 @@ var TestArea = function TestArea() {
       tags: []
     },
     personas: personas
-  }, React.createElement(Container$4, {
-    isLoading: isLoading
-  }, React.createElement(Header$1, null, React.createElement("div", {
-    className: 'infos'
-  }, React.createElement("h2", null, t.test), React.createElement("p", null, t.testArea.description))), React.createElement(Inputs, null, React.createElement(InputTest, {
-    placeholder: t.testArea.typeSentence,
-    onChange: handleSearch,
-    onRecordAudio: handleRecordAudio
-  }), React.createElement(Select, {
-    placeholder: t.testArea.selectPersona,
-    options: optionsPersona,
-    onSelect: handleSelectPersona
-  }), React.createElement(Select, {
-    placeholder: t.testArea.selectPresset,
-    options: optionsPresset,
-    onSelect: handleSelectPresset
-  }), React.createElement("button", {
-    onClick: handleTest
-  }, React.createElement(PiWaveformBold, null), " ", t.buttons.test)), !results ? React.createElement(EmptyState, {
-    icon: React.createElement(FaList, null),
-    title: t.testArea.emptyState.title,
-    description: t.testArea.emptyState.description,
-    activeButton: false
-  }) : React.createElement(Result, null, React.createElement("div", {
-    className: 'icon'
-  }, React.createElement(MdPerson2, null)), React.createElement("div", {
-    className: 'text'
-  }, results))));
+  }, React.createElement(Container$4, null, returnTest()));
 };
 
 var Leia = function Leia(props) {