@iobroker/adapter-react-v5 7.2.4 → 7.3.0

package/src/Dialogs/SelectID.tsx

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

package/src/Dialogs/SimpleCron.tsx

@@ -1,101 +0,0 @@
-import React, { type JSX } 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: Record<string, React.CSSProperties> = {
-    dialogPaper: {
-        height: 'calc(100% - 96px)',
-    },
-};
-
-interface DialogCronProps {
-    onClose: () => void;
-    onOk: (cron: string) => void;
-    title?: string;
-    cron?: string;
-    cancel?: string;
-    ok?: string;
-}
-
-interface DialogCronState {
-    cron: string;
-}
-
-class DialogSimpleCron extends React.Component<DialogCronProps, DialogCronState> {
-    constructor(props: DialogCronProps) {
-        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(): void {
-        this.props.onClose();
-    }
-
-    handleOk(): void {
-        this.props.onOk(this.state.cron);
-        this.props.onClose();
-    }
-
-    render(): JSX.Element {
-        return (
-            <Dialog
-                onClose={() => {}}
-                maxWidth="md"
-                fullWidth
-                sx={{ '& .MuiDialog-paper': styles.dialogPaper }}
-                open={!0}
-                aria-labelledby="cron-dialog-title"
-            >
-                <DialogTitle id="cron-dialog-title">{this.props.title || I18n.t('ra_Define CRON...')}</DialogTitle>
-                <DialogContent style={{ height: '100%', overflow: 'hidden' }}>
-                    <SimpleCron
-                        cronExpression={this.state.cron}
-                        onChange={cron => this.setState({ cron })}
-                        language={I18n.getLanguage()}
-                    />
-                </DialogContent>
-                <DialogActions>
-                    <Button
-                        variant="contained"
-                        disabled={!this.state.cron || this.state.cron.includes('_')}
-                        onClick={() => this.handleOk()}
-                        color="primary"
-                        startIcon={<IconOk />}
-                    >
-                        {this.props.ok || I18n.t('ra_Ok')}
-                    </Button>
-                    <Button
-                        variant="contained"
-                        onClick={() => this.handleCancel()}
-                        color="grey"
-                        startIcon={<IconCancel />}
-                    >
-                        {this.props.cancel || I18n.t('ra_Cancel')}
-                    </Button>
-                </DialogActions>
-            </Dialog>
-        );
-    }
-}
-
-export default DialogSimpleCron;

package/src/Dialogs/TextInput.tsx

@@ -1,99 +0,0 @@
-import React, { type JSX } 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';
-
-interface TextInputProps {
-    /** The dialog close callback */
-    onClose: (text: string | null) => void;
-    /** The title text */
-    titleText: string;
-    /** Prompt text (default: empty) */
-    promptText?: string;
-    /** Label text (default: empty) */
-    labelText?: string;
-    /** The text of the cancel button */
-    cancelText: string;
-    /** The text of the "apply" button */
-    applyText: string;
-    /** The verification callback. Return a non-empty string if there was an error */
-    verify?: (text: string) => string;
-    /** The text replacement callback */
-    rule?: (text: string) => string;
-    /** The type of the textbox (default: text) */
-    type?: 'text' | 'number' | 'password' | 'email';
-    /** The initial input value when opening the dialog */
-    value?: string;
-    /** @deprecated Use value. The input when opening the dialog */
-    input?: string;
-    /** If true, the dialog will be full width */
-    fullWidth?: boolean;
-}
-function TextInput(props: TextInputProps): JSX.Element {
-    const [text, setText] = React.useState<string>(props.input || props.value || '');
-    const [error, setError] = React.useState<string | boolean>('');
-    return (
-        <Dialog
-            open={!0}
-            onClose={() => props.onClose(null)}
-            aria-labelledby="form-dialog-title"
-            fullWidth={props.fullWidth !== undefined ? props.fullWidth : false}
-        >
-            <DialogTitle id="form-dialog-title">{props.titleText}</DialogTitle>
-            <DialogContent>
-                <DialogContentText>{props.promptText}</DialogContentText>
-                <TextField
-                    variant="standard"
-                    autoFocus
-                    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: string | boolean = '';
-                        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
-                />
-            </DialogContent>
-            <DialogActions>
-                <Button
-                    variant="contained"
-                    disabled={!text || !!error}
-                    onClick={() => props.onClose(text)}
-                    color="primary"
-                    startIcon={<IconCheck />}
-                >
-                    {props.applyText || I18n.t('ra_Ok')}
-                </Button>
-                <Button
-                    color="grey"
-                    variant="contained"
-                    onClick={() => props.onClose(null)}
-                    startIcon={<IconClose />}
-                >
-                    {props.cancelText || I18n.t('ra_Cancel')}
-                </Button>
-            </DialogActions>
-        </Dialog>
-    );
-}
-
-export default withWidth()(TextInput);