@node-projects/web-component-designer 0.0.291 → 0.1.0

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

@@ -1,313 +0,0 @@
-import { DesignItem } from '../../../item/DesignItem.js';
-import { NodeType } from "../../../item/NodeType.js";
-import { ExtensionType } from './ExtensionType.js';
-export class ExtensionManager {
-    designerCanvas;
-    designItemsWithExtentions = new Set();
-    constructor(designerCanvas) {
-        this.designerCanvas = designerCanvas;
-        designerCanvas.instanceServiceContainer.selectionService.onSelectionChanged.on(this._selectedElementsChanged.bind(this));
-        designerCanvas.instanceServiceContainer.contentService.onContentChanged.on(this._contentChanged.bind(this));
-    }
-    _contentChanged(contentChanged) {
-        requestAnimationFrame(() => {
-            switch (contentChanged.changeType) {
-                case 'added':
-                    this.applyExtensions(contentChanged.designItems, ExtensionType.Permanent, null, true);
-                    break;
-                case 'moved':
-                    this.refreshExtensions(contentChanged.designItems, ExtensionType.Permanent);
-                    break;
-                case 'parsed':
-                    this.applyExtensions(Array.from(this.designerCanvas.rootDesignItem.children()), ExtensionType.Permanent, null, true);
-                    break;
-                case 'removed':
-                    this.removeExtensions(contentChanged.designItems, true, ExtensionType.Permanent);
-                    break;
-            }
-        });
-    }
-    _selectedElementsChanged(selectionChangedEvent) {
-        if (selectionChangedEvent.oldSelectedElements && selectionChangedEvent.oldSelectedElements.length) {
-            if (selectionChangedEvent.oldSelectedElements[0].parent) {
-                const primaryContainer = DesignItem.GetOrCreateDesignItem(selectionChangedEvent.oldSelectedElements[0].parent.element, selectionChangedEvent.oldSelectedElements[0].parent.element, this.designerCanvas.serviceContainer, this.designerCanvas.instanceServiceContainer);
-                this.removeExtension(primaryContainer, ExtensionType.PrimarySelectionContainer);
-                this.removeExtension(primaryContainer, ExtensionType.PrimarySelectionContainerAndCanBeEntered);
-                this.removeExtension(selectionChangedEvent.oldSelectedElements[0], ExtensionType.PrimarySelection);
-                this.removeExtension(selectionChangedEvent.oldSelectedElements[0], ExtensionType.PrimarySelectionAndCanBeEntered);
-                this.removeExtensions(selectionChangedEvent.oldSelectedElements, false, ExtensionType.Selection);
-            }
-        }
-        if (selectionChangedEvent.selectedElements && selectionChangedEvent.selectedElements.length) {
-            this.applyExtensions(selectionChangedEvent.selectedElements, ExtensionType.Selection);
-            this.applyExtension(selectionChangedEvent.selectedElements[0], ExtensionType.PrimarySelection);
-            if (selectionChangedEvent.selectedElements[0].getPlacementService()?.isEnterableContainer(selectionChangedEvent.selectedElements[0]))
-                this.applyExtension(selectionChangedEvent.selectedElements[0], ExtensionType.PrimarySelectionAndCanBeEntered);
-            const primaryContainer = DesignItem.GetOrCreateDesignItem(selectionChangedEvent.selectedElements[0].parent.element, selectionChangedEvent.selectedElements[0].parent.element, this.designerCanvas.serviceContainer, this.designerCanvas.instanceServiceContainer);
-            this.applyExtension(primaryContainer, ExtensionType.PrimarySelectionContainer);
-            if (primaryContainer.getPlacementService()?.isEnterableContainer(primaryContainer))
-                this.applyExtension(primaryContainer, ExtensionType.PrimarySelectionContainerAndCanBeEntered);
-        }
-        //this.refreshExtensions(selectionChangedEvent.selectedElements);
-    }
-    applyExtension(designItem, extensionType, event, recursive = false) {
-        if (designItem && designItem.nodeType == NodeType.Element) {
-            const extProv = this.designerCanvas.serviceContainer.designerExtensions.get(extensionType);
-            let extensions = [];
-            if (extProv) {
-                for (let e of extProv) {
-                    let shouldAppE = designItem.shouldAppliedDesignerExtensions.get(extensionType);
-                    if (!shouldAppE)
-                        shouldAppE = [];
-                    shouldAppE.push(e);
-                    designItem.shouldAppliedDesignerExtensions.set(extensionType, shouldAppE);
-                    if (e.shouldExtend(this, this.designerCanvas, designItem)) {
-                        let appE = designItem.appliedDesignerExtensions.get(extensionType);
-                        if (!appE)
-                            appE = [];
-                        const ext = e.getExtension(this, this.designerCanvas, designItem);
-                        try {
-                            ext.extend(event);
-                            extensions.push(ext);
-                        }
-                        catch (err) {
-                            console.error(err);
-                        }
-                        appE.push(ext);
-                        designItem.appliedDesignerExtensions.set(extensionType, appE);
-                        this.designItemsWithExtentions.add(designItem);
-                    }
-                }
-            }
-            if (recursive) {
-                for (const d of designItem.children()) {
-                    this.applyExtension(d, extensionType, event, recursive);
-                }
-            }
-            return extensions;
-        }
-        return null;
-    }
-    applyExtensions(designItems, extensionType, event, recursive = false) {
-        if (designItems) {
-            const extProv = this.designerCanvas.serviceContainer.designerExtensions.get(extensionType);
-            if (extProv) {
-                for (let e of extProv) {
-                    for (let i of designItems) {
-                        let shouldAppE = i.shouldAppliedDesignerExtensions.get(extensionType);
-                        if (!shouldAppE)
-                            shouldAppE = [];
-                        shouldAppE.push(e);
-                        i.shouldAppliedDesignerExtensions.set(extensionType, shouldAppE);
-                        if (e.shouldExtend(this, this.designerCanvas, i)) {
-                            let appE = i.appliedDesignerExtensions.get(extensionType);
-                            if (!appE)
-                                appE = [];
-                            const ext = e.getExtension(this, this.designerCanvas, i);
-                            try {
-                                ext.extend(event);
-                            }
-                            catch (err) {
-                                console.error(err);
-                            }
-                            appE.push(ext);
-                            i.appliedDesignerExtensions.set(extensionType, appE);
-                            this.designItemsWithExtentions.add(i);
-                        }
-                    }
-                }
-            }
-            if (recursive) {
-                for (const d of designItems) {
-                    this.applyExtensions(Array.from(d.children()), extensionType, event, recursive);
-                }
-            }
-        }
-    }
-    removeExtension(designItem, extensionType) {
-        if (designItem) {
-            if (extensionType) {
-                designItem.shouldAppliedDesignerExtensions.delete(extensionType);
-                let exts = designItem.appliedDesignerExtensions.get(extensionType);
-                if (exts) {
-                    for (let e of exts) {
-                        try {
-                            e.dispose();
-                        }
-                        catch (err) {
-                            console.error(err);
-                        }
-                    }
-                    designItem.appliedDesignerExtensions.delete(extensionType);
-                    if (!designItem.appliedDesignerExtensions.size)
-                        this.designItemsWithExtentions.delete(designItem);
-                }
-            }
-            else {
-                designItem.shouldAppliedDesignerExtensions.clear();
-                for (let appE of designItem.appliedDesignerExtensions) {
-                    for (let e of appE[1]) {
-                        try {
-                            e.dispose();
-                        }
-                        catch (err) {
-                            console.error(err);
-                        }
-                    }
-                }
-                designItem.appliedDesignerExtensions.clear();
-                this.designItemsWithExtentions.delete(designItem);
-            }
-        }
-    }
-    removeExtensions(designItems, recursive, extensionType) {
-        if (designItems) {
-            if (extensionType) {
-                for (let i of designItems) {
-                    if (recursive && i.hasChildren) {
-                        this.removeExtensions([...i.children()], true, extensionType);
-                    }
-                    i.shouldAppliedDesignerExtensions.delete(extensionType);
-                    let exts = i.appliedDesignerExtensions.get(extensionType);
-                    if (exts) {
-                        for (let e of exts) {
-                            try {
-                                e.dispose();
-                            }
-                            catch (err) {
-                                console.error(err);
-                            }
-                        }
-                        i.appliedDesignerExtensions.delete(extensionType);
-                        if (!i.appliedDesignerExtensions.size)
-                            this.designItemsWithExtentions.delete(i);
-                    }
-                }
-            }
-            else {
-                for (let i of designItems) {
-                    if (recursive && i.hasChildren) {
-                        this.removeExtensions([...i.children()], true, extensionType);
-                    }
-                    i.shouldAppliedDesignerExtensions.clear();
-                    for (let appE of i.appliedDesignerExtensions) {
-                        for (let e of appE[1]) {
-                            try {
-                                e.dispose();
-                            }
-                            catch (err) {
-                                console.error(err);
-                            }
-                        }
-                    }
-                    i.appliedDesignerExtensions.clear();
-                    this.designItemsWithExtentions.delete(i);
-                }
-            }
-        }
-    }
-    refreshExtension(designItem, extensionType, event) {
-        if (designItem) {
-            if (extensionType) {
-                let exts = designItem.appliedDesignerExtensions.get(extensionType);
-                if (exts) {
-                    for (let e of exts) {
-                        try {
-                            e.refresh(event);
-                        }
-                        catch (err) {
-                            console.error(err);
-                        }
-                    }
-                }
-            }
-            else {
-                for (let appE of designItem.appliedDesignerExtensions) {
-                    for (let e of appE[1]) {
-                        try {
-                            e.refresh(event);
-                        }
-                        catch (err) {
-                            console.error(err);
-                        }
-                    }
-                }
-            }
-        }
-    }
-    refreshExtensions(designItems, extensionType, event, ignoredExtension) {
-        if (designItems) {
-            if (extensionType) {
-                for (let i of designItems) {
-                    let exts = i.appliedDesignerExtensions.get(extensionType);
-                    if (exts) {
-                        for (let e of exts) {
-                            try {
-                                if (e != ignoredExtension)
-                                    e.refresh(event);
-                            }
-                            catch (err) {
-                                console.error(err);
-                            }
-                        }
-                    }
-                }
-            }
-            else {
-                for (let i of designItems) {
-                    for (let appE of i.appliedDesignerExtensions) {
-                        for (let e of appE[1]) {
-                            try {
-                                if (e != ignoredExtension)
-                                    e.refresh(event);
-                            }
-                            catch (err) {
-                                console.error(err);
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-    refreshAllExtensions(designItems, ignoredExtension) {
-        if (designItems) {
-            this.refreshExtensions(designItems, ExtensionType.Permanent, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.Selection, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.PrimarySelection, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.PrimarySelectionContainer, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.MouseOver, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.OnlyOneItemSelected, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.MultipleItemsSelected, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.ContainerDragOverAndCanBeEntered, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.ContainerDrag, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.Doubleclick, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.Placement, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.PrimarySelectionAndCanBeEntered, null, ignoredExtension);
-            this.refreshExtensions(designItems, ExtensionType.PrimarySelectionContainerAndCanBeEntered, null, ignoredExtension);
-        }
-    }
-    refreshAllAppliedExtentions() {
-        this.refreshAllExtensions([...this.designItemsWithExtentions]);
-    }
-    //todo does not work with permanant, when not applied... maybe we need to do in another way
-    //maybe store the "shouldAppliedExtensions??"
-    reapplyAllAppliedExtentions() {
-        for (let d of ExtensionManager.getAllChildElements(this.designerCanvas.rootDesignItem)) {
-            const keys = [...d.shouldAppliedDesignerExtensions.keys()];
-            for (let e of keys) {
-                this.removeExtension(d, e);
-                this.applyExtension(d, e);
-            }
-        }
-    }
-    static *getAllChildElements(designItem) {
-        if (designItem.nodeType == NodeType.Element)
-            yield designItem;
-        if (designItem.hasChildren) {
-            for (let c of designItem.children())
-                for (let di of ExtensionManager.getAllChildElements(c))
-                    yield di;
-        }
-    }
-}

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

@@ -1,30 +0,0 @@
-export declare enum ExtensionType {
-    Permanent = 1,
-    Selection = 2,
-    PrimarySelection = 3,
-    PrimarySelectionContainer = 4,
-    MouseOver = 5,
-    OnlyOneItemSelected = 6,
-    MultipleItemsSelected = 7,
-    /**
-     * Extension for the Container wich the dragged element is draged over.
-     */
-    ContainerDragOverAndCanBeEntered = 8,
-    /**
-    * Extension for the Container on wich a new element is draged over.
-    */
-    ContainerExternalDragOverAndCanBeEntered = 9,
-    /**
-     * Extension for the Current Container wich the dragged element is contained.
-     */
-    ContainerDrag = 10,
-    Doubleclick = 11,
-    Placement = 12,
-    /**
-     * Extensions only when the container can be Entered.
-     * So for Example on a custome webcomponent wich uses a grid layout for it's root, but can not show children,
-     * do not display grid extension.
-     */
-    PrimarySelectionAndCanBeEntered = 13,
-    PrimarySelectionContainerAndCanBeEntered = 14
-}

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

@@ -1,31 +0,0 @@
-export var ExtensionType;
-(function (ExtensionType) {
-    ExtensionType[ExtensionType["Permanent"] = 1] = "Permanent";
-    ExtensionType[ExtensionType["Selection"] = 2] = "Selection";
-    ExtensionType[ExtensionType["PrimarySelection"] = 3] = "PrimarySelection";
-    ExtensionType[ExtensionType["PrimarySelectionContainer"] = 4] = "PrimarySelectionContainer";
-    ExtensionType[ExtensionType["MouseOver"] = 5] = "MouseOver";
-    ExtensionType[ExtensionType["OnlyOneItemSelected"] = 6] = "OnlyOneItemSelected";
-    ExtensionType[ExtensionType["MultipleItemsSelected"] = 7] = "MultipleItemsSelected";
-    /**
-     * Extension for the Container wich the dragged element is draged over.
-     */
-    ExtensionType[ExtensionType["ContainerDragOverAndCanBeEntered"] = 8] = "ContainerDragOverAndCanBeEntered";
-    /**
-    * Extension for the Container on wich a new element is draged over.
-    */
-    ExtensionType[ExtensionType["ContainerExternalDragOverAndCanBeEntered"] = 9] = "ContainerExternalDragOverAndCanBeEntered";
-    /**
-     * Extension for the Current Container wich the dragged element is contained.
-     */
-    ExtensionType[ExtensionType["ContainerDrag"] = 10] = "ContainerDrag";
-    ExtensionType[ExtensionType["Doubleclick"] = 11] = "Doubleclick";
-    ExtensionType[ExtensionType["Placement"] = 12] = "Placement";
-    /**
-     * Extensions only when the container can be Entered.
-     * So for Example on a custome webcomponent wich uses a grid layout for it's root, but can not show children,
-     * do not display grid extension.
-     */
-    ExtensionType[ExtensionType["PrimarySelectionAndCanBeEntered"] = 13] = "PrimarySelectionAndCanBeEntered";
-    ExtensionType[ExtensionType["PrimarySelectionContainerAndCanBeEntered"] = 14] = "PrimarySelectionContainerAndCanBeEntered";
-})(ExtensionType || (ExtensionType = {}));

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

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

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

@@ -1,20 +0,0 @@
-import { getDesignerCanvasNormalizedTransformedCornerDOMPoints } from '../../../helper/TransformHelper.js';
-import { AbstractExtension } from './AbstractExtension.js';
-import { OverlayLayer } from './OverlayLayer.js';
-export class FlexboxExtension extends AbstractExtension {
-    _path;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        let transformedCornerPoints = getDesignerCanvasNormalizedTransformedCornerDOMPoints(this.extendedItem.element, null, this.designerCanvas);
-        this._path = this._drawTransformedRect(transformedCornerPoints, 'svg-flexbox', this._path, OverlayLayer.Background);
-    }
-    refresh() {
-        this._removeAllOverlays();
-        this.extend();
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,11 +0,0 @@
-import { IDesignerExtensionProvider } from './IDesignerExtensionProvider.js';
-import { IDesignItem } from '../../../item/IDesignItem.js';
-import { IDesignerCanvas } from '../IDesignerCanvas.js';
-import { IDesignerExtension } from './IDesignerExtension.js';
-import { IExtensionManager } from './IExtensionManger.js';
-export declare const flexboxExtensionShowOverlayOptionName = "flexboxExtensionShowOverlay";
-export declare class FlexboxExtensionProvider implements IDesignerExtensionProvider {
-    shouldExtend(extensionManager: IExtensionManager, designerCanvas: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerCanvas: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-    readonly style: CSSStyleSheet;
-}

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

@@ -1,17 +0,0 @@
-import { css } from "@node-projects/base-custom-webcomponent";
-import { FlexboxExtension } from './FlexboxExtension.js';
-export const flexboxExtensionShowOverlayOptionName = 'flexboxExtensionShowOverlay';
-export class FlexboxExtensionProvider {
-    shouldExtend(extensionManager, designerCanvas, designItem) {
-        const display = getComputedStyle(designItem.element).display;
-        if (display == 'flex' || display == 'inline-flex')
-            return designerCanvas.instanceServiceContainer.designContext.extensionOptions[flexboxExtensionShowOverlayOptionName] !== false;
-        return false;
-    }
-    getExtension(extensionManager, designerCanvas, designItem) {
-        return new FlexboxExtension(extensionManager, designerCanvas, designItem);
-    }
-    style = css `
-    .svg-flexbox { stroke: orange; fill: #9a47ff22; }
-  `;
-}

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

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

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

@@ -1,19 +0,0 @@
-import { getDesignerCanvasNormalizedTransformedCornerDOMPoints } from '../../../helper/TransformHelper.js';
-import { AbstractExtension } from './AbstractExtension.js';
-import { OverlayLayer } from "./OverlayLayer.js";
-export class GrayOutDragOverContainerExtension extends AbstractExtension {
-    _rect;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    refresh() {
-        let transformedCornerPoints = getDesignerCanvasNormalizedTransformedCornerDOMPoints(this.extendedItem.element, null, this.designerCanvas);
-        this._rect = this._drawTransformedRect(transformedCornerPoints, 'svg-rect-enter-container', this._rect, OverlayLayer.Background);
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

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

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

@@ -1,13 +0,0 @@
-import { css } from "@node-projects/base-custom-webcomponent";
-import { GrayOutDragOverContainerExtension } from "./GrayOutDragOverContainerExtension.js";
-export class GrayOutDragOverContainerExtensionProvider {
-    shouldExtend(extensionManager, designerCanvas, designItem) {
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new GrayOutDragOverContainerExtension(extensionManager, designerView, designItem);
-    }
-    style = css `
-    .svg-rect-enter-container { stroke: none; fill: #aa00ff2e; }
-  `;
-}

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

@@ -1,13 +0,0 @@
-import { IRect } from '../../../../interfaces/IRect.js';
-import { IDesignItem } from '../../../item/IDesignItem.js';
-import { IDesignerCanvas } from '../IDesignerCanvas.js';
-import { AbstractExtension } from './AbstractExtension.js';
-import { IExtensionManager } from './IExtensionManger.js';
-export declare class GrayOutExtension extends AbstractExtension {
-    private _path;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    refresh(): void;
-    drawGrayOut(r: IRect): void;
-    dispose(): void;
-}

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

@@ -1,32 +0,0 @@
-import { AbstractExtension } from './AbstractExtension.js';
-import { OverlayLayer } from "./OverlayLayer.js";
-export class GrayOutExtension extends AbstractExtension {
-    _path;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    refresh() {
-        if (!this._path) {
-            this._path = document.createElementNS("http://www.w3.org/2000/svg", "path");
-            this._path.setAttribute('class', 'svg-gray-out');
-            this._addOverlay(this._path, OverlayLayer.Background);
-        }
-        let normalizedRect = this.designerCanvas.getNormalizedElementCoordinates(this.extendedItem.element);
-        this.drawGrayOut(normalizedRect);
-    }
-    drawGrayOut(r) {
-        let outsideRect = { width: this.designerCanvas.containerBoundingRect.width / this.designerCanvas.scaleFactor, height: this.designerCanvas.containerBoundingRect.height / this.designerCanvas.scaleFactor };
-        const pathPoints = "M0 0 L0 " + outsideRect.height + "L" + r.x + " " + outsideRect.height + "L" + r.x + " 0" + " L0 0" +
-            "M" + r.x + " 0 L" + r.x + " " + r.y + "L" + outsideRect.width + " " + r.y + "L" + outsideRect.width + " 0" + "L" + r.x + " 0" +
-            "M" + r.x + " " + (r.y + r.height) + "L" + r.x + " " + outsideRect.height + "L" + outsideRect.width + " " + outsideRect.height + "L" + outsideRect.width + " " + (r.y + r.height) + "L" + r.x + " " + (r.y + r.height) +
-            "M" + (r.x + r.width) + " " + r.y + "L" + (r.x + r.width) + " " + (r.y + r.height) + "L" + outsideRect.width + " " + (r.y + r.height) + "L" + outsideRect.width + " " + (r.y) + "L" + (r.x + r.width) + " " + r.y;
-        this._path.setAttribute("d", pathPoints);
-    }
-    dispose() {
-        this._removeAllOverlays();
-        this._path = null;
-    }
-}

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

@@ -1,10 +0,0 @@
-import { IDesignerExtensionProvider } from './IDesignerExtensionProvider.js';
-import { IDesignItem } from '../../../item/IDesignItem.js';
-import { IDesignerCanvas } from '../IDesignerCanvas.js';
-import { IDesignerExtension } from './IDesignerExtension.js';
-import { IExtensionManager } from './IExtensionManger.js';
-export declare class GrayOutExtensionProvider 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/GrayOutExtensionProvider.js

@@ -1,13 +0,0 @@
-import { GrayOutExtension } from './GrayOutExtension.js';
-import { css } from "@node-projects/base-custom-webcomponent";
-export class GrayOutExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new GrayOutExtension(extensionManager, designerView, designItem);
-    }
-    style = css `
-    .svg-gray-out { stroke: transparent; fill: rgba(211, 211, 211, 0.8); pointer-events: none }
-  `;
-}

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

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

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

@@ -1,20 +0,0 @@
-import { getDesignerCanvasNormalizedTransformedCornerDOMPoints } from '../../../helper/TransformHelper.js';
-import { AbstractExtension } from './AbstractExtension.js';
-const offset = 3;
-export class HighlightElementExtension extends AbstractExtension {
-    _rect;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend() {
-        this.refresh();
-    }
-    refresh() {
-        let transformedCornerPoints = getDesignerCanvasNormalizedTransformedCornerDOMPoints(this.extendedItem.element, { x: offset, y: offset }, this.designerCanvas);
-        this._rect = this._drawTransformedRect(transformedCornerPoints, 'svg-hover', this._rect);
-        this._rect.style.strokeWidth = (2 / this.designerCanvas.zoomFactor).toString();
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,10 +0,0 @@
-import { IDesignerExtensionProvider } from './IDesignerExtensionProvider.js';
-import { IDesignItem } from '../../../item/IDesignItem.js';
-import { IDesignerCanvas } from '../IDesignerCanvas.js';
-import { IDesignerExtension } from './IDesignerExtension.js';
-import { IExtensionManager } from './IExtensionManger.js';
-export declare class HighlightElementExtensionProvider 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/HighlightElementExtensionProvider.js

@@ -1,13 +0,0 @@
-import { HighlightElementExtension } from './HighlightElementExtension.js';
-import { css } from "@node-projects/base-custom-webcomponent";
-export class HighlightElementExtensionProvider {
-    shouldExtend(extensionManager, designerView, designItem) {
-        return true;
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return new HighlightElementExtension(extensionManager, designerView, designItem);
-    }
-    style = css `
-    .svg-hover { stroke: #90caf9; fill: none; }
-  `;
-}

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

@@ -1,5 +0,0 @@
-import { IDisposable } from '../../../../interfaces/IDisposable.js';
-export interface IDesignerExtension extends IDisposable {
-    extend(event?: Event): any;
-    refresh(event?: Event): any;
-}

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

@@ -1 +0,0 @@
-export {};