@iobroker/adapter-react-v5 7.6.19 → 7.7.0

package/build/Components/DeviceType/DeviceTypeIcon.js

@@ -83,12 +83,13 @@ export function DeviceTypeIcon(props) {
             extendDeviceTypeTranslation();
             setLoaded(true);
         }
-    }, [props.title]);
+    }, [props.title, loaded]);
     if (!loaded && props.title) {
         return (React.createElement(Box, { style: { ...defaultStyle, ...(props.style || undefined) }, className: props.className, sx: props.sx }));
     }
     // src could contain a device type too, so detect if it is a type
-    const type = props.type || (props.src ? Object.keys(TYPE_ICONS).find(type => props.src === type) : undefined);
+    const type = props.type ||
+        (props.src ? Object.keys(TYPE_ICONS).find(type => props.src === type) : undefined);
     if (!type && props.src) {
         return (React.createElement(Icon, { style: defaultStyle, ...props, title: props.title === true ? undefined : props.title, src: props.src }));
     }

package/build/Components/DeviceType/DeviceTypeIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeviceTypeIcon.js","sourceRoot":"./src/","sources":["Components/DeviceType/DeviceTypeIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\n\nimport { Box, Tooltip } from '@mui/material';\n\nimport { AiOutlineLineChart as TypeIconChart } from 'react-icons/ai';\nimport { GoDeviceCameraVideo as TypeIconCamera } from 'react-icons/go';\n\nimport {\n    // FaExternalLinkSquareAlt as TypeIconURL,\n    FaImage as TypeIconImage,\n    FaRegLightbulb as TypeIconDimmer,\n    FaInfoCircle as TypeIconInfo,\n    FaLightbulb as TypeIconLight,\n    FaLock as TypeIconLock,\n    FaStreetView as TypeIconLocation,\n    FaStepForward as TypeIconMedia,\n    FaSlidersH as TypeIconSlider,\n    FaVolumeDown as TypeIconVolume,\n    FaVolumeUp as TypeIconVolumeGroup,\n    FaFan as TypeIconAC,\n    FaWrench as TypeIconInstance,\n} from 'react-icons/fa';\n\nimport {\n    MdFormatColorFill as TypeIconHUE,\n    MdFormatColorFill as TypeIconCT,\n    MdWarning as TypeIconWarning,\n    MdQuestionMark as TypeIconUnknown,\n    MdOutlineMyLocation as TypeIconLocationOne,\n    MdDeviceHub as TypeIconHub3,\n    MdPolyline as TypeIconNode,\n    MdHub as TypeIconHub5,\n    MdControlCamera as TypeIconController,\n} from 'react-icons/md';\nimport { WiCloudy as TypeIconWeather } from 'react-icons/wi';\nimport { IoIosRadioButtonOn as TypeIconButtonSensor } from 'react-icons/io';\nimport { TbSunElectricity as TypeIconIlluminance } from 'react-icons/tb';\nimport { PiPaletteDuotone as TypeIconRGBWSingle } from 'react-icons/pi';\n\nimport { Types } from '@iobroker/type-detector';\n\nimport { I18n } from '../../i18n';\nimport { Icon } from '../Icon';\n\nimport {\n    Cleaner as TypeIconVacuumCleaner,\n    Humidity as TypeIconHumidity,\n    Jalousie as TypeIconBlinds,\n    PushButton as TypeIconButton,\n    DoorOpened as TypeIconDoor,\n    FireOn as TypeIconFireAlarm,\n    FloodOn as TypeIconFloodAlarm,\n    Gate as TypeIconGate,\n    MotionOn as TypeIconMotion,\n    RGB as TypeIconRGB,\n    Socket as TypeIconSocket,\n    Thermometer as TypeIconTemperature,\n    Thermostat as TypeIconThermostat,\n    // HeatValve as TypeIconValve,\n    WindowOpened as TypeIconWindow,\n    WindowTilted as TypeIconWindowTilt,\n    type IconPropsSVG,\n} from './icons';\nimport { extendDeviceTypeTranslation } from './deviceTypeTranslations';\n\nexport type TypesExtended = Types | 'invalid' | 'hub3' | 'node' | 'hub5' | 'controller';\n\nconst TYPE_ICONS: Record<TypesExtended, React.FC<IconPropsSVG>> = {\n    [Types.airCondition]: TypeIconAC,\n    [Types.blind]: TypeIconBlinds,\n    [Types.blindButtons]: TypeIconBlinds,\n    [Types.button]: TypeIconButton,\n    [Types.buttonSensor]: TypeIconButtonSensor,\n    [Types.camera]: TypeIconCamera,\n    [Types.chart]: TypeIconChart,\n    // [Types.url]: TypeIconURL,\n    [Types.image]: TypeIconImage,\n    [Types.dimmer]: TypeIconDimmer,\n    [Types.door]: TypeIconDoor,\n    [Types.fireAlarm]: TypeIconFireAlarm,\n    // @ts-expect-error special case\n    'sensor.alarm.fire': TypeIconFireAlarm,\n    [Types.floodAlarm]: TypeIconFloodAlarm,\n    'sensor.alarm.flood': TypeIconFloodAlarm,\n    [Types.gate]: TypeIconGate,\n    [Types.humidity]: TypeIconHumidity,\n    [Types.illuminance]: TypeIconIlluminance,\n    [Types.info]: TypeIconInfo,\n    [Types.light]: TypeIconLight,\n    [Types.lock]: TypeIconLock,\n    [Types.location]: TypeIconLocation,\n    [Types.locationOne]: TypeIconLocationOne,\n    [Types.media]: TypeIconMedia,\n    [Types.motion]: TypeIconMotion,\n    [Types.ct]: TypeIconCT,\n    [Types.rgb]: TypeIconRGB,\n    [Types.rgbSingle]: TypeIconRGB,\n    [Types.rgbwSingle]: TypeIconRGBWSingle,\n    [Types.hue]: TypeIconHUE,\n    [Types.cie]: TypeIconRGB,\n    [Types.slider]: TypeIconSlider,\n    [Types.socket]: TypeIconSocket,\n    [Types.temperature]: TypeIconTemperature,\n    [Types.thermostat]: TypeIconThermostat,\n    // [Types.valve]: TypeIconValve,\n    [Types.vacuumCleaner]: TypeIconVacuumCleaner,\n    [Types.volume]: TypeIconVolume,\n    [Types.volumeGroup]: TypeIconVolumeGroup,\n    [Types.window]: TypeIconWindow,\n    [Types.windowTilt]: TypeIconWindowTilt,\n    [Types.weatherCurrent]: TypeIconWeather,\n    [Types.weatherForecast]: TypeIconWeather,\n    [Types.warning]: TypeIconWarning,\n\n    [Types.unknown]: TypeIconUnknown,\n    [Types.instance]: TypeIconInstance,\n\n    // Special matter types\n    invalid: TypeIconWarning,\n    hub3: TypeIconHub3,\n    node: TypeIconNode,\n    hub5: TypeIconHub5,\n    controller: TypeIconController,\n};\n\nconst defaultStyle: React.CSSProperties = {\n    width: 32,\n    height: 32,\n};\n\nexport interface IconProps {\n    /** URL, UTF-8 character, or svg code (data:image/svg...) */\n    src?: string | React.JSX.Element | null | undefined;\n    /** Class name */\n    className?: string;\n    /** Style for image */\n    style?: React.CSSProperties;\n    /** Styles for mui */\n    sx?: Record<string, any>;\n    /** Tooltip */\n    title?: string | true;\n    /** Styles for utf-8 characters */\n    styleUTF8?: React.CSSProperties;\n    /** On error handler */\n    onError?: React.ReactEventHandler<HTMLImageElement>;\n    /** Reference to image */\n    ref?: React.RefObject<HTMLImageElement>;\n    /** Alternative text for image */\n    alt?: string;\n    /** On click handler */\n    onClick?: React.MouseEventHandler<any>;\n}\n\nexport type TypeIconProps = IconProps & { type?: TypesExtended };\n\nexport function DeviceTypeIcon(props: TypeIconProps): React.JSX.Element | null {\n    const [loaded, setLoaded] = React.useState(false);\n\n    useEffect(() => {\n        if (props.title && !loaded) {\n            extendDeviceTypeTranslation();\n            setLoaded(true);\n        }\n    }, [props.title]);\n\n    if (!loaded && props.title) {\n        return (\n            <Box\n                style={{ ...defaultStyle, ...(props.style || undefined) }}\n                className={props.className}\n                sx={props.sx}\n            />\n        );\n    }\n    // src could contain a device type too, so detect if it is a type\n    const type: TypesExtended | undefined =\n        props.type || (props.src ? (Object.keys(TYPE_ICONS).find(type => props.src === type) as TypesExtended) : undefined);\n\n    if (!type && props.src) {\n        return (\n            <Icon\n                style={defaultStyle}\n                {...props}\n                title={props.title === true ? undefined : props.title}\n                src={props.src}\n            />\n        );\n    }\n\n    const TypeIcon = type && TYPE_ICONS[type];\n    if (!TypeIcon) {\n        // Show the first letter of a type\n        return type ? (\n            <span style={{ ...defaultStyle, ...(props.style || undefined) }}>{type[0].toUpperCase()}</span>\n        ) : null;\n    }\n\n    const icon = (\n        <TypeIcon\n            style={{ ...defaultStyle, ...(props.style || undefined) }}\n            onClick={props.onClick}\n            className={props.className}\n            sx={props.sx}\n        />\n    );\n\n    if (props.title) {\n        return (\n            <Tooltip\n                slotProps={{ popper: { sx: { pointerEvents: 'none' } } }}\n                title={props.title === true ? I18n.t(`type-${type}`) : props.title}\n            >\n                <div style={{ display: 'flex' }}>{icon}</div>\n            </Tooltip>\n        );\n    }\n\n    return icon;\n}\n"]}
+{"version":3,"file":"DeviceTypeIcon.js","sourceRoot":"./src/","sources":["Components/DeviceType/DeviceTypeIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\n\nimport { Box, Tooltip } from '@mui/material';\n\nimport { AiOutlineLineChart as TypeIconChart } from 'react-icons/ai';\nimport { GoDeviceCameraVideo as TypeIconCamera } from 'react-icons/go';\n\nimport {\n    // FaExternalLinkSquareAlt as TypeIconURL,\n    FaImage as TypeIconImage,\n    FaRegLightbulb as TypeIconDimmer,\n    FaInfoCircle as TypeIconInfo,\n    FaLightbulb as TypeIconLight,\n    FaLock as TypeIconLock,\n    FaStreetView as TypeIconLocation,\n    FaStepForward as TypeIconMedia,\n    FaSlidersH as TypeIconSlider,\n    FaVolumeDown as TypeIconVolume,\n    FaVolumeUp as TypeIconVolumeGroup,\n    FaFan as TypeIconAC,\n    FaWrench as TypeIconInstance,\n} from 'react-icons/fa';\n\nimport {\n    MdFormatColorFill as TypeIconHUE,\n    MdFormatColorFill as TypeIconCT,\n    MdWarning as TypeIconWarning,\n    MdQuestionMark as TypeIconUnknown,\n    MdOutlineMyLocation as TypeIconLocationOne,\n    MdDeviceHub as TypeIconHub3,\n    MdPolyline as TypeIconNode,\n    MdHub as TypeIconHub5,\n    MdControlCamera as TypeIconController,\n} from 'react-icons/md';\nimport { WiCloudy as TypeIconWeather } from 'react-icons/wi';\nimport { IoIosRadioButtonOn as TypeIconButtonSensor } from 'react-icons/io';\nimport { TbSunElectricity as TypeIconIlluminance } from 'react-icons/tb';\nimport { PiPaletteDuotone as TypeIconRGBWSingle } from 'react-icons/pi';\n\nimport { Types } from '@iobroker/type-detector';\n\nimport { I18n } from '../../i18n';\nimport { Icon } from '../Icon';\n\nimport {\n    Cleaner as TypeIconVacuumCleaner,\n    Humidity as TypeIconHumidity,\n    Jalousie as TypeIconBlinds,\n    PushButton as TypeIconButton,\n    DoorOpened as TypeIconDoor,\n    FireOn as TypeIconFireAlarm,\n    FloodOn as TypeIconFloodAlarm,\n    Gate as TypeIconGate,\n    MotionOn as TypeIconMotion,\n    RGB as TypeIconRGB,\n    Socket as TypeIconSocket,\n    Thermometer as TypeIconTemperature,\n    Thermostat as TypeIconThermostat,\n    // HeatValve as TypeIconValve,\n    WindowOpened as TypeIconWindow,\n    WindowTilted as TypeIconWindowTilt,\n    type IconPropsSVG,\n} from './icons';\nimport { extendDeviceTypeTranslation } from './deviceTypeTranslations';\n\nexport type TypesExtended = Types | 'invalid' | 'hub3' | 'node' | 'hub5' | 'controller';\n\nconst TYPE_ICONS: Record<TypesExtended, React.FC<IconPropsSVG>> = {\n    [Types.airCondition]: TypeIconAC,\n    [Types.blind]: TypeIconBlinds,\n    [Types.blindButtons]: TypeIconBlinds,\n    [Types.button]: TypeIconButton,\n    [Types.buttonSensor]: TypeIconButtonSensor,\n    [Types.camera]: TypeIconCamera,\n    [Types.chart]: TypeIconChart,\n    // [Types.url]: TypeIconURL,\n    [Types.image]: TypeIconImage,\n    [Types.dimmer]: TypeIconDimmer,\n    [Types.door]: TypeIconDoor,\n    [Types.fireAlarm]: TypeIconFireAlarm,\n    // @ts-expect-error special case\n    'sensor.alarm.fire': TypeIconFireAlarm,\n    [Types.floodAlarm]: TypeIconFloodAlarm,\n    'sensor.alarm.flood': TypeIconFloodAlarm,\n    [Types.gate]: TypeIconGate,\n    [Types.humidity]: TypeIconHumidity,\n    [Types.illuminance]: TypeIconIlluminance,\n    [Types.info]: TypeIconInfo,\n    [Types.light]: TypeIconLight,\n    [Types.lock]: TypeIconLock,\n    [Types.location]: TypeIconLocation,\n    [Types.locationOne]: TypeIconLocationOne,\n    [Types.media]: TypeIconMedia,\n    [Types.motion]: TypeIconMotion,\n    [Types.ct]: TypeIconCT,\n    [Types.rgb]: TypeIconRGB,\n    [Types.rgbSingle]: TypeIconRGB,\n    [Types.rgbwSingle]: TypeIconRGBWSingle,\n    [Types.hue]: TypeIconHUE,\n    [Types.cie]: TypeIconRGB,\n    [Types.slider]: TypeIconSlider,\n    [Types.socket]: TypeIconSocket,\n    [Types.temperature]: TypeIconTemperature,\n    [Types.thermostat]: TypeIconThermostat,\n    // [Types.valve]: TypeIconValve,\n    [Types.vacuumCleaner]: TypeIconVacuumCleaner,\n    [Types.volume]: TypeIconVolume,\n    [Types.volumeGroup]: TypeIconVolumeGroup,\n    [Types.window]: TypeIconWindow,\n    [Types.windowTilt]: TypeIconWindowTilt,\n    [Types.weatherCurrent]: TypeIconWeather,\n    [Types.weatherForecast]: TypeIconWeather,\n    [Types.warning]: TypeIconWarning,\n\n    [Types.unknown]: TypeIconUnknown,\n    [Types.instance]: TypeIconInstance,\n\n    // Special matter types\n    invalid: TypeIconWarning,\n    hub3: TypeIconHub3,\n    node: TypeIconNode,\n    hub5: TypeIconHub5,\n    controller: TypeIconController,\n};\n\nconst defaultStyle: React.CSSProperties = {\n    width: 32,\n    height: 32,\n};\n\nexport interface IconProps {\n    /** URL, UTF-8 character, or svg code (data:image/svg...) */\n    src?: string | React.JSX.Element | null | undefined;\n    /** Class name */\n    className?: string;\n    /** Style for image */\n    style?: React.CSSProperties;\n    /** Styles for mui */\n    sx?: Record<string, any>;\n    /** Tooltip */\n    title?: string | true;\n    /** Styles for utf-8 characters */\n    styleUTF8?: React.CSSProperties;\n    /** On error handler */\n    onError?: React.ReactEventHandler<HTMLImageElement>;\n    /** Reference to image */\n    ref?: React.RefObject<HTMLImageElement>;\n    /** Alternative text for image */\n    alt?: string;\n    /** On click handler */\n    onClick?: React.MouseEventHandler<any>;\n}\n\nexport type TypeIconProps = IconProps & { type?: TypesExtended };\n\nexport function DeviceTypeIcon(props: TypeIconProps): React.JSX.Element | null {\n    const [loaded, setLoaded] = React.useState(false);\n\n    useEffect(() => {\n        if (props.title && !loaded) {\n            extendDeviceTypeTranslation();\n            setLoaded(true);\n        }\n    }, [props.title, loaded]);\n\n    if (!loaded && props.title) {\n        return (\n            <Box\n                style={{ ...defaultStyle, ...(props.style || undefined) }}\n                className={props.className}\n                sx={props.sx}\n            />\n        );\n    }\n    // src could contain a device type too, so detect if it is a type\n    const type: TypesExtended | undefined =\n        props.type ||\n        (props.src ? (Object.keys(TYPE_ICONS).find(type => props.src === type) as TypesExtended) : undefined);\n\n    if (!type && props.src) {\n        return (\n            <Icon\n                style={defaultStyle}\n                {...props}\n                title={props.title === true ? undefined : props.title}\n                src={props.src}\n            />\n        );\n    }\n\n    const TypeIcon = type && TYPE_ICONS[type];\n    if (!TypeIcon) {\n        // Show the first letter of a type\n        return type ? (\n            <span style={{ ...defaultStyle, ...(props.style || undefined) }}>{type[0].toUpperCase()}</span>\n        ) : null;\n    }\n\n    const icon = (\n        <TypeIcon\n            style={{ ...defaultStyle, ...(props.style || undefined) }}\n            onClick={props.onClick}\n            className={props.className}\n            sx={props.sx}\n        />\n    );\n\n    if (props.title) {\n        return (\n            <Tooltip\n                slotProps={{ popper: { sx: { pointerEvents: 'none' } } }}\n                title={props.title === true ? I18n.t(`type-${type}`) : props.title}\n            >\n                <div style={{ display: 'flex' }}>{icon}</div>\n            </Tooltip>\n        );\n    }\n\n    return icon;\n}\n"]}

package/build/Components/DeviceType/DeviceTypeSelector.js

@@ -44,7 +44,8 @@ export function DeviceTypeSelector(props) {
     useEffect(() => {
         const _typesWords = {};
         Object.keys(Types)
-            .filter(id => (!props.supportedDevices || props.supportedDevices?.includes(id)) && !props.unsupportedDevices?.includes(id))
+            .filter(id => (!props.supportedDevices || props.supportedDevices?.includes(id)) &&
+            !props.unsupportedDevices?.includes(id))
             .forEach(typeId => (_typesWords[typeId] = I18n.t(`type-${Types[typeId]}`)));
         // sort types by ABC in the current language
         const _types = Object.keys(_typesWords);

package/build/Components/DeviceType/DeviceTypeSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeviceTypeSelector.js","sourceRoot":"./src/","sources":["Components/DeviceType/DeviceTypeSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\nimport { Box, FormControl, InputLabel, MenuItem, Select } from '@mui/material';\n\nimport { Types } from '@iobroker/type-detector';\n\nimport { I18n } from '../../i18n';\nimport { Icon } from '../Icon';\nimport type { ThemeType } from '../../types';\n\nimport { DeviceTypeIcon } from './DeviceTypeIcon';\nimport { extendDeviceTypeTranslation } from './deviceTypeTranslations';\n\nconst styles: Record<\n    'itemChildrenWrapper' | 'type' | 'selectIcon' | 'selectText' | 'iconWrapper' | 'iconStyle' | 'emptyIcon',\n    React.CSSProperties\n> = {\n    itemChildrenWrapper: {\n        display: 'flex',\n        width: '100%',\n        justifyContent: 'space-between',\n    },\n    type: {\n        marginTop: 10,\n    },\n    selectIcon: {\n        paddingRight: 8,\n        verticalAlign: 'middle',\n        width: 20,\n        height: 20,\n    },\n    selectText: {\n        verticalAlign: 'middle',\n    },\n    iconWrapper: {\n        display: 'flex',\n        alignItems: 'center',\n    },\n    iconStyle: {\n        width: 16,\n        height: 16,\n        margin: '0 3px',\n    },\n    emptyIcon: {\n        width: 16,\n        height: 16,\n        margin: '0 3px',\n    },\n};\n\nexport function DeviceTypeSelector(props: {\n    themeType: ThemeType;\n    supportedDevices?: Types[];\n    unsupportedDevices?: Types[];\n    value?: Types | '';\n    onChange: (value: Types) => void;\n    label?: string;\n    style?: React.CSSProperties;\n    sx?: Record<string, any>;\n    disabled?: boolean;\n    error?: boolean;\n    /** Show icons for applications: google, amazon, material, alias. Used in devices */\n    showApplications?: {\n        TYPE_OPTIONS: Partial<Record<Types, Record<string, boolean>>>;\n        ICONS_TYPE: Record<string, React.JSX.Element>;\n    };\n}): React.JSX.Element {\n    const [typesWords, setTypesWords] = React.useState<Partial<Record<Types, string>>>({});\n    const [types, setTypes] = React.useState<Types[] | null>([]);\n\n    useEffect(() => {\n        const _typesWords: Partial<Record<Types, string>> = {};\n        Object.keys(Types)\n            .filter(\n                id => (!props.supportedDevices || props.supportedDevices?.includes(id as Types)) && !props.unsupportedDevices?.includes(id as Types),\n            )\n            .forEach(typeId => (_typesWords[typeId as Types] = I18n.t(`type-${Types[typeId as Types]}`)));\n\n        // sort types by ABC in the current language\n        const _types: Types[] = Object.keys(_typesWords) as Types[];\n\n        _types.sort((a, b) => {\n            if (_typesWords[a as Types] === _typesWords[b as Types]) {\n                return 0;\n            }\n            return _typesWords[a as Types]!.localeCompare(_typesWords[b as Types]!, 'de');\n        });\n\n        extendDeviceTypeTranslation();\n\n        setTypes(_types);\n        setTypesWords(_typesWords);\n    }, [props.supportedDevices, props.unsupportedDevices]);\n\n    if (!types) {\n        return (\n            <Box\n                style={{\n                    ...styles.type,\n                    ...props.style,\n                }}\n                sx={props.sx}\n            />\n        );\n    }\n\n    return (\n        <FormControl\n            style={{\n                ...styles.type,\n                ...props.style,\n            }}\n            sx={props.sx}\n            variant=\"standard\"\n            error={!!props.error}\n        >\n            <InputLabel>{props.label || I18n.t('type-Device type')}</InputLabel>\n            <Select\n                variant=\"standard\"\n                disabled={!!props.disabled}\n                value={props.value}\n                onChange={e => props.onChange(e.target.value as Types)}\n            >\n                {types.map(typeId => (\n                    <MenuItem\n                        key={Types[typeId]}\n                        value={Types[typeId]}\n                    >\n                        <div style={styles.itemChildrenWrapper}>\n                            <div>\n                                <DeviceTypeIcon\n                                    type={Types[typeId]}\n                                    style={{\n                                        ...styles.selectIcon,\n                                        color: props.themeType === 'dark' ? '#FFFFFF' : '#000',\n                                    }}\n                                />\n                                <span style={styles.selectText}>{typesWords[typeId]}</span>\n                            </div>\n                            {props.showApplications?.TYPE_OPTIONS[typeId] ? (\n                                <div style={styles.iconWrapper}>\n                                    {Object.keys(props.showApplications.TYPE_OPTIONS[typeId]).map(key =>\n                                        props.showApplications.TYPE_OPTIONS[typeId][key] ? (\n                                            <Icon\n                                                key={key}\n                                                style={styles.iconStyle}\n                                                src={props.showApplications.ICONS_TYPE[key]}\n                                            />\n                                        ) : (\n                                            <div\n                                                key={key}\n                                                style={styles.emptyIcon}\n                                            />\n                                        ),\n                                    )}\n                                </div>\n                            ) : null}\n                        </div>\n                    </MenuItem>\n                ))}\n            </Select>\n        </FormControl>\n    );\n}\n"]}
+{"version":3,"file":"DeviceTypeSelector.js","sourceRoot":"./src/","sources":["Components/DeviceType/DeviceTypeSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\nimport { Box, FormControl, InputLabel, MenuItem, Select } from '@mui/material';\n\nimport { Types } from '@iobroker/type-detector';\n\nimport { I18n } from '../../i18n';\nimport { Icon } from '../Icon';\nimport type { ThemeType } from '../../types';\n\nimport { DeviceTypeIcon } from './DeviceTypeIcon';\nimport { extendDeviceTypeTranslation } from './deviceTypeTranslations';\n\nconst styles: Record<\n    'itemChildrenWrapper' | 'type' | 'selectIcon' | 'selectText' | 'iconWrapper' | 'iconStyle' | 'emptyIcon',\n    React.CSSProperties\n> = {\n    itemChildrenWrapper: {\n        display: 'flex',\n        width: '100%',\n        justifyContent: 'space-between',\n    },\n    type: {\n        marginTop: 10,\n    },\n    selectIcon: {\n        paddingRight: 8,\n        verticalAlign: 'middle',\n        width: 20,\n        height: 20,\n    },\n    selectText: {\n        verticalAlign: 'middle',\n    },\n    iconWrapper: {\n        display: 'flex',\n        alignItems: 'center',\n    },\n    iconStyle: {\n        width: 16,\n        height: 16,\n        margin: '0 3px',\n    },\n    emptyIcon: {\n        width: 16,\n        height: 16,\n        margin: '0 3px',\n    },\n};\n\nexport function DeviceTypeSelector(props: {\n    themeType: ThemeType;\n    supportedDevices?: Types[];\n    unsupportedDevices?: Types[];\n    value?: Types | '';\n    onChange: (value: Types) => void;\n    label?: string;\n    style?: React.CSSProperties;\n    sx?: Record<string, any>;\n    disabled?: boolean;\n    error?: boolean;\n    /** Show icons for applications: google, amazon, material, alias. Used in devices */\n    showApplications?: {\n        TYPE_OPTIONS: Partial<Record<Types, Record<string, boolean>>>;\n        ICONS_TYPE: Record<string, React.JSX.Element>;\n    };\n}): React.JSX.Element {\n    const [typesWords, setTypesWords] = React.useState<Partial<Record<Types, string>>>({});\n    const [types, setTypes] = React.useState<Types[] | null>([]);\n\n    useEffect(() => {\n        const _typesWords: Partial<Record<Types, string>> = {};\n        Object.keys(Types)\n            .filter(\n                id =>\n                    (!props.supportedDevices || props.supportedDevices?.includes(id as Types)) &&\n                    !props.unsupportedDevices?.includes(id as Types),\n            )\n            .forEach(typeId => (_typesWords[typeId as Types] = I18n.t(`type-${Types[typeId as Types]}`)));\n\n        // sort types by ABC in the current language\n        const _types: Types[] = Object.keys(_typesWords) as Types[];\n\n        _types.sort((a, b) => {\n            if (_typesWords[a] === _typesWords[b]) {\n                return 0;\n            }\n            return _typesWords[a].localeCompare(_typesWords[b], 'de');\n        });\n\n        extendDeviceTypeTranslation();\n\n        setTypes(_types);\n        setTypesWords(_typesWords);\n    }, [props.supportedDevices, props.unsupportedDevices]);\n\n    if (!types) {\n        return (\n            <Box\n                style={{\n                    ...styles.type,\n                    ...props.style,\n                }}\n                sx={props.sx}\n            />\n        );\n    }\n\n    return (\n        <FormControl\n            style={{\n                ...styles.type,\n                ...props.style,\n            }}\n            sx={props.sx}\n            variant=\"standard\"\n            error={!!props.error}\n        >\n            <InputLabel>{props.label || I18n.t('type-Device type')}</InputLabel>\n            <Select\n                variant=\"standard\"\n                disabled={!!props.disabled}\n                value={props.value}\n                onChange={e => props.onChange(e.target.value as Types)}\n            >\n                {types.map(typeId => (\n                    <MenuItem\n                        key={Types[typeId]}\n                        value={Types[typeId]}\n                    >\n                        <div style={styles.itemChildrenWrapper}>\n                            <div>\n                                <DeviceTypeIcon\n                                    type={Types[typeId]}\n                                    style={{\n                                        ...styles.selectIcon,\n                                        color: props.themeType === 'dark' ? '#FFFFFF' : '#000',\n                                    }}\n                                />\n                                <span style={styles.selectText}>{typesWords[typeId]}</span>\n                            </div>\n                            {props.showApplications?.TYPE_OPTIONS[typeId] ? (\n                                <div style={styles.iconWrapper}>\n                                    {Object.keys(props.showApplications.TYPE_OPTIONS[typeId]).map(key =>\n                                        props.showApplications.TYPE_OPTIONS[typeId][key] ? (\n                                            <Icon\n                                                key={key}\n                                                style={styles.iconStyle}\n                                                src={props.showApplications.ICONS_TYPE[key]}\n                                            />\n                                        ) : (\n                                            <div\n                                                key={key}\n                                                style={styles.emptyIcon}\n                                            />\n                                        ),\n                                    )}\n                                </div>\n                            ) : null}\n                        </div>\n                    </MenuItem>\n                ))}\n            </Select>\n        </FormControl>\n    );\n}\n"]}

package/build/Components/DeviceType/deviceTypeTranslations.js

@@ -9,18 +9,22 @@ import itLang from './i18n/it.json';
 import nlLang from './i18n/nl.json';
 import ukLang from './i18n/uk.json';
 import zhLang from './i18n/zh-cn.json';
+let translationLoaded = false;
 export function extendDeviceTypeTranslation() {
-    I18n.extendTranslations({
-        en: enLang,
-        de: deLang,
-        ru: ruLang,
-        pt: ptLang,
-        pl: plLang,
-        fr: frLang,
-        it: itLang,
-        nl: nlLang,
-        uk: ukLang,
-        'zh-cn': zhLang,
-    });
+    if (!translationLoaded) {
+        translationLoaded = true;
+        I18n.extendTranslations({
+            en: enLang,
+            de: deLang,
+            ru: ruLang,
+            pt: ptLang,
+            pl: plLang,
+            fr: frLang,
+            it: itLang,
+            nl: nlLang,
+            uk: ukLang,
+            'zh-cn': zhLang,
+        });
+    }
 }
 //# sourceMappingURL=deviceTypeTranslations.js.map

package/build/Components/DeviceType/deviceTypeTranslations.js.map

@@ -1 +1 @@
-{"version":3,"file":"deviceTypeTranslations.js","sourceRoot":"./src/","sources":["Components/DeviceType/deviceTypeTranslations.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,UAAU,2BAA2B;IACvC,IAAI,CAAC,kBAAkB,CAAC;QACpB,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,OAAO,EAAE,MAAM;KAClB,CAAC,CAAC;AACP,CAAC","sourcesContent":["import { I18n } from '../../i18n';\nimport enLang from './i18n/en.json';\nimport deLang from './i18n/de.json';\nimport ruLang from './i18n/ru.json';\nimport ptLang from './i18n/pt.json';\nimport plLang from './i18n/pl.json';\nimport frLang from './i18n/fr.json';\nimport itLang from './i18n/it.json';\nimport nlLang from './i18n/nl.json';\nimport ukLang from './i18n/uk.json';\nimport zhLang from './i18n/zh-cn.json';\n\nexport function extendDeviceTypeTranslation() {\n    I18n.extendTranslations({\n        en: enLang,\n        de: deLang,\n        ru: ruLang,\n        pt: ptLang,\n        pl: plLang,\n        fr: frLang,\n        it: itLang,\n        nl: nlLang,\n        uk: ukLang,\n        'zh-cn': zhLang,\n    });\n}\n"]}
+{"version":3,"file":"deviceTypeTranslations.js","sourceRoot":"./src/","sources":["Components/DeviceType/deviceTypeTranslations.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,gBAAgB,CAAC;AACpC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,IAAI,iBAAiB,GAAG,KAAK,CAAC;AAC9B,MAAM,UAAU,2BAA2B;IACvC,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACrB,iBAAiB,GAAG,IAAI,CAAC;QACzB,IAAI,CAAC,kBAAkB,CAAC;YACpB,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,OAAO,EAAE,MAAM;SAClB,CAAC,CAAC;IACP,CAAC;AACL,CAAC","sourcesContent":["import { I18n } from '../../i18n';\nimport enLang from './i18n/en.json';\nimport deLang from './i18n/de.json';\nimport ruLang from './i18n/ru.json';\nimport ptLang from './i18n/pt.json';\nimport plLang from './i18n/pl.json';\nimport frLang from './i18n/fr.json';\nimport itLang from './i18n/it.json';\nimport nlLang from './i18n/nl.json';\nimport ukLang from './i18n/uk.json';\nimport zhLang from './i18n/zh-cn.json';\n\nlet translationLoaded = false;\nexport function extendDeviceTypeTranslation(): void {\n    if (!translationLoaded) {\n        translationLoaded = true;\n        I18n.extendTranslations({\n            en: enLang,\n            de: deLang,\n            ru: ruLang,\n            pt: ptLang,\n            pl: plLang,\n            fr: frLang,\n            it: itLang,\n            nl: nlLang,\n            uk: ukLang,\n            'zh-cn': zhLang,\n        });\n    }\n}\n"]}

package/build/Components/IconPicker.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { type IconSelectorIcon } from './IconSelector';
 interface IconPickerProps {
     previewStyle?: React.CSSProperties;
     previewClassName?: string;
@@ -16,13 +17,7 @@ interface IconPickerProps {
     disabled?: boolean;
     /** The icon change callback. */
     onChange: (icon: string) => void;
-    icons?: {
-        icon?: string;
-        src?: string;
-        href?: string;
-        name?: ioBroker.StringOrTranslated;
-        _id?: string;
-    }[];
+    icons?: IconSelectorIcon[];
     onlyRooms?: boolean;
     onlyDevices?: boolean;
 }

package/build/Components/IconPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconPicker.js","sourceRoot":"./src/","sources":["Components/IconPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback } from 'react';\nimport { useDropzone } from 'react-dropzone';\n\nimport { InputLabel, FormControl, IconButton } from '@mui/material';\nimport { Clear as ClearIcon } from '@mui/icons-material';\n\nimport { IconSelector } from './IconSelector';\nimport { Icon } from './Icon';\nimport { I18n } from '../i18n';\nimport { Utils } from './Utils';\n\nconst styles: Record<string, React.CSSProperties> = {\n    formContainer: {\n        display: 'flex',\n        justifyContent: 'left',\n        alignItems: 'center',\n    },\n    formControl: {\n        display: 'flex',\n        padding: 24,\n        flexGrow: 1000,\n    },\n    divContainer: {\n        width: 32 + 32,\n        height: 32,\n        whiteSpace: 'nowrap',\n        lineHeight: '32px',\n        marginRight: 8,\n    },\n    dragField: {\n        textAlign: 'center',\n        display: 'table',\n        minHeight: 90,\n        width: 'calc(100% - 60px)',\n        border: '2px dashed #777',\n        borderRadius: 10,\n        padding: 4,\n    },\n    formIcon: {\n        margin: 10,\n        opacity: 0.6,\n    },\n    text: {\n        display: 'table-cell',\n        verticalAlign: 'middle',\n    },\n};\n\ninterface IconPickerProps {\n    previewStyle?: React.CSSProperties;\n    previewClassName?: string;\n    /** Custom icon element. */\n    icon?: React.FC<{ style?: React.CSSProperties }>;\n    customStyles?: Record<string, React.CSSProperties>;\n    customClasses?: Record<string, string>;\n    /** The label. */\n    label?: string;\n    /** The value. */\n    value?: any;\n    /** Set to true to disable the icon picker. */\n    disabled?: boolean;\n    /** The icon change callback. */\n    onChange: (icon: string) => void;\n    icons?: {\n        icon?: string;\n        src?: string;\n        href?: string;\n        name?: ioBroker.StringOrTranslated;\n        _id?: string;\n    }[];\n    onlyRooms?: boolean;\n    onlyDevices?: boolean;\n}\n\nexport function IconPicker(props: IconPickerProps): React.JSX.Element {\n    const IconCustom = props.icon;\n\n    const onChange = props.onChange;\n\n    const onDrop = useCallback(\n        (acceptedFiles: File[]) => {\n            const reader = new FileReader();\n\n            reader.addEventListener('load', () => onChange(reader.result as string), false);\n\n            if (acceptedFiles[0]) {\n                reader.readAsDataURL(acceptedFiles[0]);\n            }\n        },\n        [onChange],\n    );\n\n    const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop });\n\n    return (\n        <div style={styles.formContainer}>\n            {IconCustom ? <IconCustom style={styles.formIcon} /> : null}\n            <FormControl\n                variant=\"standard\"\n                style={{ ...styles.formControl, padding: 3 }}\n            >\n                <InputLabel\n                    shrink\n                    sx={props.customStyles?.label ? { '&.MuiInputLabel-root': props.customStyles.label } : undefined}\n                    classes={{ root: props.customClasses?.label }}\n                >\n                    {props.label}\n                </InputLabel>\n                <div style={styles.formContainer}>\n                    {props.value ? (\n                        <div style={styles.divContainer}>\n                            <Icon\n                                style={{ ...props.previewStyle, ...(props.customStyles?.icon || undefined) }}\n                                src={props.value}\n                                className={Utils.clsx(props.previewClassName, props.customClasses?.icon)}\n                            />\n                            {!props.disabled && (\n                                <IconButton\n                                    style={{ verticalAlign: 'top' }}\n                                    title={I18n.t('ra_Clear icon')}\n                                    size=\"small\"\n                                    onClick={() => props.onChange('')}\n                                >\n                                    <ClearIcon />\n                                </IconButton>\n                            )}\n                        </div>\n                    ) : (\n                        !props.disabled && (\n                            <IconSelector\n                                icons={props.icons}\n                                onlyRooms={props.onlyRooms}\n                                onlyDevices={props.onlyDevices}\n                                onSelect={(base64: string) => props.onChange(base64)}\n                                t={I18n.t}\n                                lang={I18n.getLanguage()}\n                            />\n                        )\n                    )}\n\n                    {!props.disabled && (\n                        <div\n                            {...getRootProps()}\n                            style={{\n                                ...styles.dragField,\n                                ...(isDragActive ? { backgroundColor: 'rgba(0, 255, 0, 0.1)' } : { cursor: 'pointer' }),\n                            }}\n                        >\n                            <input {...getInputProps()} />\n                            {isDragActive ? (\n                                <span style={styles.text}>{I18n.t('ra_Drop the files here...')}</span>\n                            ) : (\n                                <span style={styles.text}>\n                                    {I18n.t(\"ra_Drag 'n' drop some files here, or click to select files\")}\n                                </span>\n                            )}\n                        </div>\n                    )}\n                </div>\n            </FormControl>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"IconPicker.js","sourceRoot":"./src/","sources":["Components/IconPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAyB,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,MAAM,GAAwC;IAChD,aAAa,EAAE;QACX,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,MAAM;QACtB,UAAU,EAAE,QAAQ;KACvB;IACD,WAAW,EAAE;QACT,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,EAAE;QACX,QAAQ,EAAE,IAAI;KACjB;IACD,YAAY,EAAE;QACV,KAAK,EAAE,EAAE,GAAG,EAAE;QACd,MAAM,EAAE,EAAE;QACV,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,MAAM;QAClB,WAAW,EAAE,CAAC;KACjB;IACD,SAAS,EAAE;QACP,SAAS,EAAE,QAAQ;QACnB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,mBAAmB;QAC1B,MAAM,EAAE,iBAAiB;QACzB,YAAY,EAAE,EAAE;QAChB,OAAO,EAAE,CAAC;KACb;IACD,QAAQ,EAAE;QACN,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,GAAG;KACf;IACD,IAAI,EAAE;QACF,OAAO,EAAE,YAAY;QACrB,aAAa,EAAE,QAAQ;KAC1B;CACJ,CAAC;AAsBF,MAAM,UAAU,UAAU,CAAC,KAAsB;IAC7C,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC;IAE9B,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;IAEhC,MAAM,MAAM,GAAG,WAAW,CACtB,CAAC,aAAqB,EAAE,EAAE;QACtB,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;QAEhC,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAgB,CAAC,EAAE,KAAK,CAAC,CAAC;QAEhF,IAAI,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;YACnB,MAAM,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;QAC3C,CAAC;IACL,CAAC,EACD,CAAC,QAAQ,CAAC,CACb,CAAC;IAEF,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;IAE9E,OAAO,CACH,6BAAK,KAAK,EAAE,MAAM,CAAC,aAAa;QAC3B,UAAU,CAAC,CAAC,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,GAAI,CAAC,CAAC,CAAC,IAAI;QAC3D,oBAAC,WAAW,IACR,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,EAAE,GAAG,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,CAAC,EAAE;YAE5C,oBAAC,UAAU,IACP,MAAM,QACN,EAAE,EAAE,KAAK,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,sBAAsB,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,EAChG,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,IAE5C,KAAK,CAAC,KAAK,CACH;YACb,6BAAK,KAAK,EAAE,MAAM,CAAC,aAAa;gBAC3B,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CACX,6BAAK,KAAK,EAAE,MAAM,CAAC,YAAY;oBAC3B,oBAAC,IAAI,IACD,KAAK,EAAE,EAAE,GAAG,KAAK,CAAC,YAAY,EAAE,GAAG,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,IAAI,SAAS,CAAC,EAAE,EAC5E,GAAG,EAAE,KAAK,CAAC,KAAK,EAChB,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,aAAa,EAAE,IAAI,CAAC,GAC1E;oBACD,CAAC,KAAK,CAAC,QAAQ,IAAI,CAChB,oBAAC,UAAU,IACP,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,EAC/B,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,EAC9B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;wBAEjC,oBAAC,SAAS,OAAG,CACJ,CAChB,CACC,CACT,CAAC,CAAC,CAAC,CACA,CAAC,KAAK,CAAC,QAAQ,IAAI,CACf,oBAAC,YAAY,IACT,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,QAAQ,EAAE,CAAC,MAAc,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,EACpD,CAAC,EAAE,IAAI,CAAC,CAAC,EACT,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,GAC1B,CACL,CACJ;gBAEA,CAAC,KAAK,CAAC,QAAQ,IAAI,CAChB,gCACQ,YAAY,EAAE,EAClB,KAAK,EAAE;wBACH,GAAG,MAAM,CAAC,SAAS;wBACnB,GAAG,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,eAAe,EAAE,sBAAsB,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC;qBAC1F;oBAED,kCAAW,aAAa,EAAE,GAAI;oBAC7B,YAAY,CAAC,CAAC,CAAC,CACZ,8BAAM,KAAK,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAQ,CACzE,CAAC,CAAC,CAAC,CACA,8BAAM,KAAK,EAAE,MAAM,CAAC,IAAI,IACnB,IAAI,CAAC,CAAC,CAAC,4DAA4D,CAAC,CAClE,CACV,CACC,CACT,CACC,CACI,CACZ,CACT,CAAC;AACN,CAAC","sourcesContent":["import React, { useCallback } from 'react';\nimport { useDropzone } from 'react-dropzone';\n\nimport { InputLabel, FormControl, IconButton } from '@mui/material';\nimport { Clear as ClearIcon } from '@mui/icons-material';\n\nimport { IconSelector, type IconSelectorIcon } from './IconSelector';\nimport { Icon } from './Icon';\nimport { I18n } from '../i18n';\nimport { Utils } from './Utils';\n\nconst styles: Record<string, React.CSSProperties> = {\n    formContainer: {\n        display: 'flex',\n        justifyContent: 'left',\n        alignItems: 'center',\n    },\n    formControl: {\n        display: 'flex',\n        padding: 24,\n        flexGrow: 1000,\n    },\n    divContainer: {\n        width: 32 + 32,\n        height: 32,\n        whiteSpace: 'nowrap',\n        lineHeight: '32px',\n        marginRight: 8,\n    },\n    dragField: {\n        textAlign: 'center',\n        display: 'table',\n        minHeight: 90,\n        width: 'calc(100% - 60px)',\n        border: '2px dashed #777',\n        borderRadius: 10,\n        padding: 4,\n    },\n    formIcon: {\n        margin: 10,\n        opacity: 0.6,\n    },\n    text: {\n        display: 'table-cell',\n        verticalAlign: 'middle',\n    },\n};\n\ninterface IconPickerProps {\n    previewStyle?: React.CSSProperties;\n    previewClassName?: string;\n    /** Custom icon element. */\n    icon?: React.FC<{ style?: React.CSSProperties }>;\n    customStyles?: Record<string, React.CSSProperties>;\n    customClasses?: Record<string, string>;\n    /** The label. */\n    label?: string;\n    /** The value. */\n    value?: any;\n    /** Set to true to disable the icon picker. */\n    disabled?: boolean;\n    /** The icon change callback. */\n    onChange: (icon: string) => void;\n    icons?: IconSelectorIcon[];\n    onlyRooms?: boolean;\n    onlyDevices?: boolean;\n}\n\nexport function IconPicker(props: IconPickerProps): React.JSX.Element {\n    const IconCustom = props.icon;\n\n    const onChange = props.onChange;\n\n    const onDrop = useCallback(\n        (acceptedFiles: File[]) => {\n            const reader = new FileReader();\n\n            reader.addEventListener('load', () => onChange(reader.result as string), false);\n\n            if (acceptedFiles[0]) {\n                reader.readAsDataURL(acceptedFiles[0]);\n            }\n        },\n        [onChange],\n    );\n\n    const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop });\n\n    return (\n        <div style={styles.formContainer}>\n            {IconCustom ? <IconCustom style={styles.formIcon} /> : null}\n            <FormControl\n                variant=\"standard\"\n                style={{ ...styles.formControl, padding: 3 }}\n            >\n                <InputLabel\n                    shrink\n                    sx={props.customStyles?.label ? { '&.MuiInputLabel-root': props.customStyles.label } : undefined}\n                    classes={{ root: props.customClasses?.label }}\n                >\n                    {props.label}\n                </InputLabel>\n                <div style={styles.formContainer}>\n                    {props.value ? (\n                        <div style={styles.divContainer}>\n                            <Icon\n                                style={{ ...props.previewStyle, ...(props.customStyles?.icon || undefined) }}\n                                src={props.value}\n                                className={Utils.clsx(props.previewClassName, props.customClasses?.icon)}\n                            />\n                            {!props.disabled && (\n                                <IconButton\n                                    style={{ verticalAlign: 'top' }}\n                                    title={I18n.t('ra_Clear icon')}\n                                    size=\"small\"\n                                    onClick={() => props.onChange('')}\n                                >\n                                    <ClearIcon />\n                                </IconButton>\n                            )}\n                        </div>\n                    ) : (\n                        !props.disabled && (\n                            <IconSelector\n                                icons={props.icons}\n                                onlyRooms={props.onlyRooms}\n                                onlyDevices={props.onlyDevices}\n                                onSelect={(base64: string) => props.onChange(base64)}\n                                t={I18n.t}\n                                lang={I18n.getLanguage()}\n                            />\n                        )\n                    )}\n\n                    {!props.disabled && (\n                        <div\n                            {...getRootProps()}\n                            style={{\n                                ...styles.dragField,\n                                ...(isDragActive ? { backgroundColor: 'rgba(0, 255, 0, 0.1)' } : { cursor: 'pointer' }),\n                            }}\n                        >\n                            <input {...getInputProps()} />\n                            {isDragActive ? (\n                                <span style={styles.text}>{I18n.t('ra_Drop the files here...')}</span>\n                            ) : (\n                                <span style={styles.text}>\n                                    {I18n.t(\"ra_Drag 'n' drop some files here, or click to select files\")}\n                                </span>\n                            )}\n                        </div>\n                    )}\n                </div>\n            </FormControl>\n        </div>\n    );\n}\n"]}

package/build/Components/IconSelector.d.ts

@@ -1,13 +1,15 @@
 import React, { Component } from 'react';
 import type { Translate } from '../types';
+export interface IconObject {
+    icon?: string;
+    src?: string;
+    href?: string;
+    name?: ioBroker.StringOrTranslated;
+    _id?: string;
+}
+export type IconSelectorIcon = IconObject | string;
 interface IconSelectorProps {
-    icons?: {
-        icon?: string;
-        src?: string;
-        href?: string;
-        name?: ioBroker.StringOrTranslated;
-        _id?: string;
-    }[];
+    icons?: IconSelectorIcon[];
     onlyRooms?: boolean;
     onlyDevices?: boolean;
     onSelect?: (icon: string) => void;