@etsoo/materialui 1.5.76 → 1.5.77

package/lib/cjs/MobileListItemRenderer.js

@@ -10,6 +10,7 @@ const LinearProgress_1 = __importDefault(require("@mui/material/LinearProgress")
 const Card_1 = __importDefault(require("@mui/material/Card"));
 const CardHeader_1 = __importDefault(require("@mui/material/CardHeader"));
 const CardContent_1 = __importDefault(require("@mui/material/CardContent"));
+const ScrollerListEx_1 = require("./ScrollerListEx");
 /**
  * Default mobile list item renderer
  * @param param0 List renderer props
@@ -25,9 +26,7 @@ function MobileListItemRenderer({ data }, renderer, cellSX) {
     // Elements
     const [title, subheader, actions, children, cardActions] = renderer(data);
     return ((0, jsx_runtime_1.jsxs)(Card_1.default, { sx: {
-            height: `calc(100% - 8px)`,
-            marginTop: "8px",
-            overflow: "auto",
+            ...ScrollerListEx_1.ScrollerListExItemDefaultStyles,
             ...cellSX
         }, children: [(0, jsx_runtime_1.jsx)(CardHeader_1.default, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? ((0, jsx_runtime_1.jsx)(MoreFab_1.MoreFab, { iconButton: true, size: "small", anchorOrigin: {
                         vertical: "bottom",

package/lib/cjs/ScrollerListEx.d.ts

@@ -22,6 +22,10 @@ export type ScrollerListExItemRendererProps<T> = {
      */
     selected: boolean;
 };
+/**
+ * Default styles for item renderer
+ */
+export declare const ScrollerListExItemDefaultStyles: React.CSSProperties;
 /**
  * Extended ScrollerList Props
  */

package/lib/cjs/ScrollerListEx.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ScrollerListExItemDefaultStyles = void 0;
 exports.ScrollerListEx = ScrollerListEx;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const css_1 = require("@emotion/css");
@@ -46,6 +47,15 @@ const createGridStyle = (alternatingColors, selectedColor) => {
         }
     });
 };
+/**
+ * Default styles for item renderer
+ */
+exports.ScrollerListExItemDefaultStyles = {
+    height: `calc(100% - 16px)`,
+    marginTop: "8px",
+    marginBottom: "8px",
+    overflow: "auto"
+};
 /**
  * Extended ScrollerList
  * @param props Props
@@ -73,7 +83,7 @@ function ScrollerListEx(props) {
         return selected;
     };
     // Destruct
-    const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, idField = "id", itemRenderer = ({ data }) => ((0, jsx_runtime_1.jsx)(Box_1.default, { component: "pre", sx: { height: "100%", overflow: "auto" }, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 116, selectedColor = "#edf4fb", ...rest } = props;
+    const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, idField = "id", itemRenderer = ({ data }) => ((0, jsx_runtime_1.jsx)(Box_1.default, { component: "pre", sx: exports.ScrollerListExItemDefaultStyles, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 142, selectedColor = "#edf4fb", ...rest } = props;
     // Init handler
     const initHandler = (0, useListCacheInitLoad_1.useListCacheInitLoad)(cacheKey, cacheMinutes);
     const onUpdateRowsHandler = react_2.default.useCallback((rows, state) => {

package/lib/mjs/MobileListItemRenderer.js

@@ -4,6 +4,7 @@ import LinearProgress from "@mui/material/LinearProgress";
 import Card from "@mui/material/Card";
 import CardHeader from "@mui/material/CardHeader";
 import CardContent from "@mui/material/CardContent";
+import { ScrollerListExItemDefaultStyles } from "./ScrollerListEx";
 /**
  * Default mobile list item renderer
  * @param param0 List renderer props
@@ -19,9 +20,7 @@ export function MobileListItemRenderer({ data }, renderer, cellSX) {
     // Elements
     const [title, subheader, actions, children, cardActions] = renderer(data);
     return (_jsxs(Card, { sx: {
-            height: `calc(100% - 8px)`,
-            marginTop: "8px",
-            overflow: "auto",
+            ...ScrollerListExItemDefaultStyles,
             ...cellSX
         }, children: [_jsx(CardHeader, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? (_jsx(MoreFab, { iconButton: true, size: "small", anchorOrigin: {
                         vertical: "bottom",

package/lib/mjs/ScrollerListEx.d.ts

@@ -22,6 +22,10 @@ export type ScrollerListExItemRendererProps<T> = {
      */
     selected: boolean;
 };
+/**
+ * Default styles for item renderer
+ */
+export declare const ScrollerListExItemDefaultStyles: React.CSSProperties;
 /**
  * Extended ScrollerList Props
  */

package/lib/mjs/ScrollerListEx.js

@@ -40,6 +40,15 @@ const createGridStyle = (alternatingColors, selectedColor) => {
         }
     });
 };
+/**
+ * Default styles for item renderer
+ */
+export const ScrollerListExItemDefaultStyles = {
+    height: `calc(100% - 16px)`,
+    marginTop: "8px",
+    marginBottom: "8px",
+    overflow: "auto"
+};
 /**
  * Extended ScrollerList
  * @param props Props
@@ -67,7 +76,7 @@ export function ScrollerListEx(props) {
         return selected;
     };
     // Destruct
-    const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, idField = "id", itemRenderer = ({ data }) => (_jsx(Box, { component: "pre", sx: { height: "100%", overflow: "auto" }, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 116, selectedColor = "#edf4fb", ...rest } = props;
+    const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, idField = "id", itemRenderer = ({ data }) => (_jsx(Box, { component: "pre", sx: ScrollerListExItemDefaultStyles, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 142, selectedColor = "#edf4fb", ...rest } = props;
     // Init handler
     const initHandler = useListCacheInitLoad(cacheKey, cacheMinutes);
     const onUpdateRowsHandler = React.useCallback((rows, state) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.5.76",
+  "version": "1.5.77",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",

package/src/MobileListItemRenderer.tsx

@@ -5,7 +5,10 @@ import LinearProgress from "@mui/material/LinearProgress";
 import Card from "@mui/material/Card";
 import CardHeader from "@mui/material/CardHeader";
 import CardContent from "@mui/material/CardContent";
-import { ScrollerListExItemRendererProps } from "./ScrollerListEx";
+import {
+  ScrollerListExItemDefaultStyles,
+  ScrollerListExItemRendererProps
+} from "./ScrollerListEx";
 import { SxProps, Theme } from "@mui/material/styles";
 
 /**
@@ -38,9 +41,7 @@ export function MobileListItemRenderer<T>(
   return (
     <Card
       sx={{
-        height: `calc(100% - 8px)`,
-        marginTop: "8px",
-        overflow: "auto",
+        ...ScrollerListExItemDefaultStyles,
         ...cellSX
       }}
     >

package/src/ScrollerListEx.tsx

@@ -13,6 +13,7 @@ import {
   useListCacheInitLoad
 } from "./uses/useListCacheInitLoad";
 import Box from "@mui/material/Box";
+import { SxProps, Theme } from "@mui/material/styles";
 
 // Scroll bar size
 const scrollbarSize = 16;
@@ -79,6 +80,16 @@ export type ScrollerListExItemRendererProps<T> = {
   selected: boolean;
 };
 
+/**
+ * Default styles for item renderer
+ */
+export const ScrollerListExItemDefaultStyles: React.CSSProperties = {
+  height: `calc(100% - 16px)`,
+  marginTop: "8px",
+  marginBottom: "8px",
+  overflow: "auto"
+};
+
 /**
  * Extended ScrollerList Props
  */
@@ -173,7 +184,7 @@ export function ScrollerListEx<T extends object>(
     cacheMinutes = 15,
     idField = "id" as DataTypes.Keys<T>,
     itemRenderer = ({ data }) => (
-      <Box component="pre" sx={{ height: "100%", overflow: "auto" }}>
+      <Box component="pre" sx={ScrollerListExItemDefaultStyles}>
         {JSON.stringify(data)}
       </Box>
     ),
@@ -181,7 +192,7 @@ export function ScrollerListEx<T extends object>(
     onDoubleClick,
     onUpdateRows,
     onSelectChange,
-    rowHeight = 116,
+    rowHeight = 142,
     selectedColor = "#edf4fb",
     ...rest
   } = props;