@iobroker/gui-components 8.0.1

package/build/Dialogs/SelectID.js

@@ -0,0 +1,151 @@
+/**
+ * Copyright 2018-2025 Denis Haev (bluefox) <dogafox@gmail.com>
+ *
+ * MIT License
+ *
+ */
+import React, { Component } from 'react';
+import { Button, DialogTitle, DialogContent, DialogActions, Dialog } from '@mui/material';
+import { Cancel as IconCancel, Check as IconOk } from '@mui/icons-material';
+import { I18n } from '../i18n';
+import { ObjectBrowser, } from '../Components/ObjectBrowser';
+export class DialogSelectID extends Component {
+    dialogName;
+    filters;
+    filterFunc;
+    constructor(props) {
+        super(props);
+        this.dialogName = this.props.dialogName || 'default';
+        this.dialogName = `SelectID.${this.dialogName}`;
+        const filters = (window._localStorage || window.localStorage).getItem(this.dialogName) || '{}';
+        try {
+            this.filters = JSON.parse(filters);
+        }
+        catch {
+            this.filters = {};
+        }
+        if (props.filters) {
+            this.filters = { ...this.filters, ...(props.filters || {}) };
+        }
+        let selected = this.props.selected || [];
+        if (!Array.isArray(selected)) {
+            selected = [selected];
+        }
+        selected = selected.filter(id => id);
+        if (props.filterFunc) {
+            if (typeof props.filterFunc === 'string') {
+                try {
+                    this.filterFunc = new Function('obj', props.filterFunc);
+                }
+                catch {
+                    console.error(`Cannot parse filter function: "obj => ${props.filterFunc}"`);
+                    this.filterFunc = undefined;
+                }
+            }
+            else {
+                this.filterFunc = props.filterFunc;
+            }
+        }
+        this.state = {
+            selected,
+            name: '',
+            selectionBlocked: false,
+        };
+    }
+    handleCancel() {
+        this.props.onClose();
+    }
+    handleOk() {
+        this.props.onOk(this.props.multiSelect ? this.state.selected : this.state.selected[0] || '', this.state.name);
+        this.props.onClose();
+    }
+    render() {
+        let title;
+        if (this.state.name || this.state.selected.length) {
+            if (this.state.selected.length === 1) {
+                title = [
+                    React.createElement("span", { key: "selected" },
+                        I18n.t('ra_Selected'),
+                        "\u00A0"),
+                    React.createElement("span", { key: "id", style: { fontWeight: 'bold', fontStyle: 'italic' } }, (this.state.name || this.state.selected[0]) +
+                        (this.state.name ? ` [${this.state.selected[0]}]` : '')),
+                ];
+            }
+            else {
+                title = [
+                    React.createElement("span", { key: "selected" },
+                        I18n.t('ra_Selected'),
+                        "\u00A0"),
+                    React.createElement("span", { key: "id", style: { fontWeight: 'bold', fontStyle: 'italic' } }, I18n.t('%s items', this.state.selected.length.toString())),
+                ];
+            }
+        }
+        else {
+            title = this.props.title || I18n.t('ra_Please select object ID...');
+        }
+        return (React.createElement(Dialog, { onClose: () => { }, maxWidth: false, style: { zIndex: this.props.zIndex || undefined }, sx: {
+                '& .MuiDialog-paper': {
+                    height: '95%',
+                    p: '4px',
+                    width: '100%',
+                    maxWidth: '100%',
+                    maxHeight: 'calc(100% - 16px)',
+                },
+            }, fullWidth: true, open: !0, "aria-labelledby": "ar_dialog_selectid_title" },
+            React.createElement(DialogTitle, { id: "ar_dialog_selectid_title", style: {
+                    whiteSpace: 'nowrap',
+                    width: 'calc(100% - 72px)',
+                    overflow: 'hidden',
+                    display: 'inline-block',
+                    textOverflow: 'ellipsis',
+                } }, title),
+            React.createElement(DialogContent, { style: {
+                    height: '100%',
+                    overflow: 'hidden',
+                    padding: '8px 4px',
+                } },
+                React.createElement(ObjectBrowser, { foldersFirst: this.props.foldersFirst, imagePrefix: this.props.imagePrefix || this.props.prefix, dateFormat: this.props.dateFormat, defaultFilters: this.filters, dialogName: this.dialogName, isFloatComma: this.props.isFloatComma, showExpertButton: this.props.showExpertButton !== undefined ? this.props.showExpertButton : true, expertMode: this.props.expertMode, 
+                    // style={{ width: '100%', height: '100%' }}
+                    columns: this.props.columns || ['name', 'type', 'role', 'room', 'func', 'val'], types: this.props.types
+                        ? Array.isArray(this.props.types)
+                            ? this.props.types
+                            : [this.props.types]
+                        : ['state'], root: this.props.root, t: I18n.t, lang: this.props.lang || I18n.getLanguage(), socket: this.props.socket, selected: this.state.selected, multiSelect: this.props.multiSelect, notEditable: this.props.notEditable === undefined ? true : this.props.notEditable, 
+                    // name={this.state.name}
+                    themeName: this.props.themeName, themeType: this.props.themeType, theme: this.props.theme, customFilter: this.props.customFilter, allowNonObjects: this.props.allowNonObjects, onFilterChanged: (filterConfig) => {
+                        this.filters = filterConfig;
+                        (window._localStorage || window.localStorage).setItem(this.dialogName, JSON.stringify(filterConfig));
+                    }, onSelect: async (_selected, name, isDouble) => {
+                        let selected;
+                        if (!Array.isArray(_selected)) {
+                            selected = [_selected];
+                        }
+                        else {
+                            selected = _selected;
+                        }
+                        if (JSON.stringify(selected) !== JSON.stringify(this.state.selected)) {
+                            let selectionAllowed = true;
+                            if (this.props.onSelectConfirm) {
+                                const objects = {};
+                                for (const id of selected) {
+                                    try {
+                                        objects[id] = await this.props.socket.getObject(id);
+                                    }
+                                    catch {
+                                        // ignore
+                                    }
+                                }
+                                selectionAllowed = await this.props.onSelectConfirm(selected, objects);
+                            }
+                            this.setState({ selected, name, selectionBlocked: !selectionAllowed }, () => isDouble && this.handleOk());
+                        }
+                        else if (isDouble) {
+                            this.handleOk();
+                        }
+                    }, filterFunc: this.filterFunc, title: "", onAllLoaded: () => this.setState({ allLoaded: true }) })),
+            React.createElement(DialogActions, null,
+                React.createElement(Button, { id: `ar_dialog_selectid_ok_${this.props.dialogName || ''}`, variant: "contained", onClick: () => this.handleOk(), startIcon: React.createElement(IconOk, null), disabled: !this.state.allLoaded || !this.state.selected.length || this.state.selectionBlocked, color: "primary" }, this.props.ok || I18n.t('ra_Ok')),
+                React.createElement(Button, { id: `ar_dialog_selectid_cancel_${this.props.dialogName || ''}`, color: "grey", variant: "contained", onClick: () => this.handleCancel(), startIcon: React.createElement(IconCancel, null) }, this.props.cancel || I18n.t('ra_Cancel')))));
+    }
+}
+//# sourceMappingURL=SelectID.js.map

package/build/Dialogs/SelectID.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectID.js","sourceRoot":"./src/","sources":["Dialogs/SelectID.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright 2018-2025 Denis Haev (bluefox) <dogafox@gmail.com>\n *\n * MIT License\n *\n */\nimport React, { Component, type JSX } from 'react';\n\nimport { Button, DialogTitle, DialogContent, DialogActions, Dialog } from '@mui/material';\n\nimport { Cancel as IconCancel, Check as IconOk } from '@mui/icons-material';\n\nimport type { Connection } from '../Connection';\n\nimport { I18n } from '../i18n';\nimport {\n    ObjectBrowser,\n    type ObjectBrowserFilter,\n    type ObjectBrowserColumn,\n    type ObjectBrowserCustomFilter,\n} from '../Components/ObjectBrowser';\nimport type { IobTheme } from '../types';\n\nexport interface SelectIDFilters {\n    id?: string;\n    name?: string;\n    room?: string[];\n    func?: string[];\n    role?: string[];\n    type?: string[];\n    custom?: string[];\n}\n\ninterface DialogSelectIDProps {\n    /** The internal name of the dialog; default: \"default\". Used to store settings in local storage */\n    dialogName?: string;\n    /** The dialog title; default: Please select object ID... (translated) */\n    title?: string;\n    /** Set to true to allow the selection of multiple IDs. */\n    multiSelect?: boolean;\n    /** Show folders before any leaves. */\n    foldersFirst?: boolean;\n    /** Path prefix for images (default: '.') */\n    imagePrefix?: string;\n    /** @deprecated same as imagePrefix */\n    prefix?: string;\n    /** Show the expert button */\n    showExpertButton?: boolean;\n    /** Force expert mode */\n    expertMode?: boolean;\n    /** optional ['name', 'type', 'role', 'room', 'func', 'val', 'buttons'] */\n    columns?: ObjectBrowserColumn[];\n    /**  Object types to show; default: 'state' only */\n    types?: ioBroker.ObjectType | ioBroker.ObjectType[];\n    /** The language. */\n    lang?: ioBroker.Languages;\n    /** The socket connection. */\n    socket: Connection;\n    /** Can't objects be edited? (default: true) */\n    notEditable?: boolean;\n    /** Theme name. */\n    themeName?: string;\n    /** Theme type: dark or light */\n    themeType?: string;\n    /** The theme object */\n    theme: IobTheme;\n    /** The date format for the date columns */\n    dateFormat?: string;\n    /** Is use comma or point for displaying of float numbers */\n    isFloatComma?: boolean;\n    /** Custom filter. */\n    customFilter?: ObjectBrowserCustomFilter;\n    /** The selected IDs. */\n    selected?: string | string[];\n    /** The ok button text; default: OK (translated) */\n    ok?: string;\n    /** The cancel button text; default: Cancel (translated) */\n    cancel?: string;\n    /** Close handler that is always called when the dialog is closed. */\n    onClose: () => void;\n    /** Handler that is called when the user presses OK. */\n    onOk: (selected: string | string[] | undefined, name: string | null) => void;\n    /**\n     * Function to filter out all unnecessary objects. Can be string or function.\n     * It cannot be used together with \"types\".\n     * Example for function: `obj => obj.common?.type === 'boolean'` to show only boolean states\n     * In case of string, it must look like `obj.common && obj.common.type === 'boolean'`\n     */\n    filterFunc?: string | ((obj: ioBroker.Object) => boolean);\n    /** predefined filter fields, like {\"id\":\"\",\"name\":\"\",\"room\":\"\",\"func\":\"\",\"role\":\"level\",\"type\":\"\",\"custom\":\"\"} */\n    filters?: SelectIDFilters;\n    /** Show elements only of this root ID */\n    root?: string;\n    /** Allow selection of non-objects (virtual branches) */\n    allowNonObjects?: boolean;\n    /** Will be called by selection, so the decision could be done if the OK button is available or not */\n    onSelectConfirm?: (\n        selected: string | string[],\n        objects: Record<string, ioBroker.Object | null | undefined>,\n    ) => Promise<boolean>;\n    /** The z-index of the dialog; default: 1300 */\n    zIndex?: number;\n}\n\ninterface DialogSelectIDState {\n    selected: string[];\n    name: string | null;\n    selectionBlocked: boolean;\n    allLoaded?: boolean; // used to detect if all objects are loaded\n}\n\nexport class DialogSelectID extends Component<DialogSelectIDProps, DialogSelectIDState> {\n    private readonly dialogName: string;\n\n    private filters: ObjectBrowserFilter;\n\n    private readonly filterFunc?: (obj: ioBroker.Object) => boolean;\n\n    constructor(props: DialogSelectIDProps) {\n        super(props);\n        this.dialogName = this.props.dialogName || 'default';\n        this.dialogName = `SelectID.${this.dialogName}`;\n\n        const filters: string = ((window as any)._localStorage || window.localStorage).getItem(this.dialogName) || '{}';\n\n        try {\n            this.filters = JSON.parse(filters);\n        } catch {\n            this.filters = {};\n        }\n\n        if (props.filters) {\n            this.filters = { ...this.filters, ...(props.filters || {}) };\n        }\n\n        let selected = this.props.selected || [];\n        if (!Array.isArray(selected)) {\n            selected = [selected];\n        }\n        selected = selected.filter(id => id);\n\n        if (props.filterFunc) {\n            if (typeof props.filterFunc === 'string') {\n                try {\n                    this.filterFunc = new Function('obj', props.filterFunc) as (obj: ioBroker.Object) => boolean;\n                } catch {\n                    console.error(`Cannot parse filter function: \"obj => ${props.filterFunc}\"`);\n                    this.filterFunc = undefined;\n                }\n            } else {\n                this.filterFunc = props.filterFunc;\n            }\n        }\n\n        this.state = {\n            selected,\n            name: '',\n            selectionBlocked: false,\n        };\n    }\n\n    handleCancel(): void {\n        this.props.onClose();\n    }\n\n    handleOk(): void {\n        this.props.onOk(this.props.multiSelect ? this.state.selected : this.state.selected[0] || '', this.state.name);\n        this.props.onClose();\n    }\n\n    render(): JSX.Element {\n        let title;\n        if (this.state.name || this.state.selected.length) {\n            if (this.state.selected.length === 1) {\n                title = [\n                    <span key=\"selected\">\n                        {I18n.t('ra_Selected')}\n                        &nbsp;\n                    </span>,\n                    <span\n                        key=\"id\"\n                        style={{ fontWeight: 'bold', fontStyle: 'italic' }}\n                    >\n                        {(this.state.name || this.state.selected[0]) +\n                            (this.state.name ? ` [${this.state.selected[0]}]` : '')}\n                    </span>,\n                ];\n            } else {\n                title = [\n                    <span key=\"selected\">\n                        {I18n.t('ra_Selected')}\n                        &nbsp;\n                    </span>,\n                    <span\n                        key=\"id\"\n                        style={{ fontWeight: 'bold', fontStyle: 'italic' }}\n                    >\n                        {I18n.t('%s items', this.state.selected.length.toString())}\n                    </span>,\n                ];\n            }\n        } else {\n            title = this.props.title || I18n.t('ra_Please select object ID...');\n        }\n\n        return (\n            <Dialog\n                onClose={() => {}}\n                maxWidth={false}\n                style={{ zIndex: this.props.zIndex || undefined }}\n                sx={{\n                    '& .MuiDialog-paper': {\n                        height: '95%',\n                        p: '4px',\n                        width: '100%',\n                        maxWidth: '100%',\n                        maxHeight: 'calc(100% - 16px)',\n                    },\n                }}\n                fullWidth\n                open={!0}\n                aria-labelledby=\"ar_dialog_selectid_title\"\n            >\n                <DialogTitle\n                    id=\"ar_dialog_selectid_title\"\n                    style={{\n                        whiteSpace: 'nowrap',\n                        width: 'calc(100% - 72px)',\n                        overflow: 'hidden',\n                        display: 'inline-block',\n                        textOverflow: 'ellipsis',\n                    }}\n                >\n                    {title}\n                </DialogTitle>\n                <DialogContent\n                    style={{\n                        height: '100%',\n                        overflow: 'hidden',\n                        padding: '8px 4px',\n                    }}\n                >\n                    <ObjectBrowser\n                        foldersFirst={this.props.foldersFirst}\n                        imagePrefix={this.props.imagePrefix || this.props.prefix} // prefix is for back compatibility\n                        dateFormat={this.props.dateFormat}\n                        defaultFilters={this.filters}\n                        dialogName={this.dialogName}\n                        isFloatComma={this.props.isFloatComma}\n                        showExpertButton={\n                            this.props.showExpertButton !== undefined ? this.props.showExpertButton : true\n                        }\n                        expertMode={this.props.expertMode}\n                        // style={{ width: '100%', height: '100%' }}\n                        columns={this.props.columns || ['name', 'type', 'role', 'room', 'func', 'val']}\n                        types={\n                            this.props.types\n                                ? Array.isArray(this.props.types)\n                                    ? this.props.types\n                                    : [this.props.types]\n                                : ['state']\n                        }\n                        root={this.props.root}\n                        t={I18n.t}\n                        lang={this.props.lang || I18n.getLanguage()}\n                        socket={this.props.socket}\n                        selected={this.state.selected}\n                        multiSelect={this.props.multiSelect}\n                        notEditable={this.props.notEditable === undefined ? true : this.props.notEditable}\n                        // name={this.state.name}\n                        themeName={this.props.themeName}\n                        themeType={this.props.themeType}\n                        theme={this.props.theme}\n                        customFilter={this.props.customFilter}\n                        allowNonObjects={this.props.allowNonObjects}\n                        onFilterChanged={(filterConfig: ObjectBrowserFilter) => {\n                            this.filters = filterConfig;\n                            ((window as any)._localStorage || window.localStorage).setItem(\n                                this.dialogName,\n                                JSON.stringify(filterConfig),\n                            );\n                        }}\n                        onSelect={async (\n                            _selected: string | string[],\n                            name: string | null,\n                            isDouble?: boolean,\n                        ): Promise<void> => {\n                            let selected: string[];\n                            if (!Array.isArray(_selected)) {\n                                selected = [_selected];\n                            } else {\n                                selected = _selected;\n                            }\n\n                            if (JSON.stringify(selected) !== JSON.stringify(this.state.selected)) {\n                                let selectionAllowed = true;\n                                if (this.props.onSelectConfirm) {\n                                    const objects: Record<string, ioBroker.Object | null | undefined> = {};\n                                    for (const id of selected) {\n                                        try {\n                                            objects[id] = await this.props.socket.getObject(id);\n                                        } catch {\n                                            // ignore\n                                        }\n                                    }\n\n                                    selectionAllowed = await this.props.onSelectConfirm(selected, objects);\n                                }\n\n                                this.setState(\n                                    { selected, name, selectionBlocked: !selectionAllowed },\n                                    () => isDouble && this.handleOk(),\n                                );\n                            } else if (isDouble) {\n                                this.handleOk();\n                            }\n                        }}\n                        filterFunc={this.filterFunc}\n                        title=\"\"\n                        onAllLoaded={() => this.setState({ allLoaded: true })}\n                    />\n                </DialogContent>\n                <DialogActions>\n                    <Button\n                        id={`ar_dialog_selectid_ok_${this.props.dialogName || ''}`}\n                        variant=\"contained\"\n                        onClick={() => this.handleOk()}\n                        startIcon={<IconOk />}\n                        disabled={!this.state.allLoaded || !this.state.selected.length || this.state.selectionBlocked}\n                        color=\"primary\"\n                    >\n                        {this.props.ok || I18n.t('ra_Ok')}\n                    </Button>\n                    <Button\n                        id={`ar_dialog_selectid_cancel_${this.props.dialogName || ''}`}\n                        color=\"grey\"\n                        variant=\"contained\"\n                        onClick={() => this.handleCancel()}\n                        startIcon={<IconCancel />}\n                    >\n                        {this.props.cancel || I18n.t('ra_Cancel')}\n                    </Button>\n                </DialogActions>\n            </Dialog>\n        );\n    }\n}\n"]}

package/build/Dialogs/SimpleCron.d.ts

@@ -0,0 +1,19 @@
+import React, { type JSX } from 'react';
+interface DialogCronProps {
+    onClose: () => void;
+    onOk: (cron: string) => void;
+    title?: string;
+    cron?: string;
+    cancel?: string;
+    ok?: string;
+}
+interface DialogCronState {
+    cron: string;
+}
+export declare class DialogSimpleCron extends React.Component<DialogCronProps, DialogCronState> {
+    constructor(props: DialogCronProps);
+    handleCancel(): void;
+    handleOk(): void;
+    render(): JSX.Element;
+}
+export {};

package/build/Dialogs/SimpleCron.js

@@ -0,0 +1,46 @@
+import React from 'react';
+import { Button, DialogTitle, DialogContent, DialogActions, Dialog } from '@mui/material';
+import { Check as IconOk, Cancel as IconCancel } from '@mui/icons-material';
+import { SimpleCron } from '../Components/SimpleCron';
+import { I18n } from '../i18n';
+// Generates cron expression
+const styles = {
+    dialogPaper: {
+        height: 'calc(100% - 96px)',
+    },
+};
+export class DialogSimpleCron extends React.Component {
+    constructor(props) {
+        super(props);
+        let cron;
+        if (this.props.cron && typeof this.props.cron === 'string' && this.props.cron.replace(/^["']/, '')[0] !== '{') {
+            cron = this.props.cron.replace(/['"]/g, '').trim();
+        }
+        else {
+            cron = this.props.cron || '{}';
+            if (typeof cron === 'string') {
+                cron = cron.replace(/^["']/, '').replace(/["']\n?$/, '');
+            }
+        }
+        this.state = {
+            cron,
+        };
+    }
+    handleCancel() {
+        this.props.onClose();
+    }
+    handleOk() {
+        this.props.onOk(this.state.cron);
+        this.props.onClose();
+    }
+    render() {
+        return (React.createElement(Dialog, { onClose: () => { }, maxWidth: "md", fullWidth: true, sx: { '& .MuiDialog-paper': styles.dialogPaper }, open: !0, "aria-labelledby": "cron-dialog-title" },
+            React.createElement(DialogTitle, { id: "cron-dialog-title" }, this.props.title || I18n.t('ra_Define CRON...')),
+            React.createElement(DialogContent, { style: { height: '100%', overflow: 'hidden' } },
+                React.createElement(SimpleCron, { cronExpression: this.state.cron, onChange: (cron) => this.setState({ cron }), language: I18n.getLanguage() })),
+            React.createElement(DialogActions, null,
+                React.createElement(Button, { variant: "contained", disabled: !this.state.cron || this.state.cron.includes('_'), onClick: () => this.handleOk(), color: "primary", startIcon: React.createElement(IconOk, null) }, this.props.ok || I18n.t('ra_Ok')),
+                React.createElement(Button, { variant: "contained", onClick: () => this.handleCancel(), color: "grey", startIcon: React.createElement(IconCancel, null) }, this.props.cancel || I18n.t('ra_Cancel')))));
+    }
+}
+//# sourceMappingURL=SimpleCron.js.map

package/build/Dialogs/SimpleCron.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleCron.js","sourceRoot":"./src/","sources":["Dialogs/SimpleCron.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type JSX } from 'react';\r\nimport { Button, DialogTitle, DialogContent, DialogActions, Dialog } from '@mui/material';\r\n\r\nimport { Check as IconOk, Cancel as IconCancel } from '@mui/icons-material';\r\n\r\nimport { SimpleCron } from '../Components/SimpleCron';\r\n\r\nimport { I18n } from '../i18n';\r\n\r\n// Generates cron expression\r\n\r\nconst styles: Record<string, React.CSSProperties> = {\r\n    dialogPaper: {\r\n        height: 'calc(100% - 96px)',\r\n    },\r\n};\r\n\r\ninterface DialogCronProps {\r\n    onClose: () => void;\r\n    onOk: (cron: string) => void;\r\n    title?: string;\r\n    cron?: string;\r\n    cancel?: string;\r\n    ok?: string;\r\n}\r\n\r\ninterface DialogCronState {\r\n    cron: string;\r\n}\r\n\r\nexport class DialogSimpleCron extends React.Component<DialogCronProps, DialogCronState> {\r\n    constructor(props: DialogCronProps) {\r\n        super(props);\r\n\r\n        let cron;\r\n        if (this.props.cron && typeof this.props.cron === 'string' && this.props.cron.replace(/^[\"']/, '')[0] !== '{') {\r\n            cron = this.props.cron.replace(/['\"]/g, '').trim();\r\n        } else {\r\n            cron = this.props.cron || '{}';\r\n            if (typeof cron === 'string') {\r\n                cron = cron.replace(/^[\"']/, '').replace(/[\"']\\n?$/, '');\r\n            }\r\n        }\r\n\r\n        this.state = {\r\n            cron,\r\n        };\r\n    }\r\n\r\n    handleCancel(): void {\r\n        this.props.onClose();\r\n    }\r\n\r\n    handleOk(): void {\r\n        this.props.onOk(this.state.cron);\r\n        this.props.onClose();\r\n    }\r\n\r\n    render(): JSX.Element {\r\n        return (\r\n            <Dialog\r\n                onClose={() => {}}\r\n                maxWidth=\"md\"\r\n                fullWidth\r\n                sx={{ '& .MuiDialog-paper': styles.dialogPaper }}\r\n                open={!0}\r\n                aria-labelledby=\"cron-dialog-title\"\r\n            >\r\n                <DialogTitle id=\"cron-dialog-title\">{this.props.title || I18n.t('ra_Define CRON...')}</DialogTitle>\r\n                <DialogContent style={{ height: '100%', overflow: 'hidden' }}>\r\n                    <SimpleCron\r\n                        cronExpression={this.state.cron}\r\n                        onChange={(cron: string) => this.setState({ cron })}\r\n                        language={I18n.getLanguage()}\r\n                    />\r\n                </DialogContent>\r\n                <DialogActions>\r\n                    <Button\r\n                        variant=\"contained\"\r\n                        disabled={!this.state.cron || this.state.cron.includes('_')}\r\n                        onClick={() => this.handleOk()}\r\n                        color=\"primary\"\r\n                        startIcon={<IconOk />}\r\n                    >\r\n                        {this.props.ok || I18n.t('ra_Ok')}\r\n                    </Button>\r\n                    <Button\r\n                        variant=\"contained\"\r\n                        onClick={() => this.handleCancel()}\r\n                        color=\"grey\"\r\n                        startIcon={<IconCancel />}\r\n                    >\r\n                        {this.props.cancel || I18n.t('ra_Cancel')}\r\n                    </Button>\r\n                </DialogActions>\r\n            </Dialog>\r\n        );\r\n    }\r\n}\r\n"]}

package/build/Dialogs/TextInput.d.ts

@@ -0,0 +1,2 @@
+import { type JSX } from 'react';
+export declare const DialogTextInput: (props: Record<string, any>) => JSX.Element;

package/build/Dialogs/TextInput.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { Button, TextField, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material';
+import { Close as IconClose, Check as IconCheck } from '@mui/icons-material';
+import { I18n } from '../i18n';
+import { withWidth } from '../Components/withWidth';
+function TextInputFunc(props) {
+    const [text, setText] = React.useState(props.input || props.value || '');
+    const [error, setError] = React.useState('');
+    return (React.createElement(Dialog, { open: !0, onClose: () => props.onClose(null), "aria-labelledby": "form-dialog-title", fullWidth: props.fullWidth !== undefined ? props.fullWidth : false },
+        React.createElement(DialogTitle, { id: "form-dialog-title" }, props.titleText),
+        React.createElement(DialogContent, null,
+            React.createElement(DialogContentText, null, props.promptText),
+            React.createElement(TextField, { variant: "standard", autoFocus: true, margin: "dense", error: !!error, helperText: error === true || !error ? '' : error, value: text, label: props.labelText || '', type: props.type || 'text', onKeyUp: e => e.code === 'Enter' && text && props.onClose(text), onChange: e => {
+                    let _error = '';
+                    if (props.verify) {
+                        _error = !props.verify(e.target.value);
+                    }
+                    if (props.rule) {
+                        setText(props.rule(e.target.value));
+                    }
+                    else {
+                        setText(e.target.value);
+                    }
+                    setError(_error);
+                }, fullWidth: true })),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { variant: "contained", disabled: !text || !!error, onClick: () => props.onClose(text), color: "primary", startIcon: React.createElement(IconCheck, null) }, props.applyText || I18n.t('ra_Ok')),
+            React.createElement(Button, { color: "grey", variant: "contained", onClick: () => props.onClose(null), startIcon: React.createElement(IconClose, null) }, props.cancelText || I18n.t('ra_Cancel')))));
+}
+export const DialogTextInput = withWidth()(TextInputFunc);
+//# sourceMappingURL=TextInput.js.map

package/build/Dialogs/TextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput.js","sourceRoot":"./src/","sources":["Dialogs/TextInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type JSX } from 'react';\r\n\r\nimport { Button, TextField, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material';\r\n\r\nimport { Close as IconClose, Check as IconCheck } from '@mui/icons-material';\r\n\r\nimport { I18n } from '../i18n';\r\nimport { withWidth } from '../Components/withWidth';\r\n\r\ninterface TextInputProps {\r\n    /** The dialog close callback */\r\n    onClose: (text: string | null) => void;\r\n    /** The title text */\r\n    titleText: string;\r\n    /** Prompt text (default: empty) */\r\n    promptText?: string;\r\n    /** Label text (default: empty) */\r\n    labelText?: string;\r\n    /** The text of the cancel button */\r\n    cancelText: string;\r\n    /** The text of the \"apply\" button */\r\n    applyText: string;\r\n    /** The verification callback. Return a non-empty string if there was an error */\r\n    verify?: (text: string) => string;\r\n    /** The text replacement callback */\r\n    rule?: (text: string) => string;\r\n    /** The type of the textbox (default: text) */\r\n    type?: 'text' | 'number' | 'password' | 'email';\r\n    /** The initial input value when opening the dialog */\r\n    value?: string;\r\n    /** @deprecated Use value. The input when opening the dialog */\r\n    input?: string;\r\n    /** If true, the dialog will be full width */\r\n    fullWidth?: boolean;\r\n}\r\n\r\nfunction TextInputFunc(props: TextInputProps): JSX.Element {\r\n    const [text, setText] = React.useState<string>(props.input || props.value || '');\r\n    const [error, setError] = React.useState<string | boolean>('');\r\n    return (\r\n        <Dialog\r\n            open={!0}\r\n            onClose={() => props.onClose(null)}\r\n            aria-labelledby=\"form-dialog-title\"\r\n            fullWidth={props.fullWidth !== undefined ? props.fullWidth : false}\r\n        >\r\n            <DialogTitle id=\"form-dialog-title\">{props.titleText}</DialogTitle>\r\n            <DialogContent>\r\n                <DialogContentText>{props.promptText}</DialogContentText>\r\n                <TextField\r\n                    variant=\"standard\"\r\n                    autoFocus\r\n                    margin=\"dense\"\r\n                    error={!!error}\r\n                    helperText={error === true || !error ? '' : error}\r\n                    value={text}\r\n                    label={props.labelText || ''}\r\n                    type={props.type || 'text'}\r\n                    onKeyUp={e => e.code === 'Enter' && text && props.onClose(text)}\r\n                    onChange={e => {\r\n                        let _error: string | boolean = '';\r\n                        if (props.verify) {\r\n                            _error = !props.verify(e.target.value);\r\n                        }\r\n\r\n                        if (props.rule) {\r\n                            setText(props.rule(e.target.value));\r\n                        } else {\r\n                            setText(e.target.value);\r\n                        }\r\n                        setError(_error);\r\n                    }}\r\n                    fullWidth\r\n                />\r\n            </DialogContent>\r\n            <DialogActions>\r\n                <Button\r\n                    variant=\"contained\"\r\n                    disabled={!text || !!error}\r\n                    onClick={() => props.onClose(text)}\r\n                    color=\"primary\"\r\n                    startIcon={<IconCheck />}\r\n                >\r\n                    {props.applyText || I18n.t('ra_Ok')}\r\n                </Button>\r\n                <Button\r\n                    color=\"grey\"\r\n                    variant=\"contained\"\r\n                    onClick={() => props.onClose(null)}\r\n                    startIcon={<IconClose />}\r\n                >\r\n                    {props.cancelText || I18n.t('ra_Cancel')}\r\n                </Button>\r\n            </DialogActions>\r\n        </Dialog>\r\n    );\r\n}\r\n\r\nexport const DialogTextInput = withWidth()(TextInputFunc);\r\n"]}

package/build/GenericApp.d.ts

@@ -0,0 +1,209 @@
+/**
+ * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
+ *
+ * MIT License
+ *
+ */
+import React, { type JSX } from 'react';
+import { type AdminConnection } from '@iobroker/socket-client';
+import { Router } from './Components/Router';
+import type { GenericAppProps, GenericAppState, GenericAppSettings, ThemeName, ThemeType, IobTheme, Width } from './types';
+declare global {
+    /** If config has been changed */
+    var changed: boolean;
+    interface Window {
+        io: any;
+        SocketClient: any;
+        adapterName: undefined | string;
+        socketUrl: undefined | string;
+        iobOldAlert: any;
+        changed: boolean;
+        $iframeDialog: {
+            close?: () => void;
+        };
+    }
+}
+export declare class GenericApp<TProps extends GenericAppProps = GenericAppProps, TState extends GenericAppState = GenericAppState> extends Router<TProps, TState> {
+    protected socket: AdminConnection;
+    protected isIFrame: boolean;
+    protected readonly instance: number;
+    protected readonly adapterName: string;
+    protected readonly instanceId: string;
+    protected readonly newReact: boolean;
+    protected encryptedFields: string[];
+    protected readonly sentryDSN: string | undefined;
+    private alertDialogRendered;
+    private _secret;
+    protected _systemConfig: ioBroker.SystemConfigCommon | undefined;
+    private savedNative;
+    protected common: ioBroker.InstanceCommon | null;
+    private sentryStarted;
+    private sentryInited;
+    private resizeTimer;
+    constructor(props: TProps, settings?: GenericAppSettings);
+    /**
+     * Checks if this connection is running in a web adapter and not in an admin.
+     *
+     * @returns True if running in a web adapter or in a socketio adapter.
+     */
+    static isWeb(): boolean;
+    showAlert(message: string, type?: 'info' | 'warning' | 'error' | 'success'): void;
+    renderAlertSnackbar(): JSX.Element;
+    onSystemConfigChanged: (id: string, obj: ioBroker.AnyObject | null | undefined) => void;
+    /**
+     * Called immediately after a component is mounted. Setting state here will trigger re-rendering.
+     */
+    componentDidMount(): void;
+    /**
+     * Called immediately before a component is destroyed.
+     */
+    componentWillUnmount(): void;
+    onReceiveMessage: (message: {
+        data: string;
+    } | null) => void;
+    private onResize;
+    /**
+     * Gets the width depending on the window inner width.
+     */
+    static getWidth(): Width;
+    /**
+     * Get a theme
+     *
+     * @param name Theme name
+     */
+    createTheme(name?: ThemeName | null): IobTheme;
+    /**
+     * Get the theme name
+     */
+    getThemeName(currentTheme: IobTheme): ThemeName;
+    /**
+     * Get the theme type
+     */
+    getThemeType(currentTheme: IobTheme): ThemeType;
+    onThemeChanged(_newThemeName: string): void;
+    onToggleExpertMode(_expertMode: boolean): void;
+    /**
+     * Changes the current theme
+     */
+    toggleTheme(newThemeName?: ThemeName): void;
+    /**
+     * Gets the system configuration.
+     */
+    getSystemConfig(): Promise<ioBroker.SystemConfigObject>;
+    /**
+     * Get current expert mode
+     */
+    getExpertMode(): boolean;
+    /**
+     * Gets called when the socket.io connection is ready.
+     * You can overload this function to execute own commands.
+     */
+    onConnectionReady(): void;
+    /**
+     * Encrypts a string.
+     */
+    encrypt(value: string): string;
+    /**
+     * Decrypts a string.
+     */
+    decrypt(value: string): string;
+    /**
+     * Gets called when the navigation hash changes.
+     * You may override this if needed.
+     */
+    onHashChanged(): void;
+    /**
+     * Selects the given tab.
+     */
+    selectTab(tab: string, index?: number): void;
+    /**
+     * Gets called before the settings are saved.
+     * You may override this if needed.
+     */
+    onPrepareSave(settings: Record<string, any>): boolean;
+    /**
+     * Gets called after the settings are loaded.
+     * You may override this if needed.
+     *
+     * @param settings instance settings from native part
+     * @param encryptedNative optional list of fields to be decrypted
+     */
+    onPrepareLoad(settings: Record<string, any>, encryptedNative?: string[]): void;
+    /**
+     * Gets the extendable instances.
+     */
+    getExtendableInstances(): Promise<ioBroker.InstanceObject[]>;
+    /**
+     * Gets the IP addresses of the given host.
+     */
+    getIpAddresses(host: string): Promise<{
+        name: string;
+        address: string;
+        family: 'ipv4' | 'ipv6';
+    }[]>;
+    /**
+     * Saves the settings to the server.
+     *
+     * @param isClose True if the user is closing the dialog.
+     */
+    onSave(isClose?: boolean): void;
+    /**
+     * Renders the toast.
+     */
+    renderToast(): JSX.Element | null;
+    /**
+     * Closes the dialog.
+     */
+    static onClose(): void;
+    /**
+     * Renders the error dialog.
+     */
+    renderError(): React.JSX.Element | null;
+    /**
+     * Checks if the configuration has changed.
+     *
+     * @param native the new state
+     */
+    getIsChanged(native: Record<string, any>): boolean;
+    /**
+     * Gets called when loading the configuration.
+     *
+     * @param newNative The new configuration object.
+     */
+    onLoadConfig(newNative: Record<string, any>): void;
+    /**
+     * Sets the configuration error.
+     */
+    setConfigurationError(errorText: string): void;
+    /**
+     * Renders the save and close buttons.
+     */
+    renderSaveCloseButtons(): React.JSX.Element | null;
+    private _updateNativeValue;
+    /**
+     * Update the native value
+     *
+     * @param attr The attribute name with dots as delimiter.
+     * @param value The new value.
+     * @param cb Callback which will be called upon completion.
+     */
+    updateNativeValue(attr: string, value: any, cb?: () => void): void;
+    /**
+     * Set the error text to be shown.
+     */
+    showError(text: string | React.JSX.Element): void;
+    /**
+     * Sets the toast to be shown.
+     *
+     * @param toast Text to be shown.
+     */
+    showToast(toast: string | React.JSX.Element): void;
+    /**
+     * Renders helper dialogs
+     */
+    renderHelperDialogs(): React.JSX.Element;
+    /**
+     * Renders this component.
+     */
+    render(): React.JSX.Element;
+}