@etsoo/react 1.5.80 → 1.5.81

package/lib/mu/pages/DataGridPageProps.d.ts

@@ -1,17 +0,0 @@
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-import { DataGridExProps } from '../DataGridEx';
-import { SearchPageProps } from './SearchPageProps';
-/**
- * DataGrid page props
- */
-export declare type DataGridPageProps<T extends object, F extends DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>> = SearchPageProps<T, F> & Omit<DataGridExProps<T, D>, 'loadData' | 'height'> & {
-    /**
-     * Height will be deducted
-     * @param height Current calcuated height
-     */
-    adjustHeight?: (height: number) => number;
-    /**
-     * Grid height
-     */
-    height?: number;
-};

package/lib/mu/pages/DataGridPageProps.js

@@ -1 +0,0 @@
-export {};

package/lib/mu/pages/EditPage.d.ts

@@ -1,33 +0,0 @@
-import { FormEventHandler } from 'react';
-import { CommonPageProps } from './CommonPageProps';
-/**
- * Add / Edit page props
- */
-export interface EditPageProps extends Omit<CommonPageProps, 'onSubmit'> {
-    /**
-     * Is editing
-     */
-    isEditing?: boolean;
-    /**
-     * On form submit
-     */
-    onSubmit?: FormEventHandler<HTMLFormElement>;
-    /**
-     * On delete callback
-     */
-    onDelete?: () => Promise<void> | void;
-    /**
-     * Submit button disabled or not
-     */
-    submitDisabled?: boolean;
-    /**
-     * Support back click
-     * @default true
-     */
-    supportBack?: boolean;
-}
-/**
- * Add / Edit page
- * @param props Props
- */
-export declare function EditPage(props: EditPageProps): JSX.Element;

package/lib/mu/pages/EditPage.js

@@ -1,29 +0,0 @@
-import { Button, Grid } from '@mui/material';
-import React from 'react';
-import { Labels } from '../../app/Labels';
-import { MUGlobal } from '../MUGlobal';
-import { CommonPage, CommonPageScrollContainer } from './CommonPage';
-import SaveIcon from '@mui/icons-material/Save';
-import DeleteIcon from '@mui/icons-material/Delete';
-import { BackButton } from '../BackButton';
-/**
- * Add / Edit page
- * @param props Props
- */
-export function EditPage(props) {
-    // Destruct
-    const { children, isEditing, onDelete, onSubmit, paddings = MUGlobal.pagePaddings, scrollContainer = CommonPageScrollContainer, supportBack = true, submitDisabled = false, ...rest } = props;
-    // Labels
-    const labels = Labels.CommonPage;
-    return (React.createElement(CommonPage, { paddings: paddings, scrollContainer: scrollContainer, ...rest },
-        React.createElement("form", { onSubmit: onSubmit },
-            React.createElement(Grid, { container: true, justifyContent: "left", spacing: paddings, paddingTop: 1 }, children),
-            React.createElement(Grid, { container: true, position: "sticky", display: "flex", gap: paddings, sx: {
-                    top: 'auto',
-                    bottom: (theme) => MUGlobal.updateWithTheme(paddings, theme.spacing),
-                    paddingTop: paddings
-                } },
-                isEditing && onDelete && (React.createElement(Button, { color: "primary", variant: "outlined", onClick: () => onDelete(), startIcon: React.createElement(DeleteIcon, { color: "warning" }) }, labels.delete)),
-                React.createElement(Button, { variant: "contained", type: "submit", startIcon: React.createElement(SaveIcon, null), sx: { flexGrow: 1 }, disabled: submitDisabled }, labels.save),
-                supportBack && React.createElement(BackButton, { title: labels.back })))));
-}

package/lib/mu/pages/FixedListPage.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-import { ListPageProps } from './ListPageProps';
-/**
- * Fixed height list page
- * @param props Props
- * @returns Component
- */
-export declare function FixedListPage<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>>(props: ListPageProps<T, F, D> & {
-    /**
-     * Height will be deducted
-     * @param height Current calcuated height
-     */
-    adjustHeight?: (height: number) => number;
-}): JSX.Element;

package/lib/mu/pages/FixedListPage.js

@@ -1,72 +0,0 @@
-import { Box, Stack } from '@mui/material';
-import React from 'react';
-import { GridDataGet } from '../../components/GridLoader';
-import useCombinedRefs from '../../uses/useCombinedRefs';
-import { useDimensions } from '../../uses/useDimensions';
-import { MUGlobal } from '../MUGlobal';
-import { ScrollerListEx } from '../ScrollerListEx';
-import { SearchBar } from '../SearchBar';
-import { CommonPage } from './CommonPage';
-/**
- * Fixed height list page
- * @param props Props
- * @returns Component
- */
-export function FixedListPage(props) {
-    var _a;
-    // Destruct
-    const { adjustHeight, fields, fieldTemplate, loadData, mRef, sizeReadyMiliseconds = 0, pageProps = {}, ...rest } = props;
-    (_a = pageProps.paddings) !== null && _a !== void 0 ? _a : (pageProps.paddings = MUGlobal.pagePaddings);
-    // States
-    const [states] = React.useState({});
-    // Scroll container
-    const [scrollContainer, updateScrollContainer] = React.useState();
-    const refs = useCombinedRefs(mRef, (ref) => {
-        if (ref == null)
-            return;
-        const first = states.ref == null;
-        states.ref = ref;
-        if (first)
-            reset();
-    });
-    const reset = () => {
-        if (states.data == null || states.ref == null)
-            return;
-        states.ref.reset({ data: states.data });
-    };
-    // On submit callback
-    const onSubmit = (data, _reset) => {
-        states.data = data;
-        reset();
-    };
-    const localLoadData = (props) => {
-        const data = GridDataGet(props, fieldTemplate);
-        return loadData(data);
-    };
-    // Watch container
-    const { dimensions } = useDimensions(1, undefined, sizeReadyMiliseconds);
-    const rect = dimensions[0][2];
-    const list = React.useMemo(() => {
-        if (rect != null && rect.height > 50) {
-            let height = document.documentElement.clientHeight -
-                Math.round(rect.top + rect.height + 1);
-            if (adjustHeight != null) {
-                height -= adjustHeight(height);
-            }
-            return (React.createElement(Box, { id: "list-container", sx: {
-                    height: height + 'px'
-                } },
-                React.createElement(ScrollerListEx, { autoLoad: false, height: height, loadData: localLoadData, mRef: refs, oRef: (element) => {
-                        if (element != null)
-                            updateScrollContainer(element);
-                    }, ...rest })));
-        }
-    }, [rect]);
-    const { paddings, ...pageRest } = pageProps;
-    // Layout
-    return (React.createElement(CommonPage, { ...pageRest, paddings: {}, scrollContainer: scrollContainer },
-        React.createElement(Stack, null,
-            React.createElement(Box, { ref: dimensions[0][0], sx: { padding: paddings } },
-                React.createElement(SearchBar, { fields: fields, onSubmit: onSubmit })),
-            list)));
-}

package/lib/mu/pages/ListPage.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-import { ListPageProps } from './ListPageProps';
-/**
- * List page
- * @param props Props
- * @returns Component
- */
-export declare function ListPage<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>>(props: ListPageProps<T, F, D>): JSX.Element;

package/lib/mu/pages/ListPage.js

@@ -1,51 +0,0 @@
-import { Box, Stack } from '@mui/material';
-import React from 'react';
-import { GridDataGet } from '../../components/GridLoader';
-import useCombinedRefs from '../../uses/useCombinedRefs';
-import { MUGlobal } from '../MUGlobal';
-import { ScrollerListEx } from '../ScrollerListEx';
-import { SearchBar } from '../SearchBar';
-import { CommonPage, CommonPageScrollContainer } from './CommonPage';
-/**
- * List page
- * @param props Props
- * @returns Component
- */
-export function ListPage(props) {
-    var _a;
-    // Destruct
-    const { fields, fieldTemplate, loadData, mRef, pageProps = {}, ...rest } = props;
-    (_a = pageProps.paddings) !== null && _a !== void 0 ? _a : (pageProps.paddings = MUGlobal.pagePaddings);
-    // States
-    const [states] = React.useState({});
-    const refs = useCombinedRefs(mRef, (ref) => {
-        if (ref == null)
-            return;
-        const first = states.ref == null;
-        states.ref = ref;
-        if (first)
-            reset();
-    });
-    const reset = () => {
-        if (states.data == null || states.ref == null)
-            return;
-        states.ref.reset({ data: states.data });
-    };
-    // On submit callback
-    const onSubmit = (data, _reset) => {
-        states.data = data;
-        reset();
-    };
-    const localLoadData = (props) => {
-        const data = GridDataGet(props, fieldTemplate);
-        return loadData(data);
-    };
-    // Layout
-    return (React.createElement(CommonPage, { ...pageProps, scrollContainer: CommonPageScrollContainer },
-        React.createElement(Stack, null,
-            React.createElement(Box, { sx: {
-                    paddingBottom: pageProps.paddings
-                } },
-                React.createElement(SearchBar, { fields: fields, onSubmit: onSubmit })),
-            React.createElement(ScrollerListEx, { autoLoad: false, loadData: localLoadData, mRef: refs, ...rest }))));
-}

package/lib/mu/pages/ListPageProps.d.ts

@@ -1,7 +0,0 @@
-import { DataTypes } from '@etsoo/shared';
-import { ScrollerListExProps } from '../ScrollerListEx';
-import { SearchPageProps } from './SearchPageProps';
-/**
- * List page props
- */
-export declare type ListPageProps<T extends object, F extends DataTypes.BasicTemplate, D extends DataTypes.Keys<T>> = SearchPageProps<T, F> & Omit<ScrollerListExProps<T, D>, 'loadData'>;

package/lib/mu/pages/ListPageProps.js

@@ -1 +0,0 @@
-export {};

package/lib/mu/pages/ResponsivePage.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-import { ResponsePageProps } from './ResponsivePageProps';
-/**
- * Fixed height list page
- * @param props Props
- * @returns Component
- */
-export declare function ResponsivePage<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>>(props: ResponsePageProps<T, F, D>): JSX.Element;

package/lib/mu/pages/ResponsivePage.js

@@ -1,45 +0,0 @@
-import React from 'react';
-import { MUGlobal } from '../MUGlobal';
-import { ResponsibleContainer } from '../ResponsibleContainer';
-import { CommonPage } from './CommonPage';
-/**
- * Fixed height list page
- * @param props Props
- * @returns Component
- */
-export function ResponsivePage(props) {
-    var _a;
-    // Destruct
-    const { pageProps = {}, ...rest } = props;
-    (_a = pageProps.paddings) !== null && _a !== void 0 ? _a : (pageProps.paddings = MUGlobal.pagePaddings);
-    const { paddings, fabColumnDirection, ...pageRest } = pageProps;
-    // State
-    const [scrollContainer, setScrollContainer] = React.useState();
-    const [direction, setDirection] = React.useState(fabColumnDirection);
-    // Layout
-    return (React.createElement(CommonPage, { ...pageRest, paddings: {}, scrollContainer: scrollContainer, fabColumnDirection: direction },
-        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 })));
-}

package/lib/mu/pages/ResponsivePageProps.d.ts

@@ -1,39 +0,0 @@
-/// <reference types="react" />
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-import { ListChildComponentProps } from 'react-window';
-import { GridMethodRef } from '../GridMethodRef';
-import { ScrollerListExInnerItemRendererProps, ScrollerListExItemSize } from '../ScrollerListEx';
-import { DataGridPageProps } from './DataGridPageProps';
-/**
- * Response page props
- */
-export declare type ResponsePageProps<T extends object, F extends DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = IdDefaultType<T>> = Omit<DataGridPageProps<T, F, D>, 'mRef' | 'itemKey' | 'onScroll' | 'onItemsRendered'> & {
-    /**
-     * Min width to show Datagrid
-     */
-    dataGridMinWidth?: number;
-    /**
-     * Inner item renderer
-     */
-    innerItemRenderer: (props: ScrollerListExInnerItemRendererProps<T>) => React.ReactNode;
-    /**
-     * Item renderer
-     */
-    itemRenderer?: (props: ListChildComponentProps<T>) => React.ReactElement;
-    /**
-     * Item size, a function indicates its a variable size list
-     */
-    itemSize: ScrollerListExItemSize;
-    /**
-     * Methods
-     */
-    mRef?: React.MutableRefObject<GridMethodRef | undefined>;
-    /**
-     * Pull to refresh data
-     */
-    pullToRefresh?: boolean;
-    /**
-     * Quick action for double click or click under mobile
-     */
-    quickAction?: (data: T) => void;
-};

package/lib/mu/pages/ResponsivePageProps.js

@@ -1 +0,0 @@
-export {};

package/lib/mu/pages/SearchPageProps.d.ts

@@ -1,30 +0,0 @@
-/// <reference types="react" />
-import { DataTypes } from '@etsoo/shared';
-import { GridJsonData, GridLoader } from '../../components/GridLoader';
-import { CommonPageProps } from './CommonPageProps';
-/**
- * Search page props
- */
-export declare type SearchPageProps<T extends object, F extends DataTypes.BasicTemplate> = Omit<GridLoader<T>, 'loadData'> & {
-    /**
-     * Search fields
-     */
-    fields: React.ReactElement[];
-    /**
-     * Search field template
-     */
-    fieldTemplate?: F;
-    /**
-     * Load data callback
-     */
-    loadData: (data: GridJsonData & DataTypes.BasicTemplateType<F>) => PromiseLike<T[] | null | undefined>;
-    /**
-     * Page props
-     */
-    pageProps?: CommonPageProps;
-    /**
-     * Size ready to read miliseconds span
-     * @default 100
-     */
-    sizeReadyMiliseconds?: number;
-};

package/lib/mu/pages/SearchPageProps.js

@@ -1 +0,0 @@
-export {};

package/lib/mu/pages/TablePage.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DataTypes, IdDefaultType } from '@etsoo/shared';
-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>): JSX.Element;

package/lib/mu/pages/TablePage.js

@@ -1,71 +0,0 @@
-import { Box, Stack } from '@mui/material';
-import React from 'react';
-import { GridDataGet } from '../../components/GridLoader';
-import useCombinedRefs from '../../uses/useCombinedRefs';
-import { useDimensions } from '../../uses/useDimensions';
-import { MUGlobal } from '../MUGlobal';
-import { SearchBar } from '../SearchBar';
-import { TableEx, TableExMinWidth } from '../TableEx';
-import { CommonPage, CommonPageScrollContainer } from './CommonPage';
-/**
- * Table page
- * @param props Props
- * @returns Component
- */
-export function TablePage(props) {
-    var _a;
-    // Destruct
-    const { columns, fields, fieldTemplate, loadData, mRef, sizeReadyMiliseconds = 0, pageProps = {}, ...rest } = props;
-    (_a = pageProps.paddings) !== null && _a !== void 0 ? _a : (pageProps.paddings = MUGlobal.pagePaddings);
-    // States
-    const [states] = React.useState({});
-    const refs = useCombinedRefs(mRef, (ref) => {
-        if (ref == null)
-            return;
-        const first = states.ref == null;
-        states.ref = ref;
-        if (first)
-            reset();
-    });
-    const reset = () => {
-        if (states.data == null || states.ref == null)
-            return;
-        states.ref.reset({ data: states.data });
-    };
-    // On submit callback
-    const onSubmit = (data, _reset) => {
-        states.data = data;
-        reset();
-    };
-    const localLoadData = (props) => {
-        const data = GridDataGet(props, fieldTemplate);
-        return loadData(data);
-    };
-    // Total width
-    const totalWidth = React.useMemo(() => columns.reduce((previousValue, { width, minWidth }) => {
-        var _a;
-        return previousValue + ((_a = width !== null && width !== void 0 ? width : minWidth) !== null && _a !== void 0 ? _a : TableExMinWidth);
-    }, 0), [columns]);
-    // Watch container
-    const { dimensions } = useDimensions(1, undefined, sizeReadyMiliseconds);
-    const rect = dimensions[0][2];
-    const list = React.useMemo(() => {
-        if (rect != null && rect.height > 50 && rect.width >= totalWidth) {
-            let maxHeight = document.documentElement.clientHeight -
-                (rect.top + rect.height + 1);
-            const style = window.getComputedStyle(dimensions[0][1]);
-            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 }));
-        }
-    }, [rect]);
-    // Layout
-    return (React.createElement(CommonPage, { ...pageProps, scrollContainer: CommonPageScrollContainer },
-        React.createElement(Stack, null,
-            React.createElement(Box, { ref: dimensions[0][0], sx: {
-                    paddingBottom: pageProps.paddings
-                } },
-                React.createElement(SearchBar, { fields: fields, onSubmit: onSubmit })),
-            list)));
-}

package/lib/mu/pages/TablePageProps.d.ts

@@ -1,7 +0,0 @@
-import { DataTypes } from '@etsoo/shared';
-import { TableExProps } from '../TableEx';
-import { SearchPageProps } from './SearchPageProps';
-/**
- * Table page props
- */
-export declare type TablePageProps<T extends object, F extends DataTypes.BasicTemplate, D extends DataTypes.Keys<T>> = SearchPageProps<T, F> & Omit<TableExProps<T, D>, 'loadData'>;

package/lib/mu/pages/TablePageProps.js

@@ -1 +0,0 @@
-export {};

package/lib/mu/pages/ViewPage.d.ts

@@ -1,66 +0,0 @@
-import { DataTypes } from '@etsoo/shared';
-import { GridProps } from '@mui/material';
-import React from 'react';
-import { GridColumnRenderProps, GridDataType } from '../../components/GridColumn';
-import { CommonPageProps } from './CommonPageProps';
-/**
- * View page display field
- */
-export interface ViewPageField<T extends object> extends GridProps {
-    /**
-     * Data field
-     */
-    data: (string & keyof T) | ((item: T) => React.ReactNode);
-    /**
-     * Data type
-     */
-    dataType?: GridDataType;
-    /**
-     * Label field
-     */
-    label?: string | (() => React.ReactNode);
-    /**
-     * Display as single row
-     */
-    singleRow?: boolean;
-    /**
-     * Render props
-     */
-    renderProps?: GridColumnRenderProps;
-}
-declare type ViewPageFieldType<T extends object> = (string & keyof T) | [string & keyof T, GridDataType, GridColumnRenderProps?] | ViewPageField<T>;
-/**
- * View page props
- */
-export interface ViewPageProps<T extends DataTypes.StringRecord> extends Omit<CommonPageProps, 'children'> {
-    /**
-     * Actions
-     */
-    actions?: React.ReactNode | ((data: T, refresh: () => PromiseLike<void>) => React.ReactNode);
-    /**
-     * Children
-     */
-    children?: React.ReactNode | ((data: T, refresh: () => PromiseLike<void>) => React.ReactNode);
-    /**
-     * Fields to display
-     */
-    fields: ViewPageFieldType<T>[];
-    /**
-     * Load data
-     */
-    loadData: () => PromiseLike<T | undefined>;
-    /**
-     * Pull to refresh data
-     */
-    pullToRefresh?: boolean;
-    /**
-     * Support refresh
-     */
-    supportRefresh?: boolean;
-}
-/**
- * View page
- * @param props Props
- */
-export declare function ViewPage<T extends DataTypes.StringRecord>(props: ViewPageProps<T>): JSX.Element;
-export {};

package/lib/mu/pages/ViewPage.js

@@ -1,105 +0,0 @@
-import { Utils } from '@etsoo/shared';
-import { Grid, LinearProgress, Stack, Typography } from '@mui/material';
-import React from 'react';
-import { Labels } from '../../app/Labels';
-import { globalApp } from '../../app/ReactApp';
-import { GridDataFormat } from '../GridDataFormat';
-import { MUGlobal } from '../MUGlobal';
-import { PullToRefreshUI } from '../PullToRefreshUI';
-import { CommonPage } from './CommonPage';
-function formatItemData(fieldData) {
-    if (fieldData == null)
-        return undefined;
-    if (typeof fieldData === 'string')
-        return fieldData;
-    if (fieldData instanceof Date)
-        return globalApp.formatDate(fieldData, 'd');
-    return `${fieldData}`;
-}
-function getItemField(field, data) {
-    var _a, _b, _c;
-    // Item data and label
-    let itemData, itemLabel, gridProps = {};
-    let xs = 6;
-    if (Array.isArray(field)) {
-        const [fieldData, fieldType, renderProps] = field;
-        itemData = GridDataFormat(data[fieldData], fieldType, renderProps);
-        itemLabel = (_a = globalApp.get(fieldData)) !== null && _a !== void 0 ? _a : fieldData;
-    }
-    else if (typeof field === 'object') {
-        // Destruct
-        const { data: fieldData, dataType, label: fieldLabel, renderProps, singleRow, ...rest } = field;
-        gridProps = {
-            ...rest,
-            ...(singleRow && { xs: 12, sm: 12, md: 12, lg: 12, xl: 12 })
-        };
-        if (singleRow === false)
-            xs = 12;
-        // Field data
-        if (typeof fieldData === 'function')
-            itemData = fieldData(data);
-        else if (dataType == null)
-            itemData = formatItemData(data[fieldData]);
-        else
-            itemData = GridDataFormat(data[fieldData], dataType, renderProps);
-        // Field label
-        itemLabel =
-            typeof fieldLabel === 'function'
-                ? fieldLabel()
-                : (_b = globalApp.get(fieldLabel !== null && fieldLabel !== void 0 ? fieldLabel : (typeof fieldData === 'string' ? fieldData : 'noData'))) !== null && _b !== void 0 ? _b : fieldLabel;
-    }
-    else {
-        itemData = formatItemData(data[field]);
-        itemLabel = (_c = globalApp.get(field)) !== null && _c !== void 0 ? _c : field;
-    }
-    return [
-        itemData,
-        itemLabel,
-        { xs, sm: 6, md: 6, lg: 4, xl: 3, ...gridProps }
-    ];
-}
-/**
- * View page
- * @param props Props
- */
-export function ViewPage(props) {
-    // Destruct
-    const { actions, children, fields, loadData, paddings = MUGlobal.pagePaddings, supportRefresh = true, fabColumnDirection = true, supportBack = true, pullToRefresh = true, ...rest } = props;
-    // Data
-    const [data, setData] = React.useState();
-    // Labels
-    const labels = Labels.CommonPage;
-    // Container
-    const pullContainer = '#page-container';
-    // Load data
-    const refresh = async () => {
-        const result = await loadData();
-        if (result == null)
-            return;
-        setData(result);
-    };
-    return (React.createElement(CommonPage, { paddings: paddings, onRefresh: supportRefresh ? refresh : undefined, onUpdate: supportRefresh ? undefined : refresh, ...rest, scrollContainer: globalThis, fabColumnDirection: fabColumnDirection, supportBack: supportBack }, data == null ? (React.createElement(LinearProgress, null)) : (React.createElement(React.Fragment, null,
-        React.createElement(Grid, { container: true, justifyContent: "left", spacing: paddings, className: "ET-ViewPage", sx: {
-                '.MuiTypography-subtitle2': {
-                    fontWeight: 'bold'
-                }
-            } }, fields.map((field, index) => {
-            // Get data
-            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(Grid, { item: true, ...gridProps, key: index },
-                React.createElement(Typography, { variant: "caption", component: "div" },
-                    itemLabel,
-                    ":"),
-                React.createElement(Typography, { variant: "subtitle2" }, itemData)));
-        })),
-        actions != null && (React.createElement(Stack, { className: "ET-ViewPage-Actions", direction: "row", width: "100%", flexWrap: "wrap", justifyContent: "flex-end", paddingTop: paddings, paddingBottom: paddings, gap: paddings }, 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 === null || container === void 0 ? void 0 : container.scrollTop);
-            } }))))));
-}