@iobroker/adapter-react-v5 4.9.11 → 4.10.0

package/Components/Loader.d.ts

@@ -1,37 +1,26 @@
-export default _export;
-export type LoaderProps = {
-    /**
-     * The size in pixels of this loader.
-     */
-    size?: number;
-    /**
-     * The chosen theme type.
-     */
-    themeType?: string;
-    /**
-     * The chosen theme.
-     */
-    theme?: string;
-};
-/** @type {typeof Loader} */
-declare const _export: typeof Loader;
 /**
- * @typedef {object} LoaderProps
- * @property {number} [size] The size in pixels of this loader.
- * @property {string} [themeType] The chosen theme type.
- * @property {string} [theme] The chosen theme.
+ * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
  *
- * @extends {React.Component<LoaderProps>}
- */
-declare class Loader extends React.Component<LoaderProps, any, any> {
-    constructor(props: any);
-    render(): React.JSX.Element;
-}
-declare namespace Loader {
-    namespace propTypes {
-        let size: PropTypes.Requireable<number>;
-        let themeType: PropTypes.Requireable<string>;
+ * MIT License
+ *
+ **/
+import React from 'react';
+declare global {
+    interface Window {
+        loadingBackgroundImage: undefined | string;
+        loadingBackgroundColor: undefined | string;
+        loadingHideLogo: undefined | 'true';
     }
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+interface LoaderProps {
+    /** The size in pixels of this loader. */
+    size?: number;
+    /** The chosen theme type. */
+    themeType?: 'dark' | 'light';
+    /** Theme name*/
+    themeName?: 'dark' | 'light' | 'colored' | 'blue';
+    /** @deprecated Theme name. use themeName instead */
+    theme?: 'dark' | 'light' | 'colored' | 'blue';
+}
+declare function Loader(props: LoaderProps): React.JSX.Element;
+export default Loader;

package/Components/Loader.js

@@ -1,111 +1,285 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
 });
-exports["default"] = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
- * Copyright 2018-2023 Denis Haev (bluefox) <dogafox@gmail.com>
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
  *
  * MIT License
  *
  **/
-// import './loader.css'
-var loaderStyles = "\n/**\n * Copyright 2018-2023 Denis Haev (bluefox) <dogafox@gmail.com>\n *\n * MIT License\n *\n **/\n\n.logo-background-light, .logo-background-colored {\n    background: white;\n}\n.logo-background-dark, .logo-background-blue {\n    background: black;\n}\n.logo-div {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    -ms-transform: translateX(-50%) translateY(-50%);\n    -webkit-transform: translate(-50%,-50%);\n    transform: translate(-50%,-50%);\n    overflow: hidden;\n    border-radius: 50%;\n    z-index: 2;\n}\n.logo-border {\n    /*border-color: #164477;*/\n    border-top-color: #3399CC;\n    border-left-color: #164477;\n    border-bottom-color: #164477;\n    border-right-color: #164477;\n    border-radius: 50%;\n    border-style: solid;\n    box-sizing: border-box;\n    width: 100%;\n    height: 100%;\n    position: absolute;\n}\n.logo-top {\n    position: absolute;\n    width: 4.5%;\n    height: 16%;\n    top: 0;\n    z-index: 2;\n}\n.logo-i {\n    position: absolute;\n    width: 14.5%;\n    height: 60%;\n    top: 20%;\n    left: 42%;\n    background: #3399CC;\n}\n.logo-i-top {\n    position: absolute;\n    width: 14.5%;\n    height: 4%;\n    left: 42%;\n    background: #3399CC;\n    border-radius: 100%;\n}\n.logo-back {\n    width: 100%;\n    height: 100%;\n    z-index: 0;\n    overflow: hidden;\n}\n@keyframes logo-grow {\n    0% {\n        width: 230px;\n        height: 230px;\n        transform: translate(-50%,-50%) scale(1);\n        opacity: 1\n    }\n    99% {\n        width: 230px;\n        height: 230px;\n        transform: translate(-50%,-50%) scale(10);\n        opacity: 0;\n    }\n    100% {\n        width: 0;\n        height: 0;\n        opacity: 0;\n    }\n}\n@keyframes logo-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }\n@keyframes logo-color-inside-light {\n    0% {\n        background: #FEFEFE;\n    }\n    100% {\n        background: #3399CC;\n    }\n}\n@keyframes logo-color-inside-dark {\n    0% {\n        background: #030303;\n    }\n    100% {\n        background: #3399CC;\n    }\n}\n@keyframes logo-color-inside-colored {\n    0% {\n        background: #FEFEFE;\n    }\n    100% {\n        background: #3399CC;\n    }\n}\n@keyframes logo-color-inside-blue {\n    0% {\n        background: #030303;\n    }\n    100% {\n        background: #3399CC;\n    }\n}\n\n@keyframes logo-color-outside-light {\n    0% {\n        border-color: #FEFEFE;\n    }\n    100% {\n        border-top-color: #3399CC;\n        border-left-color: #164477;\n        border-bottom-color: #164477;\n        border-right-color: #164477;\n    }\n}\n@keyframes logo-color-outside-dark  {\n    0% {\n        border-color: #040404;\n    }\n    100% {\n        border-top-color: #3399CC;\n        border-left-color: #164477;\n        border-bottom-color: #164477;\n        border-right-color: #164477;\n    }\n}\n@keyframes logo-color-outside-colored {\n    0% {\n        border-color: #FEFEFE;\n    }\n    100% {\n        border-top-color: #3399CC;\n        border-left-color: #164477;\n        border-bottom-color: #164477;\n        border-right-color: #164477;\n    }\n}\n@keyframes logo-color-outside-blue  {\n    0% {\n        border-color: #040404;\n    }\n    100% {\n        border-top-color: #3399CC;\n        border-left-color: #164477;\n        border-bottom-color: #164477;\n        border-right-color: #164477;\n    }\n}\n\n.logo-animate-wait {\n    animation: logo-color-outside 1.5s, logo-spin 1.5s linear infinite;\n}\n\n.logo-animate-grow-light {\n    background: #DDD;\n}\n.logo-animate-grow-dark {\n    background: #1d1d1d;\n}\n.logo-animate-grow-colored {\n    background: #DDD;\n}\n.logo-animate-grow-blue {\n    background: #1d1d1d;\n}\n\n.logo-animate-grow {\n    display: inline-block;\n    text-align: center;\n    z-index: 1;\n    top: 50%;\n    left: 50%;\n    -ms-transform: translateX(-50%) translateY(-50%);\n    -webkit-transform: translate(-50%,-50%);\n    transform: translate(-50%,-50%);\n    width: 245px;\n    height: 245px;\n    border-radius: 50%;\n    position: absolute;\n    animation: logo-grow 1s 1 ease forwards;\n}\n\n.logo-animate-color-inside-light {\n    animation: logo-color-inside-light 2.5s;\n}\n.logo-animate-color-inside-dark {\n    animation: logo-color-inside-dark 2.5s;\n}\n.logo-animate-color-inside-colored {\n    animation: logo-color-inside-colored 2.5s;\n}\n.logo-animate-color-inside-blue {\n    animation: logo-color-inside-blue 2.5s;\n}\n\n.logo-animate-color-outside-light {\n    animation: logo-color-outside-light 1.5s;\n}\n.logo-animate-color-outside-dark {\n    animation: logo-color-outside-dark 1.5s;\n}\n.logo-animate-color-outside-colored {\n    animation: logo-color-outside-colored 1.5s;\n}\n.logo-animate-color-outside-blue {\n    animation: logo-color-outside-blue 1.5s;\n}\n";
-
+const react_1 = __importStar(require("react"));
+const loaderStyles = `
 /**
- * @typedef {object} LoaderProps
- * @property {number} [size] The size in pixels of this loader.
- * @property {string} [themeType] The chosen theme type.
- * @property {string} [theme] The chosen theme.
+ * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
  *
- * @extends {React.Component<LoaderProps>}
- */
-var Loader = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2["default"])(Loader, _React$Component);
-  function Loader(props) {
-    var _this;
-    (0, _classCallCheck2["default"])(this, Loader);
-    _this = _callSuper(this, Loader, [props]);
-    if (!window.document.getElementById('loader-iobroker-component')) {
-      var style = window.document.createElement('style');
-      style.setAttribute('id', 'loader-iobroker-component');
-      style.innerHTML = loaderStyles;
-      window.document.head.appendChild(style);
-    }
-    return _this;
-  }
-  (0, _createClass2["default"])(Loader, [{
-    key: "render",
-    value: function render() {
-      var size = this.props.size || 234;
-      var theme = this.props.themeType || this.props.theme || 'light';
-      return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-back logo-background-".concat(theme),
-        style: {
-          backgroundImage: window.loadingBackgroundImage && window.loadingBackgroundImage !== '@@loginBackgroundImage@@' ? "url(".concat(window.loadingBackgroundImage, ")") : undefined,
-          backgroundColor: window.loadingBackgroundColor && window.loadingBackgroundColor !== '@@loginBackgroundColor@@' ? window.loadingBackgroundColor : undefined,
-          backgroundSize: 'cover'
-        }
-      }, window.loadingHideLogo === 'true' ? null : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-div",
-        style: {
-          width: size,
-          height: size
-        }
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-top logo-background-".concat(theme),
-        style: {
-          left: '37%'
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-top logo-background-".concat(theme),
-        style: {
-          left: '57%'
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-border logo-background-".concat(theme, " logo-animate-wait"),
-        style: {
-          borderWidth: size * 0.132
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-i logo-animate-color-inside-".concat(theme)
-      }), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-i-top logo-animate-color-inside-".concat(theme),
-        style: {
-          top: '18%'
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-i-top logo-animate-color-inside-".concat(theme),
-        style: {
-          bottom: '18%'
-        }
-      })), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "logo-animate-grow logo-animate-grow-".concat(theme),
-        style: {
-          width: size + 11,
-          height: size + 11
-        }
-      })));
-    }
-  }]);
-  return Loader;
-}(_react["default"].Component);
-Loader.propTypes = {
-  size: _propTypes["default"].number,
-  themeType: _propTypes["default"].string
-};
+ * MIT License
+ *
+ **/
 
-/** @type {typeof Loader} */
-var _export = Loader;
-var _default = exports["default"] = _export;
-//# sourceMappingURL=Loader.js.map
+.logo-background-light, .logo-background-colored {
+    background: white;
+}
+.logo-background-dark, .logo-background-blue {
+    background: black;
+}
+.logo-div {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    -ms-transform: translateX(-50%) translateY(-50%);
+    -webkit-transform: translate(-50%,-50%);
+    transform: translate(-50%,-50%);
+    overflow: hidden;
+    border-radius: 50%;
+    z-index: 2;
+}
+.logo-border {
+    /*border-color: #164477;*/
+    border-top-color: #3399CC;
+    border-left-color: #164477;
+    border-bottom-color: #164477;
+    border-right-color: #164477;
+    border-radius: 50%;
+    border-style: solid;
+    box-sizing: border-box;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+}
+.logo-top {
+    position: absolute;
+    width: 4.5%;
+    height: 16%;
+    top: 0;
+    z-index: 2;
+}
+.logo-i {
+    position: absolute;
+    width: 14.5%;
+    height: 60%;
+    top: 20%;
+    left: 42%;
+    background: #3399CC;
+}
+.logo-i-top {
+    position: absolute;
+    width: 14.5%;
+    height: 4%;
+    left: 42%;
+    background: #3399CC;
+    border-radius: 100%;
+}
+.logo-back {
+    width: 100%;
+    height: 100%;
+    z-index: 0;
+    overflow: hidden;
+}
+@keyframes logo-grow {
+    0% {
+        width: 230px;
+        height: 230px;
+        transform: translate(-50%,-50%) scale(1);
+        opacity: 1
+    }
+    99% {
+        width: 230px;
+        height: 230px;
+        transform: translate(-50%,-50%) scale(10);
+        opacity: 0;
+    }
+    100% {
+        width: 0;
+        height: 0;
+        opacity: 0;
+    }
+}
+@keyframes logo-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
+@keyframes logo-color-inside-light {
+    0% {
+        background: #FEFEFE;
+    }
+    100% {
+        background: #3399CC;
+    }
+}
+@keyframes logo-color-inside-dark {
+    0% {
+        background: #030303;
+    }
+    100% {
+        background: #3399CC;
+    }
+}
+@keyframes logo-color-inside-colored {
+    0% {
+        background: #FEFEFE;
+    }
+    100% {
+        background: #3399CC;
+    }
+}
+@keyframes logo-color-inside-blue {
+    0% {
+        background: #030303;
+    }
+    100% {
+        background: #3399CC;
+    }
+}
+
+@keyframes logo-color-outside-light {
+    0% {
+        border-color: #FEFEFE;
+    }
+    100% {
+        border-top-color: #3399CC;
+        border-left-color: #164477;
+        border-bottom-color: #164477;
+        border-right-color: #164477;
+    }
+}
+@keyframes logo-color-outside-dark  {
+    0% {
+        border-color: #040404;
+    }
+    100% {
+        border-top-color: #3399CC;
+        border-left-color: #164477;
+        border-bottom-color: #164477;
+        border-right-color: #164477;
+    }
+}
+@keyframes logo-color-outside-colored {
+    0% {
+        border-color: #FEFEFE;
+    }
+    100% {
+        border-top-color: #3399CC;
+        border-left-color: #164477;
+        border-bottom-color: #164477;
+        border-right-color: #164477;
+    }
+}
+@keyframes logo-color-outside-blue  {
+    0% {
+        border-color: #040404;
+    }
+    100% {
+        border-top-color: #3399CC;
+        border-left-color: #164477;
+        border-bottom-color: #164477;
+        border-right-color: #164477;
+    }
+}
+
+.logo-animate-wait {
+    animation: logo-color-outside 1.5s, logo-spin 1.5s linear infinite;
+}
+
+.logo-animate-grow-light {
+    background: #DDD;
+}
+.logo-animate-grow-dark {
+    background: #1d1d1d;
+}
+.logo-animate-grow-colored {
+    background: #DDD;
+}
+.logo-animate-grow-blue {
+    background: #1d1d1d;
+}
+
+.logo-animate-grow {
+    display: inline-block;
+    text-align: center;
+    z-index: 1;
+    top: 50%;
+    left: 50%;
+    -ms-transform: translateX(-50%) translateY(-50%);
+    -webkit-transform: translate(-50%,-50%);
+    transform: translate(-50%,-50%);
+    width: 245px;
+    height: 245px;
+    border-radius: 50%;
+    position: absolute;
+    animation: logo-grow 1s 1 ease forwards;
+}
+
+.logo-animate-color-inside-light {
+    animation: logo-color-inside-light 2.5s;
+}
+.logo-animate-color-inside-dark {
+    animation: logo-color-inside-dark 2.5s;
+}
+.logo-animate-color-inside-colored {
+    animation: logo-color-inside-colored 2.5s;
+}
+.logo-animate-color-inside-blue {
+    animation: logo-color-inside-blue 2.5s;
+}
+
+.logo-animate-color-outside-light {
+    animation: logo-color-outside-light 1.5s;
+}
+.logo-animate-color-outside-dark {
+    animation: logo-color-outside-dark 1.5s;
+}
+.logo-animate-color-outside-colored {
+    animation: logo-color-outside-colored 1.5s;
+}
+.logo-animate-color-outside-blue {
+    animation: logo-color-outside-blue 1.5s;
+}
+`;
+function Loader(props) {
+    (0, react_1.useEffect)(() => {
+        if (!window.document.getElementById('loader-iobroker-component')) {
+            const style = window.document.createElement('style');
+            style.setAttribute('id', 'loader-iobroker-component');
+            style.innerHTML = loaderStyles;
+            window.document.head.appendChild(style);
+        }
+    }, []);
+    const size = props.size || 234;
+    const theme = props.themeName || props.theme || props.themeType || 'light';
+    return react_1.default.createElement("div", { className: `logo-back logo-background-${theme}`, style: {
+            backgroundImage: window.loadingBackgroundImage && window.loadingBackgroundImage !== '@@loginBackgroundImage@@' ? `url(${window.loadingBackgroundImage})` : undefined,
+            backgroundColor: window.loadingBackgroundColor && window.loadingBackgroundColor !== '@@loginBackgroundColor@@' ? window.loadingBackgroundColor : undefined,
+            backgroundSize: 'cover',
+        } }, window.loadingHideLogo === 'true' ?
+        null
+        :
+            react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("div", { className: "logo-div", style: { width: size, height: size } },
+                    react_1.default.createElement("div", { className: `logo-top logo-background-${theme}`, style: { left: '37%' } }),
+                    react_1.default.createElement("div", { className: `logo-top logo-background-${theme}`, style: { left: '57%' } }),
+                    react_1.default.createElement("div", { className: `logo-border logo-background-${theme} logo-animate-wait`, style: { borderWidth: size * 0.132 } }),
+                    react_1.default.createElement("div", { className: `logo-i logo-animate-color-inside-${theme}` }),
+                    react_1.default.createElement("div", { className: `logo-i-top logo-animate-color-inside-${theme}`, style: { top: '18%' } }),
+                    react_1.default.createElement("div", { className: `logo-i-top logo-animate-color-inside-${theme}`, style: { bottom: '18%' } })),
+                react_1.default.createElement("div", { className: `logo-animate-grow logo-animate-grow-${theme}`, style: { width: size + 11, height: size + 11 } })));
+}
+exports.default = Loader;

package/Components/TabContainer.d.ts

@@ -13,5 +13,5 @@ interface TabContainerProps {
     children: React.ReactNode;
 }
 /** @type {typeof TabContainer} */
-declare const _export: React.JSXElementConstructor<Omit<TabContainerProps, "classes"> & import("@mui/styles").StyledComponentProps<"container" | "root" | "overflowHidden"> & object>;
+declare const _export: React.JSXElementConstructor<Omit<TabContainerProps, "classes"> & import("@mui/styles").StyledComponentProps<"root" | "container" | "overflowHidden"> & object>;
 export default _export;

package/Components/TextWithIcon.d.ts

@@ -1,17 +1,22 @@
-declare const _default: React.JSXElementConstructor<Omit<PropTypes.InferProps<{
-    lang: PropTypes.Validator<string>;
-    themeType: PropTypes.Requireable<string>;
-    value: PropTypes.Validator<NonNullable<NonNullable<string | object>>>;
-    list: PropTypes.Requireable<object>;
-    options: PropTypes.Requireable<object>;
-    className: PropTypes.Requireable<string>;
-    style: PropTypes.Requireable<object>;
-    title: PropTypes.Requireable<string>;
-    removePrefix: PropTypes.Requireable<string>;
-    moreClasses: PropTypes.Requireable<object>;
-    icon: PropTypes.Requireable<string>;
-    color: PropTypes.Requireable<string>;
-}>, "classes"> & import("@mui/styles").StyledComponentProps<"div" | "text" | "icon"> & object>;
-export default _default;
-import PropTypes from 'prop-types';
 import React from 'react';
+interface TextWithIconProps {
+    lang: ioBroker.Languages;
+    themeType?: 'dark' | 'light';
+    value: string | Record<string, any>;
+    list?: ioBroker.Object[] | Record<string, ioBroker.Object>;
+    options?: Record<string, any>;
+    className?: string;
+    style?: React.CSSProperties;
+    title?: string;
+    removePrefix?: string;
+    moreClasses?: {
+        root?: string;
+        icon?: string;
+        text?: string;
+    };
+    icon?: string;
+    color?: string;
+    classes: Record<string, string>;
+}
+declare const _default: React.JSXElementConstructor<Omit<TextWithIconProps, "classes"> & import("@mui/styles").StyledComponentProps<string> & object>;
+export default _default;