@etsoo/materialui 1.3.58 → 1.3.59

package/lib/pages/ResponsivePage.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
 import { ResponsibleContainer } from "../ResponsibleContainer";
@@ -17,30 +18,28 @@ export function ResponsivePage(props) {
     const [scrollContainer, setScrollContainer] = React.useState();
     const [direction, setDirection] = React.useState(fabColumnDirection);
     // Layout
-    return (React.createElement(CommonPage, { ...pageRest, paddings: {}, scrollContainer: scrollContainer, fabColumnDirection: direction },
-        operationMessageHandler && (React.createElement(OperationMessageContainer, { handler: operationMessageHandler })),
-        React.createElement(ResponsibleContainer, { paddings: paddings, containerBoxSx: (paddings, hasField, _dataGrid) => {
-                // Half
-                const half = MUGlobal.half(paddings);
-                // .SearchBox keep the same to avoid flick when switching between DataGrid and List
-                return {
-                    paddingTop: paddings,
-                    "& .SearchBox": {
-                        marginLeft: paddings,
-                        marginRight: paddings,
-                        marginBottom: hasField ? half : 0
-                    },
-                    "& .ListBox": {
-                        marginBottom: paddings
-                    },
-                    "& .DataGridBox": {
-                        marginLeft: paddings,
-                        marginRight: paddings,
-                        marginBottom: paddings
-                    }
-                };
-            }, elementReady: (element, isDataGrid) => {
-                setDirection(!isDataGrid);
-                setScrollContainer(element);
-            }, ...rest })));
+    return (_jsxs(CommonPage, { ...pageRest, paddings: {}, scrollContainer: scrollContainer, fabColumnDirection: direction, children: [operationMessageHandler && (_jsx(OperationMessageContainer, { handler: operationMessageHandler })), _jsx(ResponsibleContainer, { paddings: paddings, containerBoxSx: (paddings, hasField, _dataGrid) => {
+                    // Half
+                    const half = MUGlobal.half(paddings);
+                    // .SearchBox keep the same to avoid flick when switching between DataGrid and List
+                    return {
+                        paddingTop: paddings,
+                        "& .SearchBox": {
+                            marginLeft: paddings,
+                            marginRight: paddings,
+                            marginBottom: hasField ? half : 0
+                        },
+                        "& .ListBox": {
+                            marginBottom: paddings
+                        },
+                        "& .DataGridBox": {
+                            marginLeft: paddings,
+                            marginRight: paddings,
+                            marginBottom: paddings
+                        }
+                    };
+                }, elementReady: (element, isDataGrid) => {
+                    setDirection(!isDataGrid);
+                    setScrollContainer(element);
+                }, ...rest })] }));
 }

package/lib/pages/TablePage.d.ts

@@ -1,9 +1,8 @@
 import { DataTypes, IdDefaultType } from "@etsoo/shared";
-import React from "react";
 import { TablePageProps } from "./TablePageProps";
 /**
  * Table page
  * @param props Props
  * @returns Component
  */
-export declare function TablePage<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>>(props: TablePageProps<T, F, D>): React.JSX.Element;
+export declare function TablePage<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>>(props: TablePageProps<T, F, D>): import("react/jsx-runtime").JSX.Element;

package/lib/pages/TablePage.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCombinedRefs, useDimensions } from "@etsoo/react";
 import { Box, Stack } from "@mui/material";
 import React from "react";
@@ -54,16 +55,12 @@ export function TablePage(props) {
             const paddingBottom = parseFloat(style.paddingBottom);
             if (!isNaN(paddingBottom))
                 maxHeight -= paddingBottom;
-            return (React.createElement(TableEx, { autoLoad: false, columns: columns, loadData: localLoadData, maxHeight: maxHeight, mRef: refs, ...rest }));
+            return (_jsx(TableEx, { autoLoad: false, columns: columns, loadData: localLoadData, maxHeight: maxHeight, mRef: refs, ...rest }));
         }
     }, [rect]);
     const f = typeof fields == "function" ? fields(searchData ?? {}) : fields;
     // Layout
-    return (React.createElement(CommonPage, { ...pageProps, scrollContainer: globalThis },
-        React.createElement(Stack, null,
-            React.createElement(Box, { ref: dimensions[0][0], sx: {
-                    paddingBottom: pageProps.paddings
-                } },
-                React.createElement(SearchBar, { fields: f, onSubmit: onSubmit })),
-            list)));
+    return (_jsx(CommonPage, { ...pageProps, scrollContainer: globalThis, children: _jsxs(Stack, { children: [_jsx(Box, { ref: dimensions[0][0], sx: {
+                        paddingBottom: pageProps.paddings
+                    }, children: _jsx(SearchBar, { fields: f, onSubmit: onSubmit }) }), list] }) }));
 }

package/lib/pages/UserMenu.d.ts

@@ -37,4 +37,4 @@ export declare const eventWatcher: EventWatcher;
  * @param props Props
  * @returns Component
  */
-export declare function UserMenu(props: UserMenuProps): React.JSX.Element;
+export declare function UserMenu(props: UserMenuProps): import("react/jsx-runtime").JSX.Element;

package/lib/pages/UserMenu.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { EventWatcher } from "@etsoo/react";
 import { IconButton, Menu } from "@mui/material";
 import React from "react";
@@ -46,41 +47,38 @@ export function UserMenu(props) {
             }
         }
     };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(IconButton, { edge: "end", "aria-haspopup": "true", onClick: handleUserMenuOpen, color: "inherit" },
-            React.createElement(UserAvatar, { title: name, src: avatar })),
-        React.createElement(Menu, { slotProps: {
-                paper: {
-                    elevation: 0,
-                    sx: {
-                        overflow: "visible",
-                        filter: "drop-shadow(0px 2px 8px rgba(0,0,0,0.32))",
-                        mt: -0.4,
-                        "& .MuiAvatar-root": {
-                            width: 32,
-                            height: 32,
-                            ml: -0.5,
-                            mr: 1
-                        },
-                        "&:before": {
-                            content: '""',
-                            display: "block",
-                            position: "absolute",
-                            top: 0,
-                            right: 14,
-                            width: 10,
-                            height: 10,
-                            bgcolor: "background.paper",
-                            transform: "translateY(-50%) rotate(45deg)",
-                            zIndex: 0
+    return (_jsxs(React.Fragment, { children: [_jsx(IconButton, { edge: "end", "aria-haspopup": "true", onClick: handleUserMenuOpen, color: "inherit", children: _jsx(UserAvatar, { title: name, src: avatar }) }), _jsx(Menu, { slotProps: {
+                    paper: {
+                        elevation: 0,
+                        sx: {
+                            overflow: "visible",
+                            filter: "drop-shadow(0px 2px 8px rgba(0,0,0,0.32))",
+                            mt: -0.4,
+                            "& .MuiAvatar-root": {
+                                width: 32,
+                                height: 32,
+                                ml: -0.5,
+                                mr: 1
+                            },
+                            "&:before": {
+                                content: '""',
+                                display: "block",
+                                position: "absolute",
+                                top: 0,
+                                right: 14,
+                                width: 10,
+                                height: 10,
+                                bgcolor: "background.paper",
+                                transform: "translateY(-50%) rotate(45deg)",
+                                zIndex: 0
+                            }
                         }
                     }
-                }
-            }, disableScrollLock: true, anchorEl: anchorEl, anchorOrigin: {
-                vertical: "bottom",
-                horizontal: "right"
-            }, keepMounted: true, transformOrigin: {
-                vertical: "top",
-                horizontal: "right"
-            }, open: isMenuOpen, transitionDuration: 0, onTransitionEnd: () => eventWatcher.do(eventWatcherAction), onClick: handleClick, onClose: handleMenuClose }, children(handleMenuClose))));
+                }, disableScrollLock: true, anchorEl: anchorEl, anchorOrigin: {
+                    vertical: "bottom",
+                    horizontal: "right"
+                }, keepMounted: true, transformOrigin: {
+                    vertical: "top",
+                    horizontal: "right"
+                }, open: isMenuOpen, transitionDuration: 0, onTransitionEnd: () => eventWatcher.do(eventWatcherAction), onClick: handleClick, onClose: handleMenuClose, children: children(handleMenuClose) })] }));
 }

package/lib/pages/ViewPage.d.ts

@@ -17,7 +17,7 @@ export type ViewPageGridItemProps = GridProps & {
  * @param props Props
  * @returns Result
  */
-export declare function ViewPageGridItem(props: ViewPageGridItemProps): React.JSX.Element;
+export declare function ViewPageGridItem(props: ViewPageGridItemProps): import("react/jsx-runtime").JSX.Element;
 /**
  * View page row width type
  */
@@ -100,5 +100,5 @@ export interface ViewPageProps<T extends DataTypes.StringRecord> extends Omit<Co
  * View page
  * @param props Props
  */
-export declare function ViewPage<T extends DataTypes.StringRecord>(props: ViewPageProps<T>): React.JSX.Element;
+export declare function ViewPage<T extends DataTypes.StringRecord>(props: ViewPageProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/pages/ViewPage.js

@@ -1,3 +1,5 @@
+import { createElement as _createElement } from "react";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { ScrollRestoration } from "@etsoo/react";
 import { DateUtils, Utils } from "@etsoo/shared";
 import { Grid, LinearProgress, Stack, Typography } from "@mui/material";
@@ -27,11 +29,7 @@ export function ViewPageGridItem(props) {
         options = getResp(singleRow ?? "small");
     }
     // Layout
-    return (React.createElement(Grid, { item: true, ...gridProps, ...options },
-        label != null && (React.createElement(Typography, { variant: "caption", component: "div" },
-            label,
-            ":")),
-        typeof data === "object" ? (data) : (React.createElement(Typography, { variant: "subtitle2" }, data))));
+    return (_jsxs(Grid, { item: true, ...gridProps, ...options, children: [label != null && (_jsxs(Typography, { variant: "caption", component: "div", children: [label, ":"] })), typeof data === "object" ? (data) : (_jsx(Typography, { variant: "subtitle2", children: data }))] }));
 }
 function formatItemData(fieldData) {
     if (fieldData == null)
@@ -125,36 +123,30 @@ export function ViewPage(props) {
             MessageUtils.offRefresh(refreshHandler);
         };
     }, []);
-    return (React.createElement(CommonPage, { paddings: paddings, onRefresh: supportRefresh ? refresh : undefined, onUpdate: supportRefresh ? undefined : refresh, ...rest, scrollContainer: globalThis, fabColumnDirection: fabColumnDirection, fabTop: fabTop, supportBack: supportBack }, data == null ? (React.createElement(LinearProgress, null)) : (React.createElement(React.Fragment, null,
-        operationMessageHandler && (React.createElement(OperationMessageContainer, { handler: "id" in operationMessageHandler
-                ? [
-                    operationMessageHandler.types,
-                    refresh,
-                    operationMessageHandler.id
-                ]
-                : operationMessageHandler })),
-        React.createElement(Grid, { container: true, justifyContent: "left", spacing: spacing, className: "ET-ViewPage", ref: gridRef, sx: {
-                ".MuiTypography-subtitle2": {
-                    fontWeight: "bold"
-                }
-            } }, fields.map((field, index) => {
-            // Get data
-            if (typeof field === "function") {
-                // Most flexible way, do whatever you want
-                return field(data, refresh);
-            }
-            const [itemData, itemLabel, gridProps] = getItemField(field, data);
-            // Some callback function may return '' instead of undefined
-            if (itemData == null || itemData === "")
-                return undefined;
-            // Layout
-            return (React.createElement(ViewPageGridItem, { item: true, ...gridProps, key: index, data: itemData, label: itemLabel }));
-        })),
-        actions !== null && (React.createElement(Stack, { className: "ET-ViewPage-Actions", direction: "row", width: "100%", flexWrap: "wrap", justifyContent: "flex-end", paddingTop: actions == null ? undefined : paddings, paddingBottom: paddings, gap: paddings }, actions != null && Utils.getResult(actions, data, refresh))),
-        Utils.getResult(children, data, refresh),
-        pullToRefresh && (React.createElement(PullToRefreshUI, { mainElement: pullContainer, triggerElement: pullContainer, instructionsPullToRefresh: labels.pullToRefresh, instructionsReleaseToRefresh: labels.releaseToRefresh, instructionsRefreshing: labels.refreshing, onRefresh: refresh, shouldPullToRefresh: () => {
-                const container = document.querySelector(pullContainer);
-                return !container?.scrollTop;
-            } })),
-        React.createElement(ScrollRestoration, null)))));
+    return (_jsx(CommonPage, { paddings: paddings, onRefresh: supportRefresh ? refresh : undefined, onUpdate: supportRefresh ? undefined : refresh, ...rest, scrollContainer: globalThis, fabColumnDirection: fabColumnDirection, fabTop: fabTop, supportBack: supportBack, children: data == null ? (_jsx(LinearProgress, {})) : (_jsxs(React.Fragment, { children: [operationMessageHandler && (_jsx(OperationMessageContainer, { handler: "id" in operationMessageHandler
+                        ? [
+                            operationMessageHandler.types,
+                            refresh,
+                            operationMessageHandler.id
+                        ]
+                        : operationMessageHandler })), _jsx(Grid, { container: true, justifyContent: "left", spacing: spacing, className: "ET-ViewPage", ref: gridRef, sx: {
+                        ".MuiTypography-subtitle2": {
+                            fontWeight: "bold"
+                        }
+                    }, children: fields.map((field, index) => {
+                        // Get data
+                        if (typeof field === "function") {
+                            // Most flexible way, do whatever you want
+                            return field(data, refresh);
+                        }
+                        const [itemData, itemLabel, gridProps] = getItemField(field, data);
+                        // Some callback function may return '' instead of undefined
+                        if (itemData == null || itemData === "")
+                            return undefined;
+                        // Layout
+                        return (_createElement(ViewPageGridItem, { item: true, ...gridProps, key: index, data: itemData, label: itemLabel }));
+                    }) }), actions !== null && (_jsx(Stack, { className: "ET-ViewPage-Actions", direction: "row", width: "100%", flexWrap: "wrap", justifyContent: "flex-end", paddingTop: actions == null ? undefined : paddings, paddingBottom: paddings, gap: paddings, children: actions != null && Utils.getResult(actions, data, refresh) })), Utils.getResult(children, data, refresh), pullToRefresh && (_jsx(PullToRefreshUI, { mainElement: pullContainer, triggerElement: pullContainer, instructionsPullToRefresh: labels.pullToRefresh, instructionsReleaseToRefresh: labels.releaseToRefresh, instructionsRefreshing: labels.refreshing, onRefresh: refresh, shouldPullToRefresh: () => {
+                        const container = document.querySelector(pullContainer);
+                        return !container?.scrollTop;
+                    } })), _jsx(ScrollRestoration, {})] })) }));
 }

package/lib/texts/DateText.d.ts

@@ -1,6 +1,5 @@
 import { DateUtils } from '@etsoo/shared';
 import { TypographyProps } from '@mui/material';
-import React from 'react';
 /**
  * Date text props
  */
@@ -31,4 +30,4 @@ export interface DateTextProps extends TypographyProps {
  * @param props Props
  * @returns Component
  */
-export declare function DateText(props: DateTextProps): React.JSX.Element;
+export declare function DateText(props: DateTextProps): import("react/jsx-runtime").JSX.Element;

package/lib/texts/DateText.js

@@ -1,6 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DateUtils } from '@etsoo/shared';
 import { Typography } from '@mui/material';
-import React from 'react';
 /**
  * Date text
  * @param props Props
@@ -21,5 +21,5 @@ export function DateText(props) {
         rest.color = (theme) => theme.palette.error.main;
     }
     // Layout
-    return (React.createElement(Typography, { component: "span", fontSize: "inherit", ...rest }, localValue));
+    return (_jsx(Typography, { component: "span", fontSize: "inherit", ...rest, children: localValue }));
 }

package/lib/texts/MoneyText.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { NumberTextProps } from './NumberText';
 /**
  * Money text props
@@ -18,4 +17,4 @@ export interface MoneyTextProps extends NumberTextProps {
  * @param props Props
  * @returns Component
  */
-export declare function MoneyText(props: MoneyTextProps): React.JSX.Element;
+export declare function MoneyText(props: MoneyTextProps): import("react/jsx-runtime").JSX.Element;

package/lib/texts/MoneyText.js

@@ -1,6 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { NumberUtils } from '@etsoo/shared';
 import { Typography } from '@mui/material';
-import React from 'react';
 /**
  * Money text
  * @param props Props
@@ -10,7 +10,7 @@ export function MoneyText(props) {
     // Destruct
     const { currency, isInteger = false, locale, options = {}, value, ...rest } = props;
     // Layout
-    return (React.createElement(Typography, { component: "span", fontSize: "inherit", ...rest }, value == null
-        ? ''
-        : NumberUtils.formatMoney(value, currency, locale, isInteger, options)));
+    return (_jsx(Typography, { component: "span", fontSize: "inherit", ...rest, children: value == null
+            ? ''
+            : NumberUtils.formatMoney(value, currency, locale, isInteger, options) }));
 }

package/lib/texts/NumberText.d.ts

@@ -1,5 +1,4 @@
 import { TypographyProps } from '@mui/material';
-import React from 'react';
 /**
  * Number text props
  */
@@ -22,4 +21,4 @@ export interface NumberTextProps extends TypographyProps {
  * @param props Props
  * @returns Component
  */
-export declare function NumberText(props: NumberTextProps): React.JSX.Element;
+export declare function NumberText(props: NumberTextProps): import("react/jsx-runtime").JSX.Element;

package/lib/texts/NumberText.js

@@ -1,6 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { NumberUtils } from '@etsoo/shared';
 import { Typography } from '@mui/material';
-import React from 'react';
 /**
  * Number text
  * @param props Props
@@ -10,5 +10,5 @@ export function NumberText(props) {
     // Destruct
     const { locale, options = {}, value, ...rest } = props;
     // Layout
-    return (React.createElement(Typography, { component: "span", fontSize: "inherit", ...rest }, value == null ? '' : NumberUtils.format(value, locale, options)));
+    return (_jsx(Typography, { component: "span", fontSize: "inherit", ...rest, children: value == null ? '' : NumberUtils.format(value, locale, options) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.3.58",
+  "version": "1.3.59",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -52,12 +52,12 @@
     "@emotion/styled": "^11.11.5",
     "@etsoo/appscript": "^1.4.90",
     "@etsoo/notificationbase": "^1.1.42",
-    "@etsoo/react": "^1.7.44",
+    "@etsoo/react": "^1.7.45",
     "@etsoo/shared": "^1.2.40",
     "@mui/icons-material": "^5.15.18",
     "@mui/material": "^5.15.18",
     "@mui/x-data-grid": "^7.5.0",
-    "chart.js": "^4.4.2",
+    "chart.js": "^4.4.3",
     "chartjs-plugin-datalabels": "^2.2.0",
     "eventemitter3": "^5.0.1",
     "pica": "^9.0.1",

package/tsconfig.json

@@ -12,7 +12,7 @@
     "strict": true,
     "esModuleInterop": true,
     "skipLibCheck": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
     "forceConsistentCasingInFileNames": true
   },
   "include": ["src"]