@widergy/energy-ui 3.173.2 → 3.173.4

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

@@ -1,294 +1 @@
-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);
+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=e=>{var t,a,i,n,l;let{acceptedFileTypes:r,actions:o,allowedPDFUploadSizes:s,classes:d,containerClassname:u,customValidation:m,dataTestId:c,deleteDataTestId:f,disabled:p,disableResize:y,errorClassname:v,field:g,fieldTypes:E=[],hideLabels:T,icon:R,input:h,loadingTextClassname:b,maxFileSize:A=99999999,onLoaded:I,notifyOnInitialLoad:O=!0,previewDataTestId:_,readOnly:S=!1,resizeConfig:w,sanitize:F,titleVariant:z}=e;const C=null==g||null===(t=g.configuration)||void 0===t?void 0:t.help_text,P=(null==g||null===(a=g.configuration)||void 0===a?void 0:a.max_file_size)||A,D=(null==g||null===(i=g.configuration)||void 0===i?void 0:i.accepted_file_types)||r,L=(null==g||null===(n=g.configuration)||void 0===n?void 0:n.max_files)||DEFAULT_MAX_FILES,[x,V]=useState([]),[M,X]=useState(!1),[W,B]=useState(FORMAT_ERROR_TEXT),U=useRef(null),[j,N]=useState((null==h||null===(l=h.value)||void 0===l?void 0:l.files)||[]),Y=(e,t)=>{X(!0),B(t?"".concat(e,"(").concat(t,")"):e)},G=async e=>{const t=e=>new Promise((t,a)=>{const i=new FileReader;i.onload=a=>{hasPreview(e)||isDownloadable(e)?t({src:a.target.result,file:e}):t({src:null,file:e})},i.onerror=e=>a(e),i.readAsDataURL(e)});try{const a=(await Promise.all(e.map(t))).map(e=>{let{src:t,file:a}=e;return((e,t)=>({...t,src:e}))(t,{type:a.type,name:a.name,size:getSizeInMB(a.size),onClick:()=>{return(e=a.name)&&V(t=>t.filter(t=>t.name!==e)),N(t=>{const a=Object.values(t).filter(t=>t.name!==e);return h.onChange&&h.onChange(isEmpty(a)?null:{files:a}),a}),U.current&&(U.current.value=null),void X(!1);var e}})});V(e=>getNotRepeatedFiles([...(e||[]).filter(e=>"loading"!==e.type),...a]))}catch(e){V(e=>(e||[]).filter(e=>"loading"!==e.type)),Y(null==e?void 0:e.message)}},Z=async function(){var e,t;let a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const n=Array.isArray(h.value)?h.value.length:1;if(a===n)return I&&I(),O&&h.onChange&&h.onChange({files:i}),N(i),void G(i);const l=Array.isArray(h.value)?h.value.flatMap(e=>Object.values(e)[0]):h.value,r=Array.isArray(h.value)?(null===(e=h.value[a])||void 0===e?void 0:e.url)||(null===(t=l[a])||void 0===t?void 0:t.url):h.value;getBlobFromUrl(r,async e=>{if(e){var t,n;const r=Array.isArray(h.value)?(null===(t=h.value[a])||void 0===t?void 0:t.name)||(null===(n=l[a])||void 0===n?void 0:n.name):null,o=new File([e],r||getDefaultAttachment(e.type.substring(e.type.indexOf("/")+1),a+1),{type:e.type});Z(a+1,[...i,o])}else V(e=>{let t=!1;return e.map(e=>t||e.type!==PREVIEW_TYPES.LOADING?e:(t=!0,{...e,type:PREVIEW_TYPES.ERROR}))}),Z(a+1,i)})};return useEffect(()=>{var e;if(isEmpty(j)?isEmpty(null===(e=h.value)||void 0===e?void 0:e.files)||G(h.value.files):G(j),Array.isArray(h.value)&&!isEmpty(h.value)||h.value&&"string"==typeof h.value){if(isEmpty(x)){const e=Array.isArray(h.value)?h.value.length:1;V(Array.from({length:e},()=>({type:PREVIEW_TYPES.LOADING})))}Z()}},[h]),React.createElement(Attachment,{actions:o,acceptedFileTypes:D,classes:d,containerClassname:u,disabled:p,dataTestId:c,deleteDataTestId:f,error:M,errorClassname:v,errorText:W,field:g,fieldTypes:E,fileInputRef:U,helpText:C,hideLabels:T,icon:R,loadingTextClassname:b,maxFiles:L,maxFileSize:getSizeInMB(P),onChange:async e=>{var t;const a=(null===(t=h.value)||void 0===t?void 0:t.files)||j,i=Object.values(isEmpty(a)?e.target.files:getNotRepeatedFiles([...a,...e.target.files])),n={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(getSizeInMB(P),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null==s?void 0:s.map(e=>e.name).join(" - "),")")};X(!1);const l=async e=>{if(e<i.length){if(L&&i.length>L)return void Y(MAX_FILES_ERROR,L);let t=i[e];if(t){let a=!m||await m(t,Y);if(a){if(a=await fileSignatureValidation(t,E,t.type),!a)return void Y(n.formatError);if(F&&(t=await F(t)),a=fileSizeValidation(t,P),a&&isPDF(t)&&!isEmpty(s)&&(a=await pdfAspectRatioValidation(t,s),!a))return void Y(n.aspectRatioError);if(a||y||!isImage(t)||isIE()||(t=await resizeImage(t,w),a=fileSizeValidation(t,P),i[e]=t),!a)return void Y(n.sizeError)}}await l(e+1)}else h.onChange&&h.onChange({files:i}),N(i),await G(i)};await l(0)},preview:x,previewDataTestId:_,readOnly:S,titleVariant:z})};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,200 +1 @@
-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;
+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=e=>{var t;let{actions:a,acceptedFileTypes:l,classes:r,dataTestId:n,deleteDataTestId:o,disabled:c,error:s,errorText:i,field:m,fieldTypes:p=[],fileInputRef:T,helpText:d,hideLabels:E,maxFiles:I,maxFileSize:y,onChange:u,preview:R,previewDataTestId:v,readOnly:L,RemoveIcon:b,titleVariant:f}=e;const _=((null==m||null===(t=m.configuration)||void 0===t?void 0:t.ignore_title)||E)&&(null==m?void 0:m.title),O=l||p.map(e=>inputFiles[e].inputType).join(),U=b||"IconTrash",g=isEmpty(R),h=R.length<I,[F,w]=useState(!1),[N,A]=useState(null),P=e=>{A(e),w(!0)};return React.createElement(Fragment,null,_&&React.createElement("div",{className:styles.upperTitleContainer},React.createElement(UTFieldLabel,{actions:a,readOnly:m.read_only,size:f,required:m.required},null==m?void 0:m.title)),React.createElement("div",{className:"".concat(styles.container," ").concat(r.container," ").concat(s&&r.errorContainer," ").concat(L&&r.readOnlyContainer)},!g&&R.map(e=>React.createElement("div",{className:"".concat(styles.previewContainer," ").concat(r.previewContainer),"data-testid":v},e.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)):e.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,e.src?React.createElement(Preview,{classes:r,openPreviewModal:P,preview:e,previewProps:R.previewProps}):React.createElement(UTIcon,{name:"IconCheck",colorTheme:"accent",size:ICON_SIZE}),React.createElement("div",{className:styles.fileContainer},React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},e.name),React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},e.size,MB_LABEL)),(isAudio(e)||isVideo(e))&&React.createElement(UTButton,{disabled:c,Icon:"IconPlayerPlay",onClick:()=>{A(e),w(!0)},size:"small",variant:"text"}),(isDownloadable(e)||L&&isImage(e))&&e.src&&React.createElement(UTButton,{Icon:"IconDownload",onClick:()=>download(e.src,e.name,e.type),size:"small",variant:"text"}),!L&&React.createElement(UTButton,{dataTestId:o,disabled:c,Icon:U,onClick:e.onClick,size:"small",variant:"text"})))),!L&&g&&React.createElement(UTIcon,{name:"IconCloudUpload",className:"".concat(styles.filesIcon," ").concat(r.filesIcon),colorTheme:"accent",size:ICON_SIZE}),!L&&React.createElement("div",{className:"".concat(styles.labelAndInputContainer," ").concat(!g&&styles.positionRelative)},g&&React.createElement(UTLabel,{colorTheme:"accent"},INDICATIONS),React.createElement(UTButton,{classNames:{root:!g&&styles.uploadButtonFullWidth},colorTheme:"primary",disabled:!h,Icon:"IconUpload",variant:"semitransparent"},UPLOAD_FILE),h&&React.createElement("input",{className:styles.input,"data-testid":n,accept:O,ref:T,type:"file",onChange:u,disabled:c,multiple:!0})),!L&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small",className:styles.aclaration},"".concat(FORMAT_FILE_LABEL).concat(getAvailableFileTypesLabel(O),".")," ",React.createElement("br",null),"".concat(MAX_SIZE_FILE_LABEL).concat(y,"MB"))),d&&React.createElement(UTLabel,{className:styles.helpText,colorTheme:"gray",variant:"small"},d),s&&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"},i)),F&&React.createElement(PreviewModal,{preview:N,previewProps:R.previewProps,previewModalIsOpen:F,closePreviewModal:()=>w(!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;

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

@@ -1,21 +1 @@
-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'])
-    }
-  };
-};
+export const retrieveStyle=e=>{var o,t,l,r,n;let{theme:i}=e;return{container:{backgroundColor:null===(o=i.Palette)||void 0===o?void 0:o.light["03"],border:"1px dashed ".concat((null===(t=i.Palette)||void 0===t||null===(t=t.actions)||void 0===t||null===(t=t.accent)||void 0===t?void 0:t["04"])||i.Palette.accent["04"])},errorContainer:{border:"2px solid ".concat(null===(l=i.Palette)||void 0===l?void 0:l.error["04"])},previewContainer:{backgroundColor:null===(r=i.Palette)||void 0===r?void 0:r.light["01"]},readOnlyContainer:{border:"1px solid ".concat(null===(n=i.Palette)||void 0===n?void 0:n.light["04"])}}};

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

@@ -1,72 +1 @@
-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));
+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 e=>fetch(e,{method:"GET"}).catch(e=>console.error(e));export const getBlobFromUrl=async(e,t)=>{if(!e||!t)return!1;const i=await getImage(e);if(null!=i&&i.ok)try{t(await i.blob())}catch{t(null)}else t(null)};const lengthMatches=(e,t,i)=>{const s=e*(i/100);return Math.abs(e-t)<s},pageMatches=(e,t)=>{const i=e.getViewport({scale:1});return t.some(e=>lengthMatches(e.heightInPt,i.height,e.toleranceInPercentage)&&lengthMatches(e.widthInPt,i.width,e.toleranceInPercentage)||lengthMatches(e.heightInPt,i.width,e.toleranceInPercentage)&&lengthMatches(e.widthInPt,i.height,e.toleranceInPercentage))};export const pdfAspectRatioValidation=async(e,t)=>{const i=window["pdfjs-dist/build/pdf"].getDocument(URL.createObjectURL(e)),s=await i.promise,n=s.numPages,o=[];for(let e=1;e<=n;e+=1)o.push(s.getPage(e));return(await Promise.all(o)).every(e=>pageMatches(e,t))};export const isImage=e=>inputFiles.image.validType.includes(null==e?void 0:e.type);export const isPDF=e=>inputFiles.pdf.validType.includes(null==e?void 0:e.type);export const isAudio=e=>inputFiles.audio.validType.includes(null==e?void 0:e.type);export const isVideo=e=>inputFiles.video.validType.includes(null==e?void 0:e.type);export const isHTML=e=>inputFiles.html.validType.includes(null==e?void 0:e.type);export const isCSV=e=>inputFiles.csv.validType.includes(null==e?void 0:e.type);export const isXLS=e=>inputFiles.xls.validType.includes(null==e?void 0:e.type);export const isXLSX=e=>inputFiles.xlsx.validType.includes(null==e?void 0:e.type);export const isDownloadable=e=>isPDF(e)||isCSV(e)||isXLS(e)||isXLSX(e);export const hasPreview=e=>isImage(e)||isAudio(e)||isVideo(e)||isPDF(e);export const isValidFile=e=>hasPreview(e)||isPDF(e)||isHTML(e);export const isNewFile=(e,t)=>{var i,s;if(!e&&!t)return!1;if(!e||!t)return!0;const n=typeof e;return n!==typeof t||("string"===n?e!==t:(null===(i=e.file)||void 0===i?void 0:i.lastModified)!==(null===(s=t.file)||void 0===s?void 0:s.lastModified))};export const getAvailableFileTypesLabel=e=>Array.isArray(e)?e.join(", ").replace(/,\s([^,]+)$/," o $1"):e.split(",").filter(e=>e.trim().startsWith(".")).join(", ").replace(/,\s([^,]+)$/," o $1");export const getSizeInMB=e=>(e/1048576).toFixed(2);export const getNotRepeatedFiles=e=>e.filter((e,t,i)=>t===i.findIndex(t=>t.name===e.name));export const getDefaultAttachment=(e,t)=>"".concat(DEFAULT_ATTACHMENT_NAME,"-").concat(t).concat(e&&".".concat(e));