@etsoo/materialui 1.1.38 → 1.1.41

package/lib/AuditDisplay.d.ts

@@ -1,11 +1,11 @@
-import { AuditLineDto } from '@etsoo/appscript';
-import { Theme } from '@mui/material';
-import React, { CSSProperties } from 'react';
-import { ListMoreDisplayProps } from './ListMoreDisplay';
+import { AuditLineDto } from "@etsoo/appscript";
+import { Theme } from "@mui/material";
+import React, { CSSProperties } from "react";
+import { ListMoreDisplayProps } from "./ListMoreDisplay";
 /**
  * Audit display props
  */
-export interface AuditDisplayProps extends Omit<ListMoreDisplayProps<AuditLineDto>, 'children'> {
+export interface AuditDisplayProps extends Omit<ListMoreDisplayProps<AuditLineDto>, "children"> {
     /**
      * Get list item style callback
      */

package/lib/AuditDisplay.js

@@ -1,19 +1,19 @@
-import { Utils } from '@etsoo/shared';
-import { Button, Divider, Typography, useTheme } from '@mui/material';
-import React from 'react';
-import { globalApp } from './app/ReactApp';
-import { ListMoreDisplay } from './ListMoreDisplay';
-import { ShowDataComparison } from './ShowDataComparison';
+import { Utils } from "@etsoo/shared";
+import { Button, Divider, Typography, useTheme } from "@mui/material";
+import React from "react";
+import { globalApp } from "./app/ReactApp";
+import { ListMoreDisplay } from "./ListMoreDisplay";
+import { ShowDataComparison } from "./ShowDataComparison";
 // Get label
 const getLabel = (key) => {
     var _a;
-    return (_a = globalApp.get(Utils.formatInitial(key))) !== null && _a !== void 0 ? _a : key;
+    return (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.get(Utils.formatInitial(key))) !== null && _a !== void 0 ? _a : key;
 };
 // Format date
 const formatDate = (date) => {
-    if (typeof globalApp === 'undefined')
-        return date.toUTCString();
-    return globalApp.formatDate(date, 'ds');
+    if (globalApp)
+        return globalApp.formatDate(date, "ds");
+    return date.toUTCString();
 };
 /**
  * Audit display
@@ -24,28 +24,26 @@ export function AuditDisplay(props) {
     // Theme
     const theme = useTheme();
     // Title
-    var title = getLabel('dataComparison');
+    var title = getLabel("dataComparison");
     // Destruct
     const { getItemStyle = (index, theme) => ({
-        padding: [theme.spacing(1.5), theme.spacing(1)].join(' '),
-        background: index % 2 === 0
-            ? theme.palette.grey[100]
-            : theme.palette.grey[50]
+        padding: [theme.spacing(1.5), theme.spacing(1)].join(" "),
+        background: index % 2 === 0 ? theme.palette.grey[100] : theme.palette.grey[50]
     }), getColumnLabel, equalCheck, itemRenderer = (data) => {
         const { newData, oldData, changes = { newData: newData !== null && newData !== void 0 ? newData : {}, oldData: oldData !== null && oldData !== void 0 ? oldData : {} } } = data;
         return (React.createElement(React.Fragment, null,
             changes != null && (React.createElement(Button, { variant: "outlined", size: "small", onClick: () => ShowDataComparison(changes, title, getColumnLabel, equalCheck), sx: {
                     marginLeft: theme.spacing(1),
                     marginTop: theme.spacing(-0.5),
-                    float: 'right'
+                    float: "right"
                 } }, title)),
             React.createElement(Typography, null, formatDate(data.creation) +
-                ', [' +
+                ", [" +
                 getLabel(data.action) +
-                '], ' +
+                "], " +
                 data.user)));
     }, headerTitle = (React.createElement(React.Fragment, null,
-        React.createElement(Typography, null, getLabel('audits')),
+        React.createElement(Typography, null, getLabel("audits")),
         React.createElement(Divider, null))), ...rest } = props;
     // Layout
     return (React.createElement(ListMoreDisplay, { headerTitle: headerTitle, ...rest }, (data, index) => (React.createElement("div", { key: data.id, style: getItemStyle(index, theme) }, itemRenderer(data, index)))));

package/lib/BridgeCloseButton.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { IBridgeHost } from '@etsoo/appscript';
-import { BoxProps, IconButtonProps } from '@mui/material';
+import { IBridgeHost } from "@etsoo/appscript";
+import { BoxProps, IconButtonProps } from "@mui/material";
 /**
  * Bridge close button props
  */

package/lib/BridgeCloseButton.js

@@ -1,18 +1,17 @@
-import { BridgeUtils } from '@etsoo/appscript';
-import CloseIcon from '@mui/icons-material/Close';
-import { Box, IconButton } from '@mui/material';
-import React from 'react';
-import { globalApp } from './app/ReactApp';
+import { BridgeUtils } from "@etsoo/appscript";
+import CloseIcon from "@mui/icons-material/Close";
+import { Box, IconButton } from "@mui/material";
+import React from "react";
+import { globalApp } from "./app/ReactApp";
 /**
  * Bridge close button
  * @param props Props
  * @returns Component
  */
 export function BridgeCloseButton(props) {
+    var _a;
     // Destruct
-    const { boxProps, onClick, title = typeof globalApp === 'undefined'
-        ? 'Close'
-        : globalApp.get('close'), validate, ...rest } = props;
+    const { boxProps, onClick, title = (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.get("close")) !== null && _a !== void 0 ? _a : "Close", validate, ...rest } = props;
     // Host
     const host = BridgeUtils.host;
     if (host == null ||

package/lib/ComboBox.d.ts

@@ -4,7 +4,7 @@ import { AutocompleteExtendedProps } from "./AutocompleteExtendedProps";
 /**
  * ComboBox props
  */
-export type ComboBoxProps<T extends object, D extends DataTypes.Keys<T>, L extends DataTypes.Keys<T, string>> = AutocompleteExtendedProps<T, D> & {
+export type ComboBoxProps<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>> = AutocompleteExtendedProps<T, D> & {
     /**
      * Auto add blank item
      */

package/lib/DataSteps.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { TextFieldProps } from '@mui/material';
-import { InputDialogProps } from '@etsoo/react';
+import { TextFieldProps } from "@mui/material";
+import { InputDialogProps } from "@etsoo/react";
 /**
  * Data step
  */
-export type DataStep = Omit<InputDialogProps, 'callback'> & {
+export type DataStep = Omit<InputDialogProps, "callback"> & {
     /**
      * Callback
      */
@@ -13,7 +13,7 @@ export type DataStep = Omit<InputDialogProps, 'callback'> & {
 /**
  * Data collecting steps component props
  */
-export type DataStepsProps<T extends object> = Omit<TextFieldProps, 'InputProps' | 'onClick'> & {
+export type DataStepsProps<T extends object> = Omit<TextFieldProps, "InputProps" | "onClick"> & {
     /**
      * JSON value
      */

package/lib/DataSteps.js

@@ -1,13 +1,13 @@
-import { Button, IconButton, InputAdornment, TextField } from '@mui/material';
-import CloseIcon from '@mui/icons-material/Close';
-import NavigateNextIcon from '@mui/icons-material/NavigateNext';
-import NavigateBeforeIcon from '@mui/icons-material/NavigateBefore';
-import CheckIcon from '@mui/icons-material/Check';
-import StartIcon from '@mui/icons-material/Start';
-import React from 'react';
-import { HBox } from './FlexBox';
-import { globalApp } from './app/ReactApp';
-import { MUGlobal } from './MUGlobal';
+import { Button, IconButton, InputAdornment, TextField } from "@mui/material";
+import CloseIcon from "@mui/icons-material/Close";
+import NavigateNextIcon from "@mui/icons-material/NavigateNext";
+import NavigateBeforeIcon from "@mui/icons-material/NavigateBefore";
+import CheckIcon from "@mui/icons-material/Check";
+import StartIcon from "@mui/icons-material/Start";
+import React from "react";
+import { HBox } from "./FlexBox";
+import { globalApp } from "./app/ReactApp";
+import { MUGlobal } from "./MUGlobal";
 /**
  * Data collecting steps component
  * @param props Props
@@ -17,10 +17,13 @@ export function DataSteps(props) {
     var _a;
     // App
     const app = globalApp;
+    if (app == null) {
+        throw new Error("No globalApp");
+    }
     // Labels
-    const labels = app.getLabels('close', 'nextStep', 'previousStep', 'submit');
+    const labels = app.getLabels("close", "nextStep", "previousStep", "submit");
     // Destruct
-    const { InputLabelProps = {}, jsonValue, valueFormatter = (_data) => '...', onValueChange, steps, value = '', ...rest } = props;
+    const { InputLabelProps = {}, jsonValue, valueFormatter = (_data) => "...", onValueChange, steps, value = "", ...rest } = props;
     // Shrink
     (_a = InputLabelProps.shrink) !== null && _a !== void 0 ? _a : (InputLabelProps.shrink = MUGlobal.searchFieldShrink);
     // Current index
@@ -74,9 +77,9 @@ export function DataSteps(props) {
     React.useEffect(() => {
         setLocalValue(valueFormatter(jsonRef.current));
     }, [valueFormatter]);
-    return (React.createElement(TextField, { autoComplete: "new-password", InputLabelProps: InputLabelProps, inputProps: { style: { cursor: 'pointer' } }, InputProps: {
+    return (React.createElement(TextField, { autoComplete: "new-password", InputLabelProps: InputLabelProps, inputProps: { style: { cursor: "pointer" } }, InputProps: {
             onKeyDown: (event) => {
-                if (event.key === 'Tab')
+                if (event.key === "Tab")
                     return;
                 cancelInput(event);
             },

package/lib/ListMoreDisplay.d.ts

@@ -1,11 +1,11 @@
-import { DataTypes } from '@etsoo/shared';
-import { CardProps } from '@mui/material';
-import React from 'react';
-import { GridData, GridLoader } from '@etsoo/react';
+import { DataTypes } from "@etsoo/shared";
+import { CardProps } from "@mui/material";
+import React from "react";
+import { GridData, GridLoader } from "@etsoo/react";
 /**
  * ListMoreDisplay props
  */
-export interface ListMoreDisplayProps<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate> extends Omit<CardProps, 'children'>, GridLoader<T> {
+export interface ListMoreDisplayProps<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate> extends Omit<CardProps, "children">, GridLoader<T> {
     /**
      * Batch size to load
      */

package/lib/ListMoreDisplay.js

@@ -1,8 +1,8 @@
-import { Card, CardActions, CardContent, CardHeader, CircularProgress } from '@mui/material';
-import React from 'react';
-import { GridDataGet } from '@etsoo/react';
-import { LoadingButton } from './LoadingButton';
-import { globalApp } from './app/ReactApp';
+import { Card, CardActions, CardContent, CardHeader, CircularProgress } from "@mui/material";
+import React from "react";
+import { GridDataGet } from "@etsoo/react";
+import { LoadingButton } from "./LoadingButton";
+import { globalApp } from "./app/ReactApp";
 /**
  * ListMoreDisplay
  * @param props Props
@@ -10,9 +10,7 @@ import { globalApp } from './app/ReactApp';
  */
 export function ListMoreDisplay(props) {
     // Destruct
-    const { batchSize = 6, children, defaultOrderBy, headerRenderer, autoLoad = headerRenderer == null, headerTitle, loadBatchSize, loadData, moreLabel = typeof globalApp === 'undefined'
-        ? undefined
-        : globalApp.get('more') + '...', fieldTemplate, threshold, ...rest } = props;
+    const { batchSize = 6, children, defaultOrderBy, headerRenderer, autoLoad = headerRenderer == null, headerTitle, loadBatchSize, loadData, moreLabel = globalApp ? globalApp.get("more") + "..." : undefined, fieldTemplate, threshold, ...rest } = props;
     // Refs
     const refs = React.useRef({
         autoLoad,
@@ -95,8 +93,8 @@ export function ListMoreDisplay(props) {
             React.createElement(CardHeader, { title: headerTitle }),
             React.createElement(CardContent, { sx: {
                     paddingTop: 0,
-                    paddingBottom: states.completed ? 0 : 'inherit'
+                    paddingBottom: states.completed ? 0 : "inherit"
                 } }, states.items == null ? (React.createElement(CircularProgress, { size: 20 })) : (states.items.map((item, index) => children(item, index)))),
-            !states.completed && (React.createElement(CardActions, { sx: { justifyContent: 'flex-end' } },
+            !states.completed && (React.createElement(CardActions, { sx: { justifyContent: "flex-end" } },
                 React.createElement(LoadingButton, { onClick: async () => await loadDataLocal() }, moreLabel))))));
 }

package/lib/OptionBool.js

@@ -7,8 +7,9 @@ import { OptionGroup } from "./OptionGroup";
  * @returns Component
  */
 export function OptionBool(props) {
+    var _a;
     // Options
-    const options = globalApp.getBools();
+    const options = (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.getBools()) !== null && _a !== void 0 ? _a : [];
     // Layout
     return (React.createElement(OptionGroup, { options: options, row: true, multiple: false, ...props }));
 }

package/lib/SelectBool.js

@@ -8,10 +8,11 @@ import { SelectEx } from "./SelectEx";
  * @returns Component
  */
 export function SelectBool(props) {
+    var _a;
     // Destruct
     const { search = true, autoAddBlankItem = search, ...rest } = props;
     // Options
-    const options = globalApp.getBools();
+    const options = (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.getBools()) !== null && _a !== void 0 ? _a : [];
     if (autoAddBlankItem)
         Utils.addBlankItem(options);
     // Layout

package/lib/ShowDataComparison.d.ts

@@ -1,4 +1,4 @@
-import { AuditLineChangesDto } from '@etsoo/appscript';
+import { AuditLineChangesDto } from "@etsoo/appscript";
 /**
  * Check obj is instance of AuditLineChangesDto
  * @param obj Input

package/lib/ShowDataComparison.js

@@ -1,26 +1,26 @@
-import { NotificationMessageType } from '@etsoo/notificationbase';
-import { Utils } from '@etsoo/shared';
-import { Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material';
-import React from 'react';
-import { globalApp } from './app/ReactApp';
+import { NotificationMessageType } from "@etsoo/notificationbase";
+import { Utils } from "@etsoo/shared";
+import { Table, TableBody, TableCell, TableHead, TableRow } from "@mui/material";
+import React from "react";
+import { globalApp } from "./app/ReactApp";
 /**
  * Check obj is instance of AuditLineChangesDto
  * @param obj Input
  * @returns Result
  */
 export function IsAuditLineUpdateData(obj) {
-    return (typeof obj === 'object' &&
-        'oldData' in obj &&
-        typeof obj.oldData === 'object' &&
-        'newData' in obj &&
-        typeof obj.newData === 'object');
+    return (typeof obj === "object" &&
+        "oldData" in obj &&
+        typeof obj.oldData === "object" &&
+        "newData" in obj &&
+        typeof obj.newData === "object");
 }
 // Format value
 const formatValue = (value, app) => {
     if (value == null)
-        return '';
+        return "";
     if (value instanceof Date)
-        return app.formatDate(value, 'ds');
+        return app.formatDate(value, "ds");
     return `${value}`;
 };
 /**
@@ -31,10 +31,17 @@ const formatValue = (value, app) => {
  * @param equalCheck Equal check for properties
  */
 export const ShowDataComparison = (data, modelTitle, getLabel, equalCheck = true) => {
-    modelTitle !== null && modelTitle !== void 0 ? modelTitle : (modelTitle = globalApp.get('dataComparison'));
+    // Validate app
+    const app = globalApp;
+    if (app == null) {
+        throw new Error("No globalApp");
+    }
+    // Labels
+    const { dataComparison, field, newValue, oldValue } = app.getLabels("dataComparison", "field", "newValue", "oldValue");
+    modelTitle !== null && modelTitle !== void 0 ? modelTitle : (modelTitle = dataComparison);
     getLabel !== null && getLabel !== void 0 ? getLabel : (getLabel = (key) => {
         var _a;
-        return (_a = globalApp.get(Utils.formatInitial(key))) !== null && _a !== void 0 ? _a : key;
+        return (_a = app.get(Utils.formatInitial(key))) !== null && _a !== void 0 ? _a : key;
     });
     const keys = new Set([
         ...Object.keys(data.oldData),
@@ -50,12 +57,12 @@ export const ShowDataComparison = (data, modelTitle, getLabel, equalCheck = true
     const inputs = (React.createElement(Table, null,
         React.createElement(TableHead, null,
             React.createElement(TableRow, null,
-                React.createElement(TableCell, { width: "18%" }, globalApp.get('field')),
-                React.createElement(TableCell, { width: "41%", align: "right" }, globalApp.get('oldValue')),
-                React.createElement(TableCell, { width: "41%", align: "right" }, globalApp.get('newValue')))),
+                React.createElement(TableCell, { width: "18%" }, field),
+                React.createElement(TableCell, { width: "41%", align: "right" }, oldValue),
+                React.createElement(TableCell, { width: "41%", align: "right" }, newValue))),
         React.createElement(TableBody, null, rows.map((row) => (React.createElement(TableRow, { key: row.field },
             React.createElement(TableCell, null, getLabel(row.field)),
-            React.createElement(TableCell, { align: "right" }, formatValue(row.oldValue, globalApp)),
-            React.createElement(TableCell, { align: "right" }, formatValue(row.newValue, globalApp))))))));
-    globalApp.notifier.alert([undefined, modelTitle], undefined, NotificationMessageType.Info, { fullScreen: globalApp.smDown, inputs });
+            React.createElement(TableCell, { align: "right" }, formatValue(row.oldValue, app)),
+            React.createElement(TableCell, { align: "right" }, formatValue(row.newValue, app))))))));
+    app.notifier.alert([undefined, modelTitle], undefined, NotificationMessageType.Info, { fullScreen: app.smDown, inputs });
 };

package/lib/SwitchAnt.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { SwitchProps } from '@mui/material/Switch';
+import { SwitchProps } from "@mui/material/Switch";
 /**
  * Ant style switch props
  */

package/lib/SwitchAnt.js

@@ -1,17 +1,20 @@
-import { Stack, Typography } from '@mui/material';
-import Switch from '@mui/material/Switch';
-import React from 'react';
+import { Stack, Typography } from "@mui/material";
+import Switch from "@mui/material/Switch";
+import React from "react";
+import { globalApp } from "./app/ReactApp";
 /**
  * Ant style switch
  * @param props Props
  * @returns Component
  */
 export function SwitchAnt(props) {
-    var _a;
+    var _a, _b;
+    // Labels
+    const { yes = "Yes", no = "No" } = (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.getLabels("yes", "no")) !== null && _a !== void 0 ? _a : {};
     // Destruct
-    const { activeColor, checked, defaultChecked, defaultValue, endLabel, startLabel, onChange, value = 'true', ...rest } = props;
+    const { activeColor, checked, defaultChecked, defaultValue, endLabel = yes, startLabel = no, onChange, value = "true", ...rest } = props;
     // Checked state
-    const [controlChecked, setControlChecked] = React.useState((_a = checked !== null && checked !== void 0 ? checked : defaultChecked) !== null && _a !== void 0 ? _a : defaultValue == value);
+    const [controlChecked, setControlChecked] = React.useState((_b = checked !== null && checked !== void 0 ? checked : defaultChecked) !== null && _b !== void 0 ? _b : defaultValue == value);
     // Ref
     const ref = React.useRef(null);
     React.useEffect(() => {
@@ -27,14 +30,14 @@ export function SwitchAnt(props) {
     // Layout
     return (React.createElement(Stack, { direction: "row", spacing: 1, alignItems: "center" },
         React.createElement(Typography, { onClick: () => { var _a; return controlChecked && ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.click()); }, sx: {
-                cursor: 'pointer',
+                cursor: "pointer",
                 color: controlChecked
                     ? undefined
                     : (theme) => activeColor !== null && activeColor !== void 0 ? activeColor : theme.palette.warning.main
             } }, startLabel),
         React.createElement(Switch, { checked: controlChecked, inputRef: ref, value: value, onChange: onChangeLocal, ...rest }),
         React.createElement(Typography, { onClick: () => { var _a; return !controlChecked && ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.click()); }, sx: {
-                cursor: 'pointer',
+                cursor: "pointer",
                 color: controlChecked
                     ? (theme) => activeColor !== null && activeColor !== void 0 ? activeColor : theme.palette.warning.main
                     : undefined

package/lib/Tiplist.js

@@ -11,10 +11,11 @@ import { SearchField } from "./SearchField";
  * @returns Component
  */
 export function Tiplist(props) {
+    var _a;
     // Labels
-    const labels = globalApp === null || globalApp === void 0 ? void 0 : globalApp.getLabels("noOptions", "loading", "more");
+    const { noOptions, loading, more } = (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.getLabels("noOptions", "loading", "more")) !== null && _a !== void 0 ? _a : {};
     // Destruct
-    const { search = false, idField = "id", idValue, inputAutoComplete = "new-password", inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, label, loadData, defaultValue, value, maxItems = 16, name, readOnly, onChange, openOnFocus = true, sx = { minWidth: "180px" }, noOptionsText = labels === null || labels === void 0 ? void 0 : labels.noOptions, loadingText = labels === null || labels === void 0 ? void 0 : labels.loading, getOptionLabel, getOptionDisabled, ...rest } = props;
+    const { search = false, idField = "id", idValue, inputAutoComplete = "new-password", inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, label, loadData, defaultValue, value, maxItems = 16, name, readOnly, onChange, openOnFocus = true, sx = { minWidth: "180px" }, noOptionsText = noOptions, loadingText = loading, getOptionLabel, getOptionDisabled, ...rest } = props;
     // Value input ref
     const inputRef = React.createRef();
     // Local value
@@ -160,11 +161,10 @@ export function Tiplist(props) {
                     return true;
                 return getOptionDisabled ? getOptionDisabled(item) : false;
             }, getOptionLabel: (item) => {
-                var _a;
                 if (typeof item !== "object")
                     return `${item}`;
                 if (item[idField] === "n/a")
-                    return ((_a = labels.more) !== null && _a !== void 0 ? _a : "More") + "...";
+                    return (more !== null && more !== void 0 ? more : "More") + "...";
                 return getOptionLabel
                     ? getOptionLabel(item)
                     : "label" in item

package/lib/UserAvatar.js

@@ -1,7 +1,7 @@
-import React from 'react';
-import { Avatar } from '@mui/material';
-import { BusinessUtils } from '@etsoo/appscript';
-import { globalApp } from './app/ReactApp';
+import React from "react";
+import { Avatar } from "@mui/material";
+import { BusinessUtils } from "@etsoo/appscript";
+import { globalApp } from "./app/ReactApp";
 /**
  * User avatar
  * @param props Props
@@ -10,9 +10,8 @@ import { globalApp } from './app/ReactApp';
 export function UserAvatar(props) {
     // Destruct
     const { src, title, formatTitle = (title) => {
-        return BusinessUtils.formatAvatarTitle(title, 3, typeof globalApp === 'undefined'
-            ? 'ME'
-            : globalApp.get('me'));
+        var _a;
+        return BusinessUtils.formatAvatarTitle(title, 3, (_a = globalApp === null || globalApp === void 0 ? void 0 : globalApp.get("me")) !== null && _a !== void 0 ? _a : "ME");
     } } = props;
     // Format
     const fTitle = formatTitle(title);
@@ -20,6 +19,6 @@ export function UserAvatar(props) {
     return (React.createElement(Avatar, { title: title, src: src, sx: {
             width: 48,
             height: 32,
-            fontSize: count <= 2 ? '15px' : '12px'
+            fontSize: count <= 2 ? "15px" : "12px"
         } }, fTitle));
 }

package/lib/app/ReactApp.d.ts

@@ -1,9 +1,9 @@
-import { CoreApp, IActionResult, IApp, IAppSettings, ICoreApp, IUser } from '@etsoo/appscript';
-import { INotifier, NotificationReturn } from '@etsoo/notificationbase';
-import { DataTypes } from '@etsoo/shared';
-import React from 'react';
-import { CultureAction, CultureState, INotificationReact, InputDialogProps, IPageData, IStateProps, NotificationReactCallProps, PageAction, PageState, UserAction, UserState } from '@etsoo/react';
-import { NavigateFunction, NavigateOptions } from 'react-router-dom';
+import { CoreApp, IActionResult, IApp, IAppSettings, ICoreApp, IUser } from "@etsoo/appscript";
+import { INotifier, NotificationReturn } from "@etsoo/notificationbase";
+import { DataTypes } from "@etsoo/shared";
+import React from "react";
+import { CultureAction, CultureState, INotificationReact, InputDialogProps, IPageData, IStateProps, NotificationReactCallProps, PageAction, PageState, UserAction, UserState } from "@etsoo/react";
+import { NavigateFunction, NavigateOptions } from "react-router-dom";
 /**
  * React Application Type
  */
@@ -11,7 +11,7 @@ export type ReactAppType = IApp & IReactAppBase;
 /**
  * Global application
  */
-export declare let globalApp: ReactAppType;
+export declare let globalApp: ReactAppType | null;
 /**
  * React app state detector
  * Case 1: undefined, when refresh the whole page

package/lib/app/ReactApp.js

@@ -1,11 +1,11 @@
-import { BridgeUtils, CoreApp, createClient } from '@etsoo/appscript';
-import { NotificationMessageType } from '@etsoo/notificationbase';
-import { WindowStorage } from '@etsoo/shared';
-import React from 'react';
-import { NotifierMU } from '../NotifierMU';
-import { ProgressCount } from '../ProgressCount';
-import { Labels } from './Labels';
-import { CultureState, PageActionType, PageState, UserActionType, UserState } from '@etsoo/react';
+import { BridgeUtils, CoreApp, createClient } from "@etsoo/appscript";
+import { NotificationMessageType } from "@etsoo/notificationbase";
+import { WindowStorage } from "@etsoo/shared";
+import React from "react";
+import { NotifierMU } from "../NotifierMU";
+import { ProgressCount } from "../ProgressCount";
+import { Labels } from "./Labels";
+import { CultureState, PageActionType, PageState, UserActionType, UserState } from "@etsoo/react";
 /**
  * Global application
  */
@@ -75,7 +75,7 @@ export class ReactApp extends CoreApp {
         this.userState = new UserState();
         if (BridgeUtils.host) {
             BridgeUtils.host.onUpdate((app, version) => {
-                this.notifier.message(NotificationMessageType.Success, this.get('updateTip') + `(${[app, version].join(', ')})`, this.get('updateReady'));
+                this.notifier.message(NotificationMessageType.Success, this.get("updateTip") + `(${[app, version].join(", ")})`, this.get("updateReady"));
             });
         }
         this.cultureState = new CultureState(settings.currentCulture);
@@ -88,13 +88,13 @@ export class ReactApp extends CoreApp {
      * @param callback Callback
      */
     alertResult(result, callback) {
-        const message = typeof result === 'string' ? result : this.formatResult(result);
-        if (message.endsWith(')')) {
-            const startPos = message.lastIndexOf('(');
+        const message = typeof result === "string" ? result : this.formatResult(result);
+        if (message.endsWith(")")) {
+            const startPos = message.lastIndexOf("(");
             if (startPos > 0) {
                 const main = message.substring(0, startPos).trim();
                 const tip = message.substring(startPos);
-                const titleNode = React.createElement(React.Fragment, null, main, React.createElement('br'), React.createElement('span', { style: { fontSize: '9px' } }, tip));
+                const titleNode = React.createElement(React.Fragment, null, main, React.createElement("br"), React.createElement("span", { style: { fontSize: "9px" } }, tip));
                 this.notifier.alert(titleNode, callback);
                 return;
             }
@@ -112,19 +112,19 @@ export class ReactApp extends CoreApp {
         // Update component labels
         Labels.setLabels(culture.resources, {
             notificationMU: {
-                alertTitle: 'warning',
-                alertOK: 'ok',
-                confirmTitle: 'confirm',
-                confirmYes: 'ok',
-                confirmNo: 'cancel',
-                promptTitle: 'prompt',
-                promptCancel: 'cancel',
-                promptOK: 'ok'
+                alertTitle: "warning",
+                alertOK: "ok",
+                confirmTitle: "confirm",
+                confirmYes: "ok",
+                confirmNo: "cancel",
+                promptTitle: "prompt",
+                promptCancel: "cancel",
+                promptOK: "ok"
             }
         });
         // Document title
         // Default is servier name's label or appName label
-        const title = (_b = (_a = this.get(this.name)) !== null && _a !== void 0 ? _a : this.get('appName')) !== null && _b !== void 0 ? _b : this.name;
+        const title = (_b = (_a = this.get(this.name)) !== null && _a !== void 0 ? _a : this.get("appName")) !== null && _b !== void 0 ? _b : this.name;
         const host = BridgeUtils.host;
         if (host) {
             // Notify host
@@ -170,11 +170,11 @@ export class ReactApp extends CoreApp {
      */
     freshCountdownUI(callback) {
         // Labels
-        const labels = this.getLabels('cancel', 'tokenExpiry');
+        const labels = this.getLabels("cancel", "tokenExpiry");
         // Progress
         const progress = React.createElement(ProgressCount, {
             seconds: 30,
-            valueUnit: 's',
+            valueUnit: "s",
             onComplete: () => {
                 // Stop the progress
                 return false;
@@ -228,7 +228,7 @@ export class ReactApp extends CoreApp {
     navigate(to, options) {
         if (this.navigateFunction == null)
             super.navigate(to, options);
-        else if (typeof to === 'number')
+        else if (typeof to === "number")
             this.navigateFunction(to);
         else
             this.navigateFunction(to, options);
@@ -239,7 +239,7 @@ export class ReactApp extends CoreApp {
      */
     setPageKey(key) {
         var _a;
-        this.setPageTitle((_a = this.get(key)) !== null && _a !== void 0 ? _a : '');
+        this.setPageTitle((_a = this.get(key)) !== null && _a !== void 0 ? _a : "");
     }
     /**
      * Show input dialog