@node-projects/web-component-designer 0.0.33 → 0.0.37

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

@@ -6,6 +6,7 @@ export class CssStyleChangeAction {
         this.newValue = newValue;
         this.oldValue = oldValue;
     }
+    title;
     get affectedItems() {
         return [this.designItem];
     }
@@ -29,6 +30,10 @@ export class CssStyleChangeAction {
             this.designItem.element.style[this.name] = this.newValue;
         }
     }
+    designItem;
+    name;
+    newValue;
+    oldValue;
     mergeWith(other) {
         if (other instanceof CssStyleChangeAction && this.designItem === other.designItem && this.name === other.name) {
             this.newValue = other.newValue;

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

@@ -5,6 +5,7 @@ export class DeleteAction {
         this.deletedItems = deletedItems;
         this.extensionManager = extensionManager;
     }
+    title;
     get affectedItems() {
         return this.deletedItems;
     }
@@ -25,6 +26,10 @@ export class DeleteAction {
         }
         this.extensionManager.removeExtensions(this.deletedItems);
     }
+    deletedItems;
+    extensionManager;
+    _parentItems;
+    _parentIndexes;
     mergeWith(other) {
         return false;
     }

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

@@ -5,6 +5,7 @@ export class InsertAction {
         this.index = index;
         this.newItem = newItem;
     }
+    title;
     get affectedItems() {
         return [this.designItem];
     }
@@ -17,6 +18,9 @@ export class InsertAction {
         if (prepService)
             requestAnimationFrame(() => prepService.prepareElementsForDesigner(this.newItem));
     }
+    designItem;
+    index;
+    newItem;
     mergeWith(other) {
         return false;
     }

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

@@ -7,6 +7,7 @@ export class MoveElementInDomAction {
         this.oldTarget = oldTarget;
         this.oldPosition = oldPosition;
     }
+    title;
     get affectedItems() {
         return [this.designItem, this.newTarget, this.oldTarget];
     }
@@ -16,6 +17,12 @@ export class MoveElementInDomAction {
     do() {
         this.newTarget.element.insertAdjacentElement(this.newPosition, this.designItem.element);
     }
+    designItem;
+    newTarget;
+    newPosition;
+    oldTarget;
+    oldPosition;
+    newItem;
     mergeWith(other) {
         return false;
     }

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

@@ -6,6 +6,7 @@ export class PropertyChangeAction {
         this.newValue = newValue;
         this.oldValue = oldValue;
     }
+    title;
     get affectedItems() {
         return [this.designItem];
     }
@@ -21,6 +22,10 @@ export class PropertyChangeAction {
         else
             this.property.service.setValue([this.designItem], this.property, this.newValue);
     }
+    designItem;
+    property;
+    newValue;
+    oldValue;
     mergeWith(other) {
         if (other instanceof PropertyChangeAction && this.designItem === other.designItem && this.property === other.property) {
             this.newValue = other.newValue;

package/dist/elements/widgets/bindableObjectsBrowser/bindable-objects-browser.js

@@ -1,5 +1,32 @@
 import { BaseCustomWebComponentLazyAppend, css } from '@node-projects/base-custom-webcomponent';
 export class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
+    _treeDiv;
+    _tree;
+    _filter;
+    static style = css `
+      span.drag-source {
+        border: 1px solid grey;
+        border-radius: 3px;
+        padding: 2px;
+        background-color: silver;
+      }
+
+      span.fancytree-node.fancytree-drag-source {
+        outline: 1px dotted grey;
+      }
+      span.fancytree-node.fancytree-drop-accept {
+        outline: 1px dotted green;
+      }
+      span.fancytree-node.fancytree-drop-reject {
+        outline: 1px dotted red;
+      }
+      #tree ul {
+        border: none;
+      }
+      #tree ul:focus {
+        outline: none;
+      }
+    `;
     constructor() {
         super();
         let externalCss = document.createElement('style');
@@ -94,28 +121,4 @@ export class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
         }
     }
 }
-BindableObjectsBrowser.style = css `
-      span.drag-source {
-        border: 1px solid grey;
-        border-radius: 3px;
-        padding: 2px;
-        background-color: silver;
-      }
-
-      span.fancytree-node.fancytree-drag-source {
-        outline: 1px dotted grey;
-      }
-      span.fancytree-node.fancytree-drop-accept {
-        outline: 1px dotted green;
-      }
-      span.fancytree-node.fancytree-drop-reject {
-        outline: 1px dotted red;
-      }
-      #tree ul {
-        border: none;
-      }
-      #tree ul:focus {
-        outline: none;
-      }
-    `;
 customElements.define('node-projects-bindable-objects-browser', BindableObjectsBrowser);

package/dist/elements/widgets/bindings/BindingsEditor.js

@@ -1,13 +1,9 @@
 import { css, BaseCustomWebComponentConstructorAppend, html } from '@node-projects/base-custom-webcomponent';
 export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
-    constructor() {
-        super();
-    }
-}
-BindingsEditor.style = css `
+    static style = css `
     * { font-size: 16px; }
     `;
-BindingsEditor.template = html `
+    static template = html `
     <span style="position:absolute;top:6px;left:20px;">Expression</span>
     <input style="width:340px;height:24px;position:absolute;top:30px;left:20px;">
     <span style="position:absolute;top:78px;left:20px;">Target</span>
@@ -24,4 +20,8 @@ BindingsEditor.template = html `
     <input id="nullSafe" type="checkbox" style="width:24px;height:24px;position:absolute;top:208px;left:15.328125px;">
     <label for="nullSafe" style="position:absolute;top:211px;left:44.328125px;">Null Safe</label>
   `;
+    constructor() {
+        super();
+    }
+}
 customElements.define('node-projects-bindings-editor', BindingsEditor);

package/dist/elements/widgets/codeView/code-view-ace.js

@@ -15,6 +15,18 @@ class CodeViewAceCompleter {
     }
 }
 export class CodeViewAce extends BaseCustomWebComponentLazyAppend {
+    canvasElement;
+    elementsToPackages;
+    code;
+    _aceEditor;
+    _editor;
+    static style = css `
+    :host {
+      display: block;
+      height: 100%;
+      width: 100%;
+    }
+    `;
     constructor() {
         super();
         this.style.display = 'block';
@@ -116,11 +128,4 @@ export class CodeViewAce extends BaseCustomWebComponentLazyAppend {
         this._aceEditor.scrollToLine(point1.row);
     }
 }
-CodeViewAce.style = css `
-    :host {
-      display: block;
-      height: 100%;
-      width: 100%;
-    }
-    `;
 customElements.define('node-projects-code-view-ace', CodeViewAce);

package/dist/elements/widgets/codeView/code-view-code-mirror.js

@@ -1,6 +1,24 @@
 import { BaseCustomWebComponentLazyAppend, css, html } from '@node-projects/base-custom-webcomponent';
 import { CommandType } from '../../../commandHandling/CommandType';
 export class CodeViewCodeMirror extends BaseCustomWebComponentLazyAppend {
+    canvasElement;
+    elementsToPackages;
+    code;
+    _codeMirrorEditor;
+    _editor;
+    static style = css `
+    :host {
+      display: block;
+      height: 100%;
+      width: 100%;
+    }
+    `;
+    static template = html `
+<style>@import "./node_modules/codemirror/lib/codemirror.css";</style>
+<div  style="width: 100%; height: 100%;">
+<div id="textarea"></div>
+</div>
+`;
     constructor() {
         super();
         this.style.display = 'block';
@@ -77,17 +95,4 @@ export class CodeViewCodeMirror extends BaseCustomWebComponentLazyAppend {
         this._codeMirrorEditor.setSelection(point1, point2);
     }
 }
-CodeViewCodeMirror.style = css `
-    :host {
-      display: block;
-      height: 100%;
-      width: 100%;
-    }
-    `;
-CodeViewCodeMirror.template = html `
-<style>@import "./node_modules/codemirror/lib/codemirror.css";</style>
-<div  style="width: 100%; height: 100%;">
-<div id="textarea"></div>
-</div>
-`;
 customElements.define('node-projects-code-view-code-mirror', CodeViewCodeMirror);

package/dist/elements/widgets/codeView/code-view-monaco.js

@@ -4,6 +4,22 @@ export class CodeViewMonaco extends BaseCustomWebComponentLazyAppend {
     dispose() {
         this._monacoEditor.dispose();
     }
+    canvasElement;
+    elementsToPackages;
+    code;
+    _monacoEditor;
+    _editor;
+    static style = css `
+    :host {
+      display: block;
+      height: 100%;
+      width: 100%;
+    }
+    `;
+    static template = html `
+      <style>@import "./node_modules/monaco-editor/min/vs/editor/editor.main.css";</style>
+      <div id="container" style="width: 100%; height: 100%;"></div>
+  `;
     executeCommand(command) {
         switch (command.type) {
             case CommandType.undo:
@@ -82,15 +98,4 @@ export class CodeViewMonaco extends BaseCustomWebComponentLazyAppend {
         this._monacoEditor.revealLineInCenter(point2.lineNumber);
     }
 }
-CodeViewMonaco.style = css `
-    :host {
-      display: block;
-      height: 100%;
-      width: 100%;
-    }
-    `;
-CodeViewMonaco.template = html `
-      <style>@import "./node_modules/monaco-editor/min/vs/editor/editor.main.css";</style>
-      <div id="container" style="width: 100%; height: 100%;"></div>
-  `;
 customElements.define('node-projects-code-view-monaco', CodeViewMonaco);

package/dist/elements/widgets/demoView/demoView.js

@@ -1,5 +1,29 @@
 import { BaseCustomWebComponentLazyAppend, css } from '@node-projects/base-custom-webcomponent';
 export class DemoView extends BaseCustomWebComponentLazyAppend {
+    _placeholder;
+    _loading;
+    static style = css `
+  :host {
+    display: block;
+    overflow: hidden;
+    background: white;
+    height: 100%;
+    width: 100%;
+  }
+  #placeholder {
+    height: 100%;
+    width: 100%;
+  }
+  #loading {
+    position: absolute;
+    top: 60px;
+    left: 20px;
+  }
+  iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+  }`;
     constructor() {
         super();
         this._placeholder = document.createElement('div');
@@ -30,26 +54,4 @@ export class DemoView extends BaseCustomWebComponentLazyAppend {
         doc.close();
     }
 }
-DemoView.style = css `
-  :host {
-    display: block;
-    overflow: hidden;
-    background: white;
-    height: 100%;
-    width: 100%;
-  }
-  #placeholder {
-    height: 100%;
-    width: 100%;
-  }
-  #loading {
-    position: absolute;
-    top: 60px;
-    left: 20px;
-  }
-  iframe {
-    width: 100%;
-    height: 100%;
-    border: none;
-  }`;
 customElements.define('node-projects-demo-view', DemoView);

package/dist/elements/widgets/designerView/DesignContext.js

@@ -1,5 +1,3 @@
 export class DesignContext {
-    constructor() {
-        this.imports = [];
-    }
+    imports = [];
 }

package/dist/elements/widgets/designerView/IDesignerCanvas.d.ts

@@ -2,7 +2,6 @@ import { IDesignItem } from "../../item/IDesignItem";
 import { InstanceServiceContainer } from "../../services/InstanceServiceContainer";
 import { ServiceContainer } from "../../services/ServiceContainer";
 import { Snaplines } from "./Snaplines";
-import { IDesignerMousePoint } from "../../../interfaces/IDesignerMousePoint";
 import { IPlacementView } from './IPlacementView';
 import { IExtensionManager } from "./extensions/IExtensionManger";
 import { IUiCommandHandler } from "../../../commandHandling/IUiCommandHandler";
@@ -22,7 +21,8 @@ export interface IDesignerCanvas extends IPlacementView, IUiCommandHandler {
     zoomFactor: number;
     eatEvents: Element;
     initialize(serviceContainer: ServiceContainer): any;
-    getDesignerMousepoint(event: MouseEvent, target: Element, startPoint?: IDesignerMousePoint): IDesignerMousePoint;
+    getNormalizedEventCoordinates(event: MouseEvent): IPoint;
+    getNormalizedOffsetInElement(event: MouseEvent, element: Element): IPoint;
     getElementAtPoint(point: IPoint, ignoreElementCallback?: (element: HTMLElement) => boolean): any;
     elementFromPoint(x: number, y: number): Element;
 }

package/dist/elements/widgets/designerView/Snaplines.js

@@ -1,12 +1,15 @@
 import { OverlayLayer } from "./extensions/OverlayLayer.js";
 const overlayLayer = OverlayLayer.Normal;
 export class Snaplines {
+    snapOffset = 15;
+    _overlayLayerView;
+    _containerItem;
+    _positionsH = [];
+    _positionsMiddleH = [];
+    _positionsV = [];
+    _positionsMiddleV = [];
+    _outerRect;
     constructor(overlayLayer) {
-        this.snapOffset = 15;
-        this._positionsH = [];
-        this._positionsMiddleH = [];
-        this._positionsV = [];
-        this._positionsMiddleV = [];
         this._overlayLayerView = overlayLayer;
     }
     initialize(containerItem) {

package/dist/elements/widgets/designerView/designerCanvas.d.ts

@@ -4,7 +4,6 @@ import { IDesignItem } from '../../item/IDesignItem';
 import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
 import { IDesignerCanvas } from './IDesignerCanvas';
 import { Snaplines } from './Snaplines';
-import { IDesignerMousePoint } from '../../../interfaces/IDesignerMousePoint';
 import { ContextMenuHelper } from '../../helper/contextMenu/ContextMenuHelper';
 import { IPlacementView } from './IPlacementView';
 import { CommandType } from '../../../commandHandling/CommandType';
@@ -18,6 +17,7 @@ export declare class DesignerCanvas extends BaseCustomWebComponentLazyAppend imp
     serviceContainer: ServiceContainer;
     instanceServiceContainer: InstanceServiceContainer;
     containerBoundingRect: DOMRect;
+    outerRect: DOMRect;
     gridSize: number;
     alignOnGrid: boolean;
     alignOnSnap: boolean;
@@ -50,7 +50,7 @@ export declare class DesignerCanvas extends BaseCustomWebComponentLazyAppend imp
     executeCommand(command: IUiCommand): Promise<void>;
     canExecuteCommand(command: IUiCommand): boolean;
     handleSelectAll(): void;
-    handleCopyCommand(): void;
+    handleCopyCommand(): Promise<void>;
     handlePasteCommand(): Promise<void>;
     handleDeleteCommand(): void;
     handleMoveCommand(command: CommandType): void;
@@ -69,9 +69,12 @@ export declare class DesignerCanvas extends BaseCustomWebComponentLazyAppend imp
     private _onDblClick;
     private onKeyUp;
     private onKeyDown;
-    getDesignerMousepoint(event: MouseEvent, target: Element, startPoint?: IDesignerMousePoint): IDesignerMousePoint;
+    getNormalizedEventCoordinates(event: MouseEvent): IPoint;
+    getNormalizedElementCoordinates(element: Element): IPoint;
+    getNormalizedOffsetInElement(event: MouseEvent, element: Element): IPoint;
     static getHost(node: Node): Element;
     getElementAtPoint(point: IPoint, ignoreElementCallback?: (element: HTMLElement) => boolean): HTMLElement;
+    _rect: SVGRectElement;
     private _pointerEventHandler;
     private _fillCalculationrects;
     addOverlay(element: SVGGraphicsElement, overlayLayer?: OverlayLayer): void;