@etsoo/materialui 1.5.73 → 1.5.75

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.
Files changed (11) hide show
  1. package/lib/cjs/MobileListItemRenderer.d.ts +4 -2
  2. package/lib/cjs/MobileListItemRenderer.js +4 -8
  3. package/lib/cjs/ScrollerListEx.d.ts +0 -8
  4. package/lib/cjs/ScrollerListEx.js +2 -16
  5. package/lib/mjs/MobileListItemRenderer.d.ts +4 -2
  6. package/lib/mjs/MobileListItemRenderer.js +4 -8
  7. package/lib/mjs/ScrollerListEx.d.ts +0 -8
  8. package/lib/mjs/ScrollerListEx.js +2 -16
  9. package/package.json +5 -5
  10. package/src/MobileListItemRenderer.tsx +7 -17
  11. package/src/ScrollerListEx.tsx +4 -34
package/lib/cjs/MobileListItemRenderer.d.ts CHANGED
@@ -1,17 +1,19 @@
1
1
  import { ListItemReact } from "@etsoo/react";
2
2
  import React from "react";
3
3
  import { ScrollerListExItemRendererProps } from "./ScrollerListEx";
4
+ import { SxProps, Theme } from "@mui/material/styles";
4
5
  /**
5
6
  * Default mobile list item renderer
6
7
  * @param param0 List renderer props
7
8
  * @param margin Margin
8
9
  * @param renderer Renderer for card content
10
+ * @param cellSX Cell sx
9
11
  * @returns Component
10
12
  */
11
- export declare function MobileListItemRenderer<T>({ data, margins, style }: ScrollerListExItemRendererProps<T>, renderer: (data: T) => [
13
+ export declare function MobileListItemRenderer<T>({ data }: ScrollerListExItemRendererProps<T>, renderer: (data: T) => [
12
14
  string,
13
15
  string | undefined,
14
16
  React.ReactNode | (ListItemReact | boolean)[],
15
17
  React.ReactNode,
16
18
  React.ReactNode?
17
- ]): import("react/jsx-runtime").JSX.Element;
19
+ ], cellSX?: SxProps<Theme>): import("react/jsx-runtime").JSX.Element;
package/lib/cjs/MobileListItemRenderer.js CHANGED
@@ -15,17 +15,16 @@ const CardContent_1 = __importDefault(require("@mui/material/CardContent"));
15
15
  * @param param0 List renderer props
16
16
  * @param margin Margin
17
17
  * @param renderer Renderer for card content
18
+ * @param cellSX Cell sx
18
19
  * @returns Component
19
20
  */
20
- function MobileListItemRenderer({ data, margins, style }, renderer) {
21
+ function MobileListItemRenderer({ data }, renderer, cellSX) {
21
22
  // Loading
22
23
  if (data == null)
23
24
  return (0, jsx_runtime_1.jsx)(LinearProgress_1.default, {});
24
25
  // Elements
25
26
  const [title, subheader, actions, children, cardActions] = renderer(data);
26
- return ((0, jsx_runtime_1.jsxs)(Card_1.default, { sx: {
27
- ...margins
28
- }, style: style, 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: {
27
+ return ((0, jsx_runtime_1.jsxs)(Card_1.default, { sx: { height: "100%", overflow: "auto", ...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: {
29
28
  vertical: "bottom",
30
29
  horizontal: "right"
31
30
  }, transformOrigin: {
@@ -34,8 +33,5 @@ function MobileListItemRenderer({ data, margins, style }, renderer) {
34
33
  }, actions: actions })) : (actions), title: title, subheader: subheader, slotProps: {
35
34
  title: { variant: "body2" },
36
35
  subheader: { variant: "caption" }
37
- } }), (0, jsx_runtime_1.jsx)(CardContent_1.default, { sx: {
38
- paddingTop: 0,
39
- paddingBottom: cardActions == null ? Reflect.get(margins, "marginBottom") ?? 0 : 0
40
- }, children: children }), cardActions] }));
36
+ } }), (0, jsx_runtime_1.jsx)(CardContent_1.default, { children: children }), cardActions] }));
41
37
  }
package/lib/cjs/ScrollerListEx.d.ts CHANGED
@@ -17,10 +17,6 @@ export type ScrollerListExItemRendererProps<T> = {
17
17
  * Style
18
18
  */
19
19
  style: React.CSSProperties;
20
- /**
21
- * Default margins
22
- */
23
- margins: object;
24
20
  /**
25
21
  * Item selected
26
22
  */
@@ -42,10 +38,6 @@ export type ScrollerListExProps<T extends object> = Omit<ScrollerListProps<T>, "
42
38
  * Cache minutes
43
39
  */
44
40
  cacheMinutes?: number;
45
- /**
46
- * Cell margins, default to half of MUGlobal.pagePaddings
47
- */
48
- cellMargins?: object;
49
41
  /**
50
42
  * Item renderer
51
43
  */
package/lib/cjs/ScrollerListEx.js CHANGED
@@ -9,7 +9,6 @@ const css_1 = require("@emotion/css");
9
9
  const react_1 = require("@etsoo/react");
10
10
  const shared_1 = require("@etsoo/shared");
11
11
  const react_2 = __importDefault(require("react"));
12
- const MUGlobal_1 = require("./MUGlobal");
13
12
  const GridUtils_1 = require("./GridUtils");
14
13
  const useListCacheInitLoad_1 = require("./uses/useListCacheInitLoad");
15
14
  const Box_1 = __importDefault(require("@mui/material/Box"));
@@ -47,16 +46,6 @@ const createGridStyle = (alternatingColors, selectedColor) => {
47
46
  }
48
47
  });
49
48
  };
50
- // Default margins
51
- const defaultMargins = () => {
52
- const half = MUGlobal_1.MUGlobal.half(MUGlobal_1.MUGlobal.pagePaddings);
53
- return {
54
- marginLeft: half,
55
- marginRight: half,
56
- marginTop: half,
57
- marginBottom: half
58
- };
59
- };
60
49
  /**
61
50
  * Extended ScrollerList
62
51
  * @param props Props
@@ -84,9 +73,7 @@ function ScrollerListEx(props) {
84
73
  return selected;
85
74
  };
86
75
  // Destruct
87
- const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, cellMargins = defaultMargins(), idField = "id", itemRenderer = ({ data, margins, style }) => ((0, jsx_runtime_1.jsx)(Box_1.default, { component: "pre", sx: {
88
- ...margins
89
- }, style: style, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 116, selectedColor = "#edf4fb", ...rest } = props;
76
+ 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;
90
77
  // Init handler
91
78
  const initHandler = (0, useListCacheInitLoad_1.useListCacheInitLoad)(cacheKey, cacheMinutes);
92
79
  const onUpdateRowsHandler = react_2.default.useCallback((rows, state) => {
@@ -106,8 +93,7 @@ function ScrollerListEx(props) {
106
93
  index,
107
94
  data,
108
95
  style,
109
- selected,
110
- margins: cellMargins
96
+ selected
111
97
  });
112
98
  return ((0, jsx_runtime_1.jsx)("div", { className: rowClass, style: style, onMouseDown: (event) => onMouseDown(event.currentTarget, data), onClick: (event) => onClick && onClick(event, data), onDoubleClick: (event) => onDoubleClick && onDoubleClick(event, data), children: child }));
113
99
  }, rowHeight: rowHeight, ...rest }));
package/lib/mjs/MobileListItemRenderer.d.ts CHANGED
@@ -1,17 +1,19 @@
1
1
  import { ListItemReact } from "@etsoo/react";
2
2
  import React from "react";
3
3
  import { ScrollerListExItemRendererProps } from "./ScrollerListEx";
4
+ import { SxProps, Theme } from "@mui/material/styles";
4
5
  /**
5
6
  * Default mobile list item renderer
6
7
  * @param param0 List renderer props
7
8
  * @param margin Margin
8
9
  * @param renderer Renderer for card content
10
+ * @param cellSX Cell sx
9
11
  * @returns Component
10
12
  */
11
- export declare function MobileListItemRenderer<T>({ data, margins, style }: ScrollerListExItemRendererProps<T>, renderer: (data: T) => [
13
+ export declare function MobileListItemRenderer<T>({ data }: ScrollerListExItemRendererProps<T>, renderer: (data: T) => [
12
14
  string,
13
15
  string | undefined,
14
16
  React.ReactNode | (ListItemReact | boolean)[],
15
17
  React.ReactNode,
16
18
  React.ReactNode?
17
- ]): import("react/jsx-runtime").JSX.Element;
19
+ ], cellSX?: SxProps<Theme>): import("react/jsx-runtime").JSX.Element;
package/lib/mjs/MobileListItemRenderer.js CHANGED
@@ -9,17 +9,16 @@ import CardContent from "@mui/material/CardContent";
9
9
  * @param param0 List renderer props
10
10
  * @param margin Margin
11
11
  * @param renderer Renderer for card content
12
+ * @param cellSX Cell sx
12
13
  * @returns Component
13
14
  */
14
- export function MobileListItemRenderer({ data, margins, style }, renderer) {
15
+ export function MobileListItemRenderer({ data }, renderer, cellSX) {
15
16
  // Loading
16
17
  if (data == null)
17
18
  return _jsx(LinearProgress, {});
18
19
  // Elements
19
20
  const [title, subheader, actions, children, cardActions] = renderer(data);
20
- return (_jsxs(Card, { sx: {
21
- ...margins
22
- }, style: style, children: [_jsx(CardHeader, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? (_jsx(MoreFab, { iconButton: true, size: "small", anchorOrigin: {
21
+ return (_jsxs(Card, { sx: { height: "100%", overflow: "auto", ...cellSX }, children: [_jsx(CardHeader, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? (_jsx(MoreFab, { iconButton: true, size: "small", anchorOrigin: {
23
22
  vertical: "bottom",
24
23
  horizontal: "right"
25
24
  }, transformOrigin: {
@@ -28,8 +27,5 @@ export function MobileListItemRenderer({ data, margins, style }, renderer) {
28
27
  }, actions: actions })) : (actions), title: title, subheader: subheader, slotProps: {
29
28
  title: { variant: "body2" },
30
29
  subheader: { variant: "caption" }
31
- } }), _jsx(CardContent, { sx: {
32
- paddingTop: 0,
33
- paddingBottom: cardActions == null ? Reflect.get(margins, "marginBottom") ?? 0 : 0
34
- }, children: children }), cardActions] }));
30
+ } }), _jsx(CardContent, { children: children }), cardActions] }));
35
31
  }
package/lib/mjs/ScrollerListEx.d.ts CHANGED
@@ -17,10 +17,6 @@ export type ScrollerListExItemRendererProps<T> = {
17
17
  * Style
18
18
  */
19
19
  style: React.CSSProperties;
20
- /**
21
- * Default margins
22
- */
23
- margins: object;
24
20
  /**
25
21
  * Item selected
26
22
  */
@@ -42,10 +38,6 @@ export type ScrollerListExProps<T extends object> = Omit<ScrollerListProps<T>, "
42
38
  * Cache minutes
43
39
  */
44
40
  cacheMinutes?: number;
45
- /**
46
- * Cell margins, default to half of MUGlobal.pagePaddings
47
- */
48
- cellMargins?: object;
49
41
  /**
50
42
  * Item renderer
51
43
  */
package/lib/mjs/ScrollerListEx.js CHANGED
@@ -3,7 +3,6 @@ import { css } from "@emotion/css";
3
3
  import { ScrollerList } from "@etsoo/react";
4
4
  import { Utils } from "@etsoo/shared";
5
5
  import React from "react";
6
- import { MUGlobal } from "./MUGlobal";
7
6
  import { GridUtils } from "./GridUtils";
8
7
  import { useListCacheInitLoad } from "./uses/useListCacheInitLoad";
9
8
  import Box from "@mui/material/Box";
@@ -41,16 +40,6 @@ const createGridStyle = (alternatingColors, selectedColor) => {
41
40
  }
42
41
  });
43
42
  };
44
- // Default margins
45
- const defaultMargins = () => {
46
- const half = MUGlobal.half(MUGlobal.pagePaddings);
47
- return {
48
- marginLeft: half,
49
- marginRight: half,
50
- marginTop: half,
51
- marginBottom: half
52
- };
53
- };
54
43
  /**
55
44
  * Extended ScrollerList
56
45
  * @param props Props
@@ -78,9 +67,7 @@ export function ScrollerListEx(props) {
78
67
  return selected;
79
68
  };
80
69
  // Destruct
81
- const { alternatingColors = [undefined, undefined], className, cacheKey, cacheMinutes = 15, cellMargins = defaultMargins(), idField = "id", itemRenderer = ({ data, margins, style }) => (_jsx(Box, { component: "pre", sx: {
82
- ...margins
83
- }, style: style, children: JSON.stringify(data) })), onClick, onDoubleClick, onUpdateRows, onSelectChange, rowHeight = 116, selectedColor = "#edf4fb", ...rest } = props;
70
+ 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;
84
71
  // Init handler
85
72
  const initHandler = useListCacheInitLoad(cacheKey, cacheMinutes);
86
73
  const onUpdateRowsHandler = React.useCallback((rows, state) => {
@@ -100,8 +87,7 @@ export function ScrollerListEx(props) {
100
87
  index,
101
88
  data,
102
89
  style,
103
- selected,
104
- margins: cellMargins
90
+ selected
105
91
  });
106
92
  return (_jsx("div", { className: rowClass, style: style, onMouseDown: (event) => onMouseDown(event.currentTarget, data), onClick: (event) => onClick && onClick(event, data), onDoubleClick: (event) => onDoubleClick && onDoubleClick(event, data), children: child }));
107
93
  }, rowHeight: rowHeight, ...rest }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/materialui",
3
- "version": "1.5.73",
3
+ "version": "1.5.75",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/mjs/index.js",
@@ -46,10 +46,10 @@
46
46
  "@etsoo/shared": "^1.2.76",
47
47
  "@mui/icons-material": "^7.3.4",
48
48
  "@mui/material": "^7.3.4",
49
- "@mui/x-data-grid": "^8.14.0",
50
- "chart.js": "^4.5.0",
49
+ "@mui/x-data-grid": "^8.14.1",
50
+ "chart.js": "^4.5.1",
51
51
  "chartjs-plugin-datalabels": "^2.2.0",
52
- "dompurify": "^3.2.7",
52
+ "dompurify": "^3.3.0",
53
53
  "eventemitter3": "^5.0.1",
54
54
  "pica": "^9.0.1",
55
55
  "pulltorefreshjs": "^0.1.22",
@@ -78,7 +78,7 @@
78
78
  "@types/pulltorefreshjs": "^0.1.7",
79
79
  "@types/react": "^19.2.2",
80
80
  "@types/react-avatar-editor": "^13.0.4",
81
- "@types/react-dom": "^19.2.1",
81
+ "@types/react-dom": "^19.2.2",
82
82
  "@types/react-input-mask": "^3.0.6",
83
83
  "@vitejs/plugin-react": "^5.0.4",
84
84
  "jsdom": "^27.0.0",
package/src/MobileListItemRenderer.tsx CHANGED
@@ -6,16 +6,18 @@ import Card from "@mui/material/Card";
6
6
  import CardHeader from "@mui/material/CardHeader";
7
7
  import CardContent from "@mui/material/CardContent";
8
8
  import { ScrollerListExItemRendererProps } from "./ScrollerListEx";
9
+ import { SxProps, Theme } from "@mui/material/styles";
9
10
 
10
11
  /**
11
12
  * Default mobile list item renderer
12
13
  * @param param0 List renderer props
13
14
  * @param margin Margin
14
15
  * @param renderer Renderer for card content
16
+ * @param cellSX Cell sx
15
17
  * @returns Component
16
18
  */
17
19
  export function MobileListItemRenderer<T>(
18
- { data, margins, style }: ScrollerListExItemRendererProps<T>,
20
+ { data }: ScrollerListExItemRendererProps<T>,
19
21
  renderer: (
20
22
  data: T
21
23
  ) => [
@@ -24,7 +26,8 @@ export function MobileListItemRenderer<T>(
24
26
  React.ReactNode | (ListItemReact | boolean)[],
25
27
  React.ReactNode,
26
28
  React.ReactNode?
27
- ]
29
+ ],
30
+ cellSX?: SxProps<Theme>
28
31
  ) {
29
32
  // Loading
30
33
  if (data == null) return <LinearProgress />;
@@ -33,12 +36,7 @@ export function MobileListItemRenderer<T>(
33
36
  const [title, subheader, actions, children, cardActions] = renderer(data);
34
37
 
35
38
  return (
36
- <Card
37
- sx={{
38
- ...margins
39
- }}
40
- style={style}
41
- >
39
+ <Card sx={{ height: "100%", overflow: "auto", ...cellSX }}>
42
40
  <CardHeader
43
41
  sx={{ paddingBottom: 0.5 }}
44
42
  action={
@@ -67,15 +65,7 @@ export function MobileListItemRenderer<T>(
67
65
  subheader: { variant: "caption" }
68
66
  }}
69
67
  />
70
- <CardContent
71
- sx={{
72
- paddingTop: 0,
73
- paddingBottom:
74
- cardActions == null ? Reflect.get(margins, "marginBottom") ?? 0 : 0
75
- }}
76
- >
77
- {children}
78
- </CardContent>
68
+ <CardContent>{children}</CardContent>
79
69
  {cardActions}
80
70
  </Card>
81
71
  );
package/src/ScrollerListEx.tsx CHANGED
@@ -6,7 +6,7 @@ import {
6
6
  } from "@etsoo/react";
7
7
  import { DataTypes, Utils } from "@etsoo/shared";
8
8
  import React from "react";
9
- import { MouseEventWithDataHandler, MUGlobal } from "./MUGlobal";
9
+ import { MouseEventWithDataHandler } from "./MUGlobal";
10
10
  import { GridUtils } from "./GridUtils";
11
11
  import { useListCacheInitLoad } from "./uses/useListCacheInitLoad";
12
12
  import Box from "@mui/material/Box";
@@ -51,18 +51,6 @@ const createGridStyle = (
51
51
  });
52
52
  };
53
53
 
54
- // Default margins
55
- const defaultMargins = () => {
56
- const half = MUGlobal.half(MUGlobal.pagePaddings);
57
-
58
- return {
59
- marginLeft: half,
60
- marginRight: half,
61
- marginTop: half,
62
- marginBottom: half
63
- };
64
- };
65
-
66
54
  /**
67
55
  * Extended ScrollerList inner item renderer props
68
56
  */
@@ -82,11 +70,6 @@ export type ScrollerListExItemRendererProps<T> = {
82
70
  */
83
71
  style: React.CSSProperties;
84
72
 
85
- /**
86
- * Default margins
87
- */
88
- margins: object;
89
-
90
73
  /**
91
74
  * Item selected
92
75
  */
@@ -116,11 +99,6 @@ export type ScrollerListExProps<T extends object> = Omit<
116
99
  */
117
100
  cacheMinutes?: number;
118
101
 
119
- /**
120
- * Cell margins, default to half of MUGlobal.pagePaddings
121
- */
122
- cellMargins?: object;
123
-
124
102
  /**
125
103
  * Item renderer
126
104
  */
@@ -190,16 +168,9 @@ export function ScrollerListEx<T extends object>(
190
168
  className,
191
169
  cacheKey,
192
170
  cacheMinutes = 15,
193
- cellMargins = defaultMargins(),
194
171
  idField = "id" as DataTypes.Keys<T>,
195
- itemRenderer = ({ data, margins, style }) => (
196
- <Box
197
- component="pre"
198
- sx={{
199
- ...margins
200
- }}
201
- style={style}
202
- >
172
+ itemRenderer = ({ data }) => (
173
+ <Box component="pre" sx={{ height: "100%", overflow: "auto" }}>
203
174
  {JSON.stringify(data)}
204
175
  </Box>
205
176
  ),
@@ -256,8 +227,7 @@ export function ScrollerListEx<T extends object>(
256
227
  index,
257
228
  data,
258
229
  style,
259
- selected,
260
- margins: cellMargins
230
+ selected
261
231
  });
262
232
 
263
233
  return (