@iobroker/adapter-react-v5 3.2.2 → 3.2.3

package/Components/ColorPicker.d.ts

@@ -108,6 +108,7 @@ declare class ColorPicker extends React.Component<ColorPickerProps, any, any> {
     state: {
         displayColorPicker: boolean;
         color: any;
+        anchorEl: any;
     };
     /**
      * @private
@@ -131,7 +132,6 @@ declare namespace ColorPicker {
         const name: PropTypes.Requireable<string>;
         const style: PropTypes.Requireable<object>;
         const className: PropTypes.Requireable<string>;
-        const openAbove: PropTypes.Requireable<boolean>;
     }
 }
 import React from "react";

package/Components/ColorPicker.js

@@ -17,9 +17,10 @@ var _react = _interopRequireDefault(require("react"));
 var _reactColor = require("react-color");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _withStyles = _interopRequireDefault(require("@mui/styles/withStyles"));
-var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
-var _Delete = _interopRequireDefault(require("@mui/icons-material/Delete"));
+var _material = require("@mui/material");
+var _iconsMaterial = require("@mui/icons-material");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 var styles = function styles(theme) {
@@ -30,8 +31,8 @@ var styles = function styles(theme) {
       borderRadius: 2
     },
     delButton: {
-      //width: 32,
-      //height: 32,
+      // width: 32,
+      // height: 32,
       marginTop: 16
     },
     swatch: {
@@ -49,8 +50,20 @@ var styles = function styles(theme) {
       cursor: 'default'
     },
     popover: {
-      position: 'absolute',
-      zIndex: 2
+      // position: 'absolute',
+      // zIndex: 2,
+      backgroundColor: '#00000000',
+      textAlign: 'right'
+    },
+    popoverList: {
+      padding: 0
+    },
+    closeButton: {
+      backgroundColor: "".concat(theme.palette.background.paper, " !important"),
+      borderRadius: '0 0 25% 25%',
+      '&:hover': {
+        backgroundColor: "".concat(theme.palette.secondary.main, " !important")
+      }
     },
     cover: {
       position: 'fixed',
@@ -62,6 +75,9 @@ var styles = function styles(theme) {
     textDense: {
       marginTop: 0,
       marginBottom: 0
+    },
+    picker: {
+      background: "".concat(theme.palette.background.paper, " !important")
     }
   };
 };
@@ -96,25 +112,29 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
     var _this;
     (0, _classCallCheck2["default"])(this, ColorPicker);
     _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function () {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function (e) {
       _this.setState({
-        displayColorPicker: !_this.state.displayColorPicker
+        displayColorPicker: !_this.state.displayColorPicker,
+        anchorEl: _this.state.displayColorPicker ? null : e.currentTarget
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClose", function () {
       _this.setState({
-        displayColorPicker: false
+        displayColorPicker: false,
+        anchorEl: null
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleChange", function (color) {
       _this.setState({
         color: color
+      }, function () {
+        return _this.props.onChange && _this.props.onChange(ColorPicker.getColor(color));
       });
-      _this.props.onChange && _this.props.onChange(ColorPicker.getColor(color));
     });
     _this.state = {
       displayColorPicker: false,
-      color: _this.props.value || _this.props.color
+      color: _this.props.value || _this.props.color,
+      anchorEl: null
     };
     return _this;
   }
@@ -129,18 +149,12 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
       var color = ColorPicker.getColor(this.state.color);
-      var style = {};
-      if (this.state.displayColorPicker && this.props.openAbove) {
-        style = {
-          top: -241
-        };
-      }
+      var style = _objectSpread({}, this.props.style || {});
+      style.position = 'relative';
       return /*#__PURE__*/_react["default"].createElement("div", {
-        style: Object.assign({}, this.props.style || {}, {
-          position: 'relative'
-        }),
+        style: style,
         className: this.props.className || ''
-      }, /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
+      }, /*#__PURE__*/_react["default"].createElement(_material.TextField, {
         disabled: this.props.disabled,
         variant: "standard",
         id: "name",
@@ -159,7 +173,7 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
         onChange: function onChange(e) {
           return _this2.handleChange(e.target.value);
         }
-      }), color ? /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      }), color ? /*#__PURE__*/_react["default"].createElement(_material.IconButton, {
         disabled: this.props.disabled,
         onClick: function onClick() {
           return _this2.handleChange('');
@@ -170,30 +184,43 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
           opacity: 0,
           cursor: 'default'
         }
-      }, /*#__PURE__*/_react["default"].createElement(_Delete["default"], null)) : null, /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(this.props.classes.swatch).concat(this.props.disabled ? ' ' + this.props.classes.swatchDisabled : ''),
-        onClick: function onClick() {
-          return !_this2.props.disabled && _this2.handleClick();
+      }, /*#__PURE__*/_react["default"].createElement(_iconsMaterial.Delete, null)) : null, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "".concat(this.props.classes.swatch).concat(this.props.disabled ? " ".concat(this.props.classes.swatchDisabled) : ''),
+        onClick: function onClick(e) {
+          return !_this2.props.disabled && _this2.handleClick(e);
         }
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: this.props.classes.color,
         style: {
           background: color
         }
-      })), this.state.displayColorPicker && !this.props.disabled ? /*#__PURE__*/_react["default"].createElement("div", {
-        className: this.props.classes.popover,
-        style: style
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        className: this.props.classes.cover,
-        onClick: function onClick() {
+      })), this.state.displayColorPicker && !this.props.disabled ? /*#__PURE__*/_react["default"].createElement(_material.Menu, {
+        classes: {
+          paper: this.props.classes.popover,
+          list: this.props.classes.popoverList
+        },
+        anchorEl: this.state.anchorEl,
+        open: !0,
+        onClose: function onClose() {
           return _this2.handleClose();
         }
-      }), /*#__PURE__*/_react["default"].createElement(_reactColor.ChromePicker, {
+      }, /*#__PURE__*/_react["default"].createElement(_reactColor.ChromePicker, {
+        className: this.props.classes.picker,
         color: this.state.color,
-        onChangeComplete: function onChangeComplete(color) {
-          return _this2.handleChange(color);
+        onChangeComplete: function onChangeComplete(_color) {
+          return _this2.handleChange(_color);
+        },
+        styles: {
+          picker: {
+            background: '#112233'
+          }
         }
-      })) : null);
+      }), /*#__PURE__*/_react["default"].createElement(_material.IconButton, {
+        className: this.props.classes.closeButton,
+        onClick: function onClick() {
+          return _this2.handleClose();
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_iconsMaterial.Close, null))) : null);
     }
   }], [{
     key: "getDerivedStateFromProps",
@@ -204,9 +231,8 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
         return {
           color: props.value || props.color
         };
-      } else {
-        return null;
       }
+      return null;
     }
 
     /**
@@ -225,20 +251,16 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
       if (color && (0, _typeof2["default"])(color) === 'object') {
         if (color.rgb) {
           if (isHex) {
-            return '#' + color.rgb.r.toString(16).padStart(2, '0') + color.rgb.g.toString(16).padStart(2, '0') + color.rgb.b.toString(16).padStart(2, '0');
-          } else {
-            return 'rgba(' + color.rgb.r + ',' + color.rgb.g + ',' + color.rgb.b + ',' + color.rgb.a + ')';
-          }
-        } else {
-          if (isHex) {
-            return '#' + color.r.toString(16).padStart(2, '0') + color.g.toString(16).padStart(2, '0') + color.b.toString(16).padStart(2, '0');
-          } else {
-            return 'rgba(' + color.r + ',' + color.g + ',' + color.b + ',' + color.a + ')';
+            return "#".concat(color.rgb.r.toString(16).padStart(2, '0')).concat(color.rgb.g.toString(16).padStart(2, '0')).concat(color.rgb.b.toString(16).padStart(2, '0'));
           }
+          return "rgba(".concat(color.rgb.r, ",").concat(color.rgb.g, ",").concat(color.rgb.b, ",").concat(color.rgb.a, ")");
+        }
+        if (isHex) {
+          return "#".concat(color.r.toString(16).padStart(2, '0')).concat(color.g.toString(16).padStart(2, '0')).concat(color.b.toString(16).padStart(2, '0'));
         }
-      } else {
-        return isHex ? ColorPicker.rgb2hex(color || '') : color || '';
+        return "rgba(".concat(color.r, ",").concat(color.g, ",").concat(color.b, ",").concat(color.a, ")");
       }
+      return isHex ? ColorPicker.rgb2hex(color || '') : color || '';
     }
 
     /**
@@ -250,7 +272,10 @@ var ColorPicker = /*#__PURE__*/function (_React$Component) {
     key: "rgb2hex",
     value: function rgb2hex(rgb) {
       var m = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
-      return m && m.length === 4 ? '#' + parseInt(m[1], 10).toString(16).padStart(2, '0') + parseInt(m[2], 10).toString(16).padStart(2, '0') + parseInt(m[3], 10).toString(16).padStart(2, '0') : rgb;
+      var r = parseInt(m[1], 10).toString(16).padStart(2, '0');
+      var g = parseInt(m[2], 10).toString(16).padStart(2, '0');
+      var b = parseInt(m[3], 10).toString(16).padStart(2, '0');
+      return m && m.length === 4 ? "#".concat(r).concat(g).concat(b) : rgb;
     }
 
     /**
@@ -265,8 +290,7 @@ ColorPicker.propTypes = {
   onChange: _propTypes["default"].func.isRequired,
   name: _propTypes["default"].string,
   style: _propTypes["default"].object,
-  className: _propTypes["default"].string,
-  openAbove: _propTypes["default"].bool
+  className: _propTypes["default"].string
 };
 
 /** @type {typeof ColorPicker} */

package/Components/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","names":["styles","theme","color","width","height","borderRadius","delButton","marginTop","swatch","padding","background","boxShadow","display","cursor","verticalAlign","swatchDisabled","opacity","popover","position","zIndex","cover","top","right","bottom","left","textDense","marginBottom","ColorPicker","props","setState","displayColorPicker","state","onChange","getColor","value","style","openAbove","Object","assign","className","disabled","marginRight","name","root","classes","e","handleChange","target","handleClick","handleClose","pColor","sColor","isHex","rgb","r","toString","padStart","g","b","a","rgb2hex","m","match","length","parseInt","React","Component","propTypes","PropTypes","bool","string","func","isRequired","object","_export","withStyles"],"sources":["ColorPicker.js"],"sourcesContent":["/**\n * Copyright 2018-2022 bluefox <dogafox@gmail.com>\n *\n * Licensed under the Creative Commons Attribution-NonCommercial License, Version 4.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://creativecommons.org/licenses/by-nc/4.0/legalcode.txt\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n **/\nimport React from 'react';\nimport {ChromePicker} from 'react-color';\nimport PropTypes from 'prop-types';\nimport withStyles from '@mui/styles/withStyles';\n\nimport TextField from '@mui/material/TextField';\nimport IconButton from '@mui/material/IconButton';\nimport IconDelete from '@mui/icons-material/Delete';\n\nconst styles = theme => ({\n    color: {\n        width: 36,\n        height: 14,\n        borderRadius: 2,\n    },\n    delButton: {\n        //width: 32,\n        //height: 32,\n        marginTop: 16,\n    },\n    swatch: {\n        marginTop: 16,\n        padding: 5,\n        background: '#fff',\n        borderRadius: 1,\n        boxShadow: '0 0 0 1px rgba(0,0,0,.1)',\n        display: 'inline-block',\n        cursor: 'pointer',\n        verticalAlign: 'middle',\n    },\n    swatchDisabled: {\n        opacity: 0.5,\n        cursor: 'default'\n    },\n    popover: {\n        position: 'absolute',\n        zIndex: 2,\n    },\n    cover: {\n        position: 'fixed',\n        top: 0,\n        right: 0,\n        bottom: 0,\n        left: 0,\n    },\n    textDense: {\n        marginTop: 0,\n        marginBottom: 0,\n    }\n});\n\n/**\n * @typedef {object} Rgb\n * @property {number} r The red component of the color (0-255).\n * @property {number} g The green component of the color (0-255).\n * @property {number} b The blue component of the color (0-255).\n * @property {number} a The alpha component of the color (0-255).\n *\n * @typedef {string | Rgb | { rgb: Rgb }} Color Definition of a color.\n *\n * @typedef {object} ColorPickerProps\n * @property {boolean} [disabled] Set to true to disable the color picker.\n * @property {Color} [value] The currently selected color.\n * @property {(rgba: string) => void} [onChange] The color change callback.\n * @property {string} [name] The name.\n * @property {React.CSSProperties} [style] Additional styling for this component.\n * @property {string} [className] The CSS class name.\n * @property {boolean} [openAbove] Open the color picker above the field?\n *\n * @extends {React.Component<ColorPickerProps>}\n */\nclass ColorPicker extends React.Component {\n    /**\n     * @param {Readonly<ColorPickerProps>} props\n     */\n    constructor(props) {\n        super(props);\n        this.state = {\n            displayColorPicker: false,\n            color: this.props.value || this.props.color,\n        };\n    }\n\n    /**\n     * Get the state derived from the given properties and state.\n     * @param {{ color: Color; }} props\n     * @param {{ color: Color; }} state\n     */\n    static getDerivedStateFromProps(props, state) {\n        const pColor = ColorPicker.getColor(props.value || props.color);\n        const sColor = ColorPicker.getColor(state.color);\n        if (pColor !== sColor) {\n            return {color: props.value || props.color}\n        } else {\n            return null;\n        }\n    }\n\n    /**\n     * @private\n     */\n    handleClick = () => {\n        this.setState({displayColorPicker: !this.state.displayColorPicker});\n    };\n\n    /**\n     * @private\n     */\n    handleClose = () => {\n        this.setState({displayColorPicker: false});\n    };\n\n    /**\n     * Convert the given color to hex ('#rrggbb') or rgba ('rgba(r,g,b,a)') format.\n     * @param {Color} [color]\n     * @param {boolean} [isHex] The returning string should be in hex format\n     * @returns {string} the hex or rgba representation of the given color.\n     */\n    static getColor(color, isHex) {\n        if (color && typeof color === 'object') {\n            if (color.rgb) {\n                if (isHex) {\n                    return '#' + color.rgb.r.toString(16).padStart(2, '0') + color.rgb.g.toString(16).padStart(2, '0') + color.rgb.b.toString(16).padStart(2, '0');\n                } else {\n                    return 'rgba(' + color.rgb.r + ',' + color.rgb.g + ',' + color.rgb.b + ',' + color.rgb.a + ')';\n                }\n            } else {\n                if (isHex) {\n                    return '#' + color.r.toString(16).padStart(2, '0') + color.g.toString(16).padStart(2, '0') + color.b.toString(16).padStart(2, '0');\n                } else {\n                    return 'rgba(' + color.r + ',' + color.g + ',' + color.b + ',' + color.a + ')';\n                }\n            }\n        } else {\n            return isHex ? ColorPicker.rgb2hex(color || '') : color || '';\n        }\n    }\n\n    /**\n     * Convert rgb() or rgba() format to hex format #rrggbb.\n     * @param {string} rgb\n     * @returns {string}\n     */\n    static rgb2hex(rgb){\n        const m = rgb.match(/^rgba?[\\s+]?\\([\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?/i);\n\n        return m && m.length === 4 ? '#' +\n            parseInt(m[1],10).toString(16).padStart(2, '0') +\n            parseInt(m[2],10).toString(16).padStart(2, '0') +\n            parseInt(m[3],10).toString(16).padStart(2, '0') : rgb;\n    }\n\n    /**\n     * @private\n     */\n    handleChange = color => {\n        this.setState({color});\n        this.props.onChange && this.props.onChange(ColorPicker.getColor(color));\n    };\n\n    render() {\n        const color = ColorPicker.getColor(this.state.color);\n        let style = {};\n\n        if (this.state.displayColorPicker && this.props.openAbove) {\n            style = {\n                top: -241,\n            };\n        }\n\n        return <div\n            style={Object.assign({}, this.props.style || {}, {position: 'relative'})}\n            className={ this.props.className || ''}\n        >\n            <TextField\n                disabled={this.props.disabled}\n                variant=\"standard\"\n                id=\"name\"\n                style={color ? {width: 'calc(100% - 80px)'} : {width: 'calc(100% - 54px)', marginRight: 8}}\n                label={this.props.name || 'color'}\n                value={color}\n                margin=\"dense\"\n                classes={{root: this.props.classes.textDense}}\n                onChange={e => this.handleChange(e.target.value)}\n            />\n            {color ? <IconButton\n                disabled={this.props.disabled}\n                onClick={() => this.handleChange('')}\n                size=\"small\"\n                className={this.props.classes.delButton}\n                style={color ? {} : {opacity: 0, cursor: 'default'}}\n            ><IconDelete/></IconButton> : null}\n            <div className={`${this.props.classes.swatch}${this.props.disabled ? ' ' + this.props.classes.swatchDisabled : ''}`} onClick={() => !this.props.disabled && this.handleClick()}>\n                <div className={this.props.classes.color} style={{background: color}} />\n            </div>\n            { this.state.displayColorPicker && !this.props.disabled ? <div className={this.props.classes.popover} style={style}>\n                <div className={this.props.classes.cover} onClick={() => this.handleClose()}/>\n                <ChromePicker color={ this.state.color } onChangeComplete={color => this.handleChange(color)} />\n            </div> : null }\n        </div>;\n    }\n}\n\nColorPicker.propTypes = {\n    disabled: PropTypes.bool,\n    value: PropTypes.string,\n    onChange: PropTypes.func.isRequired,\n    name: PropTypes.string,\n    style: PropTypes.object,\n    className: PropTypes.string,\n    openAbove: PropTypes.bool,\n};\n\n/** @type {typeof ColorPicker} */\nconst _export = withStyles(styles)(ColorPicker);\nexport default _export;"],"mappings":"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"}
+{"version":3,"file":"ColorPicker.js","names":["styles","theme","color","width","height","borderRadius","delButton","marginTop","swatch","padding","background","boxShadow","display","cursor","verticalAlign","swatchDisabled","opacity","popover","backgroundColor","textAlign","popoverList","closeButton","palette","paper","secondary","main","cover","position","top","right","bottom","left","textDense","marginBottom","picker","ColorPicker","props","e","setState","displayColorPicker","state","anchorEl","currentTarget","onChange","getColor","value","style","className","disabled","marginRight","name","root","classes","handleChange","target","handleClick","list","handleClose","_color","pColor","sColor","isHex","rgb","r","toString","padStart","g","b","a","rgb2hex","m","match","parseInt","length","React","Component","propTypes","PropTypes","bool","string","func","isRequired","object","_export","withStyles"],"sources":["ColorPicker.js"],"sourcesContent":["/**\n * Copyright 2018-2022 bluefox <dogafox@gmail.com>\n *\n * Licensed under the Creative Commons Attribution-NonCommercial License, Version 4.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://creativecommons.org/licenses/by-nc/4.0/legalcode.txt\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n **/\nimport React from 'react';\nimport { ChromePicker } from 'react-color';\nimport PropTypes from 'prop-types';\nimport withStyles from '@mui/styles/withStyles';\n\nimport { TextField, Menu, IconButton } from '@mui/material';\nimport { Delete as IconDelete, Close as IconClose } from '@mui/icons-material';\n\nconst styles = theme => ({\n    color: {\n        width: 36,\n        height: 14,\n        borderRadius: 2,\n    },\n    delButton: {\n        // width: 32,\n        // height: 32,\n        marginTop: 16,\n    },\n    swatch: {\n        marginTop: 16,\n        padding: 5,\n        background: '#fff',\n        borderRadius: 1,\n        boxShadow: '0 0 0 1px rgba(0,0,0,.1)',\n        display: 'inline-block',\n        cursor: 'pointer',\n        verticalAlign: 'middle',\n    },\n    swatchDisabled: {\n        opacity: 0.5,\n        cursor: 'default',\n    },\n    popover: {\n        // position: 'absolute',\n        // zIndex: 2,\n        backgroundColor: '#00000000',\n        textAlign: 'right',\n    },\n    popoverList: {\n        padding: 0,\n    },\n    closeButton: {\n        backgroundColor: `${theme.palette.background.paper} !important`,\n        borderRadius: '0 0 25% 25%',\n        '&:hover': {\n            backgroundColor: `${theme.palette.secondary.main} !important`,\n        },\n    },\n    cover: {\n        position: 'fixed',\n        top: 0,\n        right: 0,\n        bottom: 0,\n        left: 0,\n    },\n    textDense: {\n        marginTop: 0,\n        marginBottom: 0,\n    },\n    picker: {\n        background: `${theme.palette.background.paper} !important`,\n    },\n});\n\n/**\n * @typedef {object} Rgb\n * @property {number} r The red component of the color (0-255).\n * @property {number} g The green component of the color (0-255).\n * @property {number} b The blue component of the color (0-255).\n * @property {number} a The alpha component of the color (0-255).\n *\n * @typedef {string | Rgb | { rgb: Rgb }} Color Definition of a color.\n *\n * @typedef {object} ColorPickerProps\n * @property {boolean} [disabled] Set to true to disable the color picker.\n * @property {Color} [value] The currently selected color.\n * @property {(rgba: string) => void} [onChange] The color change callback.\n * @property {string} [name] The name.\n * @property {React.CSSProperties} [style] Additional styling for this component.\n * @property {string} [className] The CSS class name.\n * @property {boolean} [openAbove] Open the color picker above the field?\n *\n * @extends {React.Component<ColorPickerProps>}\n */\nclass ColorPicker extends React.Component {\n    /**\n     * @param {Readonly<ColorPickerProps>} props\n     */\n    constructor(props) {\n        super(props);\n        this.state = {\n            displayColorPicker: false,\n            color: this.props.value || this.props.color,\n            anchorEl: null,\n        };\n    }\n\n    /**\n     * Get the state derived from the given properties and state.\n     * @param {{ color: Color; }} props\n     * @param {{ color: Color; }} state\n     */\n    static getDerivedStateFromProps(props, state) {\n        const pColor = ColorPicker.getColor(props.value || props.color);\n        const sColor = ColorPicker.getColor(state.color);\n        if (pColor !== sColor) {\n            return {  color: props.value || props.color };\n        }\n        return null;\n    }\n\n    /**\n     * @private\n     */\n    handleClick = e => {\n        this.setState({ displayColorPicker: !this.state.displayColorPicker, anchorEl: this.state.displayColorPicker ? null : e.currentTarget });\n    };\n\n    /**\n     * @private\n     */\n    handleClose = () => {\n        this.setState({ displayColorPicker: false, anchorEl: null });\n    };\n\n    /**\n     * Convert the given color to hex ('#rrggbb') or rgba ('rgba(r,g,b,a)') format.\n     * @param {Color} [color]\n     * @param {boolean} [isHex] The returning string should be in hex format\n     * @returns {string} the hex or rgba representation of the given color.\n     */\n    static getColor(color, isHex) {\n        if (color && typeof color === 'object') {\n            if (color.rgb) {\n                if (isHex) {\n                    return `#${color.rgb.r.toString(16).padStart(2, '0')}${color.rgb.g.toString(16).padStart(2, '0')}${color.rgb.b.toString(16).padStart(2, '0')}`;\n                }\n                return `rgba(${color.rgb.r},${color.rgb.g},${color.rgb.b},${color.rgb.a})`;\n            }\n            if (isHex) {\n                return `#${color.r.toString(16).padStart(2, '0')}${color.g.toString(16).padStart(2, '0')}${color.b.toString(16).padStart(2, '0')}`;\n            }\n            return `rgba(${color.r},${color.g},${color.b},${color.a})`;\n        }\n        return isHex ? ColorPicker.rgb2hex(color || '') : color || '';\n    }\n\n    /**\n     * Convert rgb() or rgba() format to hex format #rrggbb.\n     * @param {string} rgb\n     * @returns {string}\n     */\n    static rgb2hex(rgb) {\n        const m = rgb.match(/^rgba?[\\s+]?\\([\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?/i);\n\n        const r = parseInt(m[1], 10).toString(16).padStart(2, '0');\n        const g = parseInt(m[2], 10).toString(16).padStart(2, '0');\n        const b = parseInt(m[3], 10).toString(16).padStart(2, '0');\n\n        return m && m.length === 4 ? `#${r}${g}${b}` : rgb;\n    }\n\n    /**\n     * @private\n     */\n    handleChange = color => {\n        this.setState({ color }, () =>\n            this.props.onChange && this.props.onChange(ColorPicker.getColor(color)));\n    };\n\n    render() {\n        const color = ColorPicker.getColor(this.state.color);\n\n        const style = {...(this.props.style || {})};\n        style.position = 'relative';\n\n        return <div\n            style={ style }\n            className={this.props.className || ''}\n        >\n            <TextField\n                disabled={this.props.disabled}\n                variant=\"standard\"\n                id=\"name\"\n                style={color ? { width: 'calc(100% - 80px)' } : { width: 'calc(100% - 54px)', marginRight: 8 }}\n                label={ this.props.name || 'color' }\n                value={color}\n                margin=\"dense\"\n                classes={{ root: this.props.classes.textDense }}\n                onChange={e => this.handleChange(e.target.value)}\n            />\n            {color ? <IconButton\n                disabled={this.props.disabled}\n                onClick={() => this.handleChange('')}\n                size=\"small\"\n                className={this.props.classes.delButton}\n                style={color ? {} : { opacity: 0, cursor: 'default' }}\n            >\n                <IconDelete />\n            </IconButton> : null}\n            <div className={`${this.props.classes.swatch}${this.props.disabled ? ` ${this.props.classes.swatchDisabled}` : ''}`} onClick={e => !this.props.disabled && this.handleClick(e)}>\n                <div className={this.props.classes.color} style={{ background: color }} />\n            </div>\n            { this.state.displayColorPicker && !this.props.disabled ? <Menu\n                classes={{ paper: this.props.classes.popover, list: this.props.classes.popoverList }}\n                anchorEl={this.state.anchorEl}\n                open={!0}\n                onClose={() => this.handleClose()}\n            >\n                <ChromePicker\n                    className={this.props.classes.picker}\n                    color={this.state.color}\n                    onChangeComplete={_color => this.handleChange(_color)}\n                    styles={{ picker: { background: '#112233' } }}\n                />\n                <IconButton className={this.props.classes.closeButton} onClick={() => this.handleClose()}><IconClose /></IconButton>\n            </Menu> : null }\n        </div>;\n    }\n}\n\nColorPicker.propTypes = {\n    disabled: PropTypes.bool,\n    value: PropTypes.string,\n    onChange: PropTypes.func.isRequired,\n    name: PropTypes.string,\n    style: PropTypes.object,\n    className: PropTypes.string,\n};\n\n/** @type {typeof ColorPicker} */\nconst _export = withStyles(styles)(ColorPicker);\nexport default _export;\n"],"mappings":";;;;;;;;;;;;;;;AAeA;AACA;AACA;AACA;AAEA;AACA;AAA+E;AAAA;AAAA;AAAA;AAE/E,IAAMA,MAAM,GAAG,SAATA,MAAM,CAAGC,KAAK;EAAA,OAAK;IACrBC,KAAK,EAAE;MACHC,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE,EAAE;MACVC,YAAY,EAAE;IAClB,CAAC;IACDC,SAAS,EAAE;MACP;MACA;MACAC,SAAS,EAAE;IACf,CAAC;IACDC,MAAM,EAAE;MACJD,SAAS,EAAE,EAAE;MACbE,OAAO,EAAE,CAAC;MACVC,UAAU,EAAE,MAAM;MAClBL,YAAY,EAAE,CAAC;MACfM,SAAS,EAAE,0BAA0B;MACrCC,OAAO,EAAE,cAAc;MACvBC,MAAM,EAAE,SAAS;MACjBC,aAAa,EAAE;IACnB,CAAC;IACDC,cAAc,EAAE;MACZC,OAAO,EAAE,GAAG;MACZH,MAAM,EAAE;IACZ,CAAC;IACDI,OAAO,EAAE;MACL;MACA;MACAC,eAAe,EAAE,WAAW;MAC5BC,SAAS,EAAE;IACf,CAAC;IACDC,WAAW,EAAE;MACTX,OAAO,EAAE;IACb,CAAC;IACDY,WAAW,EAAE;MACTH,eAAe,YAAKjB,KAAK,CAACqB,OAAO,CAACZ,UAAU,CAACa,KAAK,gBAAa;MAC/DlB,YAAY,EAAE,aAAa;MAC3B,SAAS,EAAE;QACPa,eAAe,YAAKjB,KAAK,CAACqB,OAAO,CAACE,SAAS,CAACC,IAAI;MACpD;IACJ,CAAC;IACDC,KAAK,EAAE;MACHC,QAAQ,EAAE,OAAO;MACjBC,GAAG,EAAE,CAAC;MACNC,KAAK,EAAE,CAAC;MACRC,MAAM,EAAE,CAAC;MACTC,IAAI,EAAE;IACV,CAAC;IACDC,SAAS,EAAE;MACPzB,SAAS,EAAE,CAAC;MACZ0B,YAAY,EAAE;IAClB,CAAC;IACDC,MAAM,EAAE;MACJxB,UAAU,YAAKT,KAAK,CAACqB,OAAO,CAACZ,UAAU,CAACa,KAAK;IACjD;EACJ,CAAC;AAAA,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnBA,IAoBMY,WAAW;EAAA;EAAA;EACb;AACJ;AACA;EACI,qBAAYC,KAAK,EAAE;IAAA;IAAA;IACf,0BAAMA,KAAK;IAAE,gGAyBH,UAAAC,CAAC,EAAI;MACf,MAAKC,QAAQ,CAAC;QAAEC,kBAAkB,EAAE,CAAC,MAAKC,KAAK,CAACD,kBAAkB;QAAEE,QAAQ,EAAE,MAAKD,KAAK,CAACD,kBAAkB,GAAG,IAAI,GAAGF,CAAC,CAACK;MAAc,CAAC,CAAC;IAC3I,CAAC;IAAA,gGAKa,YAAM;MAChB,MAAKJ,QAAQ,CAAC;QAAEC,kBAAkB,EAAE,KAAK;QAAEE,QAAQ,EAAE;MAAK,CAAC,CAAC;IAChE,CAAC;IAAA,iGA0Cc,UAAAvC,KAAK,EAAI;MACpB,MAAKoC,QAAQ,CAAC;QAAEpC,KAAK,EAALA;MAAM,CAAC,EAAE;QAAA,OACrB,MAAKkC,KAAK,CAACO,QAAQ,IAAI,MAAKP,KAAK,CAACO,QAAQ,CAACR,WAAW,CAACS,QAAQ,CAAC1C,KAAK,CAAC,CAAC;MAAA,EAAC;IAChF,CAAC;IA9EG,MAAKsC,KAAK,GAAG;MACTD,kBAAkB,EAAE,KAAK;MACzBrC,KAAK,EAAE,MAAKkC,KAAK,CAACS,KAAK,IAAI,MAAKT,KAAK,CAAClC,KAAK;MAC3CuC,QAAQ,EAAE;IACd,CAAC;IAAC;EACN;;EAEA;AACJ;AACA;AACA;AACA;EAJI;IAAA;IAAA,OAyEA,kBAAS;MAAA;MACL,IAAMvC,KAAK,GAAGiC,WAAW,CAACS,QAAQ,CAAC,IAAI,CAACJ,KAAK,CAACtC,KAAK,CAAC;MAEpD,IAAM4C,KAAK,qBAAQ,IAAI,CAACV,KAAK,CAACU,KAAK,IAAI,CAAC,CAAC,CAAE;MAC3CA,KAAK,CAACnB,QAAQ,GAAG,UAAU;MAE3B,oBAAO;QACH,KAAK,EAAGmB,KAAO;QACf,SAAS,EAAE,IAAI,CAACV,KAAK,CAACW,SAAS,IAAI;MAAG,gBAEtC,gCAAC,mBAAS;QACN,QAAQ,EAAE,IAAI,CAACX,KAAK,CAACY,QAAS;QAC9B,OAAO,EAAC,UAAU;QAClB,EAAE,EAAC,MAAM;QACT,KAAK,EAAE9C,KAAK,GAAG;UAAEC,KAAK,EAAE;QAAoB,CAAC,GAAG;UAAEA,KAAK,EAAE,mBAAmB;UAAE8C,WAAW,EAAE;QAAE,CAAE;QAC/F,KAAK,EAAG,IAAI,CAACb,KAAK,CAACc,IAAI,IAAI,OAAS;QACpC,KAAK,EAAEhD,KAAM;QACb,MAAM,EAAC,OAAO;QACd,OAAO,EAAE;UAAEiD,IAAI,EAAE,IAAI,CAACf,KAAK,CAACgB,OAAO,CAACpB;QAAU,CAAE;QAChD,QAAQ,EAAE,kBAAAK,CAAC;UAAA,OAAI,MAAI,CAACgB,YAAY,CAAChB,CAAC,CAACiB,MAAM,CAACT,KAAK,CAAC;QAAA;MAAC,EACnD,EACD3C,KAAK,gBAAG,gCAAC,oBAAU;QAChB,QAAQ,EAAE,IAAI,CAACkC,KAAK,CAACY,QAAS;QAC9B,OAAO,EAAE;UAAA,OAAM,MAAI,CAACK,YAAY,CAAC,EAAE,CAAC;QAAA,CAAC;QACrC,IAAI,EAAC,OAAO;QACZ,SAAS,EAAE,IAAI,CAACjB,KAAK,CAACgB,OAAO,CAAC9C,SAAU;QACxC,KAAK,EAAEJ,KAAK,GAAG,CAAC,CAAC,GAAG;UAAEc,OAAO,EAAE,CAAC;UAAEH,MAAM,EAAE;QAAU;MAAE,gBAEtD,gCAAC,qBAAU,OAAG,CACL,GAAG,IAAI,eACpB;QAAK,SAAS,YAAK,IAAI,CAACuB,KAAK,CAACgB,OAAO,CAAC5C,MAAM,SAAG,IAAI,CAAC4B,KAAK,CAACY,QAAQ,cAAO,IAAI,CAACZ,KAAK,CAACgB,OAAO,CAACrC,cAAc,IAAK,EAAE,CAAG;QAAC,OAAO,EAAE,iBAAAsB,CAAC;UAAA,OAAI,CAAC,MAAI,CAACD,KAAK,CAACY,QAAQ,IAAI,MAAI,CAACO,WAAW,CAAClB,CAAC,CAAC;QAAA;MAAC,gBAC3K;QAAK,SAAS,EAAE,IAAI,CAACD,KAAK,CAACgB,OAAO,CAAClD,KAAM;QAAC,KAAK,EAAE;UAAEQ,UAAU,EAAER;QAAM;MAAE,EAAG,CACxE,EACJ,IAAI,CAACsC,KAAK,CAACD,kBAAkB,IAAI,CAAC,IAAI,CAACH,KAAK,CAACY,QAAQ,gBAAG,gCAAC,cAAI;QAC3D,OAAO,EAAE;UAAEzB,KAAK,EAAE,IAAI,CAACa,KAAK,CAACgB,OAAO,CAACnC,OAAO;UAAEuC,IAAI,EAAE,IAAI,CAACpB,KAAK,CAACgB,OAAO,CAAChC;QAAY,CAAE;QACrF,QAAQ,EAAE,IAAI,CAACoB,KAAK,CAACC,QAAS;QAC9B,IAAI,EAAE,CAAC,CAAE;QACT,OAAO,EAAE;UAAA,OAAM,MAAI,CAACgB,WAAW,EAAE;QAAA;MAAC,gBAElC,gCAAC,wBAAY;QACT,SAAS,EAAE,IAAI,CAACrB,KAAK,CAACgB,OAAO,CAAClB,MAAO;QACrC,KAAK,EAAE,IAAI,CAACM,KAAK,CAACtC,KAAM;QACxB,gBAAgB,EAAE,0BAAAwD,MAAM;UAAA,OAAI,MAAI,CAACL,YAAY,CAACK,MAAM,CAAC;QAAA,CAAC;QACtD,MAAM,EAAE;UAAExB,MAAM,EAAE;YAAExB,UAAU,EAAE;UAAU;QAAE;MAAE,EAChD,eACF,gCAAC,oBAAU;QAAC,SAAS,EAAE,IAAI,CAAC0B,KAAK,CAACgB,OAAO,CAAC/B,WAAY;QAAC,OAAO,EAAE;UAAA,OAAM,MAAI,CAACoC,WAAW,EAAE;QAAA;MAAC,gBAAC,gCAAC,oBAAS,OAAG,CAAa,CACjH,GAAG,IAAI,CACZ;IACV;EAAC;IAAA;IAAA,OApHD,kCAAgCrB,KAAK,EAAEI,KAAK,EAAE;MAC1C,IAAMmB,MAAM,GAAGxB,WAAW,CAACS,QAAQ,CAACR,KAAK,CAACS,KAAK,IAAIT,KAAK,CAAClC,KAAK,CAAC;MAC/D,IAAM0D,MAAM,GAAGzB,WAAW,CAACS,QAAQ,CAACJ,KAAK,CAACtC,KAAK,CAAC;MAChD,IAAIyD,MAAM,KAAKC,MAAM,EAAE;QACnB,OAAO;UAAG1D,KAAK,EAAEkC,KAAK,CAACS,KAAK,IAAIT,KAAK,CAAClC;QAAM,CAAC;MACjD;MACA,OAAO,IAAI;IACf;;IAEA;AACJ;AACA;EAFI;IAAA;IAAA;IAcA;AACJ;AACA;AACA;AACA;AACA;IACI,kBAAgBA,KAAK,EAAE2D,KAAK,EAAE;MAC1B,IAAI3D,KAAK,IAAI,yBAAOA,KAAK,MAAK,QAAQ,EAAE;QACpC,IAAIA,KAAK,CAAC4D,GAAG,EAAE;UACX,IAAID,KAAK,EAAE;YACP,kBAAW3D,KAAK,CAAC4D,GAAG,CAACC,CAAC,CAACC,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAG/D,KAAK,CAAC4D,GAAG,CAACI,CAAC,CAACF,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAG/D,KAAK,CAAC4D,GAAG,CAACK,CAAC,CAACH,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;UAChJ;UACA,sBAAe/D,KAAK,CAAC4D,GAAG,CAACC,CAAC,cAAI7D,KAAK,CAAC4D,GAAG,CAACI,CAAC,cAAIhE,KAAK,CAAC4D,GAAG,CAACK,CAAC,cAAIjE,KAAK,CAAC4D,GAAG,CAACM,CAAC;QAC3E;QACA,IAAIP,KAAK,EAAE;UACP,kBAAW3D,KAAK,CAAC6D,CAAC,CAACC,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAG/D,KAAK,CAACgE,CAAC,CAACF,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAG/D,KAAK,CAACiE,CAAC,CAACH,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;QACpI;QACA,sBAAe/D,KAAK,CAAC6D,CAAC,cAAI7D,KAAK,CAACgE,CAAC,cAAIhE,KAAK,CAACiE,CAAC,cAAIjE,KAAK,CAACkE,CAAC;MAC3D;MACA,OAAOP,KAAK,GAAG1B,WAAW,CAACkC,OAAO,CAACnE,KAAK,IAAI,EAAE,CAAC,GAAGA,KAAK,IAAI,EAAE;IACjE;;IAEA;AACJ;AACA;AACA;AACA;EAJI;IAAA;IAAA,OAKA,iBAAe4D,GAAG,EAAE;MAChB,IAAMQ,CAAC,GAAGR,GAAG,CAACS,KAAK,CAAC,sEAAsE,CAAC;MAE3F,IAAMR,CAAC,GAAGS,QAAQ,CAACF,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAACN,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;MAC1D,IAAMC,CAAC,GAAGM,QAAQ,CAACF,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAACN,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;MAC1D,IAAME,CAAC,GAAGK,QAAQ,CAACF,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAACN,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;MAE1D,OAAOK,CAAC,IAAIA,CAAC,CAACG,MAAM,KAAK,CAAC,cAAOV,CAAC,SAAGG,CAAC,SAAGC,CAAC,IAAKL,GAAG;IACtD;;IAEA;AACJ;AACA;EAFI;EAAA;AAAA,EA9EsBY,iBAAK,CAACC,SAAS;AAyIzCxC,WAAW,CAACyC,SAAS,GAAG;EACpB5B,QAAQ,EAAE6B,qBAAS,CAACC,IAAI;EACxBjC,KAAK,EAAEgC,qBAAS,CAACE,MAAM;EACvBpC,QAAQ,EAAEkC,qBAAS,CAACG,IAAI,CAACC,UAAU;EACnC/B,IAAI,EAAE2B,qBAAS,CAACE,MAAM;EACtBjC,KAAK,EAAE+B,qBAAS,CAACK,MAAM;EACvBnC,SAAS,EAAE8B,qBAAS,CAACE;AACzB,CAAC;;AAED;AACA,IAAMI,OAAO,GAAG,IAAAC,sBAAU,EAACpF,MAAM,CAAC,CAACmC,WAAW,CAAC;AAAC,eACjCgD,OAAO;AAAA"}

package/Components/ObjectBrowser.d.ts

@@ -11,6 +11,25 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
      * @param {any} state
      */
     private static getDerivedStateFromProps;
+    /**
+     * @private
+     * @param {number} depth
+     * @param {any[]} expanded
+     */
+    private static collapseDepth;
+    /**
+     * @private
+     * @param {any} obj
+     * @param {any} it
+     */
+    private static getCustomValue;
+    /**
+     * @private
+     * @param {any} obj
+     * @param {any} it
+     * @param {any} value
+     */
+    private static setCustomValue;
     /**
      * @param {import('./types').ObjectBrowserProps} props
      */
@@ -33,7 +52,6 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
     statesUpdateTimer: any;
     objectsUpdateTimer: any;
     visibleCols: any[];
-    possibleCols: string[];
     imagePrefix: string;
     state: {
         loaded: boolean;
@@ -53,7 +71,6 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
         viewFileDialog: string;
         enumDialog: any;
         roleDialog: any;
-        modalEmptyId: any;
         statesView: boolean;
         columns: any;
         columnsForAdmin: any;
@@ -217,9 +234,8 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
     /**
      * @param {string} id
      * @param {ioBroker.Object} obj
-     * @param {import('./types').OldObject} oldObj
      */
-    onObjectChange: (id: string, obj: ioBroker.Object, oldObj: any) => void;
+    onObjectChange: (id: string, obj: ioBroker.Object) => void;
     /**
      * @private
      * @param {string} id
@@ -291,12 +307,6 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
      * @param {any[]} expanded
      */
     private expandDepth;
-    /**
-     * @private
-     * @param {number} depth
-     * @param {any[]} expanded
-     */
-    private collapseDepth;
     /**
      * @private
      */
@@ -322,7 +332,7 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
     private _createAllEnums;
     /**
      * @private
-     * @param {any} callback
+     * @param {any} objs
      */
     private loadObjects;
     _getSelectedIdsForExport(): string[];
@@ -416,19 +426,6 @@ declare class ObjectBrowser extends React.Component<import("./types").ObjectBrow
      * @private
      */
     private renderColumnsEditCustomDialog;
-    /**
-     * @private
-     * @param {any} obj
-     * @param {any} it
-     */
-    private getCustomValue;
-    /**
-     * @private
-     * @param {any} obj
-     * @param {any} it
-     * @param {any} value
-     */
-    private setCustomValue;
     /**
      * Renders a custom value.
      * @param {any} obj