@iobroker/adapter-react-v5 4.9.11 → 4.10.0

package/Theme.js

@@ -1,406 +1,413 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _styles = require("@mui/material/styles");
-var _colors = require("@mui/material/colors");
-var step = (16 - 5) / 23 / 100;
-
+Object.defineProperty(exports, "__esModule", { value: true });
+const styles_1 = require("@mui/material/styles");
+const colors_1 = require("@mui/material/colors");
+const step = (16 - 5) / 23 / 100;
 /**
  * Convert hex color in the format '#rrggbb' or '#rgb' to an RGB object.
- * @param {string} hex
- * @returns {{r: number, g: number, b: number}}
  */
 function toInt(hex) {
-  var rgb = {
-    r: 0,
-    g: 0,
-    b: 0
-  };
-  if (hex.length === 7) {
-    rgb.r = parseInt(hex.substr(1, 2), 16);
-    rgb.g = parseInt(hex.substr(3, 2), 16);
-    rgb.b = parseInt(hex.substr(5, 2), 16);
-  } else if (hex.length === 4) {
-    var r = hex.substr(1, 1);
-    var g = hex.substr(2, 1);
-    var b = hex.substr(3, 1);
-    rgb.r = parseInt(r + r, 16);
-    rgb.g = parseInt(g + g, 16);
-    rgb.b = parseInt(b + b, 16);
-  }
-  return rgb;
+    const rgb = {
+        r: 0,
+        g: 0,
+        b: 0,
+    };
+    if (hex.length === 7) {
+        rgb.r = parseInt(hex.substr(1, 2), 16);
+        rgb.g = parseInt(hex.substr(3, 2), 16);
+        rgb.b = parseInt(hex.substr(5, 2), 16);
+    }
+    else if (hex.length === 4) {
+        const r = hex.substr(1, 1);
+        const g = hex.substr(2, 1);
+        const b = hex.substr(3, 1);
+        rgb.r = parseInt(r + r, 16);
+        rgb.g = parseInt(g + g, 16);
+        rgb.b = parseInt(b + b, 16);
+    }
+    return rgb;
 }
-
 /**
  * Convert an RGB object to a hex color string in the format '#rrggbb'.
- * @param {{r: number, g: number, b: number}} int
- * @returns {string}
  */
-function toHex(_int) {
-  return "#".concat(Math.round(_int.r).toString(16)).concat(Math.round(_int.g).toString(16)).concat(Math.round(_int.b).toString(16));
+function toHex(int) {
+    return `#${Math.round(int.r).toString(16)}${Math.round(int.g).toString(16)}${Math.round(int.b).toString(16)}`;
 }
-
-/**
- * @param {string} color color in the format '#rrggbb' or '#rgb'
- * @param {string} overlayColor overlay color in the format '#rrggbb' or '#rgb'
- * @param {number} elevation elevation as an integer starting with 1
- * @returns {string} the hex color string in the format '#rrggbb'
- */
-function getElevation(color, overlayColor, elevation) {
-  var rgb = toInt(color);
-  var overlay = toInt(overlayColor);
-  rgb.r += overlay.r * (0.05 + step * (elevation - 1));
-  rgb.g += overlay.g * (0.05 + step * (elevation - 1));
-  rgb.b += overlay.b * (0.05 + step * (elevation - 1));
-  return toHex(rgb);
+/** Returns the hex color string in the format '#rrggbb' */
+function getElevation(
+/** color in the format '#rrggbb' or '#rgb' */
+color, 
+/** overlay color in the format '#rrggbb' or '#rgb' */
+overlayColor, 
+/** elevation as an integer starting with 1 */
+elevation) {
+    const rgb = toInt(color);
+    const overlay = toInt(overlayColor);
+    rgb.r += overlay.r * (0.05 + step * (elevation - 1));
+    rgb.g += overlay.g * (0.05 + step * (elevation - 1));
+    rgb.b += overlay.b * (0.05 + step * (elevation - 1));
+    return toHex(rgb);
 }
-
 /**
  * Get all 24 elevations of the given color and overlay.
- * @param {string} color color in the format '#rrggbb' or '#rgb'
- * @param {string} overlay overlay color in the format '#rrggbb' or '#rgb'
- * @returns {import('@mui/material/styles/withStyles').CSSProperties}
  */
-function getElevations(color, overlay) {
-  /** @type {import('@mui/material/styles/withStyles').CSSProperties} */
-  var elevations = {};
-  for (var i = 1; i <= 24; i++) {
-    elevations["elevation".concat(i)] = {
-      backgroundColor: getElevation(color, overlay, i)
-    };
-  }
-  return elevations;
-}
-var buttonsPalette = function buttonsPalette() {
-  return {
-    palette: {
-      // mode: "dark",
-      grey: {
-        main: _colors.grey[300],
-        dark: _colors.grey[400]
-      }
+function getElevations(
+/** color in the format '#rrggbb' or '#rgb' */
+color, 
+/** overlay color in the format '#rrggbb' or '#rgb' */
+overlay) {
+    const elevations = {};
+    for (let i = 1; i <= 24; i++) {
+        elevations[`elevation${i}`] = {
+            backgroundColor: getElevation(color, overlay, i),
+        };
     }
-  };
-};
-var buttonsTheme = function buttonsTheme(theme) {
-  return {
-    components: {
-      MuiButton: {
-        variants: [{
-          props: {
-            variant: 'contained',
-            color: 'grey'
-          },
-          style: {
-            color: theme.palette.getContrastText(theme.palette.grey[300])
-          }
-        }, {
-          props: {
-            variant: 'outlined',
-            color: 'grey'
-          },
-          style: {
-            color: theme.palette.text.primary,
-            borderColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
-            '&.Mui-disabled': {
-              border: "1px solid ".concat(theme.palette.action.disabledBackground)
-            },
-            '&:hover': {
-              borderColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
-              backgroundColor: (0, _styles.alpha)(theme.palette.text.primary, theme.palette.action.hoverOpacity)
-            }
-          }
-        }, {
-          props: {
-            color: 'grey',
-            variant: 'text'
-          },
-          style: {
-            color: 'black',
-            '&:hover': {
-              backgroundColor: (0, _styles.alpha)(theme.palette.text.primary, theme.palette.action.hoverOpacity)
-            }
-          }
-        }]
-      }
-    }
-  };
-};
-
+    return elevations;
+}
+// const buttonsPalette = () => ({
+//     palette: {
+//         // mode: "dark",
+//         grey: {
+//             main: grey[300],
+//             dark: grey[400],
+//         },
+//     },
+// });
+// const buttonsTheme = theme => ({
+//     components: {
+//         MuiButton: {
+//             variants: [
+//                 {
+//                     props: { variant: 'contained', color: 'grey' },
+//                     style: {
+//                         color: theme.palette.getContrastText(theme.palette.grey[300]),
+//                     },
+//                 },
+//                 {
+//                     props: { variant: 'outlined', color: 'grey' },
+//                     style: {
+//                         color: theme.palette.text.primary,
+//                         borderColor:
+//                             theme.palette.mode === 'light'
+//                                 ? 'rgba(0, 0, 0, 0.23)'
+//                                 : 'rgba(255, 255, 255, 0.23)',
+//                         '&.Mui-disabled': {
+//                             border: `1px solid ${theme.palette.action.disabledBackground}`,
+//                         },
+//                         '&:hover': {
+//                             borderColor:
+//                                 theme.palette.mode === 'light'
+//                                     ? 'rgba(0, 0, 0, 0.23)'
+//                                     : 'rgba(255, 255, 255, 0.23)',
+//                             backgroundColor: alpha(
+//                                 theme.palette.text.primary,
+//                                 theme.palette.action.hoverOpacity,
+//                             ),
+//                         },
+//                     },
+//                 },
+//                 {
+//                     props: { color: 'grey', variant: 'text' },
+//                     style: {
+//                         color: 'black',
+//                         '&:hover': {
+//                             backgroundColor: alpha(
+//                                 theme.palette.text.primary,
+//                                 theme.palette.action.hoverOpacity,
+//                             ),
+//                         },
+//                     },
+//                 },
+//             ],
+//         },
+//     },
+// });
 /**
  * The theme creation factory function.
- * @param {string} type
- * @returns {import('./types').Theme}
  */
-var Theme = function Theme(type) {
-  var theme;
-  if (type === 'dark') {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'dark',
-        background: {
-          paper: '#121212',
-          "default": '#121212'
-        },
-        primary: {
-          main: '#4dabf5'
-        },
-        secondary: {
-          main: '#436a93'
-        },
-        expert: '#14bb00',
-        text: {
-          primary: '#ffffff',
-          secondary: '#ffffff'
-        }
-      },
-      overrides: {
-        MuiAppBar: {
-          colorDefault: {
-            backgroundColor: '#272727'
-          }
-        },
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[200],
-            '&:hover': {
-              color: _colors.orange[100]
-            }
-          }
-        },
-        MuiPaper: getElevations('#121212', '#fff')
-      }
-    };
-  } else if (type === 'blue') {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'dark',
-        background: {
-          paper: '#151d21',
-          "default": '#151d21'
-        },
-        primary: {
-          main: '#4dabf5'
-        },
-        secondary: {
-          main: '#436a93'
-        },
-        expert: '#14bb00',
-        text: {
-          primary: '#ffffff',
-          secondary: '#ffffff'
-        }
-      },
-      overrides: {
-        MuiAppBar: {
-          colorDefault: {
-            backgroundColor: '#2a3135'
-          }
-        },
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[200],
-            '&:hover': {
-              color: _colors.orange[100]
-            }
-          }
-        },
-        MuiPaper: getElevations('#151d21', '#fff')
-      }
-    };
-  } else if (type === 'colored') {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'light',
-        primary: {
-          main: '#3399CC'
-        },
-        secondary: {
-          main: '#164477'
-        },
-        expert: '#96fc96'
-      },
-      overrides: {
-        MuiAppBar: {
-          colorDefault: {
-            backgroundColor: '#3399CC'
-          }
-        },
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[400],
-            '&:hover': {
-              color: _colors.orange[300]
-            }
-          }
-        }
-      }
-    };
-  } else if (type === 'PT') {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'light',
-        primary: {
-          main: '#0F99DE'
-        },
-        secondary: {
-          main: '#88A536'
-        },
-        expert: '#BD1B24'
-      },
-      overrides: {
-        MuiAppBar: {
-          colorDefault: {
-            backgroundColor: '#0F99DE'
-          }
-        },
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[400],
-            '&:hover': {
-              color: _colors.orange[300]
-            }
-          }
-        }
-      }
-    };
-  } else if (type === 'DX') {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'light',
-        primary: {
-          main: '#F5F5F7'
-        },
-        secondary: {
-          main: '#a9a9a9'
-        },
-        expert: '#BD1B24',
-        text: {
-          primary: '#007AFE',
-          secondary: '#007AFE',
-          disabled: '#007AFEAA'
-        }
-      },
-      overrides: {
-        MuiAppBar: {
-          colorDefault: {
-            backgroundColor: '#a9a9a9'
-          }
-        },
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[400],
-            '&:hover': {
-              color: _colors.orange[300]
-            }
-          }
-        }
-      }
+const CustomTheme = (type) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    let options;
+    if (type === 'dark') {
+        options = {
+            name: type,
+            palette: {
+                mode: 'dark',
+                background: {
+                    paper: '#121212',
+                    default: '#121212',
+                },
+                primary: {
+                    main: '#4dabf5',
+                },
+                secondary: {
+                    main: '#436a93',
+                },
+                // @ts-expect-error Custom field
+                expert: '#14bb00',
+                text: {
+                    primary: '#ffffff',
+                    secondary: '#ffffff',
+                },
+            },
+            overrides: {
+                MuiAppBar: {
+                    colorDefault: {
+                        backgroundColor: '#272727',
+                    },
+                },
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[200],
+                        '&:hover': {
+                            color: colors_1.orange[100],
+                        },
+                    },
+                },
+                MuiPaper: getElevations('#121212', '#fff'),
+            },
+        };
+    }
+    else if (type === 'blue') {
+        options = {
+            name: type,
+            palette: {
+                mode: 'dark',
+                background: {
+                    paper: '#151d21',
+                    default: '#151d21',
+                },
+                primary: {
+                    main: '#4dabf5',
+                },
+                secondary: {
+                    main: '#436a93',
+                },
+                // @ts-expect-error Custom field
+                expert: '#14bb00',
+                text: {
+                    primary: '#ffffff',
+                    secondary: '#ffffff',
+                },
+            },
+            overrides: {
+                MuiAppBar: {
+                    colorDefault: {
+                        backgroundColor: '#2a3135',
+                    },
+                },
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[200],
+                        '&:hover': {
+                            color: colors_1.orange[100],
+                        },
+                    },
+                },
+                MuiPaper: getElevations('#151d21', '#fff'),
+            },
+        };
+    }
+    else if (type === 'colored') {
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#3399CC',
+                },
+                secondary: {
+                    main: '#164477',
+                },
+                // @ts-expect-error Custom field
+                expert: '#96fc96',
+            },
+            overrides: {
+                MuiAppBar: {
+                    colorDefault: {
+                        backgroundColor: '#3399CC',
+                    },
+                },
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[400],
+                        '&:hover': {
+                            color: colors_1.orange[300],
+                        },
+                    },
+                },
+            },
+        };
+    }
+    else if (type === 'PT') {
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#0F99DE',
+                },
+                secondary: {
+                    main: '#88A536',
+                },
+                // @ts-expect-error Custom field
+                expert: '#BD1B24',
+            },
+            overrides: {
+                MuiAppBar: {
+                    colorDefault: {
+                        backgroundColor: '#0F99DE',
+                    },
+                },
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[400],
+                        '&:hover': {
+                            color: colors_1.orange[300],
+                        },
+                    },
+                },
+            },
+        };
+    }
+    else if (type === 'DX') {
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#F5F5F7',
+                },
+                secondary: {
+                    main: '#a9a9a9',
+                },
+                // @ts-expect-error Custom field
+                expert: '#BD1B24',
+                text: {
+                    primary: '#007AFE',
+                    secondary: '#007AFE',
+                    disabled: '#007AFEAA',
+                },
+            },
+            overrides: {
+                MuiAppBar: {
+                    colorDefault: {
+                        backgroundColor: '#a9a9a9',
+                    },
+                },
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[400],
+                        '&:hover': {
+                            color: colors_1.orange[300],
+                        },
+                    },
+                },
+            },
+        };
+    }
+    else {
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#3399CC',
+                    light: undefined,
+                    dark: undefined,
+                    contrastText: undefined,
+                },
+                secondary: {
+                    main: '#164477',
+                },
+                // @ts-ignore
+                expert: '#14bb00',
+            },
+            overrides: {
+                MuiLink: {
+                    root: {
+                        textTransform: 'uppercase',
+                        transition: 'color .3s ease',
+                        color: colors_1.orange[400],
+                        '&:hover': {
+                            color: colors_1.orange[300],
+                        },
+                    },
+                },
+            },
+        };
+    }
+    // @ts-expect-error Custom field
+    options.toolbar = {
+        height: 48,
     };
-  } else {
-    theme = {
-      name: type,
-      palette: {
-        mode: 'light',
-        primary: {
-          main: '#3399CC'
+    // @ts-expect-error Custom field
+    options.saveToolbar = {
+        background: (_b = (_a = options.palette) === null || _a === void 0 ? void 0 : _a.primary) === null || _b === void 0 ? void 0 : _b.main,
+        button: {
+            borderRadius: 3,
+            height: 32,
         },
-        secondary: {
-          main: '#164477'
-        },
-        expert: '#14bb00'
-      },
-      overrides: {
-        MuiLink: {
-          root: {
-            textTransform: 'uppercase',
-            transition: 'color .3s ease',
-            color: _colors.orange[400],
-            '&:hover': {
-              color: _colors.orange[300]
-            }
-          }
-        }
-      }
     };
-  }
-  theme.toolbar = {
-    height: 48
-  };
-
-  // add save toolbar
-  theme.saveToolbar = {
-    background: theme.palette.primary.main,
-    button: {
-      borderRadius: 3,
-      height: 32
+    if (options.palette) {
+        options.palette.grey = {
+            // @ts-expect-error Custom field
+            main: colors_1.grey[300],
+            dark: colors_1.grey[400],
+        };
     }
-  };
-  theme.palette.grey = {
-    main: _colors.grey[300],
-    dark: _colors.grey[400]
-  };
-  theme = (0, _styles.createTheme)((0, _styles.adaptV4Theme)(theme));
-  return (0, _styles.createTheme)(theme, {
-    components: {
-      MuiButton: {
-        variants: [{
-          props: {
-            variant: 'contained',
-            color: 'grey'
-          },
-          style: {
-            color: theme.palette.getContrastText(theme.palette.grey[300])
-          }
-        }, {
-          props: {
-            variant: 'outlined',
-            color: 'grey'
-          },
-          style: {
-            color: theme.palette.text.primary,
-            borderColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
-            '&.Mui-disabled': {
-              border: "1px solid ".concat(theme.palette.action.disabledBackground)
+    const theme = (0, styles_1.createTheme)(options);
+    const palette = theme.palette;
+    return (0, styles_1.createTheme)(theme, {
+        components: {
+            MuiButton: {
+                variants: [
+                    {
+                        props: { variant: 'contained', color: 'grey' },
+                        style: {
+                            color: palette.getContrastText && palette.grey && palette.grey[300] ? palette.getContrastText(palette.grey[300]) : undefined,
+                        },
+                    },
+                    {
+                        props: { variant: 'outlined', color: 'grey' },
+                        style: {
+                            color: (_c = palette.text) === null || _c === void 0 ? void 0 : _c.primary,
+                            borderColor: palette.mode === 'light'
+                                ? 'rgba(0, 0, 0, 0.23)'
+                                : 'rgba(255, 255, 255, 0.23)',
+                            '&.Mui-disabled': {
+                                border: `1px solid ${(_d = palette.action) === null || _d === void 0 ? void 0 : _d.disabledBackground}`,
+                            },
+                            '&:hover': {
+                                borderColor: palette.mode === 'light'
+                                    ? 'rgba(0, 0, 0, 0.23)'
+                                    : 'rgba(255, 255, 255, 0.23)',
+                                backgroundColor: (0, styles_1.alpha)(((_e = palette.text) === null || _e === void 0 ? void 0 : _e.primary) || '', ((_f = palette.action) === null || _f === void 0 ? void 0 : _f.hoverOpacity) || 0.04),
+                            },
+                        },
+                    },
+                    {
+                        props: { variant: 'text', color: 'grey' },
+                        style: {
+                            color: (_g = palette.text) === null || _g === void 0 ? void 0 : _g.primary,
+                            '&:hover': {
+                                backgroundColor: (0, styles_1.alpha)(((_h = palette.text) === null || _h === void 0 ? void 0 : _h.primary) || '', ((_j = palette.action) === null || _j === void 0 ? void 0 : _j.hoverOpacity) || 0.04),
+                            },
+                        },
+                    },
+                ],
             },
-            '&:hover': {
-              borderColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
-              backgroundColor: (0, _styles.alpha)(theme.palette.text.primary, theme.palette.action.hoverOpacity)
-            }
-          }
-        }, {
-          props: {
-            variant: 'text',
-            color: 'grey'
-          },
-          style: {
-            color: theme.palette.text.primary,
-            '&:hover': {
-              backgroundColor: (0, _styles.alpha)(theme.palette.text.primary, theme.palette.action.hoverOpacity)
-            }
-          }
-        }]
-      }
-    }
-  });
+        },
+    });
 };
-var _default = exports["default"] = Theme;
-//# sourceMappingURL=Theme.js.map
+exports.default = CustomTheme;