iobroker.webui 1.24.2 → 1.24.3

package/README.md

@@ -133,6 +133,11 @@ runtime.html?screenName=screen2
 	Placeholder for next versions:
 	### __WORK IN PROGRESS__
 -->
+### 1.24.3 (2025-01-20)
+- first load of css bindings
+- fix get box quads with slots
+- fix es module shims
+
 ### 1.24.2 (2025-01-19)
 - revert back es module shims, leads to errors
 

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "webui",
-    "version": "1.24.2",
+    "version": "1.24.3",
     "titleLang": {
       "en": "webui",
       "de": "webui",
@@ -29,6 +29,19 @@
       "zh-cn": "使用万维网传送器的高锰用户接口"
     },
     "news": {
+      "1.24.3": {
+        "en": "first load of css bindings\nfix get box quads with slots\nfix es module shims",
+        "de": "erste belastung von css bindungen\nfix get box quads mit schlitzen\nfix es modul shims",
+        "ru": "первая нагрузка css связывания\nисправление получить коробка квады с слотами\nфиксация эс модуль shims",
+        "pt": "primeira carga de ligações css\ncorrigir get box quads com slots\ncorrigir es módulo shims",
+        "nl": "eerste belasting van css bindingen\nfix box quads met slots\nfix es module shims",
+        "fr": "première charge de fixations css\nfixer obtenir des quads de boîte avec des fentes\nfixer les shims du module es",
+        "it": "primo carico di attacchi css\nfix ottenere scatola quads con slot\nfix es modulo shims",
+        "es": "primera carga de fijación de css\nfijar conseguir cuádruples de caja con ranuras\nfijar es módulo shims",
+        "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",
@@ -106,19 +119,6 @@
         "pl": "fix pasta w przyporządkowaniu zdarzeń\niobroker Selektor sygnału\nwiązanie do szerokości i wysokości w sterowaniu własnym",
         "uk": "фіксувати пасту в появі подій\niobroker Signal Вибратор\nобов'язковий для ширини і висоти в користувацьких управліннях",
         "zh-cn": "在事件任务中固定粘贴\nio 经纪人信号选择器\n绑定自定义控件中的宽度和高度"
-      },
-      "1.22.0": {
-        "en": "local signals browser\nstyle completition fixes\nspecial bindings for \"ring\" cameras",
-        "de": "lokale signale browser\nstil completition fixes\nspezielle bindungen für \"ring\"-kameras",
-        "ru": "браузер местных сигналов\nстиль комплектации\nспециальные привязки для «кольцовых» камер",
-        "pt": "navegador de sinais locais\ncorreções de conclusão de estilo\nligações especiais para câmeras \"ring\"",
-        "nl": "lokale signalenbrowser\nstijl completitie fixes\nspeciale bindingen voor \"ring\"-camera's",
-        "fr": "navigateur de signaux locaux\ncorrectifs de complétion de style\nfixations spéciales pour caméras \"ring\"",
-        "it": "browser segnali locali\nstile correzioni di completamento\nattacchi speciali per telecamere \"ring\"",
-        "es": "navegador de señales locales\nestilo completition fixes\nencuadernaciones especiales para cámaras \"ring\"",
-        "pl": "przeglądarka lokalnych sygnałów\npoprawki zakończenia stylu\nspecjalne wiązania do kamer \"ring\"",
-        "uk": "веб камера\nфіксація стилів\nспеціальні прив'язки для камер \"обручка\"",
-        "zh-cn": "本地信号浏览器\n样式补丁修正\n“环”相机的特殊装订"
       }
     },
     "icon": "logo.png",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.webui",
-  "version": "1.24.2",
+  "version": "1.24.3",
   "description": "ioBroker webui",
   "type": "module",
   "main": "dist/backend/main.js",
@@ -59,11 +59,11 @@
     "@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.239",
+    "@node-projects/web-component-designer": "^0.1.240",
     "@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.112",
+    "@node-projects/web-component-designer-visualization-addons": "^0.1.113",
     "@node-projects/web-component-designer-widgets-wunderbaum": "^0.1.32",
     "@types/json-schema": "^7.0.15",
     "@web/dev-server": "^0.4.6",
@@ -75,7 +75,7 @@
     "dayjs": "^1.11.13",
     "del": "^8.0.0",
     "dock-spawn-ts": "^3.2.1",
-    "es-module-shims": "1.10.1",
+    "es-module-shims": "2.0.5",
     "eslint": "^9.18.0",
     "esprima-next": "^6.0.3",
     "glob-stream": "^8.0.2",

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

@@ -79,6 +79,17 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
             disableTextChangedEvent = false;
         });
         this.documentContainer.additionalStyleString = iobrokerHandler.config?.globalStyle ?? '';
+        if (style) {
+            try {
+                const ret = await window.appShell.bindingsHelper.parseCssBindings(style, this.documentContainer.designerView.designerCanvas.rootDesignItem.element, this.relativeBindingsPrefix, this.documentContainer.designerView.designerCanvas.rootDesignItem.element);
+                this._styleBindings = ret[1];
+                const sr = this.documentContainer.designerView.designerCanvas.rootDesignItem.element.shadowRoot;
+                sr.adoptedStyleSheets = [...sr.adoptedStyleSheets, ret[0]];
+            }
+            catch (err) {
+                console.error(err);
+            }
+        }
         if (html) {
             this.documentContainer.content = html;
             this.handlePropertyChanges();

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

@@ -55,7 +55,7 @@
             ],
             "type": "object"
         },
-        "ClearSiganlsInGroup": {
+        "ClearSignalsInGroup": {
             "properties": {
                 "additionalData": {
                     "type": "string"
@@ -65,7 +65,7 @@
                     "type": "string"
                 },
                 "type": {
-                    "const": "ClearSiganlsInGroup",
+                    "const": "ClearSignalsInGroup",
                     "type": "string"
                 }
             },
@@ -1034,7 +1034,7 @@
                     "$ref": "#/definitions/WriteSignalsInGroup"
                 },
                 {
-                    "$ref": "#/definitions/ClearSiganlsInGroup"
+                    "$ref": "#/definitions/ClearSignalsInGroup"
                 },
                 {
                     "$ref": "#/definitions/RunScript"

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.24.2 - 9d75808
+      webui - 1.24.3 - fefb8f9
     </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/@node-projects/web-component-designer/dist/elements/helper/getBoxQuads.js

@@ -305,21 +305,23 @@ export function getResultingTransformationBetweenElementAndAllAncestors(node, an
     }
     let lastOffsetParent = null;
     while (actualElement != ancestor && actualElement != null) {
-        if (actualElement instanceof (actualElement.ownerDocument.defaultView ?? window).HTMLElement) {
-            if (lastOffsetParent !== actualElement.offsetParent && !(actualElement instanceof (actualElement.ownerDocument.defaultView ?? window).HTMLSlotElement)) {
+        const parentElement = getParentElementIncludingSlots(actualElement, iframes);
+        if (!(parentElement instanceof HTMLSlotElement)) {
+            if (actualElement instanceof (actualElement.ownerDocument.defaultView ?? window).HTMLElement) {
+                if (lastOffsetParent !== actualElement.offsetParent && !(actualElement instanceof (actualElement.ownerDocument.defaultView ?? window).HTMLSlotElement)) {
+                    const offsets = getElementOffsetsInContainer(actualElement, iframes);
+                    lastOffsetParent = actualElement.offsetParent;
+                    const mvMat = new DOMMatrix().translate(offsets.x, offsets.y);
+                    originalElementAndAllParentsMultipliedMatrix = mvMat.multiply(originalElementAndAllParentsMultipliedMatrix);
+                }
+            }
+            else {
                 const offsets = getElementOffsetsInContainer(actualElement, iframes);
-                lastOffsetParent = actualElement.offsetParent;
+                lastOffsetParent = null;
                 const mvMat = new DOMMatrix().translate(offsets.x, offsets.y);
                 originalElementAndAllParentsMultipliedMatrix = mvMat.multiply(originalElementAndAllParentsMultipliedMatrix);
             }
         }
-        else {
-            const offsets = getElementOffsetsInContainer(actualElement, iframes);
-            lastOffsetParent = null;
-            const mvMat = new DOMMatrix().translate(offsets.x, offsets.y);
-            originalElementAndAllParentsMultipliedMatrix = mvMat.multiply(originalElementAndAllParentsMultipliedMatrix);
-        }
-        const parentElement = getParentElementIncludingSlots(actualElement, iframes);
         if (parentElement) {
             parentElementMatrix = getElementCombinedTransform(parentElement, iframes);
             if (parentElement != ancestor)

package/www/node_modules/@node-projects/web-component-designer-visualization-addons/dist/scripting/ScriptSystem.js

@@ -239,7 +239,7 @@ export class ScriptSystem {
                 this._visualizationHandler.writeSignalsInGroup(group);
                 break;
             }
-            case 'ClearSiganlsInGroup': {
+            case 'ClearSignalsInGroup': {
                 const group = await this.getValue(command.group, context);
                 this._visualizationHandler.clearSignalsInGroup(group);
                 break;