tp-react-elements-dev 1.12.29 → 1.12.30
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/FormComponents/FileUpload/FormRenderFileUpload.esm.js +16 -21
- package/dist/components/FormComponents/FileUpload/FormRenderMultiFileUpload.esm.js +1 -0
- package/dist/components/FormComponents/HelperText/HelperText.esm.js +1 -1
- package/dist/utils/Interface/FormInterface.d.ts +1 -1
- package/package.json +1 -1
|
@@ -17,35 +17,30 @@ const FormRenderFileUpload = ({ props, variant, }) => {
|
|
|
17
17
|
inputRef.current.value = '';
|
|
18
18
|
}
|
|
19
19
|
}, [watched]);
|
|
20
|
+
const extensionMap = {
|
|
21
|
+
excel: ['xls', 'xlsx'],
|
|
22
|
+
pdf: ['pdf'],
|
|
23
|
+
zip: ['zip'],
|
|
24
|
+
image: ['jpg', 'jpeg', 'png'],
|
|
25
|
+
document: ['doc', 'docx', 'pdf'],
|
|
26
|
+
all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
|
|
27
|
+
};
|
|
28
|
+
const accept = props.item.fileType && extensionMap[props.item.fileType]
|
|
29
|
+
? extensionMap[props.item.fileType].map((ext) => `.${ext}`).join(',')
|
|
30
|
+
: '';
|
|
20
31
|
return (jsxs(Fragment, { children: [jsxs(Box, { paddingLeft: '4px', sx: { ...props.item.sx }, children: [props.item?.label && (jsx(Box, { sx: { fontSize: '10px;' }, children: renderLabel(variant, props, true) })), jsx(TextField, { type: "file", id: props.item.name, error: isShowBorderError, inputRef: inputRef, inputProps: {
|
|
21
|
-
accept
|
|
22
|
-
? '.xls, .xlsx'
|
|
23
|
-
: props.item.fileType === 'pdf'
|
|
24
|
-
? '.pdf'
|
|
25
|
-
: props.item.fileType === 'zip'
|
|
26
|
-
? '.zip'
|
|
27
|
-
: props.item.fileType === 'all'
|
|
28
|
-
? '.pdf,.jpg,.jpeg,.png,.xls,.xlsx,.doc,.docx,.zip'
|
|
29
|
-
: '',
|
|
32
|
+
accept,
|
|
30
33
|
'aria-labelledby': `${props.item.name}-label`,
|
|
31
34
|
'aria-describedby': `${props.item.name}-helper ${props.item.name}-error`,
|
|
32
35
|
'aria-required': props.item.required ? true : undefined,
|
|
33
36
|
}, onChange: (event) => {
|
|
34
37
|
const file = event.target?.files[0];
|
|
35
38
|
const fileName = file ? file.name : null;
|
|
36
|
-
const allowedExtensions =
|
|
37
|
-
excel: ['xls', 'xlsx'],
|
|
38
|
-
pdf: ['pdf'],
|
|
39
|
-
zip: ['zip'],
|
|
40
|
-
all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
|
|
41
|
-
image: ['jpg', 'jpeg', 'png'],
|
|
42
|
-
};
|
|
39
|
+
const allowedExtensions = extensionMap;
|
|
43
40
|
const fileExtension = fileName ? fileName.split('.').pop().toLowerCase() : null;
|
|
44
|
-
const validExtensions = props.item.fileType
|
|
45
|
-
? allowedExtensions.
|
|
46
|
-
:
|
|
47
|
-
? allowedExtensions.pdf
|
|
48
|
-
: allowedExtensions.all;
|
|
41
|
+
const validExtensions = props.item.fileType && allowedExtensions[props.item.fileType]
|
|
42
|
+
? allowedExtensions[props.item.fileType]
|
|
43
|
+
: allowedExtensions.all;
|
|
49
44
|
if (props.item?.fileType && fileExtension && !validExtensions.includes(fileExtension)) {
|
|
50
45
|
props.item?.handleFileError &&
|
|
51
46
|
props.item?.handleFileError(`Please upload ${allowedExtensions[props.item.fileType].join(', ')} files only`);
|
|
@@ -45,6 +45,7 @@ const FormRenderMultiFileUpload = ({ props, variant, }) => {
|
|
|
45
45
|
image: ['jpg', 'jpeg', 'png'],
|
|
46
46
|
all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
|
|
47
47
|
zip: ['zip'],
|
|
48
|
+
document: ['doc', 'docx', 'pdf'],
|
|
48
49
|
};
|
|
49
50
|
let fileExtension = null;
|
|
50
51
|
if (fileName) {
|
|
@@ -14,7 +14,7 @@ const HelperText = (props) => {
|
|
|
14
14
|
* Conditionally renders helper text if it exists in the form item props
|
|
15
15
|
* Returns an empty fragment if no helper text is provided
|
|
16
16
|
*/
|
|
17
|
-
return props?.item?.helperText ? (jsx("span", { id: `${props.item.name}-helper`, style: {
|
|
17
|
+
return props?.item?.helperText ? (jsx("span", { id: `${props.item.name}-helper`, className: "helperText-v1", style: {
|
|
18
18
|
fontSize: '11px',
|
|
19
19
|
color: '#3651d3',
|
|
20
20
|
}, children: props?.item?.helperText })) : (jsx(Fragment, {}));
|
|
@@ -38,7 +38,7 @@ export interface FormSectionPropsItem {
|
|
|
38
38
|
sx?: SxProps<Theme>;
|
|
39
39
|
donotAllowSpace?: boolean;
|
|
40
40
|
onInputProps?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
|
41
|
-
fileType?: 'excel' | 'pdf' | 'all' | 'zip' | 'image' | '';
|
|
41
|
+
fileType?: 'excel' | 'pdf' | 'all' | 'zip' | 'image' | 'document' | '';
|
|
42
42
|
handleFileError?: (message: string) => void;
|
|
43
43
|
onCloseMenu?: () => void;
|
|
44
44
|
doNotAllowPaste?: boolean;
|