@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/esm/components/UTAttachmentList/index.js

@@ -1 +1,294 @@
-import React,{useEffect,useRef,useState}from"react";import{func,arrayOf,string,shape,number,node,bool,objectOf,oneOfType,any}from"prop-types";import{fileSignatureValidation,fileSizeValidation}from"@widergy/web-utils/lib/validate";import{resizeImage}from"@widergy/web-utils/lib/image";import{isIE}from"@widergy/web-utils/lib/browser";import isEmpty from"lodash/isEmpty";import{buttonTypes}from"../../types/buttonTypes";import WithTheme from"../WithTheme";import{retrieveStyle}from"./theme";import{FORMAT_ERROR_TEXT,SIZE_ERROR_TEXT,ASPECT_RATIO_ERROR_TEXT,MAX_FILES_ERROR,DEFAULT_MAX_FILES,PREVIEW_TYPES}from"./constants";import Attachment from"./layout";import{pdfAspectRatioValidation,isImage,isPDF,getSizeInMB,hasPreview,isDownloadable,getNotRepeatedFiles,getBlobFromUrl,getDefaultAttachment}from"./utils";const AttachmentListContainer=_ref=>{var _field$configuration,_field$configuration2,_field$configuration3,_field$configuration4,_input$value;let{acceptedFileTypes:defaultAcceptedFileTypes,actions:actions,allowedPDFUploadSizes:allowedPDFUploadSizes,classes:classes,containerClassname:containerClassname,customValidation:customValidation,dataTestId:dataTestId,deleteDataTestId:deleteDataTestId,disabled:disabled,disableResize:disableResize,errorClassname:errorClassname,field:field,fieldTypes:fieldTypes=[],hideLabels:hideLabels,icon:icon,input:input,loadingTextClassname:loadingTextClassname,maxFileSize:defaultMaxFileSize=99999999,onLoaded:onLoaded,notifyOnInitialLoad:notifyOnInitialLoad=!0,previewDataTestId:previewDataTestId,readOnly:readOnly=!1,resizeConfig:resizeConfig,sanitize:sanitize,titleVariant:titleVariant}=_ref;const helpText=null==field||null===(_field$configuration=field.configuration)||void 0===_field$configuration?void 0:_field$configuration.help_text,maxFileSize=(null==field||null===(_field$configuration2=field.configuration)||void 0===_field$configuration2?void 0:_field$configuration2.max_file_size)||defaultMaxFileSize,acceptedFileTypes=(null==field||null===(_field$configuration3=field.configuration)||void 0===_field$configuration3?void 0:_field$configuration3.accepted_file_types)||defaultAcceptedFileTypes,maxFiles=(null==field||null===(_field$configuration4=field.configuration)||void 0===_field$configuration4?void 0:_field$configuration4.max_files)||DEFAULT_MAX_FILES,[preview,setPreview]=useState([]),[error,setError]=useState(!1),[errorText,setErrorText]=useState(FORMAT_ERROR_TEXT),fileInputRef=useRef(null),[updatedFiles,setUpdatedFiles]=useState((null==input||null===(_input$value=input.value)||void 0===_input$value?void 0:_input$value.files)||[]),onFailValidation=(errorMessage,dynamicData)=>{setError(!0),setErrorText(dynamicData?"".concat(errorMessage,"(").concat(dynamicData,")"):errorMessage)},buildPreviews=async files=>{const loadPreview=file=>new Promise((resolve,reject)=>{const reader=new FileReader;reader.onload=e=>{hasPreview(file)||isDownloadable(file)?resolve({src:e.target.result,file:file}):resolve({src:null,file:file})},reader.onerror=e=>reject(e),reader.readAsDataURL(file)});try{const previewItems=(await Promise.all(files.map(loadPreview))).map(_ref2=>{let{src:src,file:file}=_ref2;return((src,item)=>({...item,src:src}))(src,{type:file.type,name:file.name,size:getSizeInMB(file.size),onClick:()=>{return(fileName=file.name)&&setPreview(prevPreview=>prevPreview.filter(item=>item.name!==fileName)),setUpdatedFiles(prevFiles=>{const filteredFiles=Object.values(prevFiles).filter(item=>item.name!==fileName);return input.onChange&&input.onChange(isEmpty(filteredFiles)?null:{files:filteredFiles}),filteredFiles}),fileInputRef.current&&(fileInputRef.current.value=null),void setError(!1);var fileName}})});setPreview(currentPreviews=>getNotRepeatedFiles([...(currentPreviews||[]).filter(item=>"loading"!==item.type),...previewItems]))}catch(e){setPreview(currentPreviews=>(currentPreviews||[]).filter(item=>"loading"!==item.type)),onFailValidation(null==e?void 0:e.message)}},loadDefaultValues=async function(){var _input$value$index,_formattedImages$inde;let index=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,accumulatedFiles=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const length=Array.isArray(input.value)?input.value.length:1;if(index===length)return onLoaded&&onLoaded(),notifyOnInitialLoad&&input.onChange&&input.onChange({files:accumulatedFiles}),setUpdatedFiles(accumulatedFiles),void buildPreviews(accumulatedFiles);const formattedImages=Array.isArray(input.value)?input.value.flatMap(obj=>Object.values(obj)[0]):input.value,imageUrl=Array.isArray(input.value)?(null===(_input$value$index=input.value[index])||void 0===_input$value$index?void 0:_input$value$index.url)||(null===(_formattedImages$inde=formattedImages[index])||void 0===_formattedImages$inde?void 0:_formattedImages$inde.url):input.value;getBlobFromUrl(imageUrl,async response=>{if(response){var _input$value$index2,_formattedImages$inde2;const itemName=Array.isArray(input.value)?(null===(_input$value$index2=input.value[index])||void 0===_input$value$index2?void 0:_input$value$index2.name)||(null===(_formattedImages$inde2=formattedImages[index])||void 0===_formattedImages$inde2?void 0:_formattedImages$inde2.name):null,newFile=new File([response],itemName||getDefaultAttachment(response.type.substring(response.type.indexOf("/")+1),index+1),{type:response.type});loadDefaultValues(index+1,[...accumulatedFiles,newFile])}else setPreview(currentPreviews=>{let foundLoading=!1;return currentPreviews.map(previewElement=>foundLoading||previewElement.type!==PREVIEW_TYPES.LOADING?previewElement:(foundLoading=!0,{...previewElement,type:PREVIEW_TYPES.ERROR}))}),loadDefaultValues(index+1,accumulatedFiles)})};return useEffect(()=>{var _input$value3;if(isEmpty(updatedFiles)?isEmpty(null===(_input$value3=input.value)||void 0===_input$value3?void 0:_input$value3.files)||buildPreviews(input.value.files):buildPreviews(updatedFiles),Array.isArray(input.value)&&!isEmpty(input.value)||input.value&&"string"==typeof input.value){if(isEmpty(preview)){const length=Array.isArray(input.value)?input.value.length:1;setPreview(Array.from({length:length},()=>({type:PREVIEW_TYPES.LOADING})))}loadDefaultValues()}},[input]),React.createElement(Attachment,{actions:actions,acceptedFileTypes:acceptedFileTypes,classes:classes,containerClassname:containerClassname,disabled:disabled,dataTestId:dataTestId,deleteDataTestId:deleteDataTestId,error:error,errorClassname:errorClassname,errorText:errorText,field:field,fieldTypes:fieldTypes,fileInputRef:fileInputRef,helpText:helpText,hideLabels:hideLabels,icon:icon,loadingTextClassname:loadingTextClassname,maxFiles:maxFiles,maxFileSize:getSizeInMB(maxFileSize),onChange:async ev=>{var _input$value2;const prevFiles=(null===(_input$value2=input.value)||void 0===_input$value2?void 0:_input$value2.files)||updatedFiles,files=Object.values(isEmpty(prevFiles)?ev.target.files:getNotRepeatedFiles([...prevFiles,...ev.target.files])),fileErrorTexts={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(getSizeInMB(maxFileSize),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null==allowedPDFUploadSizes?void 0:allowedPDFUploadSizes.map(aspectRatio=>aspectRatio.name).join(" - "),")")};setError(!1);const processFiles=async index=>{if(index<files.length){if(maxFiles&&files.length>maxFiles)return void onFailValidation(MAX_FILES_ERROR,maxFiles);let file=files[index];if(file){let validation=!customValidation||await customValidation(file,onFailValidation);if(validation){if(validation=await fileSignatureValidation(file,fieldTypes,file.type),!validation)return void onFailValidation(fileErrorTexts.formatError);if(sanitize&&(file=await sanitize(file)),validation=fileSizeValidation(file,maxFileSize),validation&&isPDF(file)&&!isEmpty(allowedPDFUploadSizes)&&(validation=await pdfAspectRatioValidation(file,allowedPDFUploadSizes),!validation))return void onFailValidation(fileErrorTexts.aspectRatioError);if(validation||disableResize||!isImage(file)||isIE()||(file=await resizeImage(file,resizeConfig),validation=fileSizeValidation(file,maxFileSize),files[index]=file),!validation)return void onFailValidation(fileErrorTexts.sizeError)}}await processFiles(index+1)}else input.onChange&&input.onChange({files:files}),setUpdatedFiles(files),await buildPreviews(files)};await processFiles(0)},preview:preview,previewDataTestId:previewDataTestId,readOnly:readOnly,titleVariant:titleVariant})};AttachmentListContainer.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),allowedPDFUploadSizes:arrayOf(shape({name:string,heightInPt:number,widthInPt:number,tolerance:number})),classes:objectOf(string),containerClassname:string,customValidation:func,disabled:bool,dataTestId:string,deleteDataTestId:string,disableResize:bool,errorClassname:string,field:any,fieldTypes:arrayOf(string),hideLabels:bool,icon:node,input:shape({value:oneOfType([string,shape({name:string,type:string})])}),loadingTextClassname:string,maxFileSize:number,onLoaded:func,notifyOnInitialLoad:bool,previewDataTestId:string,readOnly:bool,resizeConfig:shape({type:string,maxWidth:number,maxHeight:number}),sanitize:func,titleVariant:string};export default WithTheme(retrieveStyle)(AttachmentListContainer);
+import React, { useEffect, useRef, useState } from 'react';
+import { func, arrayOf, string, shape, number, node, bool, objectOf, oneOfType, any } from 'prop-types';
+import { fileSignatureValidation, fileSizeValidation } from '@widergy/web-utils/lib/validate';
+import { resizeImage } from '@widergy/web-utils/lib/image';
+import { isIE } from '@widergy/web-utils/lib/browser';
+import isEmpty from 'lodash/isEmpty';
+import { buttonTypes } from '../../types/buttonTypes';
+import WithTheme from '../WithTheme';
+import { retrieveStyle } from './theme';
+import { FORMAT_ERROR_TEXT, SIZE_ERROR_TEXT, ASPECT_RATIO_ERROR_TEXT, MAX_FILES_ERROR, DEFAULT_MAX_FILES, PREVIEW_TYPES } from './constants';
+import Attachment from './layout';
+import { pdfAspectRatioValidation, isImage, isPDF, getSizeInMB, hasPreview, isDownloadable, getNotRepeatedFiles, getBlobFromUrl, getDefaultAttachment } from './utils';
+const AttachmentListContainer = _ref => {
+  var _field$configuration, _field$configuration2, _field$configuration3, _field$configuration4, _input$value;
+  let {
+    acceptedFileTypes: defaultAcceptedFileTypes,
+    actions,
+    allowedPDFUploadSizes,
+    classes,
+    containerClassname,
+    customValidation,
+    dataTestId,
+    deleteDataTestId,
+    disabled,
+    disableResize,
+    errorClassname,
+    field,
+    fieldTypes = [],
+    hideLabels,
+    icon,
+    input,
+    loadingTextClassname,
+    maxFileSize: defaultMaxFileSize = 99999999,
+    onLoaded,
+    notifyOnInitialLoad = true,
+    previewDataTestId,
+    readOnly = false,
+    resizeConfig,
+    sanitize,
+    titleVariant
+  } = _ref;
+  const helpText = field === null || field === void 0 || (_field$configuration = field.configuration) === null || _field$configuration === void 0 ? void 0 : _field$configuration.help_text;
+  const maxFileSize = (field === null || field === void 0 || (_field$configuration2 = field.configuration) === null || _field$configuration2 === void 0 ? void 0 : _field$configuration2.max_file_size) || defaultMaxFileSize;
+  const acceptedFileTypes = (field === null || field === void 0 || (_field$configuration3 = field.configuration) === null || _field$configuration3 === void 0 ? void 0 : _field$configuration3.accepted_file_types) || defaultAcceptedFileTypes;
+  const maxFiles = (field === null || field === void 0 || (_field$configuration4 = field.configuration) === null || _field$configuration4 === void 0 ? void 0 : _field$configuration4.max_files) || DEFAULT_MAX_FILES;
+  const [preview, setPreview] = useState([]);
+  const [error, setError] = useState(false);
+  const [errorText, setErrorText] = useState(FORMAT_ERROR_TEXT);
+  const fileInputRef = useRef(null);
+  const [updatedFiles, setUpdatedFiles] = useState((input === null || input === void 0 || (_input$value = input.value) === null || _input$value === void 0 ? void 0 : _input$value.files) || []);
+  const removePreviewItem = fileName => {
+    if (fileName) setPreview(prevPreview => prevPreview.filter(item => item.name !== fileName));
+    setUpdatedFiles(prevFiles => {
+      const filteredFiles = Object.values(prevFiles).filter(item => item.name !== fileName);
+      if (input.onChange) input.onChange(isEmpty(filteredFiles) ? null : {
+        files: filteredFiles
+      });
+      return filteredFiles;
+    });
+    if (fileInputRef.current) {
+      fileInputRef.current.value = null;
+    }
+    setError(false);
+  };
+  const onFailValidation = (errorMessage, dynamicData) => {
+    setError(true);
+    setErrorText(dynamicData ? "".concat(errorMessage, "(").concat(dynamicData, ")") : errorMessage);
+  };
+  const buildPreviews = async files => {
+    const loadPreview = file => new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = e => {
+        if (hasPreview(file) || isDownloadable(file)) {
+          resolve({
+            src: e.target.result,
+            file
+          });
+        } else {
+          resolve({
+            src: null,
+            file
+          });
+        }
+      };
+      reader.onerror = e => reject(e);
+      reader.readAsDataURL(file);
+    });
+    const createPreviewItem = (src, item) => ({
+      ...item,
+      src
+    });
+    try {
+      const previews = await Promise.all(files.map(loadPreview));
+      const previewItems = previews.map(_ref2 => {
+        let {
+          src,
+          file
+        } = _ref2;
+        return createPreviewItem(src, {
+          type: file.type,
+          name: file.name,
+          size: getSizeInMB(file.size),
+          onClick: () => removePreviewItem(file.name)
+        });
+      });
+      setPreview(currentPreviews => getNotRepeatedFiles([...(currentPreviews || []).filter(item => item.type !== 'loading'), ...previewItems]));
+    } catch (e) {
+      setPreview(currentPreviews => (currentPreviews || []).filter(item => item.type !== 'loading'));
+      onFailValidation(e === null || e === void 0 ? void 0 : e.message);
+    }
+  };
+  const onChange = async ev => {
+    var _input$value2;
+    const prevFiles = ((_input$value2 = input.value) === null || _input$value2 === void 0 ? void 0 : _input$value2.files) || updatedFiles;
+    const files = Object.values(isEmpty(prevFiles) ? ev.target.files : getNotRepeatedFiles([...prevFiles, ...ev.target.files]));
+    const fileErrorTexts = {
+      formatError: FORMAT_ERROR_TEXT,
+      sizeError: "".concat(SIZE_ERROR_TEXT, " ").concat(getSizeInMB(maxFileSize), "MB."),
+      aspectRatioError: "".concat(ASPECT_RATIO_ERROR_TEXT, " ").concat(allowedPDFUploadSizes === null || allowedPDFUploadSizes === void 0 ? void 0 : allowedPDFUploadSizes.map(aspectRatio => aspectRatio.name).join(' - '), ")")
+    };
+    setError(false);
+    const processFiles = async index => {
+      if (index < files.length) {
+        if (maxFiles && files.length > maxFiles) {
+          onFailValidation(MAX_FILES_ERROR, maxFiles);
+          return;
+        }
+        let file = files[index];
+        if (file) {
+          let validation = !customValidation || (await customValidation(file, onFailValidation));
+          if (validation) {
+            validation = await fileSignatureValidation(file, fieldTypes, file.type);
+            if (validation) {
+              if (sanitize) file = await sanitize(file);
+              validation = fileSizeValidation(file, maxFileSize);
+              if (validation && isPDF(file) && !isEmpty(allowedPDFUploadSizes)) {
+                validation = await pdfAspectRatioValidation(file, allowedPDFUploadSizes);
+                if (!validation) {
+                  onFailValidation(fileErrorTexts.aspectRatioError);
+                  return;
+                }
+              }
+              if (!validation && !disableResize && isImage(file) && !isIE()) {
+                file = await resizeImage(file, resizeConfig);
+                validation = fileSizeValidation(file, maxFileSize);
+                files[index] = file;
+              }
+              if (!validation) {
+                onFailValidation(fileErrorTexts.sizeError);
+                return;
+              }
+            } else {
+              onFailValidation(fileErrorTexts.formatError);
+              return;
+            }
+          }
+        }
+        await processFiles(index + 1);
+      } else {
+        if (input.onChange) input.onChange({
+          files
+        });
+        setUpdatedFiles(files);
+        await buildPreviews(files);
+      }
+    };
+    await processFiles(0);
+  };
+  const loadDefaultValues = async function () {
+    var _input$value$index, _formattedImages$inde;
+    let index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    let accumulatedFiles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+    const length = Array.isArray(input.value) ? input.value.length : 1;
+    if (index === length) {
+      if (onLoaded) onLoaded();
+      if (notifyOnInitialLoad && input.onChange) input.onChange({
+        files: accumulatedFiles
+      });
+      setUpdatedFiles(accumulatedFiles);
+      buildPreviews(accumulatedFiles);
+      return;
+    }
+    const formattedImages = Array.isArray(input.value) ? input.value.flatMap(obj => Object.values(obj)[0]) : input.value;
+    const imageUrl = Array.isArray(input.value) ? ((_input$value$index = input.value[index]) === null || _input$value$index === void 0 ? void 0 : _input$value$index.url) || ((_formattedImages$inde = formattedImages[index]) === null || _formattedImages$inde === void 0 ? void 0 : _formattedImages$inde.url) : input.value;
+    getBlobFromUrl(imageUrl, async response => {
+      if (response) {
+        var _input$value$index2, _formattedImages$inde2;
+        const itemName = Array.isArray(input.value) ? ((_input$value$index2 = input.value[index]) === null || _input$value$index2 === void 0 ? void 0 : _input$value$index2.name) || ((_formattedImages$inde2 = formattedImages[index]) === null || _formattedImages$inde2 === void 0 ? void 0 : _formattedImages$inde2.name) : null;
+        const newFile = new File([response], itemName || getDefaultAttachment(response.type.substring(response.type.indexOf('/') + 1), index + 1), {
+          type: response.type
+        });
+        loadDefaultValues(index + 1, [...accumulatedFiles, newFile]);
+      } else {
+        setPreview(currentPreviews => {
+          let foundLoading = false;
+          return currentPreviews.map(previewElement => {
+            if (!foundLoading && previewElement.type === PREVIEW_TYPES.LOADING) {
+              foundLoading = true;
+              return {
+                ...previewElement,
+                type: PREVIEW_TYPES.ERROR
+              };
+            }
+            return previewElement;
+          });
+        });
+        loadDefaultValues(index + 1, accumulatedFiles);
+      }
+    });
+  };
+  useEffect(() => {
+    var _input$value3;
+    if (!isEmpty(updatedFiles)) buildPreviews(updatedFiles);else if (!isEmpty((_input$value3 = input.value) === null || _input$value3 === void 0 ? void 0 : _input$value3.files)) buildPreviews(input.value.files);
+    if (Array.isArray(input.value) && !isEmpty(input.value) || input.value && typeof input.value === 'string') {
+      if (isEmpty(preview)) {
+        const length = Array.isArray(input.value) ? input.value.length : 1;
+        setPreview(Array.from({
+          length
+        }, () => ({
+          type: PREVIEW_TYPES.LOADING
+        })));
+      }
+      loadDefaultValues();
+    }
+  }, [input]);
+  return /*#__PURE__*/React.createElement(Attachment, {
+    actions: actions,
+    acceptedFileTypes: acceptedFileTypes,
+    classes: classes,
+    containerClassname: containerClassname,
+    disabled: disabled,
+    dataTestId: dataTestId,
+    deleteDataTestId: deleteDataTestId,
+    error: error,
+    errorClassname: errorClassname,
+    errorText: errorText,
+    field: field,
+    fieldTypes: fieldTypes,
+    fileInputRef: fileInputRef,
+    helpText: helpText,
+    hideLabels: hideLabels,
+    icon: icon,
+    loadingTextClassname: loadingTextClassname,
+    maxFiles: maxFiles,
+    maxFileSize: getSizeInMB(maxFileSize),
+    onChange: onChange,
+    preview: preview,
+    previewDataTestId: previewDataTestId,
+    readOnly: readOnly,
+    titleVariant: titleVariant
+  });
+};
+AttachmentListContainer.propTypes = {
+  acceptedFileTypes: string,
+  actions: arrayOf(buttonTypes),
+  allowedPDFUploadSizes: arrayOf(shape({
+    name: string,
+    heightInPt: number,
+    widthInPt: number,
+    tolerance: number
+  })),
+  classes: objectOf(string),
+  containerClassname: string,
+  customValidation: func,
+  disabled: bool,
+  dataTestId: string,
+  deleteDataTestId: string,
+  disableResize: bool,
+  errorClassname: string,
+  field: any,
+  fieldTypes: arrayOf(string),
+  hideLabels: bool,
+  icon: node,
+  input: shape({
+    value: oneOfType([string, shape({
+      name: string,
+      type: string
+    })])
+  }),
+  loadingTextClassname: string,
+  maxFileSize: number,
+  onLoaded: func,
+  notifyOnInitialLoad: bool,
+  previewDataTestId: string,
+  readOnly: bool,
+  resizeConfig: shape({
+    type: string,
+    maxWidth: number,
+    maxHeight: number
+  }),
+  sanitize: func,
+  titleVariant: string
+};
+export default WithTheme(retrieveStyle)(AttachmentListContainer);

package/dist/esm/components/UTAttachmentList/layout.js

@@ -1 +1,200 @@
-import React,{Fragment,useState}from"react";import{shape,string,bool,func,arrayOf,objectOf,elementType,instanceOf,number,object}from"prop-types";import{inputFiles}from"@widergy/web-utils/lib/constants/files";import isEmpty from"lodash/isEmpty";import download from"downloadjs";import{buttonTypes}from"../../types/buttonTypes";import UTLabel from"../UTLabel";import UTButton from"../UTButton";import UTIcon from"../UTIcon";import UTFieldLabel from"../UTFieldLabel";import{DEFAULT_UPLOADING_TEXT,FILE_NOT_FOUND_ERROR_TEXT,FORMAT_FILE_LABEL,ICON_SIZE,INDICATIONS,MAX_SIZE_FILE_LABEL,MB_LABEL,PREVIEW_TYPES,UPLOAD_FILE,previewPropType}from"./constants";import Preview from"./components/Preview";import{getAvailableFileTypesLabel,isAudio,isDownloadable,isImage,isVideo}from"./utils";import PreviewModal from"./components/PreviewModal";import styles from"./styles.module.scss";const AttachmentList=_ref=>{var _field$configuration;let{actions:actions,acceptedFileTypes:acceptedFileTypes,classes:classes,dataTestId:dataTestId,deleteDataTestId:deleteDataTestId,disabled:disabled,error:error,errorText:errorText,field:field,fieldTypes:fieldTypes=[],fileInputRef:fileInputRef,helpText:helpText,hideLabels:hideLabels,maxFiles:maxFiles,maxFileSize:maxFileSize,onChange:onChange,preview:preview,previewDataTestId:previewDataTestId,readOnly:readOnly,RemoveIcon:RemoveIcon,titleVariant:titleVariant}=_ref;const shouldShowUpperTitle=((null==field||null===(_field$configuration=field.configuration)||void 0===_field$configuration?void 0:_field$configuration.ignore_title)||hideLabels)&&(null==field?void 0:field.title),fieldType=acceptedFileTypes||fieldTypes.map(type=>inputFiles[type].inputType).join(),Icon=RemoveIcon||"IconTrash",previewIsEmpty=isEmpty(preview),isUploadFileAvailable=preview.length<maxFiles,[previewModalIsOpen,setPreviewModalIsOpen]=useState(!1),[selectedPreview,setSelectedPreview]=useState(null),openPreviewModal=clickedPreview=>{setSelectedPreview(clickedPreview),setPreviewModalIsOpen(!0)};return React.createElement(Fragment,null,shouldShowUpperTitle&&React.createElement("div",{className:styles.upperTitleContainer},React.createElement(UTFieldLabel,{actions:actions,readOnly:field.read_only,size:titleVariant,required:field.required},null==field?void 0:field.title)),React.createElement("div",{className:"".concat(styles.container," ").concat(classes.container," ").concat(error&&classes.errorContainer," ").concat(readOnly&&classes.readOnlyContainer)},!previewIsEmpty&&preview.map(previewItem=>React.createElement("div",{className:"".concat(styles.previewContainer," ").concat(classes.previewContainer),"data-testid":previewDataTestId},previewItem.type===PREVIEW_TYPES.LOADING?React.createElement(Fragment,null,React.createElement(UTIcon,{name:"IconLoader",className:styles.loaderIcon,size:ICON_SIZE,colorTheme:"accent"}),React.createElement(UTLabel,{className:styles.loadingText,colorTheme:"gray",variant:"small"},DEFAULT_UPLOADING_TEXT),React.createElement("div",null)):previewItem.type===PREVIEW_TYPES.ERROR?React.createElement(Fragment,null,React.createElement(UTIcon,{name:"IconX",colorTheme:"error",size:ICON_SIZE}),React.createElement(UTLabel,{className:styles.errorText,colorTheme:"error",variant:"small"},FILE_NOT_FOUND_ERROR_TEXT),React.createElement("div",null)):React.createElement(Fragment,null,previewItem.src?React.createElement(Preview,{classes:classes,openPreviewModal:openPreviewModal,preview:previewItem,previewProps:preview.previewProps}):React.createElement(UTIcon,{name:"IconCheck",colorTheme:"accent",size:ICON_SIZE}),React.createElement("div",{className:styles.fileContainer},React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},previewItem.name),React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},previewItem.size,MB_LABEL)),(isAudio(previewItem)||isVideo(previewItem))&&React.createElement(UTButton,{disabled:disabled,Icon:"IconPlayerPlay",onClick:()=>{setSelectedPreview(previewItem),setPreviewModalIsOpen(!0)},size:"small",variant:"text"}),(isDownloadable(previewItem)||readOnly&&isImage(previewItem))&&previewItem.src&&React.createElement(UTButton,{Icon:"IconDownload",onClick:()=>download(previewItem.src,previewItem.name,previewItem.type),size:"small",variant:"text"}),!readOnly&&React.createElement(UTButton,{dataTestId:deleteDataTestId,disabled:disabled,Icon:Icon,onClick:previewItem.onClick,size:"small",variant:"text"})))),!readOnly&&previewIsEmpty&&React.createElement(UTIcon,{name:"IconCloudUpload",className:"".concat(styles.filesIcon," ").concat(classes.filesIcon),colorTheme:"accent",size:ICON_SIZE}),!readOnly&&React.createElement("div",{className:"".concat(styles.labelAndInputContainer," ").concat(!previewIsEmpty&&styles.positionRelative)},previewIsEmpty&&React.createElement(UTLabel,{colorTheme:"accent"},INDICATIONS),React.createElement(UTButton,{classNames:{root:!previewIsEmpty&&styles.uploadButtonFullWidth},colorTheme:"primary",disabled:!isUploadFileAvailable,Icon:"IconUpload",variant:"semitransparent"},UPLOAD_FILE),isUploadFileAvailable&&React.createElement("input",{className:styles.input,"data-testid":dataTestId,accept:fieldType,ref:fileInputRef,type:"file",onChange:onChange,disabled:disabled,multiple:!0})),!readOnly&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small",className:styles.aclaration},"".concat(FORMAT_FILE_LABEL).concat(getAvailableFileTypesLabel(fieldType),".")," ",React.createElement("br",null),"".concat(MAX_SIZE_FILE_LABEL).concat(maxFileSize,"MB"))),helpText&&React.createElement(UTLabel,{className:styles.helpText,colorTheme:"gray",variant:"small"},helpText),error&&React.createElement("div",{className:styles.errorLabelContainer},React.createElement(UTIcon,{name:"IconX",colorTheme:"error",size:ICON_SIZE}),React.createElement(UTLabel,{className:styles.errorText,colorTheme:"error",variant:"small"},errorText)),previewModalIsOpen&&React.createElement(PreviewModal,{preview:selectedPreview,previewProps:preview.previewProps,previewModalIsOpen:previewModalIsOpen,closePreviewModal:()=>setPreviewModalIsOpen(!1)}))};AttachmentList.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),classes:objectOf(string),dataTestId:string,deleteDataTestId:string,disabled:bool,error:bool,errorText:string,field:object,fieldTypes:arrayOf(string),fileInputRef:objectOf(shape({current:instanceOf(Element)})),helpText:string,hideLabels:bool,maxFileSize:number,maxFiles:number,onChange:func,preview:arrayOf(shape({src:string,type:string})),previewDataTestId:string,previewProps:previewPropType,readOnly:bool,RemoveIcon:elementType,titleVariant:string};export default AttachmentList;
+import React, { Fragment, useState } from 'react';
+import { shape, string, bool, func, arrayOf, objectOf, elementType, instanceOf, number, object } from 'prop-types';
+import { inputFiles } from '@widergy/web-utils/lib/constants/files';
+import isEmpty from 'lodash/isEmpty';
+import download from 'downloadjs';
+import { buttonTypes } from '../../types/buttonTypes';
+import UTLabel from '../UTLabel';
+import UTButton from '../UTButton';
+import UTIcon from '../UTIcon';
+import UTFieldLabel from '../UTFieldLabel';
+import { DEFAULT_UPLOADING_TEXT, FILE_NOT_FOUND_ERROR_TEXT, FORMAT_FILE_LABEL, ICON_SIZE, INDICATIONS, MAX_SIZE_FILE_LABEL, MB_LABEL, PREVIEW_TYPES, UPLOAD_FILE, previewPropType } from './constants';
+import Preview from './components/Preview';
+import { getAvailableFileTypesLabel, isAudio, isDownloadable, isImage, isVideo } from './utils';
+import PreviewModal from './components/PreviewModal';
+import styles from './styles.module.scss';
+const AttachmentList = _ref => {
+  var _field$configuration;
+  let {
+    actions,
+    acceptedFileTypes,
+    classes,
+    dataTestId,
+    deleteDataTestId,
+    disabled,
+    error,
+    errorText,
+    field,
+    fieldTypes = [],
+    fileInputRef,
+    helpText,
+    hideLabels,
+    maxFiles,
+    maxFileSize,
+    onChange,
+    preview,
+    previewDataTestId,
+    readOnly,
+    RemoveIcon,
+    titleVariant
+  } = _ref;
+  const shouldShowUpperTitle = ((field === null || field === void 0 || (_field$configuration = field.configuration) === null || _field$configuration === void 0 ? void 0 : _field$configuration.ignore_title) || hideLabels) && (field === null || field === void 0 ? void 0 : field.title);
+  const fieldType = acceptedFileTypes || fieldTypes.map(type => inputFiles[type].inputType).join();
+  const Icon = RemoveIcon || 'IconTrash';
+  const previewIsEmpty = isEmpty(preview);
+  const isUploadFileAvailable = preview.length < maxFiles;
+  const [previewModalIsOpen, setPreviewModalIsOpen] = useState(false);
+  const [selectedPreview, setSelectedPreview] = useState(null);
+  const openPreviewModal = clickedPreview => {
+    setSelectedPreview(clickedPreview);
+    setPreviewModalIsOpen(true);
+  };
+  const closePreviewModal = () => setPreviewModalIsOpen(false);
+  return /*#__PURE__*/React.createElement(Fragment, null, shouldShowUpperTitle && /*#__PURE__*/React.createElement("div", {
+    className: styles.upperTitleContainer
+  }, /*#__PURE__*/React.createElement(UTFieldLabel, {
+    actions: actions,
+    readOnly: field.read_only,
+    size: titleVariant,
+    required: field.required
+  }, field === null || field === void 0 ? void 0 : field.title)), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.container, " ").concat(classes.container, " ").concat(error && classes.errorContainer, " ").concat(readOnly && classes.readOnlyContainer)
+  }, !previewIsEmpty && preview.map(previewItem => /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.previewContainer, " ").concat(classes.previewContainer),
+    "data-testid": previewDataTestId
+  }, previewItem.type === PREVIEW_TYPES.LOADING ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(UTIcon, {
+    name: "IconLoader",
+    className: styles.loaderIcon,
+    size: ICON_SIZE,
+    colorTheme: "accent"
+  }), /*#__PURE__*/React.createElement(UTLabel, {
+    className: styles.loadingText,
+    colorTheme: "gray",
+    variant: "small"
+  }, DEFAULT_UPLOADING_TEXT), /*#__PURE__*/React.createElement("div", null)) : previewItem.type === PREVIEW_TYPES.ERROR ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(UTIcon, {
+    name: "IconX",
+    colorTheme: "error",
+    size: ICON_SIZE
+  }), /*#__PURE__*/React.createElement(UTLabel, {
+    className: styles.errorText,
+    colorTheme: "error",
+    variant: "small"
+  }, FILE_NOT_FOUND_ERROR_TEXT), /*#__PURE__*/React.createElement("div", null)) : /*#__PURE__*/React.createElement(Fragment, null, previewItem.src ? /*#__PURE__*/React.createElement(Preview, {
+    classes: classes,
+    openPreviewModal: openPreviewModal,
+    preview: previewItem,
+    previewProps: preview.previewProps
+  }) : /*#__PURE__*/React.createElement(UTIcon, {
+    name: "IconCheck",
+    colorTheme: "accent",
+    size: ICON_SIZE
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.fileContainer
+  }, /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    variant: "small"
+  }, previewItem.name), /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    variant: "small"
+  }, previewItem.size, MB_LABEL)), (isAudio(previewItem) || isVideo(previewItem)) && /*#__PURE__*/React.createElement(UTButton, {
+    disabled: disabled,
+    Icon: "IconPlayerPlay",
+    onClick: () => {
+      setSelectedPreview(previewItem);
+      setPreviewModalIsOpen(true);
+    },
+    size: "small",
+    variant: "text"
+  }), (isDownloadable(previewItem) || readOnly && isImage(previewItem)) && previewItem.src && /*#__PURE__*/React.createElement(UTButton, {
+    Icon: "IconDownload",
+    onClick: () => download(previewItem.src, previewItem.name, previewItem.type),
+    size: "small",
+    variant: "text"
+  }), !readOnly && /*#__PURE__*/React.createElement(UTButton, {
+    dataTestId: deleteDataTestId,
+    disabled: disabled,
+    Icon: Icon,
+    onClick: previewItem.onClick,
+    size: "small",
+    variant: "text"
+  })))), !readOnly && previewIsEmpty && /*#__PURE__*/React.createElement(UTIcon, {
+    name: "IconCloudUpload",
+    className: "".concat(styles.filesIcon, " ").concat(classes.filesIcon),
+    colorTheme: "accent",
+    size: ICON_SIZE
+  }), !readOnly && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.labelAndInputContainer, " ").concat(!previewIsEmpty && styles.positionRelative)
+  }, previewIsEmpty && /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "accent"
+  }, INDICATIONS), /*#__PURE__*/React.createElement(UTButton, {
+    classNames: {
+      root: !previewIsEmpty && styles.uploadButtonFullWidth
+    },
+    colorTheme: "primary",
+    disabled: !isUploadFileAvailable,
+    Icon: "IconUpload",
+    variant: "semitransparent"
+  }, UPLOAD_FILE), isUploadFileAvailable && /*#__PURE__*/React.createElement("input", {
+    className: styles.input,
+    "data-testid": dataTestId,
+    accept: fieldType,
+    ref: fileInputRef,
+    type: "file",
+    onChange: onChange,
+    disabled: disabled,
+    multiple: true
+  })), !readOnly && /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    variant: "small",
+    className: styles.aclaration
+  }, "".concat(FORMAT_FILE_LABEL).concat(getAvailableFileTypesLabel(fieldType), "."), " ", /*#__PURE__*/React.createElement("br", null), "".concat(MAX_SIZE_FILE_LABEL).concat(maxFileSize, "MB"))), helpText && /*#__PURE__*/React.createElement(UTLabel, {
+    className: styles.helpText,
+    colorTheme: "gray",
+    variant: "small"
+  }, helpText), error && /*#__PURE__*/React.createElement("div", {
+    className: styles.errorLabelContainer
+  }, /*#__PURE__*/React.createElement(UTIcon, {
+    name: "IconX",
+    colorTheme: "error",
+    size: ICON_SIZE
+  }), /*#__PURE__*/React.createElement(UTLabel, {
+    className: styles.errorText,
+    colorTheme: "error",
+    variant: "small"
+  }, errorText)), previewModalIsOpen && /*#__PURE__*/React.createElement(PreviewModal, {
+    preview: selectedPreview,
+    previewProps: preview.previewProps,
+    previewModalIsOpen: previewModalIsOpen,
+    closePreviewModal: closePreviewModal
+  }));
+};
+AttachmentList.propTypes = {
+  acceptedFileTypes: string,
+  actions: arrayOf(buttonTypes),
+  classes: objectOf(string),
+  dataTestId: string,
+  deleteDataTestId: string,
+  disabled: bool,
+  error: bool,
+  errorText: string,
+  field: object,
+  fieldTypes: arrayOf(string),
+  fileInputRef: objectOf(shape({
+    current: instanceOf(Element)
+  })),
+  helpText: string,
+  hideLabels: bool,
+  maxFileSize: number,
+  maxFiles: number,
+  onChange: func,
+  preview: arrayOf(shape({
+    src: string,
+    type: string
+  })),
+  previewDataTestId: string,
+  previewProps: previewPropType,
+  readOnly: bool,
+  RemoveIcon: elementType,
+  titleVariant: string
+};
+export default AttachmentList;

package/dist/esm/components/UTAttachmentList/theme.js

@@ -1 +1,21 @@
-export const retrieveStyle=_ref=>{var _theme$Palette,_theme$Palette2,_theme$Palette3,_theme$Palette4,_theme$Palette5;let{theme:theme}=_ref;return{container:{backgroundColor:null===(_theme$Palette=theme.Palette)||void 0===_theme$Palette?void 0:_theme$Palette.light["03"],border:"1px dashed ".concat((null===(_theme$Palette2=theme.Palette)||void 0===_theme$Palette2||null===(_theme$Palette2=_theme$Palette2.actions)||void 0===_theme$Palette2||null===(_theme$Palette2=_theme$Palette2.accent)||void 0===_theme$Palette2?void 0:_theme$Palette2["04"])||theme.Palette.accent["04"])},errorContainer:{border:"2px solid ".concat(null===(_theme$Palette3=theme.Palette)||void 0===_theme$Palette3?void 0:_theme$Palette3.error["04"])},previewContainer:{backgroundColor:null===(_theme$Palette4=theme.Palette)||void 0===_theme$Palette4?void 0:_theme$Palette4.light["01"]},readOnlyContainer:{border:"1px solid ".concat(null===(_theme$Palette5=theme.Palette)||void 0===_theme$Palette5?void 0:_theme$Palette5.light["04"])}}};
+export const retrieveStyle = _ref => {
+  var _theme$Palette, _theme$Palette2, _theme$Palette3, _theme$Palette4, _theme$Palette5;
+  let {
+    theme
+  } = _ref;
+  return {
+    container: {
+      backgroundColor: (_theme$Palette = theme.Palette) === null || _theme$Palette === void 0 ? void 0 : _theme$Palette.light['03'],
+      border: "1px dashed ".concat(((_theme$Palette2 = theme.Palette) === null || _theme$Palette2 === void 0 || (_theme$Palette2 = _theme$Palette2.actions) === null || _theme$Palette2 === void 0 || (_theme$Palette2 = _theme$Palette2.accent) === null || _theme$Palette2 === void 0 ? void 0 : _theme$Palette2['04']) || theme.Palette.accent['04'])
+    },
+    errorContainer: {
+      border: "2px solid ".concat((_theme$Palette3 = theme.Palette) === null || _theme$Palette3 === void 0 ? void 0 : _theme$Palette3.error['04'])
+    },
+    previewContainer: {
+      backgroundColor: (_theme$Palette4 = theme.Palette) === null || _theme$Palette4 === void 0 ? void 0 : _theme$Palette4.light['01']
+    },
+    readOnlyContainer: {
+      border: "1px solid ".concat((_theme$Palette5 = theme.Palette) === null || _theme$Palette5 === void 0 ? void 0 : _theme$Palette5.light['04'])
+    }
+  };
+};

package/dist/esm/components/UTAttachmentList/utils.js

@@ -1 +1,72 @@
-import{inputFiles}from"@widergy/web-utils/lib/constants/files";import{DEFAULT_ATTACHMENT_NAME}from"./constants";window["pdfjs-dist/build/pdf"]&&(window["pdfjs-dist/build/pdf"].GlobalWorkerOptions.workerSrc="//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(window["pdfjs-dist/build/pdf"].version,"/pdf.worker.js"));const getImage=async imageUrl=>fetch(imageUrl,{method:"GET"}).catch(error=>console.error(error));export const getBlobFromUrl=async(imageUrl,callback)=>{if(!imageUrl||!callback)return!1;const response=await getImage(imageUrl);if(null!=response&&response.ok)try{callback(await response.blob())}catch{callback(null)}else callback(null)};const lengthMatches=(length1,length2,toleranceInPercentage)=>{const delta=length1*(toleranceInPercentage/100);return Math.abs(length1-length2)<delta},pageMatches=(page,allowedPDFUploadSizes)=>{const viewport=page.getViewport({scale:1});return allowedPDFUploadSizes.some(size=>lengthMatches(size.heightInPt,viewport.height,size.toleranceInPercentage)&&lengthMatches(size.widthInPt,viewport.width,size.toleranceInPercentage)||lengthMatches(size.heightInPt,viewport.width,size.toleranceInPercentage)&&lengthMatches(size.widthInPt,viewport.height,size.toleranceInPercentage))};export const pdfAspectRatioValidation=async(file,allowedPDFUploadSizes)=>{const documentLoadingTask=window["pdfjs-dist/build/pdf"].getDocument(URL.createObjectURL(file)),document=await documentLoadingTask.promise,totalPages=document.numPages,getPagePromises=[];for(let pageNumber=1;pageNumber<=totalPages;pageNumber+=1)getPagePromises.push(document.getPage(pageNumber));return(await Promise.all(getPagePromises)).every(page=>pageMatches(page,allowedPDFUploadSizes))};export const isImage=file=>inputFiles.image.validType.includes(null==file?void 0:file.type);export const isPDF=file=>inputFiles.pdf.validType.includes(null==file?void 0:file.type);export const isAudio=file=>inputFiles.audio.validType.includes(null==file?void 0:file.type);export const isVideo=file=>inputFiles.video.validType.includes(null==file?void 0:file.type);export const isHTML=file=>inputFiles.html.validType.includes(null==file?void 0:file.type);export const isCSV=file=>inputFiles.csv.validType.includes(null==file?void 0:file.type);export const isXLS=file=>inputFiles.xls.validType.includes(null==file?void 0:file.type);export const isXLSX=file=>inputFiles.xlsx.validType.includes(null==file?void 0:file.type);export const isDownloadable=file=>isPDF(file)||isCSV(file)||isXLS(file)||isXLSX(file);export const hasPreview=file=>isImage(file)||isAudio(file)||isVideo(file)||isPDF(file);export const isValidFile=file=>hasPreview(file)||isPDF(file)||isHTML(file);export const isNewFile=(newFile,oldFile)=>{var _newFile$file,_oldFile$file;if(!newFile&&!oldFile)return!1;if(!newFile||!oldFile)return!0;const newFileType=typeof newFile;return newFileType!==typeof oldFile||("string"===newFileType?newFile!==oldFile:(null===(_newFile$file=newFile.file)||void 0===_newFile$file?void 0:_newFile$file.lastModified)!==(null===(_oldFile$file=oldFile.file)||void 0===_oldFile$file?void 0:_oldFile$file.lastModified))};export const getAvailableFileTypesLabel=acceptedFileTypes=>Array.isArray(acceptedFileTypes)?acceptedFileTypes.join(", ").replace(/,\s([^,]+)$/," o $1"):acceptedFileTypes.split(",").filter(type=>type.trim().startsWith(".")).join(", ").replace(/,\s([^,]+)$/," o $1");export const getSizeInMB=maxFileSize=>(maxFileSize/1048576).toFixed(2);export const getNotRepeatedFiles=files=>files.filter((file,index,self)=>index===self.findIndex(f=>f.name===file.name));export const getDefaultAttachment=(fileType,index)=>"".concat(DEFAULT_ATTACHMENT_NAME,"-").concat(index).concat(fileType&&".".concat(fileType));
+import { inputFiles } from '@widergy/web-utils/lib/constants/files';
+import { DEFAULT_ATTACHMENT_NAME } from './constants';
+if (window['pdfjs-dist/build/pdf']) window['pdfjs-dist/build/pdf'].GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(window['pdfjs-dist/build/pdf'].version, "/pdf.worker.js");
+const getImage = async imageUrl => fetch(imageUrl, {
+  method: 'GET'
+}).catch(error => console.error(error)); // eslint-disable-line no-console
+
+export const getBlobFromUrl = async (imageUrl, callback) => {
+  if (!imageUrl || !callback) return false;
+  const response = await getImage(imageUrl);
+  if (response !== null && response !== void 0 && response.ok) {
+    try {
+      const blob = await response.blob();
+      callback(blob);
+    } catch {
+      callback(null);
+    }
+  } else {
+    callback(null);
+  }
+};
+const lengthMatches = (length1, length2, toleranceInPercentage) => {
+  const delta = length1 * (toleranceInPercentage / 100);
+  return Math.abs(length1 - length2) < delta;
+};
+const pageMatches = (page, allowedPDFUploadSizes) => {
+  const viewport = page.getViewport({
+    scale: 1
+  });
+  return allowedPDFUploadSizes.some(size => lengthMatches(size.heightInPt, viewport.height, size.toleranceInPercentage) && lengthMatches(size.widthInPt, viewport.width, size.toleranceInPercentage) || lengthMatches(size.heightInPt, viewport.width, size.toleranceInPercentage) && lengthMatches(size.widthInPt, viewport.height, size.toleranceInPercentage));
+};
+export const pdfAspectRatioValidation = async (file, allowedPDFUploadSizes) => {
+  const documentLoadingTask = window['pdfjs-dist/build/pdf'].getDocument(URL.createObjectURL(file));
+  const document = await documentLoadingTask.promise;
+  const totalPages = document.numPages;
+  const getPagePromises = [];
+  for (let pageNumber = 1; pageNumber <= totalPages; pageNumber += 1) {
+    getPagePromises.push(document.getPage(pageNumber));
+  }
+  const pages = await Promise.all(getPagePromises);
+  return pages.every(page => pageMatches(page, allowedPDFUploadSizes));
+};
+export const isImage = file => inputFiles.image.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isPDF = file => inputFiles.pdf.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isAudio = file => inputFiles.audio.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isVideo = file => inputFiles.video.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isHTML = file => inputFiles.html.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isCSV = file => inputFiles.csv.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isXLS = file => inputFiles.xls.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isXLSX = file => inputFiles.xlsx.validType.includes(file === null || file === void 0 ? void 0 : file.type);
+export const isDownloadable = file => isPDF(file) || isCSV(file) || isXLS(file) || isXLSX(file);
+export const hasPreview = file => isImage(file) || isAudio(file) || isVideo(file) || isPDF(file);
+export const isValidFile = file => hasPreview(file) || isPDF(file) || isHTML(file);
+export const isNewFile = (newFile, oldFile) => {
+  var _newFile$file, _oldFile$file;
+  if (!newFile && !oldFile) return false;
+  if (!newFile || !oldFile) return true;
+  const newFileType = typeof newFile;
+  const oldFileType = typeof oldFile;
+  if (newFileType !== oldFileType) return true;
+  if (newFileType === 'string') return newFile !== oldFile;
+  return ((_newFile$file = newFile.file) === null || _newFile$file === void 0 ? void 0 : _newFile$file.lastModified) !== ((_oldFile$file = oldFile.file) === null || _oldFile$file === void 0 ? void 0 : _oldFile$file.lastModified);
+};
+export const getAvailableFileTypesLabel = acceptedFileTypes => {
+  if (Array.isArray(acceptedFileTypes)) {
+    return acceptedFileTypes.join(', ').replace(/,\s([^,]+)$/, ' o $1');
+  }
+  return acceptedFileTypes.split(',').filter(type => type.trim().startsWith('.')).join(', ').replace(/,\s([^,]+)$/, ' o $1');
+};
+export const getSizeInMB = maxFileSize => (maxFileSize / 1048576).toFixed(2);
+export const getNotRepeatedFiles = files => files.filter((file, index, self) => index === self.findIndex(f => f.name === file.name));
+export const getDefaultAttachment = (fileType, index) => "".concat(DEFAULT_ATTACHMENT_NAME, "-").concat(index).concat(fileType && ".".concat(fileType));