react-hook-toolkit 1.0.11 → 1.0.13

package/dist/hooks/hooksComp.d.ts

@@ -7,14 +7,16 @@ interface PropsType {
 }
 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: ({ title, details, spacing, boxShadow, background, loaderType, }: DetailsCardProps) => import("react/jsx-runtime").JSX.Element;
+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;

package/dist/hooks/hooksComp.js

@@ -74,9 +74,9 @@ export var AlertMessage = function (_a) {
     return null;
 };
 export var DetailsCard = function (_a) {
-    var title = _a.title, details = _a.details, _b = _a.spacing, spacing = _b === void 0 ? 2 : _b, _c = _a.boxShadow, boxShadow = _c === void 0 ? '0px 0px 2px 2px #d8d8d8' : _c, _d = _a.background, background = _d === void 0 ? '#eee' : _d, _e = _a.loaderType, loaderType = _e === void 0 ? 'skeleton' : _e;
+    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: "flex", 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"] }), (item === null || item === void 0 ? void 0 : item.value) ? (_jsx(Typography, { component: "span", sx: { fontSize: '14px' }, children: item.value || 'N/A' })) : loaderType === 'skeleton' ? (_jsx(Skeleton, { sx: { ml: 2 }, variant: "text", width: 100, height: 20 })) : (_jsx(CircularProgress, { sx: { ml: 2 }, color: "success", size: 18 }))] }) }, index.toString())); }) })] }) }));
+    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;
@@ -120,7 +120,7 @@ export var FilePreview = function (_a) {
                                     overflow: 'hidden',
                                     textOverflow: 'ellipsis',
                                     maxWidth: width - 120,
-                                }, variant: "body1", fontWeight: "medium", children: filename }) })) : (_jsx(Typography, { sx: {
+                                }, children: filename }) })) : (_jsx(Typography, { sx: {
                                 fontSize: '14px',
                                 whiteSpace: 'nowrap',
                                 overflow: 'hidden',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-hook-toolkit",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "description": "Ultimate package for React developers, offering a powerful collection of hooks and components to enhance their development experience.",
   "main": "dist/index.js",
   "module": "dist/index.js",