iobroker.webui 1.26.0 → 1.27.0

package/README.md

@@ -133,6 +133,11 @@ runtime.html?screenName=screen2
 	Placeholder for next versions:
 	### __WORK IN PROGRESS__
 -->
+### 1.27.0 (2025-03-30)
+- edit string in visu property grid
+- bindings to properties did not work (in designer)
+- html setting did not work sometimes
+
 ### 1.26.0 (2025-03-04)
 - fix error in screenviewer
 - update npms

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "webui",
-    "version": "1.26.0",
+    "version": "1.27.0",
     "titleLang": {
       "en": "webui",
       "de": "webui",
@@ -29,6 +29,19 @@
       "zh-cn": "使用万维网传送器的高锰用户接口"
     },
     "news": {
+      "1.27.0": {
+        "en": "edit string in visu property grid\nbindings to properties did not work (in designer)\nhtml setting did not work sometimes",
+        "de": "string in visu-eigenschaftsgitter bearbeiten\nbindungen an eigenschaften funktionierten nicht (im designer)\nhtml einstellung funktioniert nicht manchmal",
+        "ru": "редактировать строки в сетке свойств visu\nпривязка к свойствам не сработала (в конструкторе)\nhtml-настройка иногда не работает",
+        "pt": "edit string in visu property grid\nligações a propriedades não funcionou (em designer)\nconfiguração html não funcionou às vezes",
+        "nl": "tekenreeks bewerken in visu eigenschap raster\nbindingen aan eigenschappen werkten niet (in ontwerper)\nhtml-instelling werkte soms niet",
+        "fr": "modifier la chaîne dans la grille de propriétés visu\nles fixations aux propriétés ne fonctionnaient pas (en designer)\nle réglage html ne fonctionnait pas parfois",
+        "it": "modifica stringa nella griglia di proprietà visu\nleganti a proprietà non ha funzionato (in progettista)\nhtml impostazione non ha funzionato a volte",
+        "es": "cadena de edición en la red de propiedades visu\nvinculantes para propiedades no funcionaron (en diseñador)\nhtml setting did not work sometimes",
+        "pl": "edytuj ciąg w siatce właściwości visu\nwiązania do nieruchomości nie działa (w projektancie)\nustawienia html nie działały czasami",
+        "uk": "редагувати рядок в мережі visu\nобов’язки до властивостей не працювали (у дизайнеру)\nналаштування html не працює іноді",
+        "zh-cn": "在粘着属性网格中编辑字符串\n约束属性无效( 设计者)\nhtml 设置有时行不通"
+      },
       "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",
@@ -106,19 +119,6 @@
         "pl": "pierwsze obciążenie wiązania css\nfix get box quads with slots\nfix es module shims",
         "uk": "перше навантаження css зв'язування\nзакріпити ящик квадроцикли з слотами\nзакріпити es модуль шім",
         "zh-cn": "首先装入 css 绑定\n固定带插槽的框形\n修补 e 模块 shims"
-      },
-      "1.24.2": {
-        "en": "revert back es module shims, leads to errors",
-        "de": "zurückkehren es modul shims, führt zu fehlern",
-        "ru": "возвращать назад эс-модульные шимы, приводит к ошибкам",
-        "pt": "reverter para trás es módulo shims, leva a erros",
-        "nl": "terug te keren es module shims, leidt tot fouten",
-        "fr": "retour du module es shims, conduit à des erreurs",
-        "it": "revert back es modulo shims, conduce a errori",
-        "es": "revert back es module shims, leads to errors",
-        "pl": "revert es module shims, prowadzi do błędów",
-        "uk": "перевернути назад es модуль шімів, призводить до помилок",
-        "zh-cn": "返回 es 模块 shims, 导致错误"
       }
     },
     "icon": "logo.png",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.webui",
-  "version": "1.26.0",
+  "version": "1.27.0",
   "description": "ioBroker webui",
   "type": "module",
   "main": "dist/backend/main.js",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@iobroker/adapter-core": "^3.2.3",
-    "@types/node": "^22.13.9"
+    "@types/node": "^22.13.14"
   },
   "devDependencies": {
     "@adobe/css-tools": "4.4.2",
@@ -52,32 +52,32 @@
     "@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.21",
-    "@iobroker/testing": "^5.0.3",
-    "@iobroker/webcomponent-selectid-dialog": "^1.0.3",
+    "@iobroker/socket-client": "^4.1.0",
+    "@iobroker/testing": "^5.0.4",
+    "@iobroker/webcomponent-selectid-dialog": "^1.0.7",
     "@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.245",
+    "@node-projects/web-component-designer": "^0.1.247",
     "@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",
-    "@node-projects/web-component-designer-visualization-addons": "^0.1.113",
-    "@node-projects/web-component-designer-widgets-wunderbaum": "^0.1.32",
+    "@node-projects/web-component-designer-visualization-addons": "^0.1.116",
+    "@node-projects/web-component-designer-widgets-wunderbaum": "^0.1.33",
     "@types/json-schema": "^7.0.15",
     "@web/dev-server": "^0.4.6",
-    "blockly": "^11.2.1",
+    "blockly": "^11.2.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",
+    "dock-spawn-ts": "^3.3.0",
     "es-module-shims": "2.0.10",
-    "eslint": "^9.21.0",
+    "eslint": "^9.23.0",
     "esprima-next": "^6.0.3",
     "glob-stream": "^8.0.2",
     "gulp": "^5.0.0",
@@ -94,6 +94,6 @@
     "tslib": "^2.8.1",
     "typescript": "^5.8.2",
     "typescript-json-schema": "^0.65.1",
-    "wunderbaum": "0.12.1"
+    "wunderbaum": "0.13.0"
   }
 }

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

@@ -51,6 +51,7 @@ declare var RUNTIME: {
         height?: string;
         left?: string;
         top?: string;
+        cssClass?: string;
     }): Promise<void>;
     runSimpleScriptCommand<T extends import('../scripting/IobrokerWebuiScriptCommands.js').WebuiScriptCommands>(scriptCommand: T): Promise<void>;
     getParentScreen(screen: BaseScreenViewerAndControl, parentlevel?: number): BaseScreenViewerAndControl;

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

@@ -1,5 +1,5 @@
 import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
-import { DocumentContainer, } from "@node-projects/web-component-designer";
+import { DocumentContainer, PropertiesHelper, } from "@node-projects/web-component-designer";
 import { iobrokerHandler } from "../common/IobrokerHandler.js";
 export const defaultNewStyle = `:host {
 }
@@ -117,19 +117,43 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
         if (this.#bindingsEnabled != value) {
             this.#bindingsEnabled == value;
             if (value) {
-                this._webuiBindings = window.appShell.bindingsHelper.applyAllBindings(this.documentContainer.designerView.designerCanvas.rootDesignItem.element.shadowRoot, this.relativeBindingsPrefix, null);
+                this.applyBindings();
             }
             else {
-                this._webuiBindings?.forEach(x => x());
-                this._styleBindings?.forEach(x => x());
+                this.removeBindings();
             }
         }
     }
     relativeBindingsPrefix = '';
     applyBindings() {
         this.removeBindings();
-        if (this.bindingsEnabled)
-            this._webuiBindings = window.appShell.bindingsHelper.applyAllBindings(this.documentContainer.designerView.designerCanvas.rootDesignItem.element.shadowRoot, this.relativeBindingsPrefix, null);
+        if (this.bindingsEnabled) {
+            try {
+                for (let p in this.properties) {
+                    Object.defineProperty(this.documentContainer.designerView.designerCanvas.rootDesignItem.element, p, {
+                        get() {
+                            return this['_' + p];
+                        },
+                        set(newValue) {
+                            if (this['_' + p] !== newValue) {
+                                this['_' + p] = newValue;
+                                this._bindingsRefresh(p);
+                                this.documentContainer.designerView.designerCanvas.rootDesignItem.element.dispatchEvent(new CustomEvent(PropertiesHelper.camelToDashCase(p) + '-changed', { detail: { newValue } }));
+                            }
+                        },
+                        enumerable: true,
+                        configurable: true,
+                    });
+                    if (this.properties[p].default) {
+                        this.documentContainer.designerView.designerCanvas.rootDesignItem.element['_' + p] = this.properties[p].default;
+                    }
+                }
+            }
+            catch (err) {
+                console.warn("applyBindings()", err);
+            }
+            this._webuiBindings = window.appShell.bindingsHelper.applyAllBindings(this.documentContainer.designerView.designerCanvas.rootDesignItem.element.shadowRoot, this.relativeBindingsPrefix, this.documentContainer.designerView.designerCanvas.rootDesignItem.element);
+        }
     }
     removeBindings() {
         this._webuiBindings?.forEach(x => x());

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

@@ -194,21 +194,19 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
             this.shadowRoot.adoptedStyleSheets = [ScreenViewer_1.styleIfFromScreen, ...this._rootShadow.adoptedStyleSheets];
         }
         let myDocument;
-        //@ts-ignore
         if (Document.parseHTMLUnsafe && !isFirefox) {
-            //@ts-ignore
-            myDocument = Document.parseHTMLUnsafe(html);
+            this._rootShadow.setHTMLUnsafe(html);
         }
         else {
             //@ts-ignore
             myDocument = new DOMParser().parseFromString(html, 'text/html', { includeShadowRoots: true });
+            const fragment = document.createDocumentFragment();
+            for (const n of myDocument.head.childNodes)
+                fragment.appendChild(n);
+            for (const n of myDocument.body.childNodes)
+                fragment.appendChild(n);
+            this._rootShadow.appendChild(fragment);
         }
-        const fragment = document.createDocumentFragment();
-        for (const n of myDocument.head.childNodes)
-            fragment.appendChild(n);
-        for (const n of myDocument.body.childNodes)
-            fragment.appendChild(n);
-        this._rootShadow.appendChild(fragment);
         const res = window.appShell.bindingsHelper.applyAllBindings(this._rootShadow, this.relativeSignalsPath, this);
         if (this._iobBindings)
             this._iobBindings.push(...res);

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.26.0 - 9c446b2
+      webui - 1.27.0 - 875a61d
     </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>