@iobroker/adapter-react-v5 6.0.3 → 6.0.5

package/Components/ObjectBrowser.d.ts

@@ -173,6 +173,7 @@ interface ObjectBrowserValueProps {
     }) => void;
     /** Configured theme */
     themeType: ThemeType;
+    theme: IobTheme;
     socket: Connection;
     defaultHistory: string;
     dateFormat: string;

package/Components/ObjectBrowser.js

@@ -457,26 +457,25 @@ const styles = {
     },
     cellButtonsButton: {
         display: 'inline-block',
-        opacity: 0.7,
+        opacity: 0.5,
         width: SMALL_BUTTON_SIZE + 4,
         height: SMALL_BUTTON_SIZE + 4,
         '&:hover': {
             opacity: 1,
         },
-        paddingTop: 0,
-        paddingLeft: 0,
-        marginTop: -2,
+        p: 0,
+        mt: '-2px',
     },
     cellButtonsEmptyButton: {
         fontSize: 12,
     },
     cellButtonMinWidth: {
-        minWidth: 47,
+        minWidth: 40,
     },
     cellButtonsButtonAlone: {
-        marginLeft: SMALL_BUTTON_SIZE + 4,
-        paddingTop: 0,
-        marginTop: -2,
+        ml: `${SMALL_BUTTON_SIZE + 20}px`,
+        pt: 0,
+        mt: '-2px',
     },
     cellButtonsButtonWithCustoms: (theme) => ({
         color: theme.palette.mode === 'dark' ? theme.palette.primary.main : theme.palette.secondary.main,
@@ -596,6 +595,7 @@ const styles = {
     },
     aclText: {
         fontSize: 13,
+        marginTop: 6,
     },
     rightsObject: {
         color: '#55ff55',
@@ -1639,21 +1639,21 @@ function prepareSparkData(values, from) {
     return v;
 }
 exports.ITEM_IMAGES = {
-    state: react_1.default.createElement(IconState_1.default, { className: "itemIcon" }),
-    channel: react_1.default.createElement(IconChannel_1.default, { className: "itemIcon" }),
-    device: react_1.default.createElement(IconDevice_1.default, { className: "itemIcon" }),
-    adapter: react_1.default.createElement(IconAdapter_1.default, { className: "itemIcon" }),
-    meta: react_1.default.createElement(icons_material_1.Description, { className: "itemIcon" }),
-    instance: react_1.default.createElement(IconInstance_1.default, { className: "itemIcon", style: { color: '#7da7ff' } }),
-    enum: react_1.default.createElement(icons_material_1.ListAlt, { className: "itemIcon" }),
-    chart: react_1.default.createElement(icons_material_1.ShowChart, { className: "itemIcon" }),
-    config: react_1.default.createElement(icons_material_1.Settings, { className: "itemIcon" }),
-    group: react_1.default.createElement(icons_material_1.SupervisedUserCircle, { className: "itemIcon" }),
-    user: react_1.default.createElement(icons_material_1.PersonOutlined, { className: "itemIcon" }),
-    host: react_1.default.createElement(icons_material_1.Router, { className: "itemIcon" }),
-    schedule: react_1.default.createElement(icons_material_1.CalendarToday, { className: "itemIcon" }),
-    script: react_1.default.createElement(icons_material_1.Code, { className: "itemIcon" }),
-    folder: react_1.default.createElement(IconClosed_1.default, { className: "itemIcon itemIconFolder" }),
+    state: react_1.default.createElement(IconState_1.default, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    channel: react_1.default.createElement(IconChannel_1.default, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    device: react_1.default.createElement(IconDevice_1.default, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    adapter: react_1.default.createElement(IconAdapter_1.default, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    meta: react_1.default.createElement(icons_material_1.Description, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    instance: react_1.default.createElement(IconInstance_1.default, { className: "itemIcon", style: { color: '#7da7ff', verticalAlign: 'middle' } }),
+    enum: react_1.default.createElement(icons_material_1.ListAlt, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    chart: react_1.default.createElement(icons_material_1.ShowChart, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    config: react_1.default.createElement(icons_material_1.Settings, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    group: react_1.default.createElement(icons_material_1.SupervisedUserCircle, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    user: react_1.default.createElement(icons_material_1.PersonOutlined, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    host: react_1.default.createElement(icons_material_1.Router, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    schedule: react_1.default.createElement(icons_material_1.CalendarToday, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    script: react_1.default.createElement(icons_material_1.Code, { className: "itemIcon", style: { verticalAlign: 'middle' } }),
+    folder: react_1.default.createElement(IconClosed_1.default, { className: "itemIcon itemIconFolder", style: { verticalAlign: 'middle' } }),
 };
 const SCREEN_WIDTHS = {
     // extra-small: 0px
@@ -2557,10 +2557,12 @@ class ObjectBrowserClass extends react_1.Component {
         this.lastSelectedItems = [...this.state.selected];
         if (this.state.selected && this.state.selected.length) {
             this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectSelected`, JSON.stringify(this.lastSelectedItems));
-            const name = this.lastSelectedItems.length === 1
-                ? Utils_1.default.getObjectName(this.objects, this.lastSelectedItems[0], null, { language: this.props.lang })
-                : '';
-            this.props.onSelect && this.props.onSelect(this.lastSelectedItems, name, isDouble);
+            if (this.lastSelectedItems.length === 1 && this.objects[this.lastSelectedItems[0]]) {
+                const name = this.lastSelectedItems.length === 1
+                    ? Utils_1.default.getObjectName(this.objects, this.lastSelectedItems[0], null, { language: this.props.lang })
+                    : '';
+                this.props.onSelect && this.props.onSelect(this.lastSelectedItems, name, isDouble);
+            }
         }
         else {
             this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectSelected`, '');
@@ -3622,8 +3624,9 @@ class ObjectBrowserClass extends react_1.Component {
         var _b, _c, _d;
         if (!item.data.obj) {
             return this.props.onObjectDelete || this.props.objectEditOfAccessControl ? react_1.default.createElement("div", { style: styles.buttonDiv },
-                this.state.filter.expertMode && this.props.objectEditOfAccessControl ? react_1.default.createElement(material_1.IconButton, { sx: Object.assign(Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonsEmptyButton), styles.cellButtonMinWidth), onClick: () => this.setState({ modalEditOfAccess: true, modalEditOfAccessObjData: item.data }), size: "large" }, "---") : null,
-                this.props.onObjectDelete && item.children && item.children.length ? react_1.default.createElement(material_1.IconButton, { style: Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonsButtonAlone), size: "small", "aria-label": "delete", title: this.texts.deleteObject, onClick: () => {
+                this.state.filter.expertMode && this.props.objectEditOfAccessControl ? react_1.default.createElement(material_1.IconButton, { sx: Object.assign(Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonsEmptyButton), styles.cellButtonMinWidth), onClick: () => this.setState({ modalEditOfAccess: true, modalEditOfAccessObjData: item.data }), size: "large" },
+                    react_1.default.createElement("div", { style: { height: 15 } }, "---")) : null,
+                this.props.onObjectDelete && item.children && item.children.length ? react_1.default.createElement(material_1.IconButton, { sx: Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonsButtonAlone), size: "small", "aria-label": "delete", title: this.texts.deleteObject, onClick: () => {
                         var _b;
                         // calculate the number of children
                         const keys = Object.keys(this.objects);
@@ -3655,18 +3658,18 @@ class ObjectBrowserClass extends react_1.Component {
         const showEdit = this.state.filter.expertMode || _a.isNonExpertId(item.data.id);
         return [
             this.state.filter.expertMode && this.props.objectEditOfAccessControl ? react_1.default.createElement(material_1.Tooltip, { key: "acl", title: item.data.aclTooltip, componentsProps: { popper: { sx: styles.tooltip } } },
-                react_1.default.createElement(material_1.IconButton, { style: styles.cellButtonMinWidth, onClick: () => this.setState({ modalEditOfAccess: true, modalEditOfAccessObjData: item.data }), size: "large" },
+                react_1.default.createElement(material_1.IconButton, { sx: Object.assign(Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonMinWidth), { opacity: 1 }), onClick: () => this.setState({ modalEditOfAccess: true, modalEditOfAccessObjData: item.data }), size: "large" },
                     react_1.default.createElement("div", { style: styles.aclText }, Number.isNaN(Number(acl))
                         ? Number(aclSystemConfig).toString(16)
                         : Number(acl).toString(16)))) :
                 react_1.default.createElement("div", { key: "aclEmpty", style: styles.cellButtonMinWidth }),
-            showEdit ? react_1.default.createElement(material_1.IconButton, { key: "edit", style: styles.cellButtonsButton, size: "small", "aria-label": "edit", title: this.texts.editObject, onClick: () => {
+            showEdit ? react_1.default.createElement(material_1.IconButton, { key: "edit", sx: Object.assign(Object.assign({}, styles.cellButtonsButton), styles.cellButtonMinWidth), size: "small", "aria-label": "edit", title: this.texts.editObject, onClick: () => {
                     this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectSelected`, id);
                     this.setState({ editObjectDialog: id, editObjectAlias: false });
                 } },
                 react_1.default.createElement(icons_material_1.Edit, { style: styles.cellButtonsButtonIcon })) :
-                react_1.default.createElement("div", { key: "editDisabled", style: styles.cellButtonsButton }),
-            this.props.onObjectDelete && (((_b = item.children) === null || _b === void 0 ? void 0 : _b.length) || !((_c = item.data.obj.common) === null || _c === void 0 ? void 0 : _c.dontDelete)) ? react_1.default.createElement(material_1.IconButton, { key: "delete", style: styles.cellButtonsButton, size: "small", "aria-label": "delete", onClick: () => {
+                react_1.default.createElement(material_1.Box, { component: "div", key: "editDisabled", sx: styles.cellButtonsButton }),
+            this.props.onObjectDelete && (((_b = item.children) === null || _b === void 0 ? void 0 : _b.length) || !((_c = item.data.obj.common) === null || _c === void 0 ? void 0 : _c.dontDelete)) ? react_1.default.createElement(material_1.IconButton, { key: "delete", sx: styles.cellButtonsButton, size: "small", "aria-label": "delete", onClick: () => {
                     var _b, _c, _d;
                     const keys = Object.keys(this.objects);
                     keys.sort();
@@ -3687,7 +3690,7 @@ class ObjectBrowserClass extends react_1.Component {
                 this.info.hasSomeCustoms &&
                 item.data.obj.type === 'state' &&
                 // @ts-expect-error deprecated from js-controller 6
-                ((_d = item.data.obj.common) === null || _d === void 0 ? void 0 : _d.type) !== 'file' ? react_1.default.createElement(material_1.IconButton, { xs: Object.assign(Object.assign({}, styles.cellButtonsButton), (item.data.hasCustoms
+                ((_d = item.data.obj.common) === null || _d === void 0 ? void 0 : _d.type) !== 'file' ? react_1.default.createElement(material_1.IconButton, { sx: Object.assign(Object.assign({}, styles.cellButtonsButton), (item.data.hasCustoms
                     ? this.styles.cellButtonsButtonWithCustoms
                     : styles.cellButtonsButtonWithoutCustoms)), key: "custom", size: "small", "aria-label": "config", title: this.texts.customConfig, onClick: () => {
                     var _b;
@@ -3755,7 +3758,6 @@ class ObjectBrowserClass extends react_1.Component {
         var _b, _c;
         const obj = this.objects[id];
         const state = this.states[id];
-        const classes = styles;
         const { valFull, fileViewer } = formatValue({
             state,
             obj: obj,
@@ -3767,7 +3769,7 @@ class ObjectBrowserClass extends react_1.Component {
         const valFullRx = [];
         valFull === null || valFull === void 0 ? void 0 : valFull.forEach(_item => {
             if (_item.t === this.texts.quality && state.q) {
-                valFullRx.push(react_1.default.createElement("div", { style: classes.cellValueTooltipBoth, key: _item.t },
+                valFullRx.push(react_1.default.createElement("div", { style: styles.cellValueTooltipBoth, key: _item.t },
                     _item.t,
                     ":\u00A0",
                     _item.v));
@@ -3775,15 +3777,15 @@ class ObjectBrowserClass extends react_1.Component {
                 !_item.nbr && valFullRx.push(react_1.default.createElement("br", { key: `${_item.t}_br` }));
             }
             else {
-                valFullRx.push(react_1.default.createElement("div", { style: classes.cellValueTooltipTitle, key: _item.t },
+                valFullRx.push(react_1.default.createElement("div", { style: styles.cellValueTooltipTitle, key: _item.t },
                     _item.t,
                     ":\u00A0"));
-                valFullRx.push(react_1.default.createElement("div", { style: classes.cellValueTooltipValue, key: `${_item.t}_v` }, _item.v));
+                valFullRx.push(react_1.default.createElement("div", { style: styles.cellValueTooltipValue, key: `${_item.t}_v` }, _item.v));
                 !_item.nbr && valFullRx.push(react_1.default.createElement("br", { key: `${_item.t}_br` }));
             }
         });
         if (fileViewer === 'image') {
-            valFullRx.push(react_1.default.createElement("img", { style: classes.cellValueTooltipImage, src: state.val, alt: id }));
+            valFullRx.push(react_1.default.createElement("img", { style: styles.cellValueTooltipImage, src: state.val, alt: id }));
         }
         else if (this.defaultHistory &&
             ((_c = (_b = this.objects[id]) === null || _b === void 0 ? void 0 : _b.common) === null || _c === void 0 ? void 0 : _c.custom) &&
@@ -5297,7 +5299,7 @@ class ObjectBrowserClass extends react_1.Component {
             : typeof this.edit.val;
         const role = this.objects[this.edit.id].common.role;
         const ObjectBrowserValue = this.props.objectBrowserValue;
-        return react_1.default.createElement(ObjectBrowserValue, { t: this.props.t, lang: this.props.lang, type: type, role: role || '', states: Utils_1.default.getStates(this.objects[this.edit.id]), themeType: this.props.themeType, expertMode: !!this.state.filter.expertMode, value: this.edit.val, socket: this.props.socket, object: this.objects[this.edit.id], defaultHistory: this.defaultHistory, dateFormat: this.props.dateFormat || this.systemConfig.common.dateFormat, isFloatComma: this.props.isFloatComma === undefined ? this.systemConfig.common.isFloatComma : this.props.isFloatComma, onClose: (res) => {
+        return react_1.default.createElement(ObjectBrowserValue, { t: this.props.t, lang: this.props.lang, type: type, role: role || '', states: Utils_1.default.getStates(this.objects[this.edit.id]), themeType: this.props.themeType, theme: this.props.theme, expertMode: !!this.state.filter.expertMode, value: this.edit.val, socket: this.props.socket, object: this.objects[this.edit.id], defaultHistory: this.defaultHistory, dateFormat: this.props.dateFormat || this.systemConfig.common.dateFormat, isFloatComma: this.props.isFloatComma === undefined ? this.systemConfig.common.isFloatComma : this.props.isFloatComma, onClose: (res) => {
                 this.setState({ updateOpened: false });
                 res && this.onUpdate(res);
             } });

package/Components/TableResize.d.ts

@@ -10,7 +10,8 @@ interface TableResizeProps {
     ready?: boolean;
     stickyHeader?: boolean;
     size?: 'small' | 'medium';
-    className: string;
+    className?: string;
+    sx?: Record<string, any>;
     style?: React.CSSProperties;
     initialWidths?: (number | 'auto')[];
     minWidths?: number[];

package/Components/TableResize.js

@@ -220,7 +220,7 @@ class TableResize extends react_1.Component {
             return react_1.default.createElement(material_1.Skeleton, null);
         }
         const style = { gridTemplateColumns: this.resizerApplyWidths() };
-        return react_1.default.createElement(material_1.Table, { stickyHeader: this.props.stickyHeader, size: this.props.size || 'small', className: this.props.className, ref: this.resizerRefTable, style: (Object.assign(Object.assign({}, this.props.style || {}), style)) }, this.props.children);
+        return react_1.default.createElement(material_1.Table, { stickyHeader: this.props.stickyHeader, size: this.props.size || 'small', className: this.props.className, sx: this.props.sx, ref: this.resizerRefTable, style: (Object.assign(Object.assign({}, (this.props.style || undefined)), style)) }, this.props.children);
     }
 }
 exports.default = TableResize;

package/Components/Utils.js

@@ -116,7 +116,7 @@ class Utils {
                 text = text[0] + text.substring(1).toLowerCase();
             }
         }
-        else if (!isDesc && item.common) {
+        else if (!isDesc && (item === null || item === void 0 ? void 0 : item.common)) {
             const textObj = item.common.name || item.common.desc;
             if (textObj && typeof textObj === 'object') {
                 text = (options.language && textObj[options.language]) || textObj.en || textObj.de || textObj.ru || '';
@@ -1308,14 +1308,7 @@ class Utils {
             text = `${dateObj.getFullYear()}-${mm}-${dd}`;
         }
         // time
-        let v = dateObj.getHours().toString().padStart(2, '0');
-        text += ` ${v}`;
-        v = dateObj.getMinutes().toString().toString();
-        text += `:${v}`;
-        v = dateObj.getSeconds().toString().padStart(2, '0');
-        text += `:${v}`;
-        v = dateObj.getMilliseconds().toString().padStart(3, '0');
-        text += `.${v}`;
+        text += ` ${dateObj.getHours().toString().padStart(2, '0')}:${dateObj.getMinutes().toString().padStart(2, '0')}:${dateObj.getSeconds().toString().padStart(2, '0')}.${dateObj.getMilliseconds().toString().padStart(3, '0')}`;
         return text;
     }
     /*

package/README.md

@@ -759,7 +759,7 @@ The best practice is to replace `padding` with `p` and `margin` with `m`, so you
   Before: `<Tooltip title={this.props.t('ra_Refresh tree')} classes={{ popper: styles.tooltip }}>`
   
   After: `<Tooltip title={this.props.t('ra_Refresh tree')} componentsProps={{ popper: { sx: { pointerEvents: 'none' } } }}>`
-  Or: `<Tooltip title={this.props.t('ra_Refresh tree')} componentsProps={{ popper: { sx: styles.tooltip } }}>`
+  Or: `<Tooltip title={this.props.t('ra_Refresh tree')} elr>`
 
   Before. `<AccordionSummary classes={{ root: styles.rootStyle, content: styles.content }}>`
 
@@ -771,7 +771,10 @@ The best practice is to replace `padding` with `p` and `margin` with `m`, so you
 -->
 
 ## Changelog
-### 6.0.3 (2024-06-21)
+### 6.0.5 (2024-06-24)
+* (bluefox) Synchronised with admin
+
+### 6.0.4 (2024-06-21)
 * (bluefox) Removed the usage of `withStyles` in favor of `sx` and `style` properties (see [Migration from v5 to v6](#migration-from-v5-to-v6)
 * (bluefox) (BREAKING) Higher version of `@mui/material` (5.15.20) is used
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iobroker/adapter-react-v5",
-  "version": "6.0.3",
+  "version": "6.0.5",
   "description": "React classes to develop admin interfaces for ioBroker with react.",
   "author": {
     "name": "Denis Haev (bluefox)",
@@ -35,8 +35,8 @@
     "@iobroker/js-controller-common-db": "^6.0.5",
     "@mui/icons-material": "^5.15.20",
     "@mui/material": "^5.15.20",
-    "@mui/x-date-pickers": "^7.7.0",
-    "@sentry/browser": "^8.10.0",
+    "@mui/x-date-pickers": "^7.7.1",
+    "@sentry/browser": "^8.11.0",
     "react-color": "^2.19.3",
     "react-colorful": "^5.6.1",
     "react-cropper": "^2.3.3",