tp-react-elements 1.0.1 → 1.0.3

package/dist/_virtual/index.esm12.js

@@ -1,3 +1,3 @@
-var Month = {};
+var InputRangeField = {};
 
-export { Month as __exports };
+export { InputRangeField as __exports };

package/dist/_virtual/index.esm14.js

@@ -1,3 +1,3 @@
-var InputRangeField = {};
+var Month = {};
 
-export { InputRangeField as __exports };
+export { Month as __exports };

package/dist/_virtual/index.esm5.js

@@ -1,3 +1,3 @@
-var Calendar = {};
+var DefinedRange = {};
 
-export { Calendar as __exports };
+export { DefinedRange as __exports };

package/dist/_virtual/index.esm6.js

@@ -1,3 +1,3 @@
-var DefinedRange = {};
+var Calendar = {};
 
-export { DefinedRange as __exports };
+export { Calendar as __exports };

package/dist/components/Form/Form.styles.esm.js

@@ -29,7 +29,7 @@ const Formitem = styled(Grid, {
     paddingRight: '15px',
     marginBottom: theme.spacing(1),
     [theme.breakpoints.down('md')]: {
-        width: '100%',
+        width: `calc(100%/${noOfColumn})`,
     },
 }));
 const ErrorMessageComponent = styled(Box)(({ theme }) => ({

package/dist/components/FormComponents/FileUpload/FormRenderFileUpload.esm.js

@@ -25,9 +25,38 @@ const FormRenderFileUpload = ({ props, variant, }) => {
         document: ['doc', 'docx', 'pdf'],
         all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
     };
-    const accept = props.item.fileType && extensionMap[props.item.fileType]
-        ? extensionMap[props.item.fileType].map((ext) => `.${ext}`).join(',')
-        : '';
+    const getValidExtensions = () => {
+        const fileType = props.item.fileType;
+        if (!fileType) {
+            return extensionMap.all;
+        }
+        if (Array.isArray(fileType)) {
+            // Check if array contains predefined keys (like 'image', 'pdf') or actual extensions
+            const hasPredefinedKeys = fileType.some((item) => extensionMap[item]);
+            if (hasPredefinedKeys) {
+                // Merge extensions from all predefined keys
+                const extensions = new Set();
+                fileType.forEach((item) => {
+                    if (extensionMap[item]) {
+                        extensionMap[item].forEach((ext) => extensions.add(ext));
+                    }
+                    else {
+                        // Treat as direct extension
+                        extensions.add(item);
+                    }
+                });
+                return Array.from(extensions);
+            }
+            // All items are direct extensions
+            return fileType;
+        }
+        return extensionMap[fileType] || extensionMap.all;
+    };
+    const getAcceptString = () => {
+        const extensions = getValidExtensions();
+        return extensions.map((ext) => `.${ext}`).join(',');
+    };
+    const accept = getAcceptString();
     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: {
                             accept,
                             'aria-labelledby': `${props.item.name}-label`,
@@ -36,14 +65,11 @@ const FormRenderFileUpload = ({ props, variant, }) => {
                         }, onChange: (event) => {
                             const file = event.target?.files[0];
                             const fileName = file ? file.name : null;
-                            const allowedExtensions = extensionMap;
                             const fileExtension = fileName ? fileName.split('.').pop().toLowerCase() : null;
-                            const validExtensions = props.item.fileType && allowedExtensions[props.item.fileType]
-                                ? allowedExtensions[props.item.fileType]
-                                : allowedExtensions.all;
+                            const validExtensions = getValidExtensions();
                             if (props.item?.fileType && fileExtension && !validExtensions.includes(fileExtension)) {
                                 props.item?.handleFileError &&
-                                    props.item?.handleFileError(`Please upload ${allowedExtensions[props.item.fileType].join(', ')} files only`);
+                                    props.item?.handleFileError(`Please upload ${validExtensions.join(', ')} files only`);
                                 event.target.value = ''; // Clear the file input\
                                 props.setValue(props.item?.name, null);
                                 props.setValue(props.item?.name + 'Name', '');

package/dist/components/FormComponents/FileUpload/FormRenderMultiFileUpload.esm.js

@@ -18,17 +18,48 @@ const FormRenderMultiFileUpload = ({ props, variant, }) => {
     }, [watched]);
     const isError = !!props.errors?.[props.item.name];
     const isShowBorderError = isError;
+    const extensionMap = {
+        excel: ['xls', 'xlsx'],
+        pdf: ['pdf'],
+        zip: ['zip'],
+        image: ['jpg', 'jpeg', 'png'],
+        document: ['doc', 'docx', 'pdf'],
+        all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
+    };
+    const getValidExtensions = () => {
+        const fileType = props.item.fileType;
+        if (!fileType) {
+            return extensionMap.all;
+        }
+        if (Array.isArray(fileType)) {
+            // Check if array contains predefined keys (like 'image', 'pdf') or actual extensions
+            const hasPredefinedKeys = fileType.some((item) => extensionMap[item]);
+            if (hasPredefinedKeys) {
+                // Merge extensions from all predefined keys
+                const extensions = new Set();
+                fileType.forEach((item) => {
+                    if (extensionMap[item]) {
+                        extensionMap[item].forEach((ext) => extensions.add(ext));
+                    }
+                    else {
+                        // Treat as direct extension
+                        extensions.add(item);
+                    }
+                });
+                return Array.from(extensions);
+            }
+            // All items are direct extensions
+            return fileType;
+        }
+        return extensionMap[fileType] || extensionMap.all;
+    };
+    const getAcceptString = () => {
+        const extensions = getValidExtensions();
+        return extensions.map((ext) => `.${ext}`).join(',');
+    };
     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: {
                             multiple: true,
-                            accept: props.item.fileType === 'excel'
-                                ? '.xls,.xlsx'
-                                : props.item.fileType === 'pdf'
-                                    ? '.pdf'
-                                    : props.item.fileType === 'image'
-                                        ? '.jpg,.jpeg,.png'
-                                        : props.item.fileType === 'all'
-                                            ? '.pdf,.jpg,.jpeg,.png,.xls,.xlsx,.doc,.docx'
-                                            : '',
+                            accept: getAcceptString(),
                             'aria-labelledby': `${props.item.name}-label`,
                             'aria-describedby': `${props.item.name}-helper ${props.item.name}-error`,
                             'aria-required': props.item.required ? true : undefined,
@@ -39,14 +70,6 @@ const FormRenderMultiFileUpload = ({ props, variant, }) => {
                                     .map((item) => item.name)
                                     .join(',')
                                 : null;
-                            const allowedExtensions = {
-                                excel: ['xls', 'xlsx'],
-                                pdf: ['pdf'],
-                                image: ['jpg', 'jpeg', 'png'],
-                                all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
-                                zip: ['zip'],
-                                document: ['doc', 'docx', 'pdf'],
-                            };
                             let fileExtension = null;
                             if (fileName) {
                                 const ext = fileName.split('.').pop();
@@ -54,16 +77,10 @@ const FormRenderMultiFileUpload = ({ props, variant, }) => {
                                     fileExtension = ext.toLowerCase();
                                 }
                             }
-                            const validExtensions = props.item.fileType === 'excel'
-                                ? allowedExtensions.excel
-                                : props.item.fileType === 'pdf'
-                                    ? allowedExtensions.pdf
-                                    : props.item.fileType === 'image'
-                                        ? allowedExtensions.image
-                                        : allowedExtensions.all;
+                            const validExtensions = getValidExtensions();
                             if (props.item?.fileType && fileExtension && !validExtensions.includes(fileExtension)) {
                                 props.item?.handleFileError &&
-                                    props.item?.handleFileError(`Please upload ${allowedExtensions[props.item.fileType].join(', ')} files only`);
+                                    props.item?.handleFileError(`Please upload ${validExtensions.join(', ')} files only`);
                                 event.target.value = ''; // Clear the file input\
                                 props.setValue(props.item?.name, null);
                                 props.setValue(props.item?.name + 'Name', '');

package/dist/components/FormComponents/FileUpload/MultiFileWithPreview.esm.js

@@ -73,23 +73,51 @@ const MultiFileWithPreview = ({ props, variant, }) => {
         }
     }, [watched]);
     const isError = !!props.errors?.[props.item.name];
+    const extensionMap = {
+        excel: ['xls', 'xlsx'],
+        pdf: ['pdf'],
+        image: ['jpg', 'jpeg', 'png'],
+        all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip'],
+        zip: ['zip'],
+        document: ['doc', 'docx', 'pdf'],
+    };
+    const getValidExtensions = () => {
+        const fileType = props.item.fileType;
+        if (!fileType) {
+            return extensionMap.all;
+        }
+        if (Array.isArray(fileType)) {
+            // Check if array contains predefined keys (like 'image', 'pdf') or actual extensions
+            const hasPredefinedKeys = fileType.some((item) => extensionMap[item]);
+            if (hasPredefinedKeys) {
+                // Merge extensions from all predefined keys
+                const extensions = new Set();
+                fileType.forEach((item) => {
+                    if (extensionMap[item]) {
+                        extensionMap[item].forEach((ext) => extensions.add(ext));
+                    }
+                    else {
+                        // Treat as direct extension
+                        extensions.add(item);
+                    }
+                });
+                return Array.from(extensions);
+            }
+            // All items are direct extensions
+            return fileType;
+        }
+        return extensionMap[fileType] || extensionMap.all;
+    };
+    const getAcceptString = () => {
+        const extensions = getValidExtensions();
+        return extensions.map((ext) => `.${ext}`).join(',');
+    };
     const handleFileChange = (event) => {
         const files = event.target.files;
         if (!files)
             return;
         const fileArray = Array.from(files);
-        const allowedExtensions = {
-            excel: ['xls', 'xlsx'],
-            pdf: ['pdf'],
-            image: ['jpg', 'jpeg', 'png'],
-            all: ['pdf', 'jpg', 'jpeg', 'png', 'xls', 'xlsx', 'doc', 'docx', 'zip']};
-        const validExtensions = props.item.fileType === 'excel'
-            ? allowedExtensions.excel
-            : props.item.fileType === 'pdf'
-                ? allowedExtensions.pdf
-                : props.item.fileType === 'image'
-                    ? allowedExtensions.image
-                    : allowedExtensions.all;
+        const validExtensions = getValidExtensions();
         const invalidFile = fileArray.find((file) => {
             const ext = file.name.split('.').pop()?.toLowerCase();
             return !ext || !validExtensions.includes(ext);
@@ -208,15 +236,7 @@ const MultiFileWithPreview = ({ props, variant, }) => {
                                             : `${selectedFiles.length} file(s) selected`
                                         : isSingleFileMode
                                             ? 'Upload File'
-                                            : 'Upload Files', jsx("input", { type: "file", hidden: true, multiple: !isSingleFileMode, accept: props.item.fileType === 'excel'
-                                            ? '.xls,.xlsx'
-                                            : props.item.fileType === 'pdf'
-                                                ? '.pdf'
-                                                : props.item.fileType === 'image'
-                                                    ? '.jpg,.jpeg,.png'
-                                                    : props.item.fileType === 'all'
-                                                        ? '.pdf,.jpg,.jpeg,.png,.xls,.xlsx,.doc,.docx'
-                                                        : '', ref: inputRef, onChange: handleFileChange })] }), jsx(Box, { sx: { width: 36, display: 'flex', justifyContent: 'center' }, children: props.item.showFileCarousel && selectedFiles.length > 0 ? (jsx(IconButton, { onClick: handlePreviewClick, color: "primary", size: "small", "aria-label": "preview selected files", children: jsx(VisibilityIcon, {}) })) : null })] })] }), jsx(FormBottomField, { ...props }), jsx(Modal, { open: open, onClose: handleClose, children: jsxs(Box, { sx: {
+                                            : 'Upload Files', jsx("input", { type: "file", hidden: true, multiple: !isSingleFileMode, accept: getAcceptString(), ref: inputRef, onChange: handleFileChange })] }), jsx(Box, { sx: { width: 36, display: 'flex', justifyContent: 'center' }, children: props.item.showFileCarousel && selectedFiles.length > 0 ? (jsx(IconButton, { onClick: handlePreviewClick, color: "primary", size: "small", "aria-label": "preview selected files", children: jsx(VisibilityIcon, {}) })) : null })] })] }), jsx(FormBottomField, { ...props }), jsx(Modal, { open: open, onClose: handleClose, children: jsxs(Box, { sx: {
                         position: 'absolute',
                         top: '50%',
                         left: '50%',

package/dist/node_modules/react-date-range/dist/components/Calendar/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as Calendar } from '../../../../../_virtual/index.esm5.js';
+import { __exports as Calendar } from '../../../../../_virtual/index.esm6.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDayCell } from '../DayCell/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DefinedRange/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DefinedRange } from '../../../../../_virtual/index.esm6.js';
+import { __exports as DefinedRange } from '../../../../../_virtual/index.esm5.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireStyles } from '../../styles.esm.js';

package/dist/node_modules/react-date-range/dist/components/InputRangeField/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as InputRangeField } from '../../../../../_virtual/index.esm14.js';
+import { __exports as InputRangeField } from '../../../../../_virtual/index.esm12.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 

package/dist/node_modules/react-date-range/dist/components/Month/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as Month } from '../../../../../_virtual/index.esm12.js';
+import { __exports as Month } from '../../../../../_virtual/index.esm14.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDayCell } from '../DayCell/index.esm.js';

package/dist/utils/Interface/FormInterface.d.ts

@@ -41,7 +41,7 @@ export interface FormSectionPropsItem {
     sx?: SxProps<Theme>;
     donotAllowSpace?: boolean;
     onInputProps?: (e: React.FocusEvent<HTMLInputElement>) => void;
-    fileType?: 'excel' | 'pdf' | 'all' | 'zip' | 'image' | 'document' | '';
+    fileType?: 'excel' | 'pdf' | 'all' | 'zip' | 'image' | 'document' | '' | string[];
     handleFileError?: (message: string) => void;
     onCloseMenu?: () => void;
     doNotAllowPaste?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tp-react-elements",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "private": false,
   "type": "module",
   "description": "React form components library built with React Hook Form and Yup",