@node-projects/web-component-designer 0.0.155 → 0.0.157

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

@@ -1,8 +1,8 @@
-import { ValueType } from "../ValueType";
-import { PropertiesHelper } from './PropertiesHelper';
-import { BindingTarget } from "../../../item/BindingTarget";
-import { PropertyType } from "../PropertyType";
-import { NodeType } from "../../../item/NodeType";
+import { ValueType } from '../ValueType.js';
+import { PropertiesHelper } from './PropertiesHelper.js';
+import { BindingTarget } from '../../../item/BindingTarget.js';
+import { PropertyType } from '../PropertyType.js';
+import { NodeType } from '../../../item/NodeType.js';
 export class AbstractPropertiesService {
     _notifyChangedProperty(designItem, property, value) {
     }
@@ -13,8 +13,7 @@ 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'));
@@ -25,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);
@@ -52,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));
@@ -79,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;
             });
@@ -105,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;
@@ -120,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,9 +1,9 @@
-import { IPropertiesService, RefreshMode } from "../IPropertiesService";
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { ValueType } from "../ValueType";
+import { IPropertiesService, RefreshMode } from '../IPropertiesService.js';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { ValueType } from '../ValueType.js';
 import { IBinding } from "../../../item/IBinding.js";
-import { BindingTarget } from "../../../item/BindingTarget";
+import { BindingTarget } from '../../../item/BindingTarget.js';
 export declare class AttributesPropertiesService implements IPropertiesService {
     name: string;
     getRefreshMode(designItem: IDesignItem): RefreshMode;
@@ -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,7 +1,7 @@
-import { RefreshMode } from "../IPropertiesService";
-import { ValueType } from "../ValueType";
-import { BindingTarget } from "../../../item/BindingTarget";
-import { PropertyType } from "../PropertyType";
+import { RefreshMode } from '../IPropertiesService.js';
+import { ValueType } from '../ValueType.js';
+import { BindingTarget } from '../../../item/BindingTarget.js';
+import { PropertyType } from '../PropertyType.js';
 export class AttributesPropertiesService {
     name = "attributes";
     getRefreshMode(designItem) {
@@ -16,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;
@@ -27,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();
     }
@@ -37,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));
             });
@@ -48,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;
             });
@@ -64,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/BaseCustomWebComponentPropertiesService.d.ts

@@ -1,6 +1,6 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export declare class BaseCustomWebComponentPropertiesService extends AbstractPolymerLikePropertiesService {
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;

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

@@ -1,5 +1,5 @@
 import { BaseCustomWebComponentLazyAppend, BaseCustomWebComponentConstructorAppend, BaseCustomWebComponentConstructorAppendLazyReady } from '@node-projects/base-custom-webcomponent';
-import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export class BaseCustomWebComponentPropertiesService extends AbstractPolymerLikePropertiesService {
     name = "baseCustomWebComponent";
     isHandledElement(designItem) {

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

@@ -1,7 +1,7 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { AbstractPropertiesService } from "./AbstractPropertiesService";
-import { RefreshMode } from '../IPropertiesService';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export declare class CommonPropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem: IDesignItem): RefreshMode;
     private commonProperties;

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

@@ -1,6 +1,6 @@
-import { PropertyType } from "../PropertyType";
-import { AbstractPropertiesService } from "./AbstractPropertiesService";
-import { RefreshMode } from '../IPropertiesService';
+import { PropertyType } from '../PropertyType.js';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export class CommonPropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem) {
         return RefreshMode.none;

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

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

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

@@ -1,7 +1,7 @@
 import { BindingTarget } from '../../../item/BindingTarget.js';
-import { PropertyType } from '../PropertyType';
-import { CommonPropertiesService } from './CommonPropertiesService';
-import { RefreshMode } from '../IPropertiesService';
+import { PropertyType } from '../PropertyType.js';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export class CssPropertiesService extends CommonPropertiesService {
     getRefreshMode(designItem) {
         return this.name == 'styles' ? RefreshMode.fullOnValueChange : RefreshMode.none;
@@ -195,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/IJsonPropertyDefinition.d.ts

@@ -1,4 +1,4 @@
-import { PropertyType } from "../PropertyType";
+import { PropertyType } from '../PropertyType.js';
 export interface IJsonPropertyDefinition {
     name: string;
     propertyName?: string;

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

@@ -1,4 +1,4 @@
-import { IJsonPropertyDefinition } from "./IJsonPropertyDefinition";
+import { IJsonPropertyDefinition } from './IJsonPropertyDefinition.js';
 export interface IJsonPropertyDefinitions {
     [key: string]: IJsonPropertyDefinition[];
 }

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

@@ -1,8 +1,8 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { IJsonPropertyDefinitions } from './IJsonPropertyDefinitions';
-import { AbstractPropertiesService } from './AbstractPropertiesService';
-import { RefreshMode } from '../IPropertiesService';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { IJsonPropertyDefinitions } from './IJsonPropertyDefinitions.js';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export declare class ListPropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem: IDesignItem): RefreshMode;
     name: string;

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

@@ -1,6 +1,6 @@
-import { AbstractPropertiesService } from './AbstractPropertiesService';
-import { PropertyType } from '../PropertyType';
-import { RefreshMode } from '../IPropertiesService';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
+import { PropertyType } from '../PropertyType.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export class ListPropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem) {
         return RefreshMode.full;

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

@@ -1,6 +1,6 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { AbstractPolymerLikePropertiesService } from "./AbstractPolymerLikePropertiesService";
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export declare class Lit2PropertiesService extends AbstractPolymerLikePropertiesService {
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;

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

@@ -1,6 +1,6 @@
-import { AbstractPolymerLikePropertiesService } from "./AbstractPolymerLikePropertiesService";
-import { PropertiesHelper } from './PropertiesHelper';
-import { PropertyType } from '../PropertyType';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
+import { PropertiesHelper } from './PropertiesHelper.js';
+import { PropertyType } from '../PropertyType.js';
 export class Lit2PropertiesService extends AbstractPolymerLikePropertiesService {
     name = "lit2";
     isHandledElement(designItem) {

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

@@ -1,6 +1,6 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { AbstractPolymerLikePropertiesService } from "./AbstractPolymerLikePropertiesService";
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export declare class LitElementPropertiesService extends AbstractPolymerLikePropertiesService {
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;

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

@@ -1,4 +1,4 @@
-import { AbstractPolymerLikePropertiesService } from "./AbstractPolymerLikePropertiesService";
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export class LitElementPropertiesService extends AbstractPolymerLikePropertiesService {
     name = "lit";
     isHandledElement(designItem) {

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

@@ -1,7 +1,7 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { CommonPropertiesService } from "./CommonPropertiesService";
-import { RefreshMode } from '../IPropertiesService';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export declare class NativeElementsPropertiesService extends CommonPropertiesService {
     private inputProperties;
     private textareaProperties;

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

@@ -1,6 +1,6 @@
-import { CommonPropertiesService } from "./CommonPropertiesService";
-import { PropertyType } from '../PropertyType';
-import { RefreshMode } from '../IPropertiesService';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { PropertyType } from '../PropertyType.js';
+import { RefreshMode } from '../IPropertiesService.js';
 export class NativeElementsPropertiesService extends CommonPropertiesService {
     inputProperties = [
         {

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

@@ -1,6 +1,6 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService';
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export declare class PolymerPropertiesService extends AbstractPolymerLikePropertiesService {
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;

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

@@ -1,4 +1,4 @@
-import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService';
+import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
 export class PolymerPropertiesService extends AbstractPolymerLikePropertiesService {
     name = "polymer";
     isHandledElement(designItem) {

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

@@ -1,6 +1,6 @@
-import { IProperty } from '../IProperty';
-import { IDesignItem } from '../../../item/IDesignItem';
-import { CommonPropertiesService } from "./CommonPropertiesService";
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
 export declare class SVGElementsPropertiesService extends CommonPropertiesService {
     private rectProperties;
     private lineProperties;

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

@@ -1,5 +1,5 @@
-import { CommonPropertiesService } from "./CommonPropertiesService";
-import { PropertyType } from '../PropertyType';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { PropertyType } from '../PropertyType.js';
 export class SVGElementsPropertiesService extends CommonPropertiesService {
     rectProperties = [
         {

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

@@ -1,4 +1,4 @@
-import { IDesignItem } from '../../item/IDesignItem';
+import { IDesignItem } from '../../item/IDesignItem.js';
 export interface ISelectionChangedEvent {
     oldSelectedElements: IDesignItem[];
     selectedElements: IDesignItem[];

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

@@ -1,6 +1,6 @@
 import { TypedEvent } from '@node-projects/base-custom-webcomponent';
-import { IDesignItem } from '../../item/IDesignItem';
-import { ISelectionChangedEvent } from './ISelectionChangedEvent';
+import { IDesignItem } from '../../item/IDesignItem.js';
+import { ISelectionChangedEvent } from './ISelectionChangedEvent.js';
 export interface ISelectionService {
     primarySelection: IDesignItem;
     selectedElements: IDesignItem[];

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

@@ -1,11 +1,15 @@
-import { ISelectionService } from './ISelectionService';
-import { IDesignItem } from '../../item/IDesignItem';
-import { ISelectionChangedEvent } from './ISelectionChangedEvent';
+import { ISelectionService } from './ISelectionService.js';
+import { IDesignItem } from '../../item/IDesignItem.js';
+import { ISelectionChangedEvent } from './ISelectionChangedEvent.js';
 import { TypedEvent } from '@node-projects/base-custom-webcomponent';
+import { IDesignerCanvas } from '../../widgets/designerView/IDesignerCanvas.js';
 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.js';
 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/treeStructureService/ITreeStructureChangedEvent.d.ts

@@ -1,4 +1,4 @@
-import { IDesignItem } from '../../item/IDesignItem';
+import { IDesignItem } from '../../item/IDesignItem.js';
 export interface ITreeStructureChangedEvent {
     action: 'add' | 'move' | 'remove' | 'replace' | 'reset';
     newItems?: IDesignItem[];

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

@@ -1,5 +1,5 @@
-import { ITransactionItem } from './ITransactionItem';
-import { IDesignItem } from '../../item/IDesignItem';
+import { ITransactionItem } from './ITransactionItem.js';
+import { IDesignItem } from '../../item/IDesignItem.js';
 export declare class ChangeGroup implements ITransactionItem {
     title: string;
     get affectedItems(): IDesignItem[];

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

@@ -1,4 +1,4 @@
-import { IDesignItem } from "../../item/IDesignItem";
+import { IDesignItem } from '../../item/IDesignItem.js';
 export interface ITransactionItem {
     title?: string;
     readonly affectedItems?: IDesignItem[];

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

@@ -1,6 +1,6 @@
-import { IService } from '../IService';
-import { ChangeGroup } from './ChangeGroup';
-import { ITransactionItem } from './ITransactionItem';
+import { IService } from '../IService.js';
+import { ChangeGroup } from './ChangeGroup.js';
+import { ITransactionItem } from './ITransactionItem.js';
 export interface IUndoService extends IService {
     openGroup(title: string): ChangeGroup;
     execute(item: ITransactionItem): void;

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.d.ts

@@ -1,5 +1,5 @@
-import { ITransactionItem } from '../ITransactionItem';
-import { IDesignItem } from '../../../item/IDesignItem';
+import { ITransactionItem } from '../ITransactionItem.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
 import { IBinding } from '../../../item/IBinding.js';
 export declare class AttributeChangeAction implements ITransactionItem {
     constructor(designItem: IDesignItem, name: string, newValue: string | IBinding | null, oldValue: string | IBinding | null);

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.d.ts

@@ -1,5 +1,5 @@
-import { ITransactionItem } from '../ITransactionItem';
-import { IDesignItem } from '../../../item/IDesignItem';
+import { ITransactionItem } from '../ITransactionItem.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
 export declare class CssStyleChangeAction implements ITransactionItem {
     constructor(designItem: IDesignItem, name: string, newValue: any, oldValue: any);
     title?: 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;
         }
     }

package/dist/elements/services/undoService/transactionItems/DeleteAction.d.ts

@@ -1,5 +1,5 @@
-import { ITransactionItem } from '../ITransactionItem';
-import { IDesignItem } from '../../../item/IDesignItem';
+import { ITransactionItem } from '../ITransactionItem.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
 export declare class DeleteAction implements ITransactionItem {
     constructor(deletedItems: IDesignItem[]);
     title?: string;