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

package/dist/elements/widgets/designerView/extensions/AltToEnterContainerExtension copy.d.ts

@@ -1,12 +0,0 @@
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { AbstractExtension } from "./AbstractExtension";
-import { IExtensionManager } from "./IExtensionManger";
-export declare class AltToEnterContainerExtension extends AbstractExtension {
-    private _text;
-    private _rect;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    refresh(): void;
-    dispose(): void;
-}

package/dist/elements/widgets/designerView/extensions/AltToEnterContainerExtension copy.js

@@ -1,20 +0,0 @@
-import { AbstractExtension } from "./AbstractExtension";
-import { OverlayLayer } from "./OverlayLayer.js";
-export class AltToEnterContainerExtension extends AbstractExtension {
-    _text;
-    _rect;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    refresh() {
-        let itemRect = this.designerCanvas.getNormalizedElementCoordinates(this.extendedItem.element);
-        this._text = this._drawText("Press ALT to enter container", itemRect.x + 5, itemRect.y + 12, 'svg-text-enter-container', this._text, OverlayLayer.Foregorund);
-        this._rect = this._drawRect(itemRect.x, itemRect.y, itemRect.width, itemRect.height, 'svg-rect-enter-container', this._rect, OverlayLayer.Foregorund);
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

package/dist/elements/widgets/designerView/extensions/AltToEnterContainerExtensionProvider copy.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 AltToEnterContainerExtensionProvider 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/AltToEnterContainerExtensionProvider copy.js

@@ -1,14 +0,0 @@
-import { AltToEnterContainerExtension } from './AltToEnterContainerExtension';
-import { css } from "@node-projects/base-custom-webcomponent";
-export class AltToEnterContainerExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new AltToEnterContainerExtension(extensionManager, designerView, designItem);
-    }
-    style = css `
-    .svg-text-enter-container { stroke: none; fill: black; stroke-width: 1; font-size: 14px; font-weight:800; font-family: monospace; }
-    .svg-rect-enter-container { stroke: none; fill: #aa00ff2e; }
-  `;
-}

package/dist/elements/widgets/designerView/extensions/EditText/EditTextExtension copy.d.ts

@@ -1,17 +0,0 @@
-import { IDesignItem } from "../../../../item/IDesignItem";
-import { IDesignerCanvas } from "../../IDesignerCanvas";
-import { AbstractExtension } from "../AbstractExtension.js";
-import { IExtensionManager } from "../IExtensionManger";
-export declare class EditTextExtension extends AbstractExtension {
-    private _contentEditedBound;
-    private _blurBound;
-    private static template;
-    private _blurTimeout;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    refresh(): void;
-    dispose(): void;
-    _contentEdited(): void;
-    _blur(): void;
-    _formatSelection(type: string): void;
-}

package/dist/elements/widgets/designerView/extensions/EditText/EditTextExtension copy.js

@@ -1,80 +0,0 @@
-import { html } from "@node-projects/base-custom-webcomponent";
-import { AbstractExtension } from "../AbstractExtension.js";
-import { ExtensionType } from "../ExtensionType.js";
-import { OverlayLayer } from "../OverlayLayer.js";
-export class EditTextExtension extends AbstractExtension {
-    _contentEditedBound;
-    _blurBound;
-    static template = html `
-    <div style="height: 24px; display: flex;">
-      <button data-command="bold" style="pointer-events: all; height: 24px; width: 24px; padding: 0; font-weight: 900;">b</button>
-      <button data-command="italic" style="pointer-events: all; height: 24px; width: 24px; padding: 0;"><em>i</em></button>
-      <button data-command="underline" style="pointer-events: all; height: 24px; width: 24px; padding: 0;"><ins>u</ins></button>
-      <button data-command="strikeThrough" style="pointer-events: all; height: 24px; width: 24px; padding: 0;"><del>s</del></button>
-    </div>
-  `;
-    _blurTimeout;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-        this._contentEditedBound = this._contentEdited.bind(this);
-        this._blurBound = this._blur.bind(this);
-    }
-    extend() {
-        //todo -> check what to do with extensions, do not loose edit on mouse click,...
-        //maybe use a html edit framework
-        this.extendedItem.instanceServiceContainer.selectionService.clearSelectedElements();
-        //this.extensionManager.removeExtension(this.extendedItem, ExtensionType.PrimarySelection);
-        //this.extensionManager.removeExtension(this.extendedItem, ExtensionType.Selection);
-        this.extendedItem.element.setAttribute('contenteditable', '');
-        this.extendedItem.element.addEventListener('input', this._contentEditedBound);
-        this.extendedItem.element.addEventListener('blur', this._blurBound);
-        this.extendedItem.element.focus();
-        this.designerCanvas.eatEvents = this.extendedItem.element;
-        let itemRect = this.extendedItem.element.getBoundingClientRect();
-        const elements = EditTextExtension.template.content.cloneNode(true);
-        elements.querySelectorAll('button').forEach(x => x.onclick = () => this._formatSelection(x.dataset['command']));
-        let foreignObject = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
-        foreignObject.setAttribute('x', '' + (itemRect.x - this.designerCanvas.containerBoundingRect.x) / this.designerCanvas.scaleFactor);
-        foreignObject.setAttribute('y', '' + ((itemRect.y - this.designerCanvas.containerBoundingRect.y) / this.designerCanvas.scaleFactor - 30));
-        foreignObject.setAttribute('width', '96');
-        foreignObject.setAttribute('height', '24');
-        foreignObject.appendChild(elements);
-        this.overlayLayerView.addOverlay(foreignObject, OverlayLayer.Foregorund);
-        this.overlays.push(foreignObject);
-        this.designerCanvas.clickOverlay.style.pointerEvents = 'none';
-    }
-    refresh() {
-        this.dispose();
-    }
-    dispose() {
-        this._removeAllOverlays();
-        this.extendedItem.element.removeAttribute('contenteditable');
-        this.extendedItem.element.removeEventListener('input', this._contentEditedBound);
-        this.extendedItem.element.removeEventListener('blur', this._blurBound);
-        this.designerCanvas.eatEvents = null;
-        this.extendedItem.updateChildrenFromNodesChildren();
-        this.designerCanvas.clickOverlay.style.pointerEvents = 'auto';
-    }
-    _contentEdited() {
-        //todo -> save???
-        //this.extendedItem.content = this.extendedItem.element.innerHTML;
-        //console.log(this.extendedItem.element.innerHTML)
-    }
-    _blur() {
-        if (!this._blurTimeout) {
-            this._blurTimeout = setTimeout(() => {
-                //todo, don't remove doubleclick extension (another type could be used), remove extension itself
-                //maybe also configureable when when to remove the extension
-                this.extensionManager.removeExtension(this.extendedItem, ExtensionType.Doubleclick);
-            }, 150);
-        }
-    }
-    _formatSelection(type) {
-        if (this._blurTimeout)
-            clearTimeout(this._blurTimeout);
-        this._blurTimeout = null;
-        //const selection = <Selection>(<any>this.designerView.shadowRoot).getSelection()
-        document.execCommand(type, false, null);
-        this.extendedItem.element.focus();
-    }
-}

package/dist/elements/widgets/designerView/extensions/EditText/EditTextExtensionProvider copy.d.ts

@@ -1,9 +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 EditTextExtensionProvider implements IDesignerExtensionProvider {
-    shouldExtend(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-}

package/dist/elements/widgets/designerView/extensions/EditText/EditTextExtensionProvider copy.js

@@ -1,11 +0,0 @@
-import { EditTextExtension } from "./EditTextExtension.js";
-export class EditTextExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        if (designItem.name === 'button' || designItem.name === 'input')
-            return false;
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new EditTextExtension(extensionManager, designerView, designItem);
-    }
-}

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

@@ -1,11 +0,0 @@
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { AbstractExtension } from "./AbstractExtension";
-import { IExtensionManager } from "./IExtensionManger";
-export declare class GrayOutDragOverExtension extends AbstractExtension {
-    private _rect;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    refresh(): void;
-    dispose(): void;
-}

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

@@ -1,18 +0,0 @@
-import { AbstractExtension } from "./AbstractExtension";
-import { OverlayLayer } from "./OverlayLayer.js";
-export class GrayOutDragOverExtension extends AbstractExtension {
-    _rect;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    refresh() {
-        let itemRect = this.designerCanvas.getNormalizedElementCoordinates(this.extendedItem.element);
-        this._rect = this._drawRect(itemRect.x, itemRect.y, itemRect.width, itemRect.height, 'svg-rect-enter-container', this._rect, OverlayLayer.Foregorund);
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,11 +0,0 @@
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { AbstractExtension } from './AbstractExtension';
-import { IExtensionManager } from "./IExtensionManger";
-export declare class IframeExtension extends AbstractExtension {
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    _pointerEvent(event: PointerEvent): void;
-    refresh(): void;
-    dispose(): void;
-}

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

@@ -1,46 +0,0 @@
-import { AbstractExtension } from './AbstractExtension';
-export class IframeExtension extends AbstractExtension {
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        // forward events to designer, so iframe is selectable via click
-        let iframe = this.extendedItem.element;
-        iframe.contentWindow.addEventListener('pointerdown', (e) => this._pointerEvent(e), { capture: true });
-        iframe.contentWindow.addEventListener('pointermove', (e) => this._pointerEvent(e), { capture: true });
-        iframe.contentWindow.addEventListener('pointerup', (e) => this._pointerEvent(e), { capture: true });
-    }
-    _pointerEvent(event) {
-        const rect = this.extendedItem.element.getBoundingClientRect();
-        const that = this;
-        const handler = {
-            get(target, property) {
-                switch (property) {
-                    case 'composedPath':
-                        return () => [that.extendedItem.element];
-                    case 'x':
-                    case 'clientX':
-                    case 'offsetX':
-                    case 'pageX':
-                        return target[property] + rect.x;
-                    case 'y':
-                    case 'clientY':
-                    case 'offsetY':
-                    case 'pageY':
-                        return target[property] + rect.y;
-                }
-                return target[property];
-            }
-        };
-        event.preventDefault();
-        event.stopPropagation();
-        const proxy = new Proxy(event, handler);
-        //@ts-ignore
-        this.designerCanvas._pointerEventHandlerBound(proxy);
-    }
-    refresh() {
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,9 +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 IframeExtensionProvider implements IDesignerExtensionProvider {
-    shouldExtend(extensionManager: IExtensionManager, designerCanvas: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerCanvas: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-}

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

@@ -1,9 +0,0 @@
-import { IframeExtension } from "./IframeExtension.js";
-export class IframeExtensionProvider {
-    shouldExtend(extensionManager, designerCanvas, designItem) {
-        return designItem.name == 'iframe';
-    }
-    getExtension(extensionManager, designerCanvas, designItem) {
-        return new IframeExtension(extensionManager, designerCanvas, designItem);
-    }
-}

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

@@ -1,23 +0,0 @@
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { AbstractExtension } from "./AbstractExtension";
-import "../../../helper/PathDataPolyfill";
-import { IPoint } from "../../../../interfaces/IPoint";
-import { IExtensionManager } from "./IExtensionManger";
-import { PathData } from "../../../helper/PathDataPolyfill";
-export declare class PathExtension extends AbstractExtension {
-    private _lastPos;
-    private _parentRect;
-    private _startPos;
-    private _circlePos;
-    private _originalPathPoint;
-    private _pathdata;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    pointerEvent(event: PointerEvent, circle: SVGCircleElement, p: PathData, index: number): void;
-    _drawPathCircle(x: number, y: number, p: PathData, index: number): void;
-    _drawPathLine(x1: number, y1: number, x2: number, y2: number): void;
-    _checkCircleIndex(p: PathData, circlePos: IPoint): boolean;
-    refresh(): void;
-    dispose(): void;
-}

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

@@ -1,251 +0,0 @@
-import { AbstractExtension } from "./AbstractExtension";
-import "../../../helper/PathDataPolyfill";
-import { EventNames } from "../../../../enums/EventNames";
-import { createPathD } from "../../../helper/PathDataPolyfill";
-import { ContextMenuHelper } from "../../../helper/contextMenu/ContextMenuHelper";
-export class PathExtension extends AbstractExtension {
-    _lastPos;
-    _parentRect;
-    _startPos;
-    _circlePos;
-    _originalPathPoint;
-    _pathdata;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this._parentRect = this.extendedItem.element.parentElement.getBoundingClientRect();
-        this._pathdata = this.extendedItem.node.getPathData({ normalize: false });
-        for (let p of this._pathdata) {
-            switch (p.type) {
-                case 'M':
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._lastPos = { x: p.values[0], y: p.values[1] };
-                    break;
-                case 'L':
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._lastPos = { x: p.values[0], y: p.values[1] };
-                    break;
-                case 'l':
-                    this._drawPathCircle(p.values[0] + this._lastPos.x, p.values[1] + this._lastPos.y, p, 0);
-                    this._lastPos = { x: p.values[0] + this._lastPos.x, y: p.values[1] + this._lastPos.y };
-                    break;
-                case 'H':
-                    break;
-                case 'V':
-                    break;
-                case 'Z':
-                    break;
-                case 'C':
-                    this._drawPathLine(this._lastPos.x, this._lastPos.y, p.values[0], p.values[1]);
-                    this._drawPathLine(p.values[4], p.values[5], p.values[2], p.values[3]);
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._drawPathCircle(p.values[2], p.values[3], p, 2);
-                    this._drawPathCircle(p.values[4], p.values[5], p, 4);
-                    this._lastPos = { x: p.values[4], y: p.values[5] };
-                    break;
-                case 'c':
-                    this._drawPathLine(this._lastPos.x, this._lastPos.y, p.values[0], p.values[1]);
-                    this._drawPathLine(this._lastPos.x + p.values[4], this._lastPos.y + p.values[5], p.values[2], p.values[3]);
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._drawPathCircle(p.values[2], p.values[3], p, 2);
-                    this._drawPathCircle(this._lastPos.x + p.values[4], this._lastPos.y + p.values[5], p, 4);
-                    this._lastPos = { x: p.values[4], y: p.values[5] };
-                    break;
-                case 'S':
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._drawPathCircle(p.values[2], p.values[3], p, 2);
-                    this._lastPos = { x: p.values[2], y: p.values[3] };
-                    break;
-                case 'Q':
-                    this._drawPathLine(this._lastPos.x, this._lastPos.y, p.values[0], p.values[1]);
-                    this._drawPathLine(p.values[0], p.values[1], p.values[2], p.values[3]);
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._drawPathCircle(p.values[2], p.values[3], p, 2);
-                    this._lastPos = { x: p.values[2], y: p.values[3] };
-                    break;
-                case 'T':
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._lastPos = { x: p.values[0], y: p.values[1] };
-                    break;
-                case 'A':
-                    this._drawPathCircle(p.values[0], p.values[1], p, 0);
-                    this._drawPathCircle(p.values[5], p.values[6], p, 5);
-                    this._lastPos = { x: p.values[0], y: p.values[1] };
-                    break;
-            }
-        }
-    }
-    pointerEvent(event, circle, p, index) {
-        event.stopPropagation();
-        const cursorPos = this.designerCanvas.getNormalizedEventCoordinates(event);
-        switch (event.type) {
-            case EventNames.PointerDown:
-                event.target.setPointerCapture(event.pointerId);
-                this._startPos = cursorPos;
-                this._circlePos = { x: parseFloat(circle.getAttribute("cx")), y: parseFloat(circle.getAttribute("cy")) };
-                this._originalPathPoint = { x: p.values[index], y: p.values[index + 1] };
-                break;
-            case EventNames.PointerMove:
-                if (this._startPos && event.buttons > 0) {
-                    this._lastPos = { x: this._startPos.x, y: this._startPos.y };
-                    const cx = cursorPos.x - this._lastPos.x + this._circlePos.x;
-                    const cy = cursorPos.y - this._lastPos.y + this._circlePos.y;
-                    const dx = cx - this._circlePos.x;
-                    const dy = cy - this._circlePos.y;
-                    if (event.shiftKey) {
-                        if (Math.abs(dx) >= Math.abs(dy)) {
-                            p.values[index] = this._originalPathPoint.x + dx;
-                            circle.setAttribute("cx", (this._circlePos.x + dx).toString());
-                            p.values[index + 1] = this._originalPathPoint.y;
-                            circle.setAttribute("cy", (this._circlePos.y).toString());
-                        }
-                        else {
-                            p.values[index] = this._originalPathPoint.x;
-                            circle.setAttribute("cx", (this._circlePos.x).toString());
-                            p.values[index + 1] = this._originalPathPoint.y + dy;
-                            circle.setAttribute("cy", (this._circlePos.y + dy).toString());
-                        }
-                    }
-                    else {
-                        p.values[index] = this._originalPathPoint.x + dx;
-                        p.values[index + 1] = this._originalPathPoint.y + dy;
-                        circle.setAttribute("cx", (this._circlePos.x + dx).toString());
-                        circle.setAttribute("cy", (this._circlePos.y + dy).toString());
-                    }
-                    this.extendedItem.element.setAttribute("d", createPathD(this._pathdata));
-                }
-                break;
-            case EventNames.PointerUp:
-                event.target.releasePointerCapture(event.pointerId);
-                this._startPos = null;
-                this._circlePos = null;
-                this._lastPos = null;
-                this.extendedItem.setAttribute('d', createPathD(this._pathdata));
-                break;
-        }
-    }
-    _drawPathCircle(x, y, p, index) {
-        let circle = this._drawCircle((this._parentRect.x - this.designerCanvas.containerBoundingRect.x) / this.designerCanvas.scaleFactor + x, (this._parentRect.y - this.designerCanvas.containerBoundingRect.y) / this.designerCanvas.scaleFactor + y, 5 / this.designerCanvas.scaleFactor, 'svg-path');
-        circle.style.strokeWidth = (1 / this.designerCanvas.zoomFactor).toString();
-        let circlePos = { x: x, y: y };
-        const items = [];
-        const pidx = this._pathdata.indexOf(p);
-        items.push({
-            title: 'delete point', action: () => {
-                this._pathdata.splice(pidx, 1);
-                if (pidx == 0)
-                    this._pathdata[0].type = 'M';
-                this.extendedItem.setAttribute('d', createPathD(this._pathdata));
-            }
-        });
-        items.push({
-            title: 'insert point after', action: () => {
-                const l = { type: 'L', values: [p.values[0], p.values[1]] };
-                this._pathdata.splice(pidx + 1, 0, l);
-                this.extendedItem.setAttribute('d', createPathD(this._pathdata));
-            }
-        });
-        if (pidx != 0 && this._checkCircleIndex(p, circlePos)) {
-            items.push({
-                title: 'convert to quadratic bézier', action: () => {
-                    let p1x = this._pathdata[pidx - 1].values[0];
-                    let p1y = this._pathdata[pidx - 1].values[1];
-                    if (this._pathdata[pidx - 1].type === 'C') {
-                        p1x = this._pathdata[pidx - 1].values[4];
-                        p1y = this._pathdata[pidx - 1].values[5];
-                    }
-                    else if (this._pathdata[pidx - 1].type === 'Q') {
-                        p1x = this._pathdata[pidx - 1].values[2];
-                        p1y = this._pathdata[pidx - 1].values[3];
-                    }
-                    const p2x = this._pathdata[pidx].values[0];
-                    const p2y = this._pathdata[pidx].values[1];
-                    const mpx = (p2x + p1x) * 0.5;
-                    const mpy = (p2y + p1y) * 0.5;
-                    const theta = Math.atan2(p2y - p1y, p2x - p1x) - Math.PI / 2;
-                    const offset = 50;
-                    const c1x = mpx + offset * Math.cos(theta);
-                    const c1y = mpy + offset * Math.sin(theta);
-                    this._pathdata[pidx].type = 'Q';
-                    this._pathdata[pidx].values[0] = c1x;
-                    this._pathdata[pidx].values[1] = c1y;
-                    this._pathdata[pidx].values[2] = p2x;
-                    this._pathdata[pidx].values[3] = p2y;
-                    this.extendedItem.setAttribute('d', createPathD(this._pathdata));
-                }
-            });
-        }
-        if (pidx != 0 && this._checkCircleIndex(p, circlePos)) {
-            items.push({
-                title: 'convert to cubic bézier', action: () => {
-                    let p1x = this._pathdata[pidx - 1].values[0];
-                    let p1y = this._pathdata[pidx - 1].values[1];
-                    if (this._pathdata[pidx - 1].type === 'C') {
-                        p1x = this._pathdata[pidx - 1].values[4];
-                        p1y = this._pathdata[pidx - 1].values[5];
-                    }
-                    else if (this._pathdata[pidx - 1].type === 'Q') {
-                        p1x = this._pathdata[pidx - 1].values[2];
-                        p1y = this._pathdata[pidx - 1].values[3];
-                    }
-                    const p2x = this._pathdata[pidx].values[0];
-                    const p2y = this._pathdata[pidx].values[1];
-                    const mpx = (p2x + p1x) * 0.5;
-                    const mpy = (p2y + p1y) * 0.5;
-                    const theta = Math.atan2(p2y - p1y, p2x - p1x) - Math.PI / 2;
-                    const offset = 50;
-                    let c1x = mpx + offset * Math.cos(theta);
-                    let c1y = mpy + offset * Math.sin(theta);
-                    c1x = p.values[0] + 2 * (p1x - p.values[0]) / 3;
-                    c1y = p.values[1] + 2 * (p1y - p.values[1]) / 3;
-                    const c2x = x + 2 * (p1x - x) / 3;
-                    const c2y = y + 2 * (p1y - y) / 3;
-                    this._pathdata[pidx].type = 'C';
-                    this._pathdata[pidx].values[0] = c1x;
-                    this._pathdata[pidx].values[1] = c1y;
-                    this._pathdata[pidx].values[2] = c2x;
-                    this._pathdata[pidx].values[3] = c2y;
-                    this._pathdata[pidx].values[4] = p2x;
-                    this._pathdata[pidx].values[5] = p2y;
-                    this.extendedItem.setAttribute('d', createPathD(this._pathdata));
-                }
-            });
-        }
-        circle.addEventListener(EventNames.PointerDown, event => this.pointerEvent(event, circle, p, index));
-        circle.addEventListener(EventNames.PointerMove, event => this.pointerEvent(event, circle, p, index));
-        circle.addEventListener(EventNames.PointerUp, event => this.pointerEvent(event, circle, p, index));
-        circle.addEventListener(EventNames.ContextMenu, event => {
-            event.preventDefault();
-            ContextMenuHelper.showContextMenu(null, event, null, items);
-        });
-    }
-    _drawPathLine(x1, y1, x2, y2) {
-        this._drawLine(this._parentRect.x - this.designerCanvas.containerBoundingRect.x + x1, this._parentRect.y - this.designerCanvas.containerBoundingRect.y + y1, this._parentRect.x - this.designerCanvas.containerBoundingRect.x + x2, this._parentRect.y - this.designerCanvas.containerBoundingRect.y + y2, 'svg-path-line');
-    }
-    _checkCircleIndex(p, circlePos) {
-        switch (p.type) {
-            case 'M':
-            case 'L':
-                if (p.values[0] == circlePos.x && p.values[1] == circlePos.y)
-                    return true;
-                break;
-            case 'Q':
-                if (p.values[2] == circlePos.x && p.values[3] == circlePos.y)
-                    return true;
-                break;
-            case 'C':
-                if (p.values[4] == circlePos.x && p.values[5] == circlePos.y)
-                    return true;
-                break;
-        }
-        return false;
-    }
-    refresh() {
-        this._removeAllOverlays();
-        this.extend();
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,9 +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 PathExtensionProvider implements IDesignerExtensionProvider {
-    shouldExtend(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-}

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

@@ -1,18 +0,0 @@
-import { PathExtension } from "./PathExtension";
-export class PathExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        if (designItem.node instanceof SVGPathElement ||
-            designItem.node instanceof SVGRectElement ||
-            designItem.node instanceof SVGCircleElement ||
-            designItem.node instanceof SVGEllipseElement ||
-            designItem.node instanceof SVGLineElement ||
-            designItem.node instanceof SVGPolylineElement ||
-            designItem.node instanceof SVGPolygonElement) {
-            return true;
-        }
-        return false;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new PathExtension(extensionManager, designerView, designItem);
-    }
-}

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

@@ -1,13 +0,0 @@
-import { IDesignItem } from "../../../item/IDesignItem";
-import { IDesignerCanvas } from "../IDesignerCanvas";
-import { AbstractExtension } from './AbstractExtension';
-import { IExtensionManager } from "./IExtensionManger";
-export declare class PrimarySelectionDefaultExtension extends AbstractExtension {
-    private _rect;
-    private _text;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    _drawMoveOverlay(itemRect: DOMRect): void;
-    refresh(): void;
-    dispose(): void;
-}

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

@@ -1,21 +0,0 @@
-import { AbstractExtension } from './AbstractExtension';
-export class PrimarySelectionDefaultExtension extends AbstractExtension {
-    _rect;
-    _text;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    _drawMoveOverlay(itemRect) {
-    }
-    refresh() {
-        const boundRect = this.extendedItem.element.getBoundingClientRect();
-        this._rect = this._drawRect((boundRect.x - this.designerCanvas.containerBoundingRect.x) / this.designerCanvas.scaleFactor, (boundRect.y - this.designerCanvas.containerBoundingRect.y) / this.designerCanvas.scaleFactor - 16, 60, 15, 'svg-primary-selection-move', this._rect);
-        this._text = this._drawText(this.extendedItem.name.substring(0, 10) + '…', (boundRect.x - this.designerCanvas.containerBoundingRect.x) / this.designerCanvas.scaleFactor, (boundRect.y - this.designerCanvas.containerBoundingRect.y) / this.designerCanvas.scaleFactor - 5, 'svg-text-primary', this._text);
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}