@node-projects/web-component-designer 0.1.116 → 0.1.118

package/dist/elements/services/propertiesService/services/AbstractPropertiesService.d.ts

@@ -11,7 +11,7 @@ export declare abstract class AbstractPropertiesService implements IPropertiesSe
     private static _stylesCache;
     private _cssCacheClearTimer;
     private static _bindingsCache;
-    private _bindingsCacheClearTimer;
+    private static _bindingsCacheClearTimer;
     abstract getRefreshMode(designItem: IDesignItem): RefreshMode;
     abstract isHandledElement(designItem: IDesignItem): boolean;
     protected _notifyChangedProperty(designItem: IDesignItem, property: IProperty, value: any): void;
@@ -21,6 +21,7 @@ export declare abstract class AbstractPropertiesService implements IPropertiesSe
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
     clearValue(designItems: IDesignItem[], property: IProperty, clearType: 'all' | 'binding' | 'value'): void;
     isSet(designItems: IDesignItem[], property: IProperty): ValueType;
+    static getOrBuildCachedBindings(designItem: IDesignItem): IBinding[];
     getValue(designItems: IDesignItem[], property: IProperty): string | boolean;
     getBinding(designItems: IDesignItem[], property: IProperty): IBinding;
     getUnsetValue(designItems: IDesignItem[], property: IProperty): any;

package/dist/elements/services/propertiesService/services/AbstractPropertiesService.js

@@ -12,7 +12,7 @@ export class AbstractPropertiesService {
     static _stylesCache = new Map;
     _cssCacheClearTimer;
     static _bindingsCache = new Map;
-    _bindingsCacheClearTimer;
+    static _bindingsCacheClearTimer;
     _notifyChangedProperty(designItem, property, value) {
     }
     getProperty(designItem, name) {
@@ -123,13 +123,7 @@ export class AbstractPropertiesService {
                     break;
             }
             ;
-            let bindings = AbstractPropertiesService._bindingsCache.get(designItems[0]);
-            if (!bindings) {
-                bindings = designItems[0].serviceContainer.forSomeServicesTillResult('bindingService', (s) => s.getBindings(designItems[0]));
-                AbstractPropertiesService._bindingsCache.set(designItems[0], bindings);
-                clearTimeout(this._bindingsCacheClearTimer);
-                this._bindingsCacheClearTimer = setTimeout(() => AbstractPropertiesService._bindingsCache.clear(), 30);
-            }
+            const bindings = AbstractPropertiesService.getOrBuildCachedBindings(designItems[0]);
             if (property.propertyType == PropertyType.cssValue) {
                 if (bindings && bindings.find(x => (x.target == BindingTarget.css || x.target == BindingTarget.cssvar) && x.targetName == property.name))
                     return ValueType.bound;
@@ -165,6 +159,23 @@ export class AbstractPropertiesService {
             return ValueType.none;
         return all ? ValueType.all : some ? ValueType.some : ValueType.none;
     }
+    static getOrBuildCachedBindings(designItem) {
+        let bindings = AbstractPropertiesService._bindingsCache.get(designItem);
+        if (!bindings) {
+            const services = designItem.serviceContainer.getServices('bindingService');
+            const bindings = [];
+            for (const s of services) {
+                const bs = s.getBindings(designItem);
+                if (bs && bs.length > 0) {
+                    bindings.push(...bs);
+                }
+            }
+            AbstractPropertiesService._bindingsCache.set(designItem, bindings);
+            clearTimeout(this._bindingsCacheClearTimer);
+            this._bindingsCacheClearTimer = setTimeout(() => AbstractPropertiesService._bindingsCache.clear(), 30);
+        }
+        return bindings;
+    }
     getValue(designItems, property) {
         if (designItems != null && designItems.length !== 0) {
             if (property.propertyType == PropertyType.cssValue) {

package/dist/elements/services/propertiesService/services/AttributesPropertiesService.js

@@ -3,6 +3,7 @@ import { ValueType } from '../ValueType.js';
 import { BindingTarget } from '../../../item/BindingTarget.js';
 import { PropertyType } from '../PropertyType.js';
 import { PropertiesHelper } from './PropertiesHelper.js';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
 export class AttributesPropertiesService {
     name = "attributes";
     getRefreshMode(designItem) {
@@ -56,10 +57,7 @@ export class AttributesPropertiesService {
                 all = all && has;
                 some = some || has;
             });
-            //TODO: optimize perf, do not call bindings service for each property. 
-            const bindings = designItems[0].serviceContainer.forSomeServicesTillResult('bindingService', (s) => {
-                return s.getBindings(designItems[0]);
-            });
+            const bindings = AbstractPropertiesService.getOrBuildCachedBindings(designItems[0]);
             if (bindings && bindings.find(x => x.target == BindingTarget.attribute && x.targetName == propName))
                 return ValueType.bound;
         }

package/dist/elements/services/propertiesService/services/ContentAndIdPropertiesService.js

@@ -64,10 +64,7 @@ export class ContentAndIdPropertiesService extends AbstractPropertiesService {
                     all = all && has;
                     some = some || has;
                 });
-                //TODO: optimize perf, do not call bindings service for each property. 
-                const bindings = designItems[0].serviceContainer.forSomeServicesTillResult('bindingService', (s) => {
-                    return s.getBindings(designItems[0]);
-                });
+                const bindings = AbstractPropertiesService.getOrBuildCachedBindings(designItems[0]);
                 if (bindings && bindings.find(x => x.target == BindingTarget.property && x.targetName == property.name))
                     return ValueType.bound;
             }

package/dist/elements/widgets/propertyGrid/PropertyGrid.js

@@ -33,9 +33,9 @@ export class PropertyGrid extends BaseCustomWebComponentLazyAppend {
     };
     constructor() {
         super();
-        this._restoreCachedInititalValues();
         this._designerTabControl = new DesignerTabControl();
         this.shadowRoot.appendChild(this._designerTabControl);
+        this._restoreCachedInititalValues();
         this.addEventListener('contextmenu', (e) => {
             if (e.composedPath()[0].localName != 'input')
                 e.preventDefault();

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A WYSIWYG designer webcomponent for html components",
   "name": "@node-projects/web-component-designer",
-  "version": "0.1.116",
+  "version": "0.1.118",
   "type": "module",
   "main": "./dist/index.js",
   "author": "jochen.kuehner@gmx.de",