@node-projects/web-component-designer 0.0.154 → 0.0.156

package/dist/elements/services/modelCommandService/DefaultModelCommandService.js

@@ -21,6 +21,7 @@ export class DefaultModelCommandService {
     }
     async executeCommand(designerCanvas, command) {
         let sel = designerCanvas.instanceServiceContainer.selectionService.primarySelection;
+        const selection = [...designerCanvas.instanceServiceContainer.selectionService.selectedElements];
         if (command.type == CommandType.moveBackward) {
             let idx = sel.parent.indexOf(sel) - 1;
             if (idx >= 0)
@@ -55,7 +56,7 @@ export class DefaultModelCommandService {
         }
         else if (command.type == CommandType.unifyHeight) {
             const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('unifyHeight');
-            const height = designerCanvas.instanceServiceContainer.selectionService.primarySelection.styles.get('height');
+            const height = designerCanvas.instanceServiceContainer.selectionService.primarySelection.getStyle('height');
             for (let s of designerCanvas.instanceServiceContainer.selectionService.selectedElements) {
                 s.setStyle('height', height);
             }
@@ -63,7 +64,7 @@ export class DefaultModelCommandService {
         }
         else if (command.type == CommandType.unifyWidth) {
             const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('unifyWidth');
-            const width = designerCanvas.instanceServiceContainer.selectionService.primarySelection.styles.get('width');
+            const width = designerCanvas.instanceServiceContainer.selectionService.primarySelection.getStyle('width');
             for (let s of designerCanvas.instanceServiceContainer.selectionService.selectedElements) {
                 s.setStyle('width', width);
             }
@@ -71,7 +72,7 @@ export class DefaultModelCommandService {
         }
         else if (command.type == CommandType.rotateCounterClockwise) {
             const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('rotateCounterClockwise');
-            var trf = designerCanvas.instanceServiceContainer.selectionService.primarySelection.styles.get('transform');
+            var trf = designerCanvas.instanceServiceContainer.selectionService.primarySelection.getStyle('transform');
             let degree = 0;
             let rotation = "";
             if (trf != null) {
@@ -96,7 +97,7 @@ export class DefaultModelCommandService {
         }
         else if (command.type == CommandType.rotateClockwise) {
             const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('rotateClockwise');
-            var trf = designerCanvas.instanceServiceContainer.selectionService.primarySelection.styles.get('transform');
+            var trf = designerCanvas.instanceServiceContainer.selectionService.primarySelection.getStyle('transform');
             let degree = 0;
             let rotation = "";
             if (trf != null) {
@@ -121,6 +122,7 @@ export class DefaultModelCommandService {
         }
         else
             return null;
+        designerCanvas.instanceServiceContainer.selectionService.setSelectedElements(selection);
         return true;
     }
 }

package/dist/elements/services/placementService/DefaultPlacementService.js

@@ -102,16 +102,16 @@ export class DefaultPlacementService {
                 transformMatrixParentTransformsCompensated = new DOMPoint(track.x, track.y, 0, 0);
             }
             const translationMatrix = new DOMMatrix().translate(transformMatrixParentTransformsCompensated.x, transformMatrixParentTransformsCompensated.y);
-            combineTransforms(designItem.element, designItem.styles.get('transform'), translationMatrix.toString());
+            combineTransforms(designItem.element, designItem.getStyle('transform'), translationMatrix.toString());
         }
     }
     enterContainer(container, items) {
         let filterdItems = filterChildPlaceItems(items);
         for (let i of filterdItems) {
             if (i.lastContainerSize) {
-                if (!i.styles.has('width'))
+                if (!i.hasStyle('width'))
                     i.setStyle('width', i.lastContainerSize.width + 'px');
-                if (!i.styles.has('height'))
+                if (!i.hasStyle('height'))
                     i.setStyle('height', i.lastContainerSize.height + 'px');
             }
         }
@@ -122,8 +122,8 @@ export class DefaultPlacementService {
         let filterdItems = filterChildPlaceItems(items);
         for (const designItem of filterdItems) {
             let translation = extractTranslationFromDOMMatrix(new DOMMatrix(designItem.element.style.transform));
-            const stylesMapOffset = extractTranslationFromDOMMatrix(new DOMMatrix(designItem.styles.get('transform') ?? ''));
-            designItem.element.style.transform = designItem.styles.get('transform') ?? '';
+            const stylesMapOffset = extractTranslationFromDOMMatrix(new DOMMatrix(designItem.getStyle('transform') ?? ''));
+            designItem.element.style.transform = designItem.getStyle('transform') ?? '';
             let track = { x: translation.x, y: translation.y };
             placeDesignItem(container, designItem, { x: track.x - stylesMapOffset.x, y: track.y - stylesMapOffset.y }, 'position');
         }

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

@@ -4,8 +4,13 @@ import { IDesignItem } from '../../item/IDesignItem';
 import { ValueType } from './ValueType';
 import { BindingTarget } from '../../item/BindingTarget';
 import { IBinding } from '../../item/IBinding';
+export declare enum RefreshMode {
+    none = 0,
+    full = 1,
+    fullOnValueChange = 2
+}
 export interface IPropertiesService extends IService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperties(designItem: IDesignItem): IProperty[];
     getProperty(designItem: IDesignItem, name: string): IProperty;

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

@@ -1 +1,6 @@
-export {};
+export var RefreshMode;
+(function (RefreshMode) {
+    RefreshMode[RefreshMode["none"] = 0] = "none";
+    RefreshMode[RefreshMode["full"] = 1] = "full";
+    RefreshMode[RefreshMode["fullOnValueChange"] = 2] = "fullOnValueChange";
+})(RefreshMode || (RefreshMode = {}));

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

@@ -3,6 +3,7 @@ import { IPropertyEditor } from './IPropertyEditor';
 import { PropertyType } from './PropertyType';
 export interface IProperty {
     name: string;
+    renamable?: boolean;
     propertyName?: string;
     attributeName?: string;
     description?: string;

package/dist/elements/services/propertiesService/propertyEditors/BasePropertyEditor.js

@@ -1,5 +1,4 @@
 import { ValueType } from '../ValueType';
-import { PropertyChangeAction } from "../../undoService/transactionItems/PropertyChangeAction";
 export class BasePropertyEditor {
     element;
     property;
@@ -13,9 +12,10 @@ export class BasePropertyEditor {
             if (this.designItems && this.designItems.length) {
                 const cg = this.designItems[0].openGroup("set property: " + this.property.name);
                 for (let d of this.designItems) {
-                    const oldValue = this.property.service.getValue([d], this.property);
-                    const action = new PropertyChangeAction(d, this.property, newValue, oldValue);
-                    d.instanceServiceContainer.undoService.execute(action);
+                    if (newValue == null)
+                        this.property.service.clearValue([d], this.property);
+                    else
+                        this.property.service.setValue([d], this.property, newValue);
                 }
                 cg.commit();
             }

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

@@ -1,8 +1,9 @@
 import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { AbstractPropertiesService } from "./AbstractPropertiesService";
+import { RefreshMode } from '../IPropertiesService';
 export declare abstract class AbstractPolymerLikePropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     getProperties(designItem: IDesignItem): IProperty[];
     protected parseProperties(list: any): IProperty[];
 }

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

@@ -1,9 +1,10 @@
 import { PropertiesHelper } from './PropertiesHelper';
 import { AbstractPropertiesService } from "./AbstractPropertiesService";
 import { PropertyType } from '../PropertyType';
+import { RefreshMode } from '../IPropertiesService';
 export class AbstractPolymerLikePropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem) {
-        return true;
+    getRefreshMode(designItem) {
+        return RefreshMode.full;
     }
     getProperties(designItem) {
         if (!this.isHandledElement(designItem))

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

@@ -1,11 +1,11 @@
-import { IPropertiesService } from "../IPropertiesService";
+import { IPropertiesService, RefreshMode } from "../IPropertiesService";
 import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { ValueType } from "../ValueType";
 import { BindingTarget } from "../../../item/BindingTarget";
 import { IBinding } from "../../../item/IBinding";
 export declare abstract class AbstractPropertiesService implements IPropertiesService {
-    abstract listNeedsRefresh(designItem: IDesignItem): boolean;
+    abstract getRefreshMode(designItem: IDesignItem): RefreshMode;
     abstract isHandledElement(designItem: IDesignItem): boolean;
     protected _notifyChangedProperty(designItem: IDesignItem, property: IProperty, value: any): void;
     getProperty(designItem: IDesignItem, name: string): IProperty;
@@ -14,7 +14,7 @@ export declare abstract class AbstractPropertiesService implements IPropertiesSe
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
     clearValue(designItems: IDesignItem[], property: IProperty): void;
     isSet(designItems: IDesignItem[], property: IProperty): ValueType;
-    getValue(designItems: IDesignItem[], property: IProperty): string | boolean;
+    getValue(designItems: IDesignItem[], property: IProperty): any;
     getBinding(designItems: IDesignItem[], property: IProperty): IBinding;
     getUnsetValue(designItems: IDesignItem[], property: IProperty): any;
 }

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

@@ -13,8 +13,10 @@ export class AbstractPropertiesService {
         const cg = designItems[0].openGroup("properties changed");
         for (let d of designItems) {
             if (property.propertyType == PropertyType.cssValue) {
-                d.styles.set(property.name, value);
-                d.element.style[property.name] = value;
+                d.setStyle(property.name, value);
+                //unkown css property names do not trigger the mutation observer of property grid, 
+                //fixed by assinging stle again to the attribute
+                d.element.setAttribute('style', d.element.getAttribute('style'));
             }
             else {
                 let attributeName = property.attributeName;
@@ -22,20 +24,16 @@ export class AbstractPropertiesService {
                     attributeName = PropertiesHelper.camelToDashCase(property.name);
                 if (property.type === 'object') {
                     const json = JSON.stringify(value);
-                    d.attributes.set(attributeName, json);
-                    d.element.setAttribute(attributeName, json);
+                    d.setAttribute(attributeName, json);
                 }
                 else if (property.type == 'boolean' && !value) {
-                    d.attributes.delete(attributeName);
-                    d.element.removeAttribute(attributeName);
+                    d.removeAttribute(attributeName);
                 }
                 else if (property.type == 'boolean' && value) {
-                    d.attributes.set(attributeName, "");
-                    d.element.setAttribute(attributeName, "");
+                    d.setAttribute(attributeName, "");
                 }
                 else {
-                    d.attributes.set(attributeName, value);
-                    d.element.setAttribute(attributeName, value);
+                    d.setAttribute(attributeName, value);
                 }
             }
             this._notifyChangedProperty(d, property, value);
@@ -49,15 +47,13 @@ export class AbstractPropertiesService {
         const cg = designItems[0].openGroup("properties cleared");
         for (let d of designItems) {
             if (property.propertyType == PropertyType.cssValue) {
-                d.styles.delete(property.name);
-                d.element.style[property.name] = '';
+                d.removeStyle(property.name);
             }
             else {
                 let attributeName = property.attributeName;
                 if (!attributeName)
                     attributeName = PropertiesHelper.camelToDashCase(property.name);
-                d.attributes.delete(attributeName);
-                d.element.removeAttribute(attributeName);
+                d.removeAttribute(attributeName);
             }
             d.serviceContainer.forSomeServicesTillResult('bindingService', (s) => {
                 return s.clearBinding(d, property.name, this.getPropertyTarget(d, property));
@@ -76,9 +72,9 @@ export class AbstractPropertiesService {
             designItems.forEach((x) => {
                 let has = false;
                 if (property.propertyType == PropertyType.cssValue)
-                    has = x.styles.has(property.name);
+                    has = x.hasStyle(property.name);
                 else
-                    has = x.attributes.has(attributeName);
+                    has = x.hasAttribute(attributeName);
                 all = all && has;
                 some = some || has;
             });
@@ -102,9 +98,9 @@ export class AbstractPropertiesService {
     getValue(designItems, property) {
         if (designItems != null && designItems.length !== 0) {
             if (property.propertyType == PropertyType.cssValue) {
-                let lastValue = designItems[0].styles.get(property.name);
+                let lastValue = designItems[0].getStyle(property.name);
                 for (const x of designItems) {
-                    let value = x.styles.get(property.name);
+                    let value = x.getStyle(property.name);
                     if (value != lastValue) {
                         lastValue = null;
                         break;
@@ -117,8 +113,8 @@ export class AbstractPropertiesService {
                 if (!attributeName)
                     attributeName = PropertiesHelper.camelToDashCase(property.name);
                 if (property.type == 'boolean')
-                    return designItems[0].attributes.has(attributeName);
-                let lastValue = designItems[0].attributes.get(attributeName);
+                    return designItems[0].hasAttribute(attributeName);
+                let lastValue = designItems[0].getAttribute(attributeName);
                 /*
                 for (const x of designItems) {
                   let value = x.attributes.get(attributeName);

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

@@ -1,4 +1,4 @@
-import { IPropertiesService } from "../IPropertiesService";
+import { IPropertiesService, RefreshMode } from "../IPropertiesService";
 import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { ValueType } from "../ValueType";
@@ -6,7 +6,7 @@ import { IBinding } from "../../../item/IBinding.js";
 import { BindingTarget } from "../../../item/BindingTarget";
 export declare class AttributesPropertiesService implements IPropertiesService {
     name: string;
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperty(designItem: IDesignItem, name: string): IProperty;
     getProperties(designItem: IDesignItem): IProperty[];
@@ -14,7 +14,7 @@ export declare class AttributesPropertiesService implements IPropertiesService {
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
     clearValue(designItems: IDesignItem[], property: IProperty): void;
     isSet(designItems: IDesignItem[], property: IProperty): ValueType;
-    getValue(designItems: IDesignItem[], property: IProperty): string;
+    getValue(designItems: IDesignItem[], property: IProperty): any;
     getBinding(designItems: IDesignItem[], property: IProperty): IBinding;
     getUnsetValue(designItems: IDesignItem[], property: IProperty): any;
 }

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

@@ -1,10 +1,11 @@
+import { RefreshMode } from "../IPropertiesService";
 import { ValueType } from "../ValueType";
 import { BindingTarget } from "../../../item/BindingTarget";
 import { PropertyType } from "../PropertyType";
 export class AttributesPropertiesService {
     name = "attributes";
-    listNeedsRefresh(designItem) {
-        return true;
+    getRefreshMode(designItem) {
+        return RefreshMode.fullOnValueChange;
     }
     isHandledElement(designItem) {
         return true;
@@ -15,8 +16,8 @@ export class AttributesPropertiesService {
     getProperties(designItem) {
         if (designItem) {
             let p = [];
-            for (let a of designItem.attributes.keys()) {
-                p.push({ name: a, type: 'string', service: this, propertyType: PropertyType.propertyAndAttribute });
+            for (let a of designItem.attributes()) {
+                p.push({ name: a[0], renamable: true, type: 'string', service: this, propertyType: PropertyType.propertyAndAttribute });
             }
             p.push({ name: '', type: 'addNew', service: this, propertyType: PropertyType.complex });
             return p;
@@ -26,8 +27,7 @@ export class AttributesPropertiesService {
     setValue(designItems, property, value) {
         const cg = designItems[0].openGroup("properties changed");
         for (let d of designItems) {
-            d.attributes.set(property.name, value);
-            d.element.setAttribute(property.name, value);
+            d.setAttribute(property.name, value);
         }
         cg.commit();
     }
@@ -36,8 +36,7 @@ export class AttributesPropertiesService {
     }
     clearValue(designItems, property) {
         for (let d of designItems) {
-            d.attributes.delete(property.name);
-            d.element.removeAttribute(property.name);
+            d.removeAttribute(property.name);
             d.serviceContainer.forSomeServicesTillResult('bindingService', (s) => {
                 return s.clearBinding(d, property.name, this.getPropertyTarget(d, property));
             });
@@ -47,11 +46,11 @@ export class AttributesPropertiesService {
         let all = true;
         let some = false;
         if (designItems != null && designItems.length !== 0) {
-            if (designItems.length == 1 && typeof designItems[0].attributes.get(property.name) == 'object')
+            if (designItems.length == 1 && typeof designItems[0].getAttribute(property.name) == 'object')
                 return ValueType.bound;
             let attributeName = property.name;
             designItems.forEach((x) => {
-                let has = x.attributes.has(attributeName);
+                let has = x.hasAttribute(attributeName);
                 all = all && has;
                 some = some || has;
             });
@@ -63,7 +62,7 @@ export class AttributesPropertiesService {
     getValue(designItems, property) {
         if (designItems != null && designItems.length !== 0) {
             let attributeName = property.name;
-            let lastValue = designItems[0].attributes.get(attributeName);
+            let lastValue = designItems[0].getAttribute(attributeName);
             if (typeof lastValue === 'object')
                 return lastValue.rawValue;
             /*

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

@@ -1,8 +1,9 @@
 import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { AbstractPropertiesService } from "./AbstractPropertiesService";
+import { RefreshMode } from '../IPropertiesService';
 export declare class CommonPropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     private commonProperties;
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;

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

@@ -1,8 +1,9 @@
 import { PropertyType } from "../PropertyType";
 import { AbstractPropertiesService } from "./AbstractPropertiesService";
+import { RefreshMode } from '../IPropertiesService';
 export class CommonPropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem) {
-        return false;
+    getRefreshMode(designItem) {
+        return RefreshMode.none;
     }
     //@ts-ignore
     commonProperties = [

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

@@ -2,8 +2,9 @@ import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { BindingTarget } from '../../../item/BindingTarget.js';
 import { CommonPropertiesService } from './CommonPropertiesService';
+import { RefreshMode } from '../IPropertiesService';
 export declare class CssPropertiesService extends CommonPropertiesService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode.none | RefreshMode.fullOnValueChange;
     layout: IProperty[];
     grid: IProperty[];
     flex: IProperty[];

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

@@ -1,9 +1,10 @@
 import { BindingTarget } from '../../../item/BindingTarget.js';
 import { PropertyType } from '../PropertyType';
 import { CommonPropertiesService } from './CommonPropertiesService';
+import { RefreshMode } from '../IPropertiesService';
 export class CssPropertiesService extends CommonPropertiesService {
-    listNeedsRefresh(designItem) {
-        return this.name == 'styles' ? true : false;
+    getRefreshMode(designItem) {
+        return this.name == 'styles' ? RefreshMode.fullOnValueChange : RefreshMode.none;
     }
     layout = [
         {
@@ -194,7 +195,7 @@ export class CssPropertiesService extends CommonPropertiesService {
         if (this.name == 'styles') {
             if (!designItem)
                 return [];
-            let arr = Array.from(designItem.styles.keys(), x => ({ name: x, type: 'string', service: this, propertyType: PropertyType.cssValue }));
+            let arr = Array.from(designItem.styles(), ([key, value]) => ({ name: key, renamable: true, type: 'string', service: this, propertyType: PropertyType.cssValue }));
             arr.push({ name: '', type: 'addNew', service: this, propertyType: PropertyType.complex });
             return arr;
         }

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

@@ -2,8 +2,9 @@ import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { IJsonPropertyDefinitions } from './IJsonPropertyDefinitions';
 import { AbstractPropertiesService } from './AbstractPropertiesService';
+import { RefreshMode } from '../IPropertiesService';
 export declare class ListPropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     name: string;
     private _propertys;
     constructor(propertyDefinitions: IJsonPropertyDefinitions);

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

@@ -1,8 +1,9 @@
 import { AbstractPropertiesService } from './AbstractPropertiesService';
 import { PropertyType } from '../PropertyType';
+import { RefreshMode } from '../IPropertiesService';
 export class ListPropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem) {
-        return true;
+    getRefreshMode(designItem) {
+        return RefreshMode.full;
     }
     name = "list";
     _propertys = new Map();

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

@@ -1,6 +1,7 @@
 import { IProperty } from '../IProperty';
 import { IDesignItem } from '../../../item/IDesignItem';
 import { CommonPropertiesService } from "./CommonPropertiesService";
+import { RefreshMode } from '../IPropertiesService';
 export declare class NativeElementsPropertiesService extends CommonPropertiesService {
     private inputProperties;
     private textareaProperties;
@@ -12,7 +13,7 @@ export declare class NativeElementsPropertiesService extends CommonPropertiesSer
     private iframeProperties;
     private formElementProperties;
     name: string;
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperty(designItem: IDesignItem, name: string): IProperty;
     getProperties(designItem: IDesignItem): IProperty[];

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

@@ -1,5 +1,6 @@
 import { CommonPropertiesService } from "./CommonPropertiesService";
 import { PropertyType } from '../PropertyType';
+import { RefreshMode } from '../IPropertiesService';
 export class NativeElementsPropertiesService extends CommonPropertiesService {
     inputProperties = [
         {
@@ -156,8 +157,8 @@ export class NativeElementsPropertiesService extends CommonPropertiesService {
         }
     ];
     name = "native";
-    listNeedsRefresh(designItem) {
-        return true;
+    getRefreshMode(designItem) {
+        return RefreshMode.full;
     }
     isHandledElement(designItem) {
         switch (designItem.element.localName) {

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

@@ -1,10 +1,10 @@
 import { BindingTarget } from "../../../item/BindingTarget.js";
 import { IDesignItem } from "../../../item/IDesignItem.js";
-import { IPropertiesService } from "../IPropertiesService.js";
+import { IPropertiesService, RefreshMode } from "../IPropertiesService.js";
 import { IProperty } from "../IProperty.js";
 import { AbstractPropertiesService } from "./AbstractPropertiesService.js";
 export declare class WebcomponentManifestPropertiesService extends AbstractPropertiesService implements IPropertiesService {
-    listNeedsRefresh(designItem: IDesignItem): boolean;
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
     private _name;
     get name(): string;
     private _propertiesList;

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

@@ -1,9 +1,10 @@
 import { BindingTarget } from "../../../item/BindingTarget.js";
+import { RefreshMode } from "../IPropertiesService.js";
 import { PropertyType } from "../PropertyType.js";
 import { AbstractPropertiesService } from "./AbstractPropertiesService.js";
 export class WebcomponentManifestPropertiesService extends AbstractPropertiesService {
-    listNeedsRefresh(designItem) {
-        return true;
+    getRefreshMode(designItem) {
+        return RefreshMode.full;
     }
     _name;
     get name() { return this._name; }

package/dist/elements/services/selectionService/SelectionService.d.ts

@@ -2,10 +2,14 @@ import { ISelectionService } from './ISelectionService';
 import { IDesignItem } from '../../item/IDesignItem';
 import { ISelectionChangedEvent } from './ISelectionChangedEvent';
 import { TypedEvent } from '@node-projects/base-custom-webcomponent';
+import { IDesignerCanvas } from '../../widgets/designerView/IDesignerCanvas';
 export declare class SelectionService implements ISelectionService {
     primarySelection: IDesignItem;
     selectedElements: IDesignItem[];
+    _designerCanvas: IDesignerCanvas;
+    constructor(designerCanvas: IDesignerCanvas);
     setSelectedElements(designItems: IDesignItem[]): void;
+    _withoutUndoSetSelectedElements(designItems: IDesignItem[]): void;
     clearSelectedElements(): void;
     isSelected(designItem: IDesignItem): boolean;
     readonly onSelectionChanged: TypedEvent<ISelectionChangedEvent>;

package/dist/elements/services/selectionService/SelectionService.js

@@ -1,8 +1,19 @@
 import { TypedEvent } from '@node-projects/base-custom-webcomponent';
+import { SelectionChangedAction } from '../undoService/transactionItems/SelectionChangedAction';
 export class SelectionService {
     primarySelection;
     selectedElements = [];
+    _designerCanvas;
+    constructor(designerCanvas) {
+        this._designerCanvas = designerCanvas;
+    }
     setSelectedElements(designItems) {
+        if (this.selectedElements != designItems) {
+            const action = new SelectionChangedAction(this.selectedElements, designItems, this);
+            this._designerCanvas.instanceServiceContainer.undoService.execute(action);
+        }
+    }
+    _withoutUndoSetSelectedElements(designItems) {
         let oldSelectedElements = this.selectedElements;
         if (!designItems) {
             this.selectedElements = [];

package/dist/elements/services/undoService/UndoService.d.ts

@@ -7,7 +7,7 @@ export declare class UndoService implements IUndoService {
     private _redoStack;
     private _transactionStack;
     private _designerCanvas;
-    constructor(designerCanvas?: IDesignerCanvas);
+    constructor(designerCanvas: IDesignerCanvas);
     openGroup(title: string): ChangeGroup;
     private commitTransactionItem;
     private abortTransactionItem;

package/dist/elements/services/undoService/transactionItems/AttributeChangeAction.js

@@ -12,7 +12,7 @@ export class AttributeChangeAction {
     }
     undo() {
         if (this.oldValue == null) {
-            this.designItem.attributes.delete(this.name);
+            this.designItem._withoutUndoRemoveAttribute(this.name);
             try {
                 this.designItem.element.removeAttribute(this.name);
             }
@@ -21,7 +21,7 @@ export class AttributeChangeAction {
             }
         }
         else {
-            this.designItem.attributes.set(this.name, this.oldValue);
+            this.designItem._withoutUndoSetAttribute(this.name, this.oldValue);
             if (this.name != "draggable") {
                 try {
                     if (typeof this.oldValue === 'string')
@@ -35,7 +35,7 @@ export class AttributeChangeAction {
     }
     do() {
         if (this.newValue == null) {
-            this.designItem.attributes.delete(this.name);
+            this.designItem._withoutUndoRemoveAttribute(this.name);
             try {
                 this.designItem.element.removeAttribute(this.name);
             }
@@ -44,7 +44,7 @@ export class AttributeChangeAction {
             }
         }
         else {
-            this.designItem.attributes.set(this.name, this.newValue);
+            this.designItem._withoutUndoSetAttribute(this.name, this.newValue);
             if (this.name != "draggable") {
                 try {
                     if (typeof this.newValue === 'string')

package/dist/elements/services/undoService/transactionItems/CssStyleChangeAction.js

@@ -12,21 +12,21 @@ export class CssStyleChangeAction {
     }
     undo() {
         if (this.oldValue === '' || this.oldValue == null) {
-            this.designItem.styles.delete(this.name);
+            this.designItem._withoutUndoRemoveStyle(this.name);
             this.designItem.element.style[this.name] = '';
         }
         else {
-            this.designItem.styles.set(this.name, this.oldValue);
+            this.designItem._withoutUndoSetStyle(this.name, this.oldValue);
             this.designItem.element.style[this.name] = this.oldValue;
         }
     }
     do() {
         if (this.newValue === '' || this.newValue == null) {
-            this.designItem.styles.delete(this.name);
+            this.designItem._withoutUndoRemoveStyle(this.name);
             this.designItem.element.style[this.name] = '';
         }
         else {
-            this.designItem.styles.set(this.name, this.newValue);
+            this.designItem._withoutUndoSetStyle(this.name, this.newValue);
             this.designItem.element.style[this.name] = this.newValue;
         }
     }