@etsoo/materialui 1.3.57 → 1.3.59

package/__tests__/ResponsePage.tsx

@@ -1,6 +1,7 @@
 import { act, render } from "@testing-library/react";
 import { MUGlobal, MobileListItemRenderer, ResponsivePage } from "../src";
 import React from "react";
+import { DataTypes } from "@etsoo/shared";
 
 global.ResizeObserver = jest.fn().mockImplementation(() => ({
   observe: jest.fn(),
@@ -14,20 +15,28 @@ type Data = { id: number; name: string };
 // https://jestjs.io/docs/en/timer-mocks
 jest.useFakeTimers();
 
+// TypeScript const assertions
+const fieldTemplate = {
+  id: "number",
+  name: "string"
+} as const;
+
 it("Render ResponsePage", async () => {
   // Act
   render(
-    <ResponsivePage<Data>
+    <ResponsivePage<Data, typeof fieldTemplate>
       fields={[]}
       columns={[
         { field: "id", header: "ID" },
         { field: "name", header: "Name" }
       ]}
       itemSize={[118, MUGlobal.pagePaddings]}
-      loadData={(_data) =>
+      fieldTemplate={fieldTemplate}
+      loadData={({ id }) =>
         Promise.resolve([
           { id: 1, name: "Name 1" },
-          { id: 2, name: "Name 2" }
+          { id: 2, name: "Name 2" },
+          { id: id ?? 0, name: "auto" }
         ])
       }
       innerItemRenderer={(props) =>

package/lib/AddresSelector.d.ts

@@ -96,5 +96,5 @@ export type AddressSelectorProps = {
  * Address selector
  * @param props Props
  */
-export declare function AddressSelector(props: AddressSelectorProps): React.JSX.Element;
+export declare function AddressSelector(props: AddressSelectorProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/AddresSelector.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FormLabel, Grid } from "@mui/material";
 import React from "react";
 import { globalApp } from "./app/ReactApp";
@@ -122,22 +123,12 @@ export function AddressSelector(props) {
         }
     };
     // Layout
-    return (React.createElement(React.Fragment, null,
-        label && (React.createElement(Grid, { item: true, xs: 12 },
-            React.createElement(FormLabel, { required: required, sx: { fontSize: (theme) => theme.typography.caption } }, label))),
-        !hideRegion && (React.createElement(Grid, { item: true, ...breakPoints },
-            React.createElement(Tiplist, { label: regionLabel, name: AddressField.Region, search: search, fullWidth: true, idValue: regionState, loadData: (keyword, id, items) => api.getRegions({
-                    keyword,
-                    id,
-                    items,
-                    favoredIds: favoredIds == null
-                        ? undefined
-                        : favoredIds(AddressField.Region)
-                }), inputRequired: required, inputError: error, inputHelperText: helperText, onChange: (_event, value) => handleChange([AddressField.Region, value]) }))),
-        React.createElement(Grid, { item: true, ...breakPoints },
-            React.createElement(ComboBox, { name: AddressField.State, label: stateLabel, search: search, fullWidth: true, idValue: stateState, options: states, inputRequired: required, inputError: hideRegion ? error : undefined, inputHelperText: hideRegion ? helperText : undefined, onChange: (_event, value) => handleChange([AddressField.State, value]) })),
-        React.createElement(Grid, { item: true, ...breakPoints },
-            React.createElement(ComboBox, { name: AddressField.City, label: cityLabel, search: search, fullWidth: true, idValue: cityState, options: cities, onChange: (_event, value) => handleChange([AddressField.City, value]) })),
-        React.createElement(Grid, { item: true, ...breakPoints },
-            React.createElement(ComboBox, { name: AddressField.District, label: districtLabel, search: search, fullWidth: true, idValue: districtState, options: districts, onChange: (_event, value) => handleChange([AddressField.District, value]) }))));
+    return (_jsxs(React.Fragment, { children: [label && (_jsx(Grid, { item: true, xs: 12, children: _jsx(FormLabel, { required: required, sx: { fontSize: (theme) => theme.typography.caption }, children: label }) })), !hideRegion && (_jsx(Grid, { item: true, ...breakPoints, children: _jsx(Tiplist, { label: regionLabel, name: AddressField.Region, search: search, fullWidth: true, idValue: regionState, loadData: (keyword, id, items) => api.getRegions({
+                        keyword,
+                        id,
+                        items,
+                        favoredIds: favoredIds == null
+                            ? undefined
+                            : favoredIds(AddressField.Region)
+                    }), inputRequired: required, inputError: error, inputHelperText: helperText, onChange: (_event, value) => handleChange([AddressField.Region, value]) }) })), _jsx(Grid, { item: true, ...breakPoints, children: _jsx(ComboBox, { name: AddressField.State, label: stateLabel, search: search, fullWidth: true, idValue: stateState, options: states, inputRequired: required, inputError: hideRegion ? error : undefined, inputHelperText: hideRegion ? helperText : undefined, onChange: (_event, value) => handleChange([AddressField.State, value]) }) }), _jsx(Grid, { item: true, ...breakPoints, children: _jsx(ComboBox, { name: AddressField.City, label: cityLabel, search: search, fullWidth: true, idValue: cityState, options: cities, onChange: (_event, value) => handleChange([AddressField.City, value]) }) }), _jsx(Grid, { item: true, ...breakPoints, children: _jsx(ComboBox, { name: AddressField.District, label: districtLabel, search: search, fullWidth: true, idValue: districtState, options: districts, onChange: (_event, value) => handleChange([AddressField.District, value]) }) })] }));
 }

package/lib/AuditDisplay.d.ts

@@ -28,4 +28,4 @@ export interface AuditDisplayProps extends Omit<ListMoreDisplayProps<AuditLineDt
  * @param props Props
  * @returns Component
  */
-export declare function AuditDisplay(props: AuditDisplayProps): React.JSX.Element;
+export declare function AuditDisplay(props: AuditDisplayProps): import("react/jsx-runtime").JSX.Element;

package/lib/AuditDisplay.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Utils } from "@etsoo/shared";
 import { Button, Divider, Typography, useTheme } from "@mui/material";
 import React from "react";
@@ -30,20 +31,16 @@ export function AuditDisplay(props) {
         background: index % 2 === 0 ? theme.palette.grey[100] : theme.palette.grey[50]
     }), getColumnLabel, equalCheck, itemRenderer = (data) => {
         const { newData, oldData, changes = { newData: newData ?? {}, oldData: 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"
-                } }, 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(Divider, null))), ...rest } = props;
+        return (_jsxs(React.Fragment, { children: [changes != null && (_jsx(Button, { variant: "outlined", size: "small", onClick: () => ShowDataComparison(changes, title, getColumnLabel, equalCheck), sx: {
+                        marginLeft: theme.spacing(1),
+                        marginTop: theme.spacing(-0.5),
+                        float: "right"
+                    }, children: title })), _jsx(Typography, { children: formatDate(data.creation) +
+                        ", [" +
+                        getLabel(data.action) +
+                        "], " +
+                        data.user })] }));
+    }, headerTitle = (_jsxs(React.Fragment, { children: [_jsx(Typography, { children: getLabel("audits") }), _jsx(Divider, {})] })), ...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)))));
+    return (_jsx(ListMoreDisplay, { headerTitle: headerTitle, ...rest, children: (data, index) => (_jsx("div", { style: getItemStyle(index, theme), children: itemRenderer(data, index) }, data.id)) }));
 }

package/lib/BackButton.d.ts

@@ -1,5 +1,4 @@
 import { IconButtonProps } from '@mui/material';
-import React from 'react';
 /**
  * BackButton props
  */
@@ -10,4 +9,4 @@ export interface BackButtonProps extends IconButtonProps {
  * @param props Props
  * @returns Component
  */
-export declare function BackButton(props: BackButtonProps): React.JSX.Element;
+export declare function BackButton(props: BackButtonProps): import("react/jsx-runtime").JSX.Element;

package/lib/BackButton.js

@@ -1,6 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { IconButton, useTheme } from '@mui/material';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import React from 'react';
 import { useNavigate } from 'react-router-dom';
 /**
  * BackButton
@@ -25,9 +25,8 @@ export function BackButton(props) {
         // Navigate
         navigate(-1);
     };
-    return (React.createElement(IconButton, { "aria-label": "Back", color: color, size: size, onClick: onClickLocal, sx: {
+    return (_jsx(IconButton, { "aria-label": "Back", color: color, size: size, onClick: onClickLocal, sx: {
             backgroundColor: pColor.contrastText,
             border: `1px solid ${pColor.light}`
-        }, ...rest },
-        React.createElement(ArrowBackIcon, null)));
+        }, ...rest, children: _jsx(ArrowBackIcon, {}) }));
 }

package/lib/BridgeCloseButton.d.ts

@@ -1,6 +1,5 @@
 import { IBridgeHost } from "@etsoo/appscript";
 import { BoxProps, IconButtonProps } from "@mui/material";
-import React from "react";
 /**
  * Bridge close button props
  */
@@ -20,4 +19,4 @@ export interface BridgeCloseButtonProps extends IconButtonProps {
  * @param props Props
  * @returns Component
  */
-export declare function BridgeCloseButton(props: BridgeCloseButtonProps): React.JSX.Element;
+export declare function BridgeCloseButton(props: BridgeCloseButtonProps): import("react/jsx-runtime").JSX.Element;

package/lib/BridgeCloseButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { BridgeUtils } from "@etsoo/appscript";
 import CloseIcon from "@mui/icons-material/Close";
 import { Box, IconButton } from "@mui/material";
@@ -16,7 +17,7 @@ export function BridgeCloseButton(props) {
     if (host == null ||
         !host.closable() ||
         (validate && validate(host) === false)) {
-        return React.createElement(React.Fragment, null);
+        return _jsx(React.Fragment, {});
     }
     // Click handler
     const onClickLocal = (event) => {
@@ -24,7 +25,5 @@ export function BridgeCloseButton(props) {
             onClick(event);
         host.exit();
     };
-    return (React.createElement(Box, { ...boxProps },
-        React.createElement(IconButton, { "aria-label": "close", onClick: onClickLocal, title: title, ...rest },
-            React.createElement(CloseIcon, null))));
+    return (_jsx(Box, { ...boxProps, children: _jsx(IconButton, { "aria-label": "close", onClick: onClickLocal, title: title, ...rest, children: _jsx(CloseIcon, {}) }) }));
 }

package/lib/ButtonLink.d.ts

@@ -1,5 +1,4 @@
 import { ButtonProps } from "@mui/material";
-import React from "react";
 /**
  * ButtonLink props
  */
@@ -18,4 +17,4 @@ export type ButtonLinkProps = Omit<ButtonProps, "href" | "onClick"> & {
  * @param props Props
  * @returns Component
  */
-export declare function ButtonLink(props: ButtonLinkProps): React.JSX.Element;
+export declare function ButtonLink(props: ButtonLinkProps): import("react/jsx-runtime").JSX.Element;

package/lib/ButtonLink.js

@@ -1,5 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from "@mui/material";
-import React from "react";
 import { useNavigate } from "react-router-dom";
 /**
  * ButtonLink
@@ -15,5 +15,5 @@ export function ButtonLink(props) {
         ? () => window.open(href, "_blank")
         : () => navigate(href, { state });
     // Layout
-    return React.createElement(Button, { ...rest, onClick: onClick });
+    return _jsx(Button, { ...rest, onClick: onClick });
 }

package/lib/ComboBox.d.ts

@@ -1,5 +1,4 @@
 import { DataTypes, IdDefaultType, LabelDefaultType, ListType } from "@etsoo/shared";
-import React from "react";
 import { AutocompleteExtendedProps } from "./AutocompleteExtendedProps";
 /**
  * ComboBox props
@@ -43,4 +42,4 @@ export type ComboBoxProps<T extends object = ListType, D extends DataTypes.Keys<
  * @param props Props
  * @returns Component
  */
-export declare function ComboBox<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>>(props: ComboBoxProps<T, D, L>): React.JSX.Element;
+export declare function ComboBox<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>>(props: ComboBoxProps<T, D, L>): import("react/jsx-runtime").JSX.Element;

package/lib/ComboBox.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Keyboard } from "@etsoo/shared";
 import { Autocomplete, IconButton, Stack } from "@mui/material";
 import React from "react";
@@ -112,20 +113,15 @@ export function ComboBox(props) {
         };
     }, []);
     // Layout
-    return (React.createElement("div", null,
-        React.createElement("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }),
-        React.createElement(Stack, { gap: 0.5, direction: "row", width: "100%" },
-            React.createElement(Autocomplete, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
-                    // Set value
-                    setInputValue(value);
-                    // Custom
-                    if (onChange != null)
-                        onChange(event, value, reason, details);
-                    if (onValueChange)
-                        onValueChange(value);
-                }, openOnFocus: openOnFocus, sx: sx, renderInput: (params) => search ? (React.createElement(SearchField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })) : (React.createElement(InputField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })), options: localOptions, noOptionsText: noOptionsText, loadingText: loadingText, openText: openText, ...rest }),
-            onAdd && (React.createElement(IconButton, { size: "small", onClick: () => {
-                    onAdd(doLoadData);
-                }, title: addLabel },
-                React.createElement(AddIcon, null))))));
+    return (_jsxs("div", { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsxs(Stack, { gap: 0.5, direction: "row", width: "100%", children: [_jsx(Autocomplete, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
+                            // Set value
+                            setInputValue(value);
+                            // Custom
+                            if (onChange != null)
+                                onChange(event, value, reason, details);
+                            if (onValueChange)
+                                onValueChange(value);
+                        }, openOnFocus: openOnFocus, sx: sx, renderInput: (params) => search ? (_jsx(SearchField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })) : (_jsx(InputField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })), options: localOptions, noOptionsText: noOptionsText, loadingText: loadingText, openText: openText, ...rest }), onAdd && (_jsx(IconButton, { size: "small", onClick: () => {
+                            onAdd(doLoadData);
+                        }, title: addLabel, children: _jsx(AddIcon, {}) }))] })] }));
 }

package/lib/ComboBoxMultiple.d.ts

@@ -1,5 +1,4 @@
 import { DataTypes, IdDefaultType, LabelDefaultType, ListType } from "@etsoo/shared";
-import React from "react";
 import { AutocompleteExtendedProps } from "./AutocompleteExtendedProps";
 /**
  * ComboBox multiple props
@@ -39,4 +38,4 @@ export type ComboBoxMultipleProps<T extends object = ListType, D extends DataTyp
  * @param props Props
  * @returns Component
  */
-export declare function ComboBoxMultiple<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>>(props: ComboBoxMultipleProps<T, D, L>): React.JSX.Element;
+export declare function ComboBoxMultiple<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>>(props: ComboBoxMultipleProps<T, D, L>): import("react/jsx-runtime").JSX.Element;

package/lib/ComboBoxMultiple.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Keyboard } from "@etsoo/shared";
 import { Autocomplete, Checkbox } from "@mui/material";
 import React from "react";
@@ -8,8 +9,8 @@ import CheckBoxIcon from "@mui/icons-material/CheckBox";
 import { SearchField } from "./SearchField";
 import { InputField } from "./InputField";
 import { globalApp } from "./app/ReactApp";
-const icon = React.createElement(CheckBoxOutlineBlankIcon, { fontSize: "small" });
-const checkedIcon = React.createElement(CheckBoxIcon, { fontSize: "small" });
+const icon = _jsx(CheckBoxOutlineBlankIcon, { fontSize: "small" });
+const checkedIcon = _jsx(CheckBoxIcon, { fontSize: "small" });
 /**
  * ComboBox multiple
  * @param props Props
@@ -19,10 +20,7 @@ export function ComboBoxMultiple(props) {
     // Labels
     const labels = globalApp?.getLabels("noOptions", "loading");
     // Destruct
-    const { search = false, autoAddBlankItem = search, idField = "id", idValue, idValues, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputReset, inputVariant, defaultValue, label, labelField = "label", loadData, onLoadData, name, inputAutoComplete = "off", options, dataReadonly = true, readOnly, onChange, openOnFocus = true, value, disableCloseOnSelect = true, renderOption = (props, option, { selected }) => (React.createElement("li", { ...props },
-        React.createElement(React.Fragment, null,
-            React.createElement(Checkbox, { icon: icon, checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }),
-            option[labelField]))), getOptionLabel = (option) => `${option[labelField]}`, sx = { minWidth: "150px" }, noOptionsText = labels?.noOptions, loadingText = labels?.loading, ...rest } = props;
+    const { search = false, autoAddBlankItem = search, idField = "id", idValue, idValues, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputReset, inputVariant, defaultValue, label, labelField = "label", loadData, onLoadData, name, inputAutoComplete = "off", options, dataReadonly = true, readOnly, onChange, openOnFocus = true, value, disableCloseOnSelect = true, renderOption = (props, option, { selected }) => (_jsx("li", { ...props, children: _jsxs(_Fragment, { children: [_jsx(Checkbox, { icon: icon, checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }), option[labelField]] }) })), getOptionLabel = (option) => `${option[labelField]}`, sx = { minWidth: "150px" }, noOptionsText = labels?.noOptions, loadingText = labels?.loading, ...rest } = props;
     // Value input ref
     const inputRef = React.createRef();
     // Options state
@@ -114,17 +112,15 @@ export function ComboBoxMultiple(props) {
         };
     }, []);
     // Layout
-    return (React.createElement("div", null,
-        React.createElement("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }),
-        React.createElement(Autocomplete, { value: stateValue == null
-                ? []
-                : Array.isArray(stateValue)
-                    ? stateValue
-                    : [stateValue], disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, multiple: true, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
-                // Set value
-                setInputValue(value.concat());
-                // Custom
-                if (onChange != null)
-                    onChange(event, value, reason, details);
-            }, openOnFocus: openOnFocus, sx: sx, renderInput: (params) => search ? (React.createElement(SearchField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })) : (React.createElement(InputField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })), options: localOptions, renderOption: renderOption, noOptionsText: noOptionsText, loadingText: loadingText, ...rest })));
+    return (_jsxs("div", { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { value: stateValue == null
+                    ? []
+                    : Array.isArray(stateValue)
+                        ? stateValue
+                        : [stateValue], disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, multiple: true, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
+                    // Set value
+                    setInputValue(value.concat());
+                    // Custom
+                    if (onChange != null)
+                        onChange(event, value, reason, details);
+                }, openOnFocus: openOnFocus, sx: sx, renderInput: (params) => search ? (_jsx(SearchField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })) : (_jsx(InputField, { ...addReadOnly(params), label: label, name: name + "Input", margin: inputMargin, variant: inputVariant, required: inputRequired, error: inputError, helperText: inputHelperText })), options: localOptions, renderOption: renderOption, noOptionsText: noOptionsText, loadingText: loadingText, ...rest })] }));
 }

package/lib/ComboBoxPro.d.ts

@@ -1,5 +1,4 @@
 import { AutocompleteProps } from "@mui/material";
-import React from "react";
 import { InputFieldProps } from "./InputField";
 import { ListType2 } from "@etsoo/shared";
 export type ComboBoxProProps<D extends ListType2 = ListType2> = Omit<AutocompleteProps<D, false, false, true>, "open" | "multiple" | "options" | "renderInput"> & {
@@ -29,4 +28,4 @@ export type ComboBoxProProps<D extends ListType2 = ListType2> = Omit<Autocomplet
      */
     onValueChange?: (value: D | null) => void;
 };
-export declare function ComboBoxPro<D extends ListType2 = ListType2>(props: ComboBoxProProps<D>): React.JSX.Element;
+export declare function ComboBoxPro<D extends ListType2 = ListType2>(props: ComboBoxProProps<D>): import("react/jsx-runtime").JSX.Element;

package/lib/ComboBoxPro.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Autocomplete } from "@mui/material";
 import React from "react";
 import { globalApp } from "./app/ReactApp";
@@ -42,11 +43,11 @@ export function ComboBoxPro(props) {
             setOptions(options);
         }
     }, [options]);
-    return (React.createElement(Autocomplete, { id: name, value: localValue == null ? "" : localValue, open: open, freeSolo: true, clearOnBlur: false, onOpen: () => {
+    return (_jsx(Autocomplete, { id: name, value: localValue == null ? "" : localValue, open: open, freeSolo: true, clearOnBlur: false, onOpen: () => {
             setOpen(true);
         }, onClose: () => {
             setOpen(false);
-        }, options: localOptions, loading: loading, openOnFocus: openOnFocus, renderInput: (params) => (React.createElement(InputField, { ...inputProps, ...params, label: label, name: name, onBlur: (event) => {
+        }, options: localOptions, loading: loading, openOnFocus: openOnFocus, renderInput: (params) => (_jsx(InputField, { ...inputProps, ...params, label: label, name: name, onBlur: (event) => {
                 if (onChange) {
                     const value = event.target.value;
                     if (!localValue && localValue != value)

package/lib/CountdownButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Button, CircularProgress } from '@mui/material';
 import React from 'react';
 /**
@@ -24,13 +25,13 @@ export const CountdownButton = React.forwardRef((props, ref) => {
         endIcon = undefined;
     }
     else if (state === 1) {
-        endIcon = React.createElement(CircularProgress, { size: 12 });
+        endIcon = _jsx(CircularProgress, { size: 12 });
     }
     else {
         const countdown = (state - seconds)
             .toString()
             .padStart(shared.maxLength, '0');
-        endIcon = React.createElement("span", { style: { fontSize: 'smaller' } }, countdown);
+        endIcon = _jsx("span", { style: { fontSize: 'smaller' }, children: countdown });
     }
     // Disabled?
     const disabled = state > 0;
@@ -77,5 +78,5 @@ export const CountdownButton = React.forwardRef((props, ref) => {
             isMounted.current = false;
         };
     }, []);
-    return (React.createElement(Button, { disabled: disabled, endIcon: endIcon, onClick: localClick, ref: ref, ...rest }));
+    return (_jsx(Button, { disabled: disabled, endIcon: endIcon, onClick: localClick, ref: ref, ...rest }));
 });

package/lib/CountryList.d.ts

@@ -1,6 +1,5 @@
 import { AddressRegionDb, RegionsRQ } from '@etsoo/appscript';
 import { DataTypes } from '@etsoo/shared';
-import React from 'react';
 import { TiplistProps } from './Tiplist';
 /**
  * Country list props
@@ -27,4 +26,4 @@ export type CountryListProps = Omit<DataTypes.Optional<TiplistProps<AddressRegio
  * @param props Props
  * @returns Component
  */
-export declare function CountryList(props: CountryListProps): React.JSX.Element;
+export declare function CountryList(props: CountryListProps): import("react/jsx-runtime").JSX.Element;

package/lib/CountryList.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { Tiplist } from './Tiplist';
 /**
@@ -18,5 +19,5 @@ export function CountryList(props) {
             });
     }, [loadFavoredIds]);
     // Layout
-    return (React.createElement(Tiplist, { name: name, loadData: (keyword, id) => loadData({ id, keyword, favoredIds: favoredIds.current, items }), ...rest }));
+    return (_jsx(Tiplist, { name: name, loadData: (keyword, id) => loadData({ id, keyword, favoredIds: favoredIds.current, items }), ...rest }));
 }

package/lib/CultureDataTable.d.ts

@@ -1,5 +1,4 @@
 import { DataTableProps } from "./DataTable";
-import React from "react";
 import { ListType1 } from "@etsoo/shared";
 /**
  * Culture table props
@@ -17,4 +16,4 @@ export type CultureDataTableProps = Omit<DataTableProps, "columns"> & {
  * @param props Props
  * @returns Component
  */
-export declare function CultureDataTable(props: CultureDataTableProps): React.JSX.Element;
+export declare function CultureDataTable(props: CultureDataTableProps): import("react/jsx-runtime").JSX.Element;

package/lib/CultureDataTable.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DataTable } from "./DataTable";
 import React from "react";
 import { globalApp } from "./app/ReactApp";
@@ -10,7 +11,7 @@ export function CultureDataTable(props) {
     // Destruct
     const { cultures, cultureLabel = globalApp?.get("culture"), editable = true, titleLabel, hasDescription = false, descriptionLabel = globalApp?.get("description"), ...rest } = props;
     const getCultureLabel = React.useCallback((value) => cultures.find((c) => c.id == value.id)?.label ?? `${value.value}`, [cultures]);
-    return (React.createElement(DataTable, { columns: [
+    return (_jsx(DataTable, { columns: [
             {
                 field: "id",
                 headerName: cultureLabel,

package/lib/DataGridEx.d.ts

@@ -98,4 +98,4 @@ export declare function DataGridExCalColumns<T>(columns: GridColumn<T>[]): {
  * @param props Props
  * @returns Component
  */
-export declare function DataGridEx<T extends object>(props: DataGridExProps<T>): React.JSX.Element;
+export declare function DataGridEx<T extends object>(props: DataGridExProps<T>): import("react/jsx-runtime").JSX.Element;