@veeqo/ui 12.4.0-beta-5 → 12.4.0-beta-6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.cjs +2 -2
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.cjs.map +1 -1
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.js +2 -2
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.js.map +1 -1
- package/package.json +1 -1
|
@@ -59,10 +59,10 @@ const useValidateInput = ({ fileList, fileTypes, inputRef, maxBytes, customError
|
|
|
59
59
|
// If no errors, errorMessage remains VALID
|
|
60
60
|
(_d = inputRef.current) === null || _d === undefined ? undefined : _d.setCustomValidity(errorMessage);
|
|
61
61
|
}, [customErrorMessage, inputRef, maxBytes, fileTypes]);
|
|
62
|
-
// Validate input whenever fileList changes
|
|
62
|
+
// Validate input whenever fileList or the custom error message changes
|
|
63
63
|
React.useEffect(() => {
|
|
64
64
|
setInputValidation();
|
|
65
|
-
}, [fileList, setInputValidation]);
|
|
65
|
+
}, [fileList, setInputValidation, customErrorMessage]);
|
|
66
66
|
};
|
|
67
67
|
|
|
68
68
|
exports.useValidateInput = useValidateInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useValidateInput.cjs","sources":["../../../../../src/components/UploadFile/hooks/useValidateInput/useValidateInput.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react';\nimport { AcceptedFileTypes, InputErrorStateMessages } from '../../constants';\n\ntype UseValidateInputProps = {\n fileTypes: Array<AcceptedFileTypes>;\n maxBytes: number;\n fileList: FileList | undefined;\n inputRef: React.MutableRefObject<HTMLInputElement | null>;\n customErrorMessage?: string;\n};\n\nexport const useValidateInput = ({\n fileList,\n fileTypes,\n inputRef,\n maxBytes,\n customErrorMessage,\n}: UseValidateInputProps) => {\n // Tracks error states within the input element itself, using preset\n // error messages and assigns these to the input component based on the file\n const setInputValidation = useCallback(() => {\n let errorMessage = customErrorMessage || InputErrorStateMessages.VALID;\n\n if (!inputRef.current?.files?.length) {\n inputRef.current?.setCustomValidity(errorMessage);\n return;\n }\n\n const results = {\n numberOfInvalidFormatFiles: 0,\n numberOfInvalidSizeFiles: 0,\n totalFiles: inputRef.current.files.length,\n };\n\n Array.from(inputRef.current.files).forEach((file) => {\n // Check file size\n if (file.size > maxBytes) {\n results.numberOfInvalidSizeFiles += 1;\n }\n\n // Check file type/format\n const [, extension] = file.type.split('/');\n const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);\n if (!isTypeValid) {\n results.numberOfInvalidFormatFiles += 1;\n }\n });\n\n // Determine appropriate error message based on validation results\n const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;\n const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;\n const isSingleFile = results.totalFiles === 1;\n\n if (hasFormatErrors && hasSizeErrors) {\n // Both format and size errors exist\n errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;\n } else if (hasFormatErrors && !hasSizeErrors) {\n // Only format errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_FORMAT;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_FORMATS;\n }\n } else if (!hasFormatErrors && hasSizeErrors) {\n // Only size errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_SIZE;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_SIZES;\n }\n }\n // If no errors, errorMessage remains VALID\n\n inputRef.current?.setCustomValidity(errorMessage);\n }, [customErrorMessage, inputRef, maxBytes, fileTypes]);\n\n // Validate input whenever fileList changes\n useEffect(() => {\n setInputValidation();\n }, [fileList, setInputValidation]);\n};\n"],"names":["useCallback","InputErrorStateMessages","useEffect"],"mappings":";;;;;AAWa,MAAA,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,kBAAkB,GACI,KAAI;;;AAG1B,IAAA,MAAM,kBAAkB,GAAGA,iBAAW,CAAC,MAAK;;AAC1C,QAAA,IAAI,YAAY,GAAG,kBAAkB,IAAIC,iCAAuB,CAAC,KAAK;AAEtE,QAAA,IAAI,EAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM,CAAA,EAAE;YACpC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;YACjD;AACD;AAED,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,0BAA0B,EAAE,CAAC;AAC7B,YAAA,wBAAwB,EAAE,CAAC;AAC3B,YAAA,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM;SAC1C;AAED,QAAA,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;;AAElD,YAAA,IAAI,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE;AACxB,gBAAA,OAAO,CAAC,wBAAwB,IAAI,CAAC;AACtC;;AAGD,YAAA,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAC1C,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;YACvF,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,CAAC,0BAA0B,IAAI,CAAC;AACxC;AACH,SAAC,CAAC;;AAGF,QAAA,MAAM,eAAe,GAAG,OAAO,CAAC,0BAA0B,GAAG,CAAC;AAC9D,QAAA,MAAM,aAAa,GAAG,OAAO,CAAC,wBAAwB,GAAG,CAAC;AAC1D,QAAA,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,KAAK,CAAC;QAE7C,IAAI,eAAe,IAAI,aAAa,EAAE;;AAEpC,YAAA,YAAY,GAAGA,iCAAuB,CAAC,uBAAuB;AAC/D;AAAM,aAAA,IAAI,eAAe,IAAI,CAAC,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,cAAc;AACtD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,eAAe;AACvD;AACF;AAAM,aAAA,IAAI,CAAC,eAAe,IAAI,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,YAAY;AACpD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,aAAa;AACrD;AACF;;QAGD,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;KAClD,EAAE,CAAC,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;;IAGvDC,eAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,EAAE;
|
|
1
|
+
{"version":3,"file":"useValidateInput.cjs","sources":["../../../../../src/components/UploadFile/hooks/useValidateInput/useValidateInput.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react';\nimport { AcceptedFileTypes, InputErrorStateMessages } from '../../constants';\n\ntype UseValidateInputProps = {\n fileTypes: Array<AcceptedFileTypes>;\n maxBytes: number;\n fileList: FileList | undefined;\n inputRef: React.MutableRefObject<HTMLInputElement | null>;\n customErrorMessage?: string;\n};\n\nexport const useValidateInput = ({\n fileList,\n fileTypes,\n inputRef,\n maxBytes,\n customErrorMessage,\n}: UseValidateInputProps) => {\n // Tracks error states within the input element itself, using preset\n // error messages and assigns these to the input component based on the file\n const setInputValidation = useCallback(() => {\n let errorMessage = customErrorMessage || InputErrorStateMessages.VALID;\n\n if (!inputRef.current?.files?.length) {\n inputRef.current?.setCustomValidity(errorMessage);\n return;\n }\n\n const results = {\n numberOfInvalidFormatFiles: 0,\n numberOfInvalidSizeFiles: 0,\n totalFiles: inputRef.current.files.length,\n };\n\n Array.from(inputRef.current.files).forEach((file) => {\n // Check file size\n if (file.size > maxBytes) {\n results.numberOfInvalidSizeFiles += 1;\n }\n\n // Check file type/format\n const [, extension] = file.type.split('/');\n const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);\n if (!isTypeValid) {\n results.numberOfInvalidFormatFiles += 1;\n }\n });\n\n // Determine appropriate error message based on validation results\n const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;\n const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;\n const isSingleFile = results.totalFiles === 1;\n\n if (hasFormatErrors && hasSizeErrors) {\n // Both format and size errors exist\n errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;\n } else if (hasFormatErrors && !hasSizeErrors) {\n // Only format errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_FORMAT;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_FORMATS;\n }\n } else if (!hasFormatErrors && hasSizeErrors) {\n // Only size errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_SIZE;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_SIZES;\n }\n }\n // If no errors, errorMessage remains VALID\n\n inputRef.current?.setCustomValidity(errorMessage);\n }, [customErrorMessage, inputRef, maxBytes, fileTypes]);\n\n // Validate input whenever fileList or the custom error message changes\n useEffect(() => {\n setInputValidation();\n }, [fileList, setInputValidation, customErrorMessage]);\n};\n"],"names":["useCallback","InputErrorStateMessages","useEffect"],"mappings":";;;;;AAWa,MAAA,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,kBAAkB,GACI,KAAI;;;AAG1B,IAAA,MAAM,kBAAkB,GAAGA,iBAAW,CAAC,MAAK;;AAC1C,QAAA,IAAI,YAAY,GAAG,kBAAkB,IAAIC,iCAAuB,CAAC,KAAK;AAEtE,QAAA,IAAI,EAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM,CAAA,EAAE;YACpC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;YACjD;AACD;AAED,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,0BAA0B,EAAE,CAAC;AAC7B,YAAA,wBAAwB,EAAE,CAAC;AAC3B,YAAA,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM;SAC1C;AAED,QAAA,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;;AAElD,YAAA,IAAI,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE;AACxB,gBAAA,OAAO,CAAC,wBAAwB,IAAI,CAAC;AACtC;;AAGD,YAAA,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAC1C,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;YACvF,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,CAAC,0BAA0B,IAAI,CAAC;AACxC;AACH,SAAC,CAAC;;AAGF,QAAA,MAAM,eAAe,GAAG,OAAO,CAAC,0BAA0B,GAAG,CAAC;AAC9D,QAAA,MAAM,aAAa,GAAG,OAAO,CAAC,wBAAwB,GAAG,CAAC;AAC1D,QAAA,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,KAAK,CAAC;QAE7C,IAAI,eAAe,IAAI,aAAa,EAAE;;AAEpC,YAAA,YAAY,GAAGA,iCAAuB,CAAC,uBAAuB;AAC/D;AAAM,aAAA,IAAI,eAAe,IAAI,CAAC,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,cAAc;AACtD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,eAAe;AACvD;AACF;AAAM,aAAA,IAAI,CAAC,eAAe,IAAI,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,YAAY;AACpD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,aAAa;AACrD;AACF;;QAGD,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;KAClD,EAAE,CAAC,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;;IAGvDC,eAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,EAAE;KACrB,EAAE,CAAC,QAAQ,EAAE,kBAAkB,EAAE,kBAAkB,CAAC,CAAC;AACxD;;;;"}
|
|
@@ -57,10 +57,10 @@ const useValidateInput = ({ fileList, fileTypes, inputRef, maxBytes, customError
|
|
|
57
57
|
// If no errors, errorMessage remains VALID
|
|
58
58
|
(_d = inputRef.current) === null || _d === undefined ? undefined : _d.setCustomValidity(errorMessage);
|
|
59
59
|
}, [customErrorMessage, inputRef, maxBytes, fileTypes]);
|
|
60
|
-
// Validate input whenever fileList changes
|
|
60
|
+
// Validate input whenever fileList or the custom error message changes
|
|
61
61
|
useEffect(() => {
|
|
62
62
|
setInputValidation();
|
|
63
|
-
}, [fileList, setInputValidation]);
|
|
63
|
+
}, [fileList, setInputValidation, customErrorMessage]);
|
|
64
64
|
};
|
|
65
65
|
|
|
66
66
|
export { useValidateInput };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useValidateInput.js","sources":["../../../../../src/components/UploadFile/hooks/useValidateInput/useValidateInput.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react';\nimport { AcceptedFileTypes, InputErrorStateMessages } from '../../constants';\n\ntype UseValidateInputProps = {\n fileTypes: Array<AcceptedFileTypes>;\n maxBytes: number;\n fileList: FileList | undefined;\n inputRef: React.MutableRefObject<HTMLInputElement | null>;\n customErrorMessage?: string;\n};\n\nexport const useValidateInput = ({\n fileList,\n fileTypes,\n inputRef,\n maxBytes,\n customErrorMessage,\n}: UseValidateInputProps) => {\n // Tracks error states within the input element itself, using preset\n // error messages and assigns these to the input component based on the file\n const setInputValidation = useCallback(() => {\n let errorMessage = customErrorMessage || InputErrorStateMessages.VALID;\n\n if (!inputRef.current?.files?.length) {\n inputRef.current?.setCustomValidity(errorMessage);\n return;\n }\n\n const results = {\n numberOfInvalidFormatFiles: 0,\n numberOfInvalidSizeFiles: 0,\n totalFiles: inputRef.current.files.length,\n };\n\n Array.from(inputRef.current.files).forEach((file) => {\n // Check file size\n if (file.size > maxBytes) {\n results.numberOfInvalidSizeFiles += 1;\n }\n\n // Check file type/format\n const [, extension] = file.type.split('/');\n const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);\n if (!isTypeValid) {\n results.numberOfInvalidFormatFiles += 1;\n }\n });\n\n // Determine appropriate error message based on validation results\n const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;\n const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;\n const isSingleFile = results.totalFiles === 1;\n\n if (hasFormatErrors && hasSizeErrors) {\n // Both format and size errors exist\n errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;\n } else if (hasFormatErrors && !hasSizeErrors) {\n // Only format errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_FORMAT;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_FORMATS;\n }\n } else if (!hasFormatErrors && hasSizeErrors) {\n // Only size errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_SIZE;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_SIZES;\n }\n }\n // If no errors, errorMessage remains VALID\n\n inputRef.current?.setCustomValidity(errorMessage);\n }, [customErrorMessage, inputRef, maxBytes, fileTypes]);\n\n // Validate input whenever fileList changes\n useEffect(() => {\n setInputValidation();\n }, [fileList, setInputValidation]);\n};\n"],"names":[],"mappings":";;;AAWa,MAAA,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,kBAAkB,GACI,KAAI;;;AAG1B,IAAA,MAAM,kBAAkB,GAAG,WAAW,CAAC,MAAK;;AAC1C,QAAA,IAAI,YAAY,GAAG,kBAAkB,IAAI,uBAAuB,CAAC,KAAK;AAEtE,QAAA,IAAI,EAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM,CAAA,EAAE;YACpC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;YACjD;AACD;AAED,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,0BAA0B,EAAE,CAAC;AAC7B,YAAA,wBAAwB,EAAE,CAAC;AAC3B,YAAA,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM;SAC1C;AAED,QAAA,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;;AAElD,YAAA,IAAI,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE;AACxB,gBAAA,OAAO,CAAC,wBAAwB,IAAI,CAAC;AACtC;;AAGD,YAAA,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAC1C,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;YACvF,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,CAAC,0BAA0B,IAAI,CAAC;AACxC;AACH,SAAC,CAAC;;AAGF,QAAA,MAAM,eAAe,GAAG,OAAO,CAAC,0BAA0B,GAAG,CAAC;AAC9D,QAAA,MAAM,aAAa,GAAG,OAAO,CAAC,wBAAwB,GAAG,CAAC;AAC1D,QAAA,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,KAAK,CAAC;QAE7C,IAAI,eAAe,IAAI,aAAa,EAAE;;AAEpC,YAAA,YAAY,GAAG,uBAAuB,CAAC,uBAAuB;AAC/D;AAAM,aAAA,IAAI,eAAe,IAAI,CAAC,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAG,uBAAuB,CAAC,cAAc;AACtD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAG,uBAAuB,CAAC,eAAe;AACvD;AACF;AAAM,aAAA,IAAI,CAAC,eAAe,IAAI,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAG,uBAAuB,CAAC,YAAY;AACpD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAG,uBAAuB,CAAC,aAAa;AACrD;AACF;;QAGD,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;KAClD,EAAE,CAAC,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;;IAGvD,SAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,EAAE;
|
|
1
|
+
{"version":3,"file":"useValidateInput.js","sources":["../../../../../src/components/UploadFile/hooks/useValidateInput/useValidateInput.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react';\nimport { AcceptedFileTypes, InputErrorStateMessages } from '../../constants';\n\ntype UseValidateInputProps = {\n fileTypes: Array<AcceptedFileTypes>;\n maxBytes: number;\n fileList: FileList | undefined;\n inputRef: React.MutableRefObject<HTMLInputElement | null>;\n customErrorMessage?: string;\n};\n\nexport const useValidateInput = ({\n fileList,\n fileTypes,\n inputRef,\n maxBytes,\n customErrorMessage,\n}: UseValidateInputProps) => {\n // Tracks error states within the input element itself, using preset\n // error messages and assigns these to the input component based on the file\n const setInputValidation = useCallback(() => {\n let errorMessage = customErrorMessage || InputErrorStateMessages.VALID;\n\n if (!inputRef.current?.files?.length) {\n inputRef.current?.setCustomValidity(errorMessage);\n return;\n }\n\n const results = {\n numberOfInvalidFormatFiles: 0,\n numberOfInvalidSizeFiles: 0,\n totalFiles: inputRef.current.files.length,\n };\n\n Array.from(inputRef.current.files).forEach((file) => {\n // Check file size\n if (file.size > maxBytes) {\n results.numberOfInvalidSizeFiles += 1;\n }\n\n // Check file type/format\n const [, extension] = file.type.split('/');\n const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);\n if (!isTypeValid) {\n results.numberOfInvalidFormatFiles += 1;\n }\n });\n\n // Determine appropriate error message based on validation results\n const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;\n const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;\n const isSingleFile = results.totalFiles === 1;\n\n if (hasFormatErrors && hasSizeErrors) {\n // Both format and size errors exist\n errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;\n } else if (hasFormatErrors && !hasSizeErrors) {\n // Only format errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_FORMAT;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_FORMATS;\n }\n } else if (!hasFormatErrors && hasSizeErrors) {\n // Only size errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_SIZE;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_SIZES;\n }\n }\n // If no errors, errorMessage remains VALID\n\n inputRef.current?.setCustomValidity(errorMessage);\n }, [customErrorMessage, inputRef, maxBytes, fileTypes]);\n\n // Validate input whenever fileList or the custom error message changes\n useEffect(() => {\n setInputValidation();\n }, [fileList, setInputValidation, customErrorMessage]);\n};\n"],"names":[],"mappings":";;;AAWa,MAAA,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,kBAAkB,GACI,KAAI;;;AAG1B,IAAA,MAAM,kBAAkB,GAAG,WAAW,CAAC,MAAK;;AAC1C,QAAA,IAAI,YAAY,GAAG,kBAAkB,IAAI,uBAAuB,CAAC,KAAK;AAEtE,QAAA,IAAI,EAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM,CAAA,EAAE;YACpC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;YACjD;AACD;AAED,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,0BAA0B,EAAE,CAAC;AAC7B,YAAA,wBAAwB,EAAE,CAAC;AAC3B,YAAA,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM;SAC1C;AAED,QAAA,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;;AAElD,YAAA,IAAI,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE;AACxB,gBAAA,OAAO,CAAC,wBAAwB,IAAI,CAAC;AACtC;;AAGD,YAAA,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAC1C,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;YACvF,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,CAAC,0BAA0B,IAAI,CAAC;AACxC;AACH,SAAC,CAAC;;AAGF,QAAA,MAAM,eAAe,GAAG,OAAO,CAAC,0BAA0B,GAAG,CAAC;AAC9D,QAAA,MAAM,aAAa,GAAG,OAAO,CAAC,wBAAwB,GAAG,CAAC;AAC1D,QAAA,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,KAAK,CAAC;QAE7C,IAAI,eAAe,IAAI,aAAa,EAAE;;AAEpC,YAAA,YAAY,GAAG,uBAAuB,CAAC,uBAAuB;AAC/D;AAAM,aAAA,IAAI,eAAe,IAAI,CAAC,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAG,uBAAuB,CAAC,cAAc;AACtD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAG,uBAAuB,CAAC,eAAe;AACvD;AACF;AAAM,aAAA,IAAI,CAAC,eAAe,IAAI,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAG,uBAAuB,CAAC,YAAY;AACpD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAG,uBAAuB,CAAC,aAAa;AACrD;AACF;;QAGD,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;KAClD,EAAE,CAAC,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;;IAGvD,SAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,EAAE;KACrB,EAAE,CAAC,QAAQ,EAAE,kBAAkB,EAAE,kBAAkB,CAAC,CAAC;AACxD;;;;"}
|