iobroker.webui 1.25.1 → 1.26.0

package/README.md

@@ -133,6 +133,15 @@ runtime.html?screenName=screen2
 	Placeholder for next versions:
 	### __WORK IN PROGRESS__
 -->
+### 1.26.0 (2025-03-04)
+- fix error in screenviewer
+- update npms
+- rename global styles
+- allow styling of dialog
+
+### 1.25.2 (2025-02-05)
+- fix null error on props
+
 ### 1.25.1 (2025-01-24)
 - escape xml
 - switch to official selector package

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "webui",
-    "version": "1.25.1",
+    "version": "1.26.0",
     "titleLang": {
       "en": "webui",
       "de": "webui",
@@ -29,6 +29,32 @@
       "zh-cn": "使用万维网传送器的高锰用户接口"
     },
     "news": {
+      "1.26.0": {
+        "en": "fix error in screenviewer\nupdate npms\nrename global styles\nallow styling of dialog",
+        "de": "fehler in screenviewer beheben\naktualisierung von npms\numbenennen global styles\ndie gestaltung des dialogs ermöglichen",
+        "ru": "исправить ошибку screenviewer\nобновление npms\nпереименовать глобальные стили\nразрешить стилизацию диалога",
+        "pt": "corrigir erro no screenviewer\natualização npms\nrenomear estilos globais\npermitir o estilo de diálogo",
+        "nl": "fix error in screenviewer\nnpms bijwerken\nglobale stijlen hernoemen\nstyling van dialoogvenster toestaan",
+        "fr": "correction d'erreur dans screenviewer\nmettre à jour npms\nrenommer les styles globaux\npermettre le style de dialogue",
+        "it": "errore di correzione in screenviewer\naggiornamento npm\nrinominare gli stili globali\nconsentire lo styling di dialogo",
+        "es": "corregir error en screenviewer\nactualización npms\nrenombrar estilos globales\npermitir el estilo de diálogo",
+        "pl": "naprawić błąd w przeglądarce\nupdate npms\nzmienić nazwę stylów globalnych\numożliwić stylizację okna dialogowego",
+        "uk": "виправлено помилку в екрані\nоновлення npms\nперейменувати глобальні стилі\nдозволяє укладати діалогове вікно",
+        "zh-cn": "在屏幕查看器中修正错误\n更新 npms\n重命名全局样式\n允许对话框的样式"
+      },
+      "1.25.2": {
+        "en": "fix null error on props",
+        "de": "nullfehler auf requisiten beheben",
+        "ru": "исправить ошибку null на реквизитов",
+        "pt": "corrigir erro nulo em adereços",
+        "nl": "fix null-fout op rekwisieten",
+        "fr": "correction de l'erreur null sur les accessoires",
+        "it": "correzione di errore null su oggetti",
+        "es": "solucionar error null en props",
+        "pl": "naprawić błąd null na rekwizytach",
+        "uk": "виправити помилку null на пропсах",
+        "zh-cn": "修复道具上的无效错误"
+      },
       "1.25.1": {
         "en": "escape xml\nswitch to official selector package",
         "de": "entkommen xml\nwechsel zum offiziellen auswahlpaket",
@@ -93,32 +119,6 @@
         "pl": "revert es module shims, prowadzi do błędów",
         "uk": "перевернути назад es модуль шімів, призводить до помилок",
         "zh-cn": "返回 es 模块 shims, 导致错误"
-      },
-      "1.24.1": {
-        "en": "hopefully fix package upload by changed name",
-        "de": "hoffentlich paket-upload mit geändertem namen beheben",
-        "ru": "надеюсь исправить загрузку пакета измененным именем",
-        "pt": "esperançosamente corrigir o upload do pacote por nome alterado",
-        "nl": "hopelijk pakket uploaden op gewijzigde naam repareren",
-        "fr": "j'espère corriger le téléchargement du paquet par changement de nom",
-        "it": "si spera di risolvere il pacchetto upload con il nome cambiato",
-        "es": "esperemos fijar la carga del paquete por nombre cambiado",
-        "pl": "miejmy nadzieję, że uda się naprawić przesyłkę po zmianie nazwy",
-        "uk": "сподіваємось на те, що завантаження пакету змінено",
-        "zh-cn": "希望用更改的名称修正软件包上传"
-      },
-      "1.24.0": {
-        "en": "cleanup www dir",
-        "de": "reinigung www dr",
-        "ru": "очистка www dir",
-        "pt": "limpeza www dir",
-        "nl": "opruimen www dir",
-        "fr": "nettoyage www dir",
-        "it": "pulizia www dir",
-        "es": "cleanup www dir",
-        "pl": "czyszczenie dir www",
-        "uk": "очищувач www dir",
-        "zh-cn": "清理 www dir"
       }
     },
     "icon": "logo.png",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.webui",
-  "version": "1.25.1",
+  "version": "1.26.0",
   "description": "ioBroker webui",
   "type": "module",
   "main": "dist/backend/main.js",
@@ -44,23 +44,23 @@
   },
   "dependencies": {
     "@iobroker/adapter-core": "^3.2.3",
-    "@types/node": "^22.10.7"
+    "@types/node": "^22.13.9"
   },
   "devDependencies": {
-    "@adobe/css-tools": "4.4.1",
+    "@adobe/css-tools": "4.4.2",
     "@alcalzone/release-script": "^3.8.0",
     "@alcalzone/release-script-plugin-iobroker": "^3.7.2",
     "@alcalzone/release-script-plugin-license": "^3.7.0",
     "@blockly/zoom-to-fit": "^6.0.12",
-    "@iobroker/socket-client": "^4.0.0",
-    "@iobroker/testing": "^5.0.0",
+    "@iobroker/socket-client": "^4.0.21",
+    "@iobroker/testing": "^5.0.3",
     "@iobroker/webcomponent-selectid-dialog": "^1.0.3",
-    "@node-projects/base-custom-webcomponent": "0.27.8",
+    "@node-projects/base-custom-webcomponent": "0.29.0",
     "@node-projects/lean-he-esm": "^3.3.0",
     "@node-projects/node-html-parser-esm": "^6.2.0",
     "@node-projects/propertygrid.webcomponent": "^1.3.0",
     "@node-projects/splitview.webcomponent": "^1.0.1",
-    "@node-projects/web-component-designer": "^0.1.240",
+    "@node-projects/web-component-designer": "^0.1.245",
     "@node-projects/web-component-designer-codeview-monaco": "^0.1.33",
     "@node-projects/web-component-designer-htmlparserservice-nodehtmlparser": "^0.1.11",
     "@node-projects/web-component-designer-stylesheetservice-css-tools": "^0.1.10",
@@ -69,31 +69,31 @@
     "@types/json-schema": "^7.0.15",
     "@web/dev-server": "^0.4.6",
     "blockly": "^11.2.1",
-    "chai": "^5.1.2",
+    "chai": "^5.2.0",
     "chai-as-promised": "^8.0.1",
     "construct-style-sheets-polyfill": "^3.1.0",
     "cross-env": "^7.0.3",
     "dayjs": "^1.11.13",
     "del": "^8.0.0",
     "dock-spawn-ts": "^3.2.1",
-    "es-module-shims": "1.10.1",
-    "eslint": "^9.18.0",
+    "es-module-shims": "2.0.10",
+    "eslint": "^9.21.0",
     "esprima-next": "^6.0.3",
     "glob-stream": "^8.0.2",
     "gulp": "^5.0.0",
     "gulp-git": "^2.11.0",
     "gulp-replace": "^1.1.4",
-    "long": "^5.2.4",
+    "long": "^5.3.1",
     "mobile-drag-drop": "^3.0.0-rc.0",
-    "mocha": "^11.0.1",
+    "mocha": "^11.1.0",
     "monaco-editor": "^0.50.0",
     "nyc": "^17.1.0",
     "sinon-chai": "^4.0.0",
     "toastify-js": "^1.12.0",
     "ts-node": "^10.9.2",
     "tslib": "^2.8.1",
-    "typescript": "^5.7.3",
+    "typescript": "^5.8.2",
     "typescript-json-schema": "^0.65.1",
-    "wunderbaum": "0.12.0"
+    "wunderbaum": "0.12.1"
   }
 }

package/www/dist/frontend/common/Common.globals.d.ts

@@ -52,7 +52,7 @@ declare var RUNTIME: {
         left?: string;
         top?: string;
     }): Promise<void>;
-    runSimpleScriptCommand<T extends import('@node-projects/web-component-designer-visualization-addons').ScriptCommands>(scriptCommand: T): Promise<void>;
+    runSimpleScriptCommand<T extends import('../scripting/IobrokerWebuiScriptCommands.js').WebuiScriptCommands>(scriptCommand: T): Promise<void>;
     getParentScreen(screen: BaseScreenViewerAndControl, parentlevel?: number): BaseScreenViewerAndControl;
     findParent<T>(element: Element, type: new (...args: any[]) => T, predicate?: (element: Element) => boolean): T;
 };

package/www/dist/frontend/common/IobrokerHandler.js

@@ -268,15 +268,17 @@ export class IobrokerHandler {
             try {
                 control = await this._getObjectFromFile(this.configPath + "controls/" + name + '.control');
                 //TODO: remove in a later version, fixes old props
-                let k = Object.keys(control.properties);
-                if (k.length && typeof control.properties[k[0]] == 'string') {
-                    for (let p in control.properties) {
-                        let prp = control.properties[p];
-                        if (prp.startsWith("[")) {
-                            control.properties[p] = { type: 'enum', values: JSON.parse(prp) };
-                        }
-                        else {
-                            control.properties[p] = { type: prp };
+                if (control.properties) {
+                    let k = Object.keys(control.properties);
+                    if (k.length && typeof control.properties[k[0]] == 'string') {
+                        for (let p in control.properties) {
+                            let prp = control.properties[p];
+                            if (prp.startsWith("[")) {
+                                control.properties[p] = { type: 'enum', values: JSON.parse(prp) };
+                            }
+                            else {
+                                control.properties[p] = { type: prp };
+                            }
                         }
                     }
                 }

package/www/dist/frontend/common/Runtime.d.ts

@@ -1,8 +1,8 @@
-import type { OpenDialog, OpenScreen, ScriptCommands } from "@node-projects/web-component-designer-visualization-addons";
+import type { OpenDialog, OpenScreen, WebuiScriptCommands } from "../scripting/IobrokerWebuiScriptCommands.js";
 export declare class Runtime {
     static openScreen(config: Omit<OpenScreen, 'type'>): Promise<void>;
     static openDialog(config: Omit<OpenDialog, 'type'>): Promise<void>;
-    static runSimpleScriptCommand<T extends ScriptCommands>(scriptCommand: T): Promise<void>;
+    static runSimpleScriptCommand<T extends WebuiScriptCommands>(scriptCommand: T): Promise<void>;
     static getParentScreen(screen: BaseScreenViewerAndControl, parentLevel?: number): BaseScreenViewerAndControl;
     static findParent<T>(element: Element, type: new (...args: any[]) => T, predicate?: (element: Element) => boolean): T;
 }

package/www/dist/frontend/config/IobrokerWebuiSolutionExplorer.js

@@ -295,20 +295,20 @@ export class IobrokerWebuiSolutionExplorer extends BaseCustomWebComponentConstru
                 }], event);
         };
         return {
-            title: 'Style',
+            title: 'Screens Style',
             folder: false,
             contextMenu: (e, data) => ctxMenu(e),
             dblclick: (e, data) => {
-                window.appShell.openGlobalStyleEditor(iobrokerHandler.config.globalStyle ?? '', 'global style', 'globalStyle');
+                window.appShell.openGlobalStyleEditor(iobrokerHandler.config.globalStyle ?? '', 'screens style', 'globalStyle');
             }
         };
     }
     _createFontDeclarationsNode() {
         return {
-            title: 'Font Declaration Style',
+            title: 'Global Style',
             folder: false,
             dblclick: (e, data) => {
-                window.appShell.openGlobalStyleEditor(iobrokerHandler.config.fontDeclarations ?? '', 'font declarations style', 'fontDeclarations');
+                window.appShell.openGlobalStyleEditor(iobrokerHandler.config.fontDeclarations ?? '', 'global style', 'fontDeclarations');
             }
         };
     }

package/www/dist/frontend/generated/ScriptCommands.json

@@ -489,6 +489,10 @@
                 "closeable": {
                     "type": "boolean"
                 },
+                "cssClass": {
+                    "description": "css class to apply to dialog",
+                    "type": "string"
+                },
                 "height": {
                     "type": "string"
                 },
@@ -522,6 +526,7 @@
                 }
             },
             "propertyOrder": [
+                "cssClass",
                 "type",
                 "screen",
                 "title",
@@ -973,9 +978,6 @@
                 {
                     "$ref": "#/definitions/OpenUrl"
                 },
-                {
-                    "$ref": "#/definitions/OpenDialog"
-                },
                 {
                     "$ref": "#/definitions/CloseDialog"
                 },
@@ -1069,6 +1071,9 @@
                 {
                     "$ref": "#/definitions/OpenScreen"
                 },
+                {
+                    "$ref": "#/definitions/OpenDialog"
+                },
                 {
                     "$ref": "#/definitions/OpenScreenInScreenViewer"
                 }

package/www/dist/frontend/helper/DialogHelper.js

@@ -3,10 +3,10 @@ export class IoBrokerWebuiDialog extends BaseCustomWebComponentConstructorAppend
     container;
     uniqueId;
     static template = html `
-        <div id="root" class="dialog-box">
-            <h3 id="head" class="dialog-title">&nbsp;</h3>
-            <a id="close" href="javascript:;" class="dialog-close" title="Close">&times;</a>
-            <div id="content" class="dialog-content"></div>
+        <div id="root" part="box" class="dialog-box">
+            <h3 id="head" part="head" class="dialog-title">&nbsp;</h3>
+            <a id="close" part="close" href="javascript:;" class="dialog-close" title="Close">&times;</a>
+            <div id="content" part="content" class="dialog-content"></div>
         </div>`;
     static style = css `
             #root {
@@ -146,6 +146,9 @@ export class IoBrokerWebuiDialog extends BaseCustomWebComponentConstructorAppend
         if (options.closeable === false || options.closeable === true) {
             dlg.closeable = options.closeable;
         }
+        if (options.cssClass) {
+            dlg.className = options.cssClass;
+        }
         document.getElementById('overlayLayer').appendChild(dlg);
         return uniqueId;
     }

package/www/dist/frontend/runtime/ScreenViewer.js

@@ -14,6 +14,18 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
         display: block;
     }
 
+    *[node-projects-hide-at-run-time] {
+        display: none !important;
+    }`;
+    static styleIfFromScreen = css `
+    :host {
+        background: transparent;
+        border: none;
+        transform: none;
+        padding: 0;
+        margin: 0;
+    }
+
     *[node-projects-hide-at-run-time] {
         display: none !important;
     }`;
@@ -179,22 +191,7 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
         else
             this._rootShadow.adoptedStyleSheets = [ScreenViewer_1.style];
         if (this._useStyleFromScreenForViewer) {
-            this.shadowRoot.adoptedStyleSheets = this._rootShadow.adoptedStyleSheets;
-            this._root.style.setProperty('background', 'transparent', 'important');
-            this._root.style.setProperty('border', 'none', 'important');
-            this._root.style.setProperty('transform', 'none', 'important');
-            this._root.style.setProperty('padding', '0', 'important');
-            this._root.style.setProperty('margin', '0', 'important');
-            this.style.setProperty('display', 'block', 'important');
-        }
-        else {
-            this.shadowRoot.adoptedStyleSheets = [];
-            this._root.style.removeProperty('background');
-            this._root.style.removeProperty('border');
-            this._root.style.removeProperty('transform');
-            this._root.style.removeProperty('padding');
-            this._root.style.removeProperty('margin');
-            this.style.removeProperty('display');
+            this.shadowRoot.adoptedStyleSheets = [ScreenViewer_1.styleIfFromScreen, ...this._rootShadow.adoptedStyleSheets];
         }
         let myDocument;
         //@ts-ignore

package/www/dist/frontend/scripting/IobrokerWebuiScriptSystem.js

@@ -36,6 +36,7 @@ export class IobrokerWebuiScriptSystem extends ScriptSystem {
                 const title = await this.getValue(command.title, context);
                 const moveable = await this.getValue(command.moveable, context);
                 const closeable = await this.getValue(command.closeable, context);
+                const cssClass = await this.getValue(command.cssClass, context);
                 let width = await this.getValue(command.width, context);
                 let height = await this.getValue(command.height, context);
                 const left = await this.getValue(command.left, context);
@@ -47,7 +48,7 @@ export class IobrokerWebuiScriptSystem extends ScriptSystem {
                     width = await (await iobrokerHandler.getWebuiObject('screen', screen)).settings.width;
                 if (!height)
                     height = await (await iobrokerHandler.getWebuiObject('screen', screen)).settings.height;
-                IoBrokerWebuiDialog.openDialog({ title, content: sv, moveable, closeable, width, height, top, left });
+                IoBrokerWebuiDialog.openDialog({ title, content: sv, moveable, closeable, width, height, top, left, cssClass });
                 break;
             }
             default: {

package/www/index.html

@@ -218,7 +218,7 @@
     </button>
     <button data-command="save" title="save" disabled><img src="./node_modules/@node-projects/web-component-designer/assets/icons/save.svg"></button>
     <div style="margin-left: 30px;">
-      webui - 1.25.1 - b3caac3
+      webui - 1.26.0 - 9c446b2
     </div>
     <button style="margin-left: 30px;" data-command="paste" title="paste" disabled><img
         src="./node_modules/@node-projects/web-component-designer/assets/icons/paste.svg"></button>

package/www/node_modules/@adobe/css-tools/dist/index.mjs

@@ -252,7 +252,7 @@ const $d708735ed1303b43$export$98e6a39c04603d36 = (css, options)=>{
         // :
         if (!match(/^:\s*/)) return error("property missing ':'");
         // val
-        const val = match(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};])+)/);
+        const val = match(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|[^)])*?\)|[^};])+)/);
         const ret = pos({
             type: (0, $b2e137848b48cf4f$export$9be5dd6e61d5d73a).declaration,
             property: propValue.replace($d708735ed1303b43$var$commentre, ''),

package/www/node_modules/@iobroker/socket-client/dist/esm/AdminConnection.js

@@ -854,12 +854,12 @@ export class AdminConnection extends Connection {
     clearNotifications(host, category) {
         return this.request({
             executor: (resolve, reject, timeout) => {
-                this._socket.emit('sendToHost', host, 'clearNotifications', { category }, notifications => {
+                this._socket.emit('sendToHost', host, 'clearNotifications', { category }, result => {
                     if (timeout.elapsed) {
                         return;
                     }
                     timeout.clearTimeout();
-                    resolve(notifications);
+                    resolve(result);
                 });
             },
         });
@@ -941,7 +941,8 @@ export class AdminConnection extends Connection {
                         return;
                     }
                     timeout.clearTimeout();
-                    resolve(res.json());
+                    const result = await res.json();
+                    resolve(result);
                 }
                 catch (e) {
                     reject(`getCurrentSession: ${e}`);
@@ -964,7 +965,9 @@ export class AdminConnection extends Connection {
                     if (err) {
                         reject(err);
                     }
-                    resolve(namespace);
+                    else {
+                        resolve(namespace);
+                    }
                 });
             },
         });

package/www/node_modules/@iobroker/socket-client/dist/esm/Connection.d.ts

@@ -1,5 +1,59 @@
 import type { ConnectionProps, LogMessage } from './ConnectionProps.js';
 import type { EmitEventHandler, ListenEventHandler, SocketClient } from './SocketClient.js';
+export interface OAuth2Response {
+    /** The access token */
+    access_token: string;
+    /** The time in seconds when the access token expires, e.g., 3600 for 1 hour */
+    expires_in: number;
+    /** The type of the token */
+    token_type: 'Bearer' | 'JWT';
+    /** The refresh token */
+    refresh_token: string;
+    /** The time in seconds when the refresh token expires, e.g., 600 for 10 minutes */
+    refresh_token_expires_in: number;
+}
+export interface StoredTokens {
+    refresh_token: string;
+    access_token: string;
+    expires_in: Date;
+    refresh_token_expires_in: Date;
+    stayLoggedIn: boolean;
+    owner: string | undefined;
+}
+export interface SocketACL {
+    user: `system.user.${string}` | '';
+    groups: `system.group.${string}`[];
+    object?: {
+        read: boolean;
+        list: boolean;
+        write: boolean;
+        delete: boolean;
+    };
+    state?: {
+        list: boolean;
+        read: boolean;
+        write: boolean;
+        delete: boolean;
+        create: boolean;
+    };
+    users?: {
+        create: boolean;
+        delete: boolean;
+        write: boolean;
+    };
+    other?: {
+        http: boolean;
+        execute: boolean;
+        sendto: boolean;
+    };
+    file?: {
+        list: boolean;
+        create: boolean;
+        write: boolean;
+        read: boolean;
+        delete: boolean;
+    };
+}
 /** Possible progress states. */
 export declare enum PROGRESS {
     /** The socket is connecting. */
@@ -67,6 +121,8 @@ export declare class Connection<CustomListenEvents extends Record<keyof CustomLi
     constructor(props: Partial<ConnectionProps>);
     private applyDefaultProps;
     private readonly props;
+    readonly connId: string;
+    private lastAccessToken;
     private ignoreState;
     private connected;
     private subscribed;
@@ -79,7 +135,7 @@ export declare class Connection<CustomListenEvents extends Record<keyof CustomLi
     private readonly objectsSubscribes;
     private objects;
     private states;
-    acl: any;
+    acl: SocketACL | null;
     isSecure: boolean;
     onReadyDone: boolean;
     private readonly onConnectionHandlers;
@@ -96,7 +152,8 @@ export declare class Connection<CustomListenEvents extends Record<keyof CustomLi
     private _instanceSubscriptions;
     /** Cache for server requests */
     private readonly _promises;
-    protected _authTimer: any;
+    protected _authTimer: ReturnType<typeof setTimeout> | null;
+    protected _refreshTimer: ReturnType<typeof setTimeout> | null;
     protected _systemConfig?: ioBroker.SystemConfigObject;
     /** The "system.config" object */
     get systemConfig(): Readonly<ioBroker.SystemConfigObject> | undefined;
@@ -117,6 +174,29 @@ export declare class Connection<CustomListenEvents extends Record<keyof CustomLi
      * Called internally.
      */
     private onPreConnect;
+    static readTokens(): StoredTokens | null;
+    static saveTokensStatic(data: OAuth2Response, stayLoggedIn: boolean, owner?: string): void;
+    saveTokens(data: OAuth2Response, stayLoggedIn: boolean): void;
+    static deleteTokensStatic(): void;
+    /**
+     * Destroy tokens if they were created by this connection if they expired or invalid
+     *
+     * @param stayLoggedIn if stored in localStorage or in sessionStorage
+     * @param logout if logout is requested
+     */
+    deleteTokens(stayLoggedIn: boolean, logout?: boolean): void;
+    private onAccessTokenUpdated;
+    private updateTokenExpiration;
+    private refreshTokens;
+    /**
+     * Attempts to acquire the semaphore lock.
+     *
+     * @returns True if the lock was acquired successfully; otherwise, false.
+     */
+    acquireTokenLock(): boolean;
+    /** Releases the semaphore lock if it's owned by the given connection ID. */
+    releaseTokenLock(): void;
+    private checkAccessTokenExpire;
     /**
      * Checks if running in ioBroker cloud
      */