@node-projects/web-component-designer 0.0.126 → 0.0.127

package/dist/elements/widgets/designerView/extensions/PrimarySelectionDefaultExtensionProvider.d.ts

@@ -1,10 +0,0 @@
-import { IDesignerExtensionProvider } from "./IDesignerExtensionProvider";
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { IDesignerExtension } from "./IDesignerExtension";
-import { IExtensionManager } from "./IExtensionManger";
-export declare class PrimarySelectionDefaultExtensionProvider implements IDesignerExtensionProvider {
-    shouldExtend(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-    readonly style: CSSStyleSheet;
-}

package/dist/elements/widgets/designerView/extensions/PrimarySelectionDefaultExtensionProvider.js

@@ -1,13 +0,0 @@
-import { PrimarySelectionDefaultExtension } from "./PrimarySelectionDefaultExtension";
-import { css } from "@node-projects/base-custom-webcomponent";
-export class PrimarySelectionDefaultExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new PrimarySelectionDefaultExtension(extensionManager, designerView, designItem);
-    }
-    style = css `
-    .svg-text-primary { stroke: none; fill: white; stroke-width: 1; font-size: 10px; font-family: monospace; }
-  `;
-}

package/dist/elements/widgets/designerView/extensions/contextMenu/CopyPasteContextMenu copy.d.ts

@@ -1,8 +0,0 @@
-import { IContextMenuItem } from "../../../../helper/contextMenu/IContextmenuItem";
-import { IDesignItem } from "../../../../item/IDesignItem";
-import { IDesignerCanvas } from "../../IDesignerCanvas";
-import { ContextmenuInitiator, IContextMenuExtension } from "./IContextMenuExtension";
-export declare class CopyPasteContextMenu implements IContextMenuExtension {
-    shouldProvideContextmenu(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem, initiator: ContextmenuInitiator): boolean;
-    provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[];
-}

package/dist/elements/widgets/designerView/extensions/contextMenu/CopyPasteContextMenu copy.js

@@ -1,15 +0,0 @@
-import { CommandType } from "../../../../../commandHandling/CommandType";
-export class CopyPasteContextMenu {
-    shouldProvideContextmenu(event, designerView, designItem, initiator) {
-        return true;
-    }
-    provideContextMenuItems(event, designerView, designItem) {
-        return [
-            { title: 'copy', action: () => { designerView.executeCommand({ type: CommandType.copy }); }, shortCut: 'Ctrl + C' },
-            { title: 'cut', action: () => { designerView.executeCommand({ type: CommandType.cut }); }, shortCut: 'Ctrl + X' },
-            { title: 'paste', action: () => { designerView.executeCommand({ type: CommandType.paste }); }, shortCut: 'Ctrl + V' },
-            { title: 'delete', action: () => { designerView.executeCommand({ type: CommandType.delete }); }, shortCut: 'Del' },
-            { title: '-' }
-        ];
-    }
-}

package/dist/elements/widgets/designerView/extensions/contextMenu/ZMoveContextMenu copy.d.ts

@@ -1,8 +0,0 @@
-import { IContextMenuItem } from "../../../../helper/contextMenu/IContextmenuItem";
-import { IDesignItem } from "../../../../item/IDesignItem";
-import { IDesignerCanvas } from "../../IDesignerCanvas";
-import { ContextmenuInitiator, IContextMenuExtension } from "./IContextMenuExtension";
-export declare class ZMoveContextMenu implements IContextMenuExtension {
-    shouldProvideContextmenu(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem, initiator: ContextmenuInitiator): boolean;
-    provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[];
-}

package/dist/elements/widgets/designerView/extensions/contextMenu/ZMoveContextMenu copy.js

@@ -1,14 +0,0 @@
-import { CommandType } from "../../../../../commandHandling/CommandType";
-export class ZMoveContextMenu {
-    shouldProvideContextmenu(event, designerView, designItem, initiator) {
-        return true;
-    }
-    provideContextMenuItems(event, designerView, designItem) {
-        return [
-            { title: 'to front', action: () => { designerView.executeCommand({ type: CommandType.moveToFront }); } },
-            { title: 'move forward', action: () => { designerView.executeCommand({ type: CommandType.moveForward }); } },
-            { title: 'move backward', action: () => { designerView.executeCommand({ type: CommandType.moveBackward }); } },
-            { title: 'to back', action: () => { designerView.executeCommand({ type: CommandType.moveToBack }); } },
-        ];
-    }
-}

package/dist/elements/widgets/designerView/toolBar/DrawElementTool.d.ts

@@ -1,19 +0,0 @@
-import { IElementDefinition } from '../../../services/elementsService/IElementDefinition';
-import { ServiceContainer } from '../../../services/ServiceContainer.js';
-import { IDesignerCanvas } from '../IDesignerCanvas';
-import { ITool } from './ITool';
-export declare class DrawElementTool implements ITool {
-    private _elementDefinition;
-    private _createdItem;
-    private _startPosition;
-    readonly cursor = "crosshair";
-    private _rect;
-    constructor(elementDefinition: IElementDefinition);
-    activated(serviceContainer: ServiceContainer): void;
-    dispose(): void;
-    pointerEventHandler(designerView: IDesignerCanvas, event: PointerEvent, currentElement: Element): void;
-    keyboardEventHandler(designerCanvas: IDesignerCanvas, event: KeyboardEvent, currentElement: Element): void;
-    private _onPointerDown;
-    private _onPointerMove;
-    private _onPointerUp;
-}

package/dist/elements/widgets/designerView/toolBar/DrawElementTool.js

@@ -1,79 +0,0 @@
-import { EventNames } from '../../../../enums/EventNames';
-import { InsertAction } from '../../../services/undoService/transactionItems/InsertAction';
-import { OverlayLayer } from '../extensions/OverlayLayer.js';
-export class DrawElementTool {
-    _elementDefinition;
-    _createdItem;
-    _startPosition;
-    cursor = 'crosshair';
-    _rect;
-    constructor(elementDefinition) {
-        this._elementDefinition = elementDefinition;
-    }
-    activated(serviceContainer) {
-    }
-    dispose() {
-        if (this._createdItem)
-            this._createdItem.element.parentElement.removeChild(this._createdItem.element);
-    }
-    pointerEventHandler(designerView, event, currentElement) {
-        switch (event.type) {
-            case EventNames.PointerDown:
-                this._onPointerDown(designerView, event);
-                break;
-            case EventNames.PointerMove:
-                this._onPointerMove(designerView, event);
-                break;
-            case EventNames.PointerUp:
-                this._onPointerUp(designerView, event);
-                break;
-        }
-    }
-    keyboardEventHandler(designerCanvas, event, currentElement) { }
-    async _onPointerDown(designerView, event) {
-        event.preventDefault();
-        this._startPosition = { x: event.x, y: event.y };
-        this._createdItem = await designerView.serviceContainer.forSomeServicesTillResult("instanceService", (service) => service.getElement(this._elementDefinition, designerView.serviceContainer, designerView.instanceServiceContainer));
-        const targetRect = event.target.getBoundingClientRect();
-        this._createdItem.setStyle('position', 'absolute');
-        this._createdItem.setStyle('left', event.offsetX + targetRect.left - designerView.containerBoundingRect.x + 'px');
-        this._createdItem.setStyle('top', event.offsetY + targetRect.top - designerView.containerBoundingRect.y + 'px');
-        this._createdItem.setStyle('width', '0');
-        this._createdItem.setStyle('height', '0');
-        this._createdItem.element.style.overflow = 'hidden';
-        //TODO: add items as last, with all properties set
-        //draw via containerService??? how to draw into a grid, a stackpanel???
-        designerView.instanceServiceContainer.undoService.execute(new InsertAction(designerView.rootDesignItem, designerView.rootDesignItem.childCount, this._createdItem));
-        designerView.instanceServiceContainer.selectionService.clearSelectedElements();
-    }
-    async _onPointerMove(designerCanvas, event) {
-        if (this._createdItem) {
-            if (!this._rect) {
-                designerCanvas.rootDesignItem.element.appendChild(this._createdItem.element);
-                this._rect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
-                designerCanvas.overlayLayer.addOverlay(this._rect, OverlayLayer.Foregorund);
-                this._rect.setAttribute('class', 'svg-draw-new-element');
-                this._rect.setAttribute('x', (this._startPosition.x - designerCanvas.containerBoundingRect.x));
-                this._rect.setAttribute('y', (this._startPosition.y - designerCanvas.containerBoundingRect.y));
-            }
-            const w = event.x - this._startPosition.x;
-            const h = event.y - this._startPosition.y;
-            if (w >= 0) {
-                this._rect.setAttribute('width', w);
-                this._createdItem.setStyle('width', w + 'px');
-            }
-            if (h >= 0) {
-                this._rect.setAttribute('height', h);
-                this._createdItem.setStyle('height', h + 'px');
-            }
-        }
-    }
-    async _onPointerUp(designerView, event) {
-        designerView.overlayLayer.removeOverlay(this._rect);
-        designerView.instanceServiceContainer.selectionService.setSelectedElements([this._createdItem]);
-        this._startPosition = null;
-        this._rect = null;
-        this._createdItem = null;
-        designerView.serviceContainer.globalContext.finishedWithTool(this);
-    }
-}

package/dist/elements/widgets/designerView/toolBar/DrawEllipsisTool.d.ts

@@ -1,16 +0,0 @@
-import { IDesignerCanvas } from '../IDesignerCanvas';
-import { ITool } from './ITool';
-import { ServiceContainer } from '../../../services/ServiceContainer.js';
-export declare class DrawEllipsisTool implements ITool {
-    readonly cursor = "crosshair";
-    private _path;
-    private _startPoint;
-    private _radius;
-    private _cx;
-    private _cy;
-    constructor();
-    activated(serviceContainer: ServiceContainer): void;
-    dispose(): void;
-    pointerEventHandler(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): void;
-    keyboardEventHandler(designerCanvas: IDesignerCanvas, event: KeyboardEvent, currentElement: Element): void;
-}

package/dist/elements/widgets/designerView/toolBar/DrawEllipsisTool.js

@@ -1,94 +0,0 @@
-import { EventNames } from '../../../../enums/EventNames';
-import { OverlayLayer } from '../extensions/OverlayLayer.js';
-import { calculateNormLegth } from '../../../helper/PathDataPolyfill';
-import { DesignItem } from '../../../item/DesignItem';
-import { InsertAction } from '../../../services/undoService/transactionItems/InsertAction';
-export class DrawEllipsisTool {
-    cursor = 'crosshair';
-    _path;
-    _startPoint;
-    _radius;
-    _cx;
-    _cy;
-    constructor() {
-    }
-    activated(serviceContainer) {
-    }
-    dispose() {
-    }
-    pointerEventHandler(designerCanvas, event, currentElement) {
-        const currentPoint = designerCanvas.getNormalizedEventCoordinates(event);
-        const offset = 50;
-        switch (event.type) {
-            case EventNames.PointerDown:
-                this._startPoint = currentPoint;
-                event.target.setPointerCapture(event.pointerId);
-                designerCanvas.captureActiveTool(this);
-                this._path = document.createElementNS("http://www.w3.org/2000/svg", "ellipse");
-                this._path.setAttribute("stroke", designerCanvas.serviceContainer.globalContext.strokeColor);
-                this._path.setAttribute("fill", designerCanvas.serviceContainer.globalContext.fillBrush);
-                this._path.setAttribute("stroke-width", designerCanvas.serviceContainer.globalContext.strokeThickness);
-                this._path.setAttribute("cx", currentPoint.x.toString());
-                this._path.setAttribute("cy", currentPoint.y.toString());
-                this._path.setAttribute("rx", "0");
-                this._path.setAttribute("ry", "0");
-                designerCanvas.overlayLayer.addOverlay(this._path, OverlayLayer.Foregorund);
-                break;
-            case EventNames.PointerMove:
-                if (this._path) {
-                    this._radius = { x: Math.abs(currentPoint.x - this._startPoint.x), y: Math.abs(currentPoint.y - this._startPoint.y) };
-                    if (event.ctrlKey) {
-                        this._path.setAttribute("cx", this._startPoint.x.toString());
-                        this._path.setAttribute("cy", this._startPoint.y.toString());
-                        this._cx = this._startPoint.x;
-                        this._cy = this._startPoint.y;
-                        if (event.shiftKey) {
-                            const radius = calculateNormLegth(this._startPoint, currentPoint);
-                            this._path.setAttribute("rx", radius.toString());
-                            this._path.setAttribute("ry", radius.toString());
-                        }
-                        else {
-                            this._path.setAttribute("rx", this._radius.x.toString());
-                            this._path.setAttribute("ry", this._radius.y.toString());
-                        }
-                    }
-                    else {
-                        if (event.shiftKey) {
-                            const radius = calculateNormLegth(this._startPoint, currentPoint);
-                            this._radius = { x: radius, y: radius };
-                        }
-                        this._cx = currentPoint.x < this._startPoint.x ? this._startPoint.x - this._radius.x / 2 : this._startPoint.x + this._radius.x / 2;
-                        this._cy = currentPoint.y < this._startPoint.y ? this._startPoint.y - this._radius.y / 2 : this._startPoint.y + this._radius.y / 2;
-                        this._path.setAttribute("cx", this._cx.toString());
-                        this._path.setAttribute("cy", this._cy.toString());
-                        this._path.setAttribute("rx", (this._radius.x / 2).toString());
-                        this._path.setAttribute("ry", (this._radius.y / 2).toString());
-                    }
-                }
-                break;
-            case EventNames.PointerUp:
-                event.target.releasePointerCapture(event.pointerId);
-                designerCanvas.releaseActiveTool();
-                const rect = this._path.getBoundingClientRect();
-                designerCanvas.overlayLayer.removeOverlay(this._path);
-                const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-                const mvX = rect.x - designerCanvas.containerBoundingRect.x - offset;
-                const mvY = rect.y - designerCanvas.containerBoundingRect.y - offset;
-                svg.appendChild(this._path);
-                this._path.setAttribute("cx", (this._cx - mvX).toString());
-                this._path.setAttribute("cy", (this._cy - mvY).toString());
-                svg.style.left = (mvX) + 'px';
-                svg.style.top = (mvY) + 'px';
-                svg.style.position = 'absolute';
-                svg.style.width = (rect.width + 2 * offset) + 'px';
-                svg.style.height = (rect.height + 2 * offset) + 'px';
-                svg.style.overflow = 'visible';
-                this._path = null;
-                const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
-                designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
-                designerCanvas.serviceContainer.globalContext.finishedWithTool(this);
-                break;
-        }
-    }
-    keyboardEventHandler(designerCanvas, event, currentElement) { }
-}

package/dist/elements/widgets/designerView/toolBar/DrawLineTool.d.ts

@@ -1,14 +0,0 @@
-import { IDesignerCanvas } from '../IDesignerCanvas';
-import { ITool } from './ITool';
-import { ServiceContainer } from '../../../services/ServiceContainer.js';
-export declare class DrawLineTool implements ITool {
-    readonly cursor = "crosshair";
-    private _path;
-    private _startPoint;
-    private _endPoint;
-    constructor();
-    activated(serviceContainer: ServiceContainer): void;
-    dispose(): void;
-    pointerEventHandler(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): void;
-    keyboardEventHandler(designerCanvas: IDesignerCanvas, event: KeyboardEvent, currentElement: Element): void;
-}

package/dist/elements/widgets/designerView/toolBar/DrawLineTool.js

@@ -1,79 +0,0 @@
-import { EventNames } from '../../../../enums/EventNames';
-import { OverlayLayer } from '../extensions/OverlayLayer.js';
-import { straightenLine } from '../../../helper/PathDataPolyfill';
-import { DesignItem } from '../../../item/DesignItem';
-import { InsertAction } from '../../../services/undoService/transactionItems/InsertAction';
-export class DrawLineTool {
-    cursor = 'crosshair';
-    _path;
-    _startPoint;
-    _endPoint;
-    constructor() {
-    }
-    activated(serviceContainer) {
-    }
-    dispose() {
-    }
-    pointerEventHandler(designerCanvas, event, currentElement) {
-        const currentPoint = designerCanvas.getNormalizedEventCoordinates(event);
-        const offset = 50;
-        switch (event.type) {
-            case EventNames.PointerDown:
-                this._startPoint = currentPoint;
-                event.target.setPointerCapture(event.pointerId);
-                designerCanvas.captureActiveTool(this);
-                this._path = document.createElementNS("http://www.w3.org/2000/svg", "line");
-                // this._pathD = "M" + currentPoint.x + " " + currentPoint.y;
-                // this._path.setAttribute("d", this._pathD);
-                this._path.setAttribute("stroke", designerCanvas.serviceContainer.globalContext.strokeColor);
-                this._path.setAttribute("stroke-width", designerCanvas.serviceContainer.globalContext.strokeThickness);
-                this._path.setAttribute("x1", currentPoint.x.toString());
-                this._path.setAttribute("y1", currentPoint.y.toString());
-                this._path.setAttribute("x2", currentPoint.x.toString());
-                this._path.setAttribute("y2", currentPoint.y.toString());
-                designerCanvas.overlayLayer.addOverlay(this._path, OverlayLayer.Foregorund);
-                break;
-            case EventNames.PointerMove:
-                if (this._path) {
-                    if (event.shiftKey) {
-                        let straightLine = straightenLine(this._startPoint, currentPoint);
-                        this._path.setAttribute("x2", straightLine.x.toString());
-                        this._path.setAttribute("y2", straightLine.y.toString());
-                        this._endPoint = straightLine;
-                    }
-                    else {
-                        //this._path.setAttribute("d", this._pathD + "L" + currentPoint.x + " " + currentPoint.y);
-                        this._path.setAttribute("x2", currentPoint.x.toString());
-                        this._path.setAttribute("y2", currentPoint.y.toString());
-                        this._endPoint = currentPoint;
-                    }
-                }
-                break;
-            case EventNames.PointerUp:
-                event.target.releasePointerCapture(event.pointerId);
-                designerCanvas.releaseActiveTool();
-                const rect = this._path.getBoundingClientRect();
-                designerCanvas.overlayLayer.removeOverlay(this._path);
-                const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-                const mvX = rect.x - designerCanvas.containerBoundingRect.x - offset;
-                const mvY = rect.y - designerCanvas.containerBoundingRect.y - offset;
-                this._path.setAttribute("x1", (this._startPoint.x - mvX).toString());
-                this._path.setAttribute("y1", (this._startPoint.y - mvY).toString());
-                this._path.setAttribute("x2", (this._endPoint.x - mvX).toString());
-                this._path.setAttribute("y2", (this._endPoint.y - mvY).toString());
-                svg.appendChild(this._path);
-                svg.style.left = (mvX) + 'px';
-                svg.style.top = (mvY) + 'px';
-                svg.style.position = 'absolute';
-                svg.style.width = (rect.width + 2 * offset) + 'px';
-                svg.style.height = (rect.height + 2 * offset) + 'px';
-                svg.style.overflow = 'visible';
-                this._path = null;
-                const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
-                designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
-                designerCanvas.serviceContainer.globalContext.finishedWithTool(this);
-                break;
-        }
-    }
-    keyboardEventHandler(designerCanvas, event, currentElement) { }
-}

package/dist/elements/widgets/designerView/toolBar/DrawPathTool.d.ts

@@ -1,20 +0,0 @@
-import { IDesignerCanvas } from '../IDesignerCanvas';
-import { ITool } from './ITool';
-import { ServiceContainer } from '../../../services/ServiceContainer.js';
-export declare class DrawPathTool implements ITool {
-    readonly cursor = "crosshair";
-    private _pathD;
-    private _path;
-    private _samePoint;
-    private _p2pMode;
-    private _dragMode;
-    private _pointerMoved;
-    private _eventStarted;
-    private _lastPoint;
-    private _startPoint;
-    constructor();
-    activated(serviceContainer: ServiceContainer): void;
-    dispose(): void;
-    pointerEventHandler(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): void;
-    keyboardEventHandler(designerCanvas: IDesignerCanvas, event: KeyboardEvent, currentElement: Element): void;
-}

package/dist/elements/widgets/designerView/toolBar/DrawPathTool.js

@@ -1,128 +0,0 @@
-import { EventNames } from '../../../../enums/EventNames';
-import { moveSVGPath, straightenLine } from '../../../helper/PathDataPolyfill';
-import { InsertAction } from '../../../services/undoService/transactionItems/InsertAction';
-import { DesignItem } from '../../../item/DesignItem';
-import { OverlayLayer } from '../extensions/OverlayLayer.js';
-export class DrawPathTool {
-    cursor = 'crosshair';
-    _pathD;
-    _path;
-    _samePoint = false;
-    _p2pMode = false;
-    _dragMode = false;
-    _pointerMoved = false;
-    _eventStarted = false;
-    _lastPoint;
-    _startPoint;
-    constructor() {
-    }
-    activated(serviceContainer) {
-    }
-    dispose() {
-    }
-    pointerEventHandler(designerCanvas, event, currentElement) {
-        const currentPoint = designerCanvas.getNormalizedEventCoordinates(event);
-        const offset = 50;
-        switch (event.type) {
-            case EventNames.PointerDown:
-                this._eventStarted = true;
-                if (!this._p2pMode) {
-                    event.target.setPointerCapture(event.pointerId);
-                    designerCanvas.captureActiveTool(this);
-                    this._path = document.createElementNS("http://www.w3.org/2000/svg", "path");
-                    this._pathD = "M" + currentPoint.x + " " + currentPoint.y;
-                    this._path.setAttribute("d", this._pathD);
-                    this._path.setAttribute("stroke", designerCanvas.serviceContainer.globalContext.strokeColor);
-                    this._path.setAttribute("fill", designerCanvas.serviceContainer.globalContext.fillBrush);
-                    this._path.setAttribute("stroke-width", designerCanvas.serviceContainer.globalContext.strokeThickness);
-                    designerCanvas.overlayLayer.addOverlay(this._path, OverlayLayer.Foregorund);
-                    this._startPoint = currentPoint;
-                }
-                if (this._lastPoint != null && this._lastPoint.x === currentPoint.x && this._lastPoint.y === currentPoint.y && !this._samePoint) {
-                    this._samePoint = true;
-                }
-                if (this._lastPoint == null) {
-                    this._lastPoint = currentPoint;
-                }
-                if (this._startPoint == null) {
-                    this._startPoint = currentPoint;
-                }
-                break;
-            case EventNames.PointerMove:
-                if (this._eventStarted) {
-                    this._pointerMoved = true;
-                }
-                if (!this._p2pMode) {
-                    this._dragMode = true;
-                    if (this._path) {
-                        this._pathD += "L" + currentPoint.x + " " + currentPoint.y;
-                        this._path.setAttribute("d", this._pathD);
-                    }
-                }
-                else { // shows line preview
-                    if (this._path) {
-                        let straightLine = currentPoint;
-                        if (event.shiftKey) {
-                            straightLine = straightenLine(this._lastPoint, currentPoint);
-                        }
-                        this._path.setAttribute("d", this._pathD + "L" + straightLine.x + " " + straightLine.y);
-                    }
-                }
-                break;
-            case EventNames.PointerUp:
-                if (this._eventStarted && !this._pointerMoved) {
-                    this._p2pMode = true;
-                }
-                if (this._p2pMode && !this._samePoint && this._startPoint.x != currentPoint.x && this._startPoint.y != currentPoint.y) {
-                    if (this._path) {
-                        if (event.shiftKey) {
-                            let straightLine = straightenLine(this._lastPoint, currentPoint);
-                            this._pathD += "L" + straightLine.x + " " + straightLine.y;
-                            this._path.setAttribute("d", this._pathD);
-                            this._lastPoint = straightLine;
-                        }
-                        else {
-                            this._pathD += "L" + currentPoint.x + " " + currentPoint.y;
-                            this._path.setAttribute("d", this._pathD);
-                            this._lastPoint = currentPoint;
-                        }
-                    }
-                }
-                if (this._samePoint && this._p2pMode || this._dragMode && !this._p2pMode) {
-                    event.target.releasePointerCapture(event.pointerId);
-                    designerCanvas.releaseActiveTool();
-                    this._eventStarted = false;
-                    this._p2pMode = false;
-                    this._pointerMoved = false;
-                    this._samePoint = false;
-                    this._dragMode = false;
-                    const rect = this._path.getBoundingClientRect();
-                    designerCanvas.overlayLayer.removeOverlay(this._path);
-                    const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-                    const mvX = rect.x - designerCanvas.containerBoundingRect.x - offset;
-                    const mvY = rect.y - designerCanvas.containerBoundingRect.y - offset;
-                    const d = moveSVGPath(this._path, mvX, mvY);
-                    this._path.setAttribute("d", d);
-                    svg.appendChild(this._path);
-                    svg.style.left = (mvX) + 'px';
-                    svg.style.top = (mvY) + 'px';
-                    svg.style.position = 'absolute';
-                    svg.style.width = (rect.width + 2 * offset) + 'px';
-                    svg.style.height = (rect.height + 2 * offset) + 'px';
-                    svg.style.overflow = 'visible';
-                    //designerView.rootDesignItem.element.appendChild(svg);
-                    this._path = null;
-                    this._pathD = null;
-                    this._lastPoint = null;
-                    const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
-                    designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
-                    designerCanvas.serviceContainer.globalContext.finishedWithTool(this);
-                }
-                //TODO: Better Path drawing (like in SVGEDIT & Adding via Undo Framework. And adding to correct container)
-                break;
-        }
-        event.preventDefault();
-        event.stopPropagation();
-    }
-    keyboardEventHandler(designerCanvas, event, currentElement) { }
-}

package/dist/elements/widgets/designerView/toolBar/DrawRectTool.d.ts

@@ -1,19 +0,0 @@
-import { IDesignerCanvas } from '../IDesignerCanvas';
-import { ITool } from './ITool';
-import { ServiceContainer } from '../../../services/ServiceContainer.js';
-export declare class DrawRectTool implements ITool {
-    readonly cursor = "crosshair";
-    private _path;
-    private _startPoint;
-    private _minX;
-    private _minY;
-    private _maxX;
-    private _maxY;
-    private _px;
-    private _py;
-    constructor();
-    activated(serviceContainer: ServiceContainer): void;
-    dispose(): void;
-    pointerEventHandler(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): void;
-    keyboardEventHandler(designerCanvas: IDesignerCanvas, event: KeyboardEvent, currentElement: Element): void;
-}