react-hook-toolkit 1.0.14 → 1.0.15

package/dist/hooks/hooksComp.d.ts

@@ -1,55 +0,0 @@
-import React, { FC } from 'react';
-export declare const DynamicLoader: (Component: any) => (props: any) => import("react/jsx-runtime").JSX.Element;
-interface PropsType {
-    type: string;
-    msg: string;
-    duration?: number;
-}
-export declare const AlertMessage: FC<PropsType>;
-interface DetailsCardProps {
-    isLoading?: boolean;
-    title: string;
-    details: any[];
-    spacing?: number;
-    boxShadow?: string;
-    background?: string;
-    loaderType?: 'skeleton' | 'circular';
-    displayType?: 'flex' | 'block';
-}
-export declare const DetailsCard: ({ isLoading, title, details, spacing, boxShadow, background, loaderType, displayType, }: DetailsCardProps) => import("react/jsx-runtime").JSX.Element;
-export declare const LabeledValue: ({ label, value, style }: any) => import("react/jsx-runtime").JSX.Element;
-interface FileComponentProps {
-    primaryKey: string | number;
-    filename: string;
-    size: string | number;
-    onDownload?: any;
-    width?: number;
-    borderColor?: string;
-    fileColor?: 'inherit' | 'primary' | 'secondary' | 'error' | 'disabled' | 'action';
-    isDownloading: boolean;
-}
-export declare const FilePreview: ({ primaryKey, filename, size, onDownload, width, borderColor, fileColor, isDownloading, }: FileComponentProps) => import("react/jsx-runtime").JSX.Element;
-interface UploadButtonProps {
-    isUpload?: boolean;
-    color?: 'inherit' | 'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning';
-    state?: {
-        isUploaded?: boolean;
-        isUploadError?: boolean;
-        isLoadingUpload?: boolean;
-    };
-    onFileSelect: (file: File) => void;
-}
-export declare const UploadFile: React.FC<UploadButtonProps>;
-interface DownloadButtonState {
-    isDownloaded?: boolean;
-    isDownloadError?: boolean;
-    isLoadingDownload?: boolean;
-}
-interface DownloadFileProps {
-    isDownload?: boolean;
-    color?: 'inherit' | 'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning';
-    state?: DownloadButtonState;
-    onDownload: () => void;
-}
-export declare const DownloadFile: React.FC<DownloadFileProps>;
-export {};

package/dist/hooks/hooksComp.js

@@ -1,168 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { useEffect, useCallback, useRef, Suspense } from 'react';
-import { Box, Alert, AlertTitle, IconButton, CardContent, Tooltip, Typography, Card, Grid, Skeleton, CircularProgress, } from '@mui/material';
-import { Close, InsertDriveFile, Image, Description, Download, CheckCircleOutlined, ErrorOutlineOutlined, Upload, } from '@mui/icons-material';
-import NProgress from 'nprogress';
-import { ErrorBoundary } from 'react-error-boundary';
-import { promise } from '../utils';
-import { getHook } from '../hookExecuter/hookExecuter';
-import { useWindowSize } from './hooks';
-function Fallback(_a) {
-    var error = _a.error;
-    return (_jsxs(Box, { sx: { padding: 2 }, children: [process.env.NODE_ENV === 'production' && (_jsxs(Alert, { sx: { py: 0, borderLeft: '2px solid #00abff !important', border: '1px solid #d0cfcf' }, severity: "info", children: [_jsx(AlertTitle, { children: "Page Loading Error" }), "Please check your network connection..."] })), process.env.NODE_ENV !== 'production' && (_jsxs(Alert, { severity: "error", sx: { py: 0, borderTop: '2px solid #791212ad !important', border: '1px solid #d0cfcf' }, children: [_jsx(AlertTitle, { children: "Error" }), error.message] }))] }));
-}
-var Error = function (_a) {
-    var children = _a.children;
-    var firstRender = useRef(false);
-    var handleReload = useCallback(function () {
-        if (!firstRender.current) {
-            firstRender.current = true; // Ensure this runs only once
-            promise(1500).then(function () {
-                window.location.reload();
-            });
-        }
-    }, []);
-    return (_jsx(ErrorBoundary, { FallbackComponent: Fallback, onError: function () {
-            if (process.env.NODE_ENV === 'production') {
-                handleReload();
-            }
-        }, children: children }));
-};
-var LoadingScreen = function () {
-    useEffect(function () {
-        NProgress.start();
-        return function () {
-            NProgress.done();
-        };
-    }, []);
-    return (_jsx(Box, { sx: {
-            backgroundColor: 'background.paper',
-            minHeight: '100%',
-        } }));
-};
-// prettier-ignore
-export var DynamicLoader = function (Component) { return function (props) { return (_jsx(Error, { children: _jsx(Suspense, { fallback: _jsx(LoadingScreen, {}), children: _jsx(Component, __assign({}, props)) }) })); }; };
-export var AlertMessage = function (_a) {
-    var type = _a.type, msg = _a.msg, duration = _a.duration;
-    var _b = getHook('snackBar'), enqueueSnackbar = _b.enqueueSnackbar, closeSnackbar = _b.closeSnackbar;
-    if (msg !== undefined && msg !== '') {
-        enqueueSnackbar(msg !== null && msg !== void 0 ? msg : '', {
-            anchorOrigin: {
-                // @shivaji perpose dyanamic global alert.
-                horizontal: 'right',
-                vertical: 'top',
-            },
-            variant: type,
-            preventDuplicate: true,
-            // persist: true, whenever you want to close.
-            action: function (key) { return (_jsx(IconButton, { "aria-label": "close", size: "small", onClick: function () { return closeSnackbar(key); }, children: _jsx(Close, { fontSize: "small", sx: { color: '#fff' } }) })); },
-            autoHideDuration: duration !== null && duration !== void 0 ? duration : 6000,
-        });
-    }
-    return null;
-};
-export var DetailsCard = function (_a) {
-    var _b = _a.isLoading, isLoading = _b === void 0 ? false : _b, title = _a.title, details = _a.details, _c = _a.spacing, spacing = _c === void 0 ? 2 : _c, _d = _a.boxShadow, boxShadow = _d === void 0 ? '0px 0px 2px 2px #d8d8d8' : _d, _e = _a.background, background = _e === void 0 ? '#eee' : _e, _f = _a.loaderType, loaderType = _f === void 0 ? 'skeleton' : _f, _g = _a.displayType, displayType = _g === void 0 ? 'flex' : _g;
-    var width = useWindowSize().width;
-    return (_jsx(Card, { sx: { boxShadow: boxShadow }, children: _jsxs(CardContent, { children: [_jsx(Typography, { variant: "h6", sx: { background: background, padding: '4px' }, children: title }), _jsx(Grid, { container: true, spacing: spacing, sx: { mt: 1 }, children: details.filter(Boolean).map(function (item, index) { return (_jsx(Grid, { item: true, xs: 12, sm: 6, md: 6, lg: width < 1367 ? 6 : 4, children: _jsxs(Box, { display: displayType, alignItems: "center", sx: { fontSize: '14px' }, children: [_jsxs(Typography, { fontWeight: "bold", component: "span", sx: { fontSize: '14px' }, children: [item === null || item === void 0 ? void 0 : item.label, ":\u00A0"] }), isLoading ? (loaderType === 'skeleton' ? (_jsx(Skeleton, { sx: { ml: 2 }, variant: "text", width: 100, height: 20 })) : (_jsx(CircularProgress, { sx: { ml: 2 }, color: "success", size: 18 }))) : (_jsx(Typography, { component: "span", sx: { fontSize: '14px' }, children: (item === null || item === void 0 ? void 0 : item.value) !== undefined && (item === null || item === void 0 ? void 0 : item.value) !== null && (item === null || item === void 0 ? void 0 : item.value) !== '' ? item.value : 'N/A' }))] }) }, index.toString())); }) })] }) }));
-};
-export var LabeledValue = function (_a) {
-    var label = _a.label, value = _a.value, _b = _a.style, style = _b === void 0 ? undefined : _b;
-    return (_jsx(_Fragment, { children: _jsx(Typography, { sx: style !== null && style !== void 0 ? style : { padding: '5px' }, children: _jsxs("span", { style: { fontSize: '13px' }, children: [_jsxs("b", { children: [label, " "] }), ": ", value !== null && value !== void 0 ? value : 'N/A'] }) }) }));
-};
-export var FilePreview = function (_a) {
-    var primaryKey = _a.primaryKey, filename = _a.filename, size = _a.size, _b = _a.onDownload, onDownload = _b === void 0 ? undefined : _b, _c = _a.width, width = _c === void 0 ? 350 : _c, _d = _a.borderColor, borderColor = _d === void 0 ? '#dfdfdf' : _d, _e = _a.fileColor, fileColor = _e === void 0 ? 'primary' : _e, _f = _a.isDownloading, isDownloading = _f === void 0 ? false : _f;
-    // Icon mapping configuration
-    var iconMap = {
-        pdf: _jsx(InsertDriveFile, { fontSize: "large", color: fileColor }),
-        image: _jsx(Image, { fontSize: "large", color: fileColor }),
-        doc: _jsx(Description, { fontSize: "large", color: fileColor }),
-        default: _jsx(Description, { fontSize: "large", color: fileColor }),
-    };
-    // Determine file type from filename extension
-    var getFileType = function (filenames) {
-        var extension = filenames.split('.').pop().toLowerCase();
-        if (['pdf'].includes(extension))
-            return 'pdf';
-        if (['jpg', 'jpeg', 'png', 'gif'].includes(extension))
-            return 'image';
-        if (['doc', 'docx', 'txt'].includes(extension))
-            return 'doc';
-        return 'default';
-    };
-    return (_jsx(Card, { variant: "outlined", sx: {
-            maxWidth: width,
-            minWidth: width,
-            border: "1px solid ".concat(borderColor),
-            borderRadius: 1,
-            '&:hover': { boxShadow: 2 },
-            marginLeft: 1,
-        }, children: _jsxs(CardContent, { sx: {
-                display: 'flex',
-                alignItems: 'center',
-                gap: 2,
-                padding: '8px !important',
-            }, children: [iconMap[getFileType(filename)], _jsxs(Box, { sx: { flexGrow: 1 }, children: [filename.length > 33 ? (_jsx(Tooltip, { title: filename, placement: "top", arrow: true, children: _jsx(Typography, { sx: {
-                                    fontSize: '14px',
-                                    whiteSpace: 'nowrap',
-                                    overflow: 'hidden',
-                                    textOverflow: 'ellipsis',
-                                    maxWidth: width - 120,
-                                }, children: filename }) })) : (_jsx(Typography, { sx: {
-                                fontSize: '14px',
-                                whiteSpace: 'nowrap',
-                                overflow: 'hidden',
-                                textOverflow: 'ellipsis',
-                                maxWidth: width - 120,
-                            }, children: filename })), _jsx(Typography, { variant: "caption", color: "text.secondary", children: size })] }), _jsx(IconButton, { disabled: onDownload === undefined, "aria-label": "download", onClick: function () { return onDownload(primaryKey); }, sx: { color: '#dfdfdf', '&:hover': { color: 'primary.main' } }, children: isDownloading ? (_jsx(CircularProgress, { color: "success", size: 20 })) : (_jsx(Download, { fontSize: "small", color: "primary" })) })] }) }));
-};
-var VisuallyHiddenInput = forwardRef(function (props, ref) { return (_jsx("input", __assign({ ref: ref, type: "file", style: {
-        position: 'absolute',
-        width: 1,
-        height: 1,
-        padding: 0,
-        overflow: 'hidden',
-        clip: 'rect(0,0,0,0)',
-        whiteSpace: 'nowrap',
-        border: 0,
-    } }, props))); });
-export var UploadFile = function (_a) {
-    var _b = _a.isUpload, isUpload = _b === void 0 ? true : _b, color = _a.color, _c = _a.state, state = _c === void 0 ? {} : _c, onFileSelect = _a.onFileSelect;
-    var onFileInputChange = function (e) {
-        var _a;
-        var file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
-        if (file) {
-            onFileSelect(file);
-            e.target.value = '';
-        }
-    };
-    return (_jsx(Tooltip, { title: "Upload", children: _jsxs(Box, { sx: { position: 'relative', display: 'inline-block' }, children: [_jsxs(IconButton, { disabled: !isUpload, component: "label", children: [(state === null || state === void 0 ? void 0 : state.isUploaded) ? (_jsx(CheckCircleOutlined, { color: "success" })) : (state === null || state === void 0 ? void 0 : state.isUploadError) ? (_jsx(ErrorOutlineOutlined, { color: "error" })) : (_jsx(Upload, { color: color !== null && color !== void 0 ? color : 'primary' })), _jsx(VisuallyHiddenInput, { onChange: onFileInputChange })] }), (state === null || state === void 0 ? void 0 : state.isLoadingUpload) && (_jsx(CircularProgress, { size: "40px", sx: {
-                        position: 'absolute',
-                        top: 0,
-                        left: 0,
-                        zIndex: 1,
-                    } }))] }) }));
-};
-export var DownloadFile = function (_a) {
-    var _b = _a.isDownload, isDownload = _b === void 0 ? true : _b, color = _a.color, _c = _a.state, state = _c === void 0 ? {} : _c, onDownload = _a.onDownload;
-    return (_jsx(Tooltip, { title: "Download", children: _jsxs(Box, { sx: { position: 'relative', display: 'inline-block' }, children: [_jsx(IconButton, { disabled: !isDownload || (state === null || state === void 0 ? void 0 : state.isLoadingDownload), onClick: onDownload, sx: {
-                        bgcolor: function (theme) { return (color ? (theme.palette.mode === 'dark' ? '#303041' : color) : 'default'); },
-                    }, children: (state === null || state === void 0 ? void 0 : state.isDownloaded) ? (_jsx(CheckCircleOutlined, { color: "success" })) : (state === null || state === void 0 ? void 0 : state.isDownloadError) ? (_jsx(ErrorOutlineOutlined, { color: "error" })) : (_jsx(Download, { color: color !== null && color !== void 0 ? color : 'primary' })) }), (state === null || state === void 0 ? void 0 : state.isLoadingDownload) && (_jsx(CircularProgress, { size: "40px", sx: {
-                        position: 'absolute',
-                        top: 0,
-                        left: 0,
-                        zIndex: 1,
-                    } }))] }) }));
-};

package/dist/skeletons/skeletons.d.ts

@@ -1,19 +0,0 @@
-export declare const FileSkeleton: ({ length, width, borderColor }: {
-    length?: number | undefined;
-    width?: number | undefined;
-    borderColor?: string | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const TableSkeleton: ({ rows, columns }: {
-    rows?: number | undefined;
-    columns?: number | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const LineChartSkeleton: () => import("react/jsx-runtime").JSX.Element;
-export declare const CardSkeleton: () => import("react/jsx-runtime").JSX.Element;
-export declare const PieChartSkeleton: React.FC;
-export declare const FieldSkeleton: ({ length, width, spacing, isLabel, itemsPerRow, }: {
-    length?: number | undefined;
-    width?: string | undefined;
-    spacing?: number | undefined;
-    isLabel?: boolean | undefined;
-    itemsPerRow?: number | undefined;
-}) => import("react/jsx-runtime").JSX.Element;

package/dist/skeletons/skeletons.js

@@ -1,94 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Card, CardContent, CardHeader, Grid, IconButton, Skeleton, Table, TableBody, TableCell, TableHead, TableRow, Toolbar, Tooltip, } from "@mui/material";
-import { Download } from "@mui/icons-material";
-export var FileSkeleton = function (_a) {
-    var _b = _a.length, length = _b === void 0 ? 1 : _b, _c = _a.width, width = _c === void 0 ? 350 : _c, _d = _a.borderColor, borderColor = _d === void 0 ? '#dfdfdf' : _d;
-    return (_jsx(Grid, { container: true, spacing: 2, children: Array.from({ length: length }).map(function (_, index) { return (_jsx(Grid, { item: true, children: _jsx(Card, { variant: "outlined", sx: {
-                    maxWidth: width,
-                    minWidth: width,
-                    border: "1px solid ".concat(borderColor),
-                    borderRadius: 1,
-                    '&:hover': { boxShadow: 2 },
-                    marginLeft: 3,
-                }, children: _jsxs(CardContent, { sx: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: 2,
-                        padding: '8px !important',
-                    }, children: [_jsx(Skeleton, { variant: "rectangular", width: 50, height: 40 }), _jsxs(Box, { sx: { flexGrow: 1 }, children: [_jsx(Skeleton, { variant: "text", width: width - 120, height: 20 }), _jsx(Skeleton, { variant: "text", width: 60, height: 14 })] }), _jsx(IconButton, { disabled: true, sx: { color: '#dfdfdf' }, children: _jsx(Download, { fontSize: "small", color: "disabled" }) })] }) }) }, index.toString())); }) }));
-};
-export var TableSkeleton = function (_a) {
-    var _b = _a.rows, rows = _b === void 0 ? 6 : _b, _c = _a.columns, columns = _c === void 0 ? 6 : _c;
-    return (_jsxs(Box, { sx: { width: '100%', overflowX: 'auto' }, children: [_jsxs(Toolbar, { sx: {
-                    display: 'flex',
-                    justifyContent: 'space-between',
-                    p: 1,
-                    borderBottom: '1px solid #dbdbdb',
-                }, children: [_jsx(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: _jsx(Skeleton, { variant: "rectangular", width: 200, height: 40 }) }), _jsx(Box, { children: _jsx(Tooltip, { title: "Filter", children: _jsx(IconButton, { children: _jsx(Skeleton, { variant: "circular", width: 40, height: 40 }) }) }) })] }), _jsxs(Table, { "aria-label": "loading table", children: [_jsx(TableHead, { children: _jsx(TableRow, { children: Array.from({ length: columns }).map(function (_, index) { return (_jsx(TableCell, { children: _jsx(Skeleton, { variant: "rectangular", height: 20 }) }, "head-".concat(index))); }) }) }), _jsx(TableBody, { children: Array.from({ length: rows }).map(function (_, rowIndex) { return (_jsx(TableRow, { children: Array.from({ length: columns }).map(function (_, colIndex) { return (_jsx(TableCell, { children: _jsx(Skeleton, { animation: "wave", variant: "text", width: "100%" }) }, "cell-".concat(rowIndex, "-").concat(colIndex))); }) }, "row-".concat(rowIndex))); }) })] })] }));
-};
-export var LineChartSkeleton = function () {
-    return (_jsxs(Box, { sx: { width: '100%', height: '300px', position: 'relative', padding: '16px' }, children: [_jsx(Skeleton, { variant: "text", width: "30%", height: 30, sx: { position: 'absolute', top: 10, left: '50%', transform: 'translateX(-50%)' } }), _jsx(Skeleton, { variant: "rectangular", width: "calc(100% - 40px)", height: 4, sx: { position: 'absolute', bottom: 40, left: 20 } }), _jsx(Skeleton, { variant: "rectangular", width: 2, height: "calc(100% - 40px)", sx: { position: 'absolute', top: 0, bottom: 40, left: 20 } }), _jsx(Skeleton, { variant: "rectangular", width: 2, height: "calc(100% - 40px)", sx: { position: 'absolute', top: 0, bottom: 40, right: 20 } }), [1, 2, 3, 4].map(function (_, index) { return (_jsx(Skeleton, { variant: "rectangular", width: "calc(100% - 40px)", height: 4, sx: { position: 'absolute', bottom: "".concat(40 + index * 50, "px"), left: '20px' } }, index.toString())); }), _jsx(Skeleton, { variant: "rectangular", width: "calc(100% - 40px)", height: 2, sx: {
-                    position: 'absolute',
-                    left: '20px',
-                    top: '85%',
-                    transform: 'rotate(-7deg)',
-                    transformOrigin: 'left center',
-                } })] }));
-};
-export var CardSkeleton = function () {
-    var skeletonStyles = {
-        boxShadow: '0px 1px 8px -2px #444444de',
-        borderRadius: '10px',
-        overflow: 'hidden',
-        padding: '12px',
-        transition: '0.3s',
-        background: 'linear-gradient(to top left, #fff 20%, #f5f5f5 80%)',
-        width: {
-            xs: '90%',
-            sm: '70%',
-            md: '150%',
-            lg: '195%',
-            xl: '200%',
-        },
-        maxWidth: '600px',
-    };
-    return (_jsx(Grid, { item: true, xs: 12, sm: 6, md: 6, children: _jsxs(Box, { sx: skeletonStyles, children: [_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 30, sx: { marginBottom: '12px', borderRadius: '4px', background: 'linear-gradient(to left, #e0e0e0 10%, #cfcfcf 100%)', } }), _jsx(Box, { children: Array.from(new Array(4)).map(function (__, index) { return (_jsxs(Box, { sx: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: index !== 3 ? 1 : 0, }, children: [_jsx(Skeleton, { variant: "text", width: "70%", height: 20 }), _jsx(Skeleton, { variant: "text", width: "20%", height: 20 })] }, index.toString())); }) })] }) }));
-};
-export var PieChartSkeleton = function () {
-    return (_jsxs(_Fragment, { children: [_jsx(Grid, { item: true, xs: 12, sm: 6, md: 6, lg: 6, sx: { padding: '10px' }, children: _jsxs(Card, { sx: {
-                        borderRadius: '6px',
-                        height: '100%',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        justifyContent: 'space-between',
-                        cursor: 'default',
-                    }, children: [_jsx(CardHeader, { title: (_jsx(Skeleton, { variant: "rectangular", width: "80%", height: "20px", sx: { margin: '0 auto', borderRadius: '4px' } })), sx: {
-                                background: '#dbe7f2',
-                                padding: '8px',
-                            } }), _jsx(CardContent, { sx: {
-                                display: 'flex',
-                                justifyContent: 'center',
-                                alignItems: 'center',
-                                height: '320px',
-                            }, children: _jsx(Skeleton, { variant: "circular", width: 200, height: 200, sx: { marginBottom: '16px' } }) })] }) }), _jsx(Grid, { item: true, xs: 12, sm: 6, md: 6, lg: 6, sx: { padding: '10px' }, children: _jsxs(Card, { sx: {
-                        borderRadius: '6px',
-                        height: '100%',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        justifyContent: 'space-between',
-                        cursor: 'default',
-                    }, children: [_jsx(CardHeader, { title: (_jsx(Skeleton, { variant: "rectangular", width: "80%", height: "20px", sx: { margin: '0 auto', borderRadius: '4px' } })), sx: {
-                                background: '#dbe7f2',
-                                padding: '8px',
-                            } }), _jsx(CardContent, { sx: {
-                                display: 'flex',
-                                justifyContent: 'center',
-                                alignItems: 'center',
-                                height: '320px',
-                            }, children: _jsx(Skeleton, { variant: "circular", width: 200, height: 200, sx: { marginBottom: '16px' } }) })] }) })] }));
-};
-export var FieldSkeleton = function (_a) {
-    var _b = _a.length, length = _b === void 0 ? 1 : _b, _c = _a.width, width = _c === void 0 ? '100%' : _c, _d = _a.spacing, spacing = _d === void 0 ? 2 : _d, _e = _a.isLabel, isLabel = _e === void 0 ? false : _e, _f = _a.itemsPerRow, itemsPerRow = _f === void 0 ? 2 : _f;
-    var columnSize = Math.floor(12 / itemsPerRow);
-    return (_jsx(Grid, { container: true, spacing: spacing, children: Array.from({ length: length }).map(function (_, index) { return (_jsx(Grid, { item: true, xs: 12, sm: columnSize, children: _jsxs(Box, { sx: { width: '100%', margin: 2 }, children: [isLabel && _jsx(Skeleton, { variant: "text", width: "40%", height: 20, sx: { marginBottom: 1 } }), _jsx(Skeleton, { variant: "rectangular", width: width, height: 40, sx: { borderRadius: 1 } })] }) }, index.toString())); }) }));
-};