iobroker.mywebui 1.42.41 → 1.42.42

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "mywebui",
-    "version": "1.42.41",
+    "version": "1.42.42",
     "titleLang": {
       "en": "mywebui",
       "de": "mywebui",
@@ -29,6 +29,13 @@
       "zh-cn": "使用万维网传送器的高锰用户接口"
     },
     "news": {
+      "1.42.42": {
+        "en": "feature: 'dynamic' tab in property grid for every element (works also with npm manifest widgets) - per-instance dynamic properties with two-way binding; fix: solution explorer drag crash on nodes without data",
+        "az": "yenilik: property grid-də hər element üçün 'dynamic' tabı (npm manifest widget-ləri ilə də işləyir) - instance-əsaslı dinamik property-lər iki-tərəfli binding ilə; düzəliş: solution explorer-də data-sız node-ları drag edəndə çökmə",
+        "tr": "yenilik: property grid'de her element için 'dynamic' sekmesi (npm manifest widget'larıyla da çalışır) - instance bazlı dinamik property'ler çift yönlü binding ile; düzeltme: solution explorer'da data'sız node sürüklemede çökme",
+        "ru": "новое: вкладка 'dynamic' в property grid для каждого элемента (работает и с npm manifest виджетами) - динамические свойства экземпляра с двусторонней привязкой; исправление: падение drag в solution explorer на узлах без data",
+        "de": "Neu: 'dynamic'-Tab im Property-Grid für jedes Element (funktioniert auch mit npm-Manifest-Widgets) - instanzbasierte dynamische Properties mit Zwei-Wege-Binding; Fix: Drag-Absturz im Solution Explorer bei Knoten ohne Daten"
+      },
       "1.42.41": {
         "en": "improvement: dynamic properties now work on Lit/package widgets at runtime too (accessors + -changed events applied by ScreenViewer); events tab lists -changed events of dynamic properties; added webui-demo-widget sample package",
         "az": "təkmilləşdirmə: dinamik property-lər artıq runtime-da Lit/package widget-lərdə də işləyir (accessor-lar + -changed event-ləri ScreenViewer tərəfindən tətbiq olunur); events tabı dinamik property-lərin -changed event-lərini göstərir; webui-demo-widget nümunə paketi əlavə olundu",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.mywebui",
-  "version": "1.42.41",
+  "version": "1.42.42",
   "description": "ioBroker mywebui - Custom edited mywebui by gokturk413 with 3D Editor",
   "type": "module",
   "main": "dist/backend/main.js",

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

@@ -15,6 +15,7 @@ import { IobrokerWebuiCustomElementContextMenu } from "../services/IobrokerWebui
 import { IobrokerWebuiRefactorService } from "../services/IobrokerWebuiRefactorService.js";
 import { IobrokerWebuiSpecialPropertiesService } from "../services/IobrokerWebuiSpecialPropertiesService.js";
 import { IobrokerWebuiLitPropertiesService } from "../services/IobrokerWebuiLitPropertiesService.js";
+import { IobrokerWebuiPropertyGroupsService } from "../services/IobrokerWebuiPropertyGroupsService.js";
 // import { IobrokerWebuiVisibilityPropertiesService } from "../services/IobrokerWebuiVisibilityPropertiesService.js";
 import { iobrokerHandler } from "../common/IobrokerHandler.js";
 import { ExpandCollapseContextMenu } from "@gokturk413/web-component-designer-widgets-wunderbaum";
@@ -51,6 +52,7 @@ export function configureDesigner(bindingsHelper) {
     serviceContainer.register('propertyService', new IobrokerWebuiPropertiesService());
     serviceContainer.register('propertyService', new IobrokerWebuiSpecialPropertiesService());
     serviceContainer.register('propertyService', new IobrokerWebuiLitPropertiesService());
+    serviceContainer.register('propertyGroupsService', new IobrokerWebuiPropertyGroupsService());
     // Visibility is now handled directly in PropertyGrid
     // serviceContainer.register('propertyService', new IobrokerWebuiVisibilityPropertiesService());
     serviceContainer.designViewConfigButtons.push(new IobrokerWebuiConfigButtonProvider());

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

@@ -1086,6 +1086,9 @@ export class IobrokerWebuiSolutionExplorer extends BaseCustomWebComponentConstru
                         dndSourceNode = e.node;
                         //@ts-ignore
                         e.event.target.style.opacity = '0.4';
+                        if (!e.node.data?.data) {
+                            return false;
+                        }
                         if (e.node.data.data.type == 'screen') {
                             const screen = e.node.data.data.name;
                             const elementDef = { tag: "iobroker-webui-screen-viewer", defaultAttributes: { 'screen-name': screen }, defaultWidth: '300px', defaultHeight: '200px' };

package/www/dist/frontend/services/IobrokerWebuiDynamicPropertiesService.js

@@ -0,0 +1,36 @@
+import { AbstractPropertiesService, PropertyType, RefreshMode } from "@gokturk413/web-component-designer";
+import { readDynamicDefs, createWebuiTypedProperty, dynamicDefsAttributeName } from "./DynamicPropertiesHelper.js";
+import { IobrokerWebuiDynamicPropsEditor } from "../config/IobrokerWebuiDynamicPropsEditor.js";
+
+// serves the 'dynamic' tab of the property grid for EVERY element
+// (independent of which properties service handles the 'properties' tab,
+// e.g. WebcomponentManifestPropertiesService for installed npm widgets)
+export class IobrokerWebuiDynamicPropertiesService extends AbstractPropertiesService {
+    name = "webuiDynamic";
+
+    getRefreshMode(designItem) {
+        return RefreshMode.fullOnValueChange;
+    }
+
+    isHandledElement(designItem) {
+        return true;
+    }
+
+    async getProperties(designItem) {
+        if (!designItem?.element?.getAttribute)
+            return null;
+        const defs = readDynamicDefs(designItem.element);
+        const properties = [];
+        for (const d of defs)
+            properties.push(await createWebuiTypedProperty(d.name, d, this));
+        properties.push({
+            name: 'dynamicPropertyDefs',
+            type: 'string',
+            attributeName: dynamicDefsAttributeName,
+            service: this,
+            propertyType: PropertyType.attribute,
+            createEditor: p => new IobrokerWebuiDynamicPropsEditor(p)
+        });
+        return properties;
+    }
+}

package/www/dist/frontend/services/IobrokerWebuiLitPropertiesService.js

@@ -1,5 +1,5 @@
 import { Lit2PropertiesService, PropertiesHelper, PropertyType, RefreshMode } from "@gokturk413/web-component-designer";
-import { buildDynamicPropertiesGroup, createWebuiTypedProperty } from "./DynamicPropertiesHelper.js";
+import { createWebuiTypedProperty } from "./DynamicPropertiesHelper.js";
 
 // extended properties service for Lit (2/3) widgets:
 //  - supports Array & custom converter properties (edited as string/JSON) which Lit2PropertiesService skips
@@ -47,7 +47,6 @@ export class IobrokerWebuiLitPropertiesService extends Lit2PropertiesService {
             if (!handled.has(name))
                 properties.push(await createWebuiTypedProperty(name, meta[name], this));
         }
-        properties.push(await buildDynamicPropertiesGroup(designItem, this));
         return properties;
     }
 }

package/www/dist/frontend/services/IobrokerWebuiPropertiesService.js

@@ -3,7 +3,6 @@ import { BaseCustomControl, webuiCustomControlSymbol } from "../runtime/CustomCo
 import { iobrokerHandler } from "../common/IobrokerHandler.js";
 import { ScreenViewer } from "../runtime/ScreenViewer.js";
 import { IobrokerWebuiSignalPropertyEditor } from "../config/IobrokerWebuiSignalPropertyEditor.js";
-import { buildDynamicPropertiesGroup } from "./DynamicPropertiesHelper.js";
 export class IobrokerWebuiPropertiesService extends BaseCustomWebComponentPropertiesService {
     isHandledElement(designItem) {
         return designItem.element instanceof BaseCustomControl || designItem.element instanceof ScreenViewer;
@@ -72,7 +71,6 @@ export class IobrokerWebuiPropertiesService extends BaseCustomWebComponentProper
             for (const [groupName, groupProps] of groupMap) {
                 result.push({ name: groupName, description: '', properties: groupProps });
             }
-            result.push(await buildDynamicPropertiesGroup(designItem, this));
             return result;
         }
         else {

package/www/dist/frontend/services/IobrokerWebuiPropertyGroupsService.js

@@ -0,0 +1,13 @@
+import { PropertyGroupsService } from "@gokturk413/web-component-designer";
+import { IobrokerWebuiDynamicPropertiesService } from "./IobrokerWebuiDynamicPropertiesService.js";
+
+// adds a 'dynamic' tab (per-instance dynamic properties) to the property grid for all elements
+export class IobrokerWebuiPropertyGroupsService extends PropertyGroupsService {
+    constructor() {
+        super();
+        const dynamicEntry = { name: 'dynamic', propertiesService: new IobrokerWebuiDynamicPropertiesService() };
+        this._pgList.splice(1, 0, dynamicEntry);
+        this._svgPgList.splice(1, 0, dynamicEntry);
+        this._svgChildPgList.splice(1, 0, dynamicEntry);
+    }
+}