@node-projects/web-component-designer 0.1.124 → 0.1.126

package/dist/elements/item/DesignItem.d.ts

@@ -70,7 +70,11 @@ export declare class DesignItem implements IDesignItem {
     static createDesignItemFromInstance(node: Node, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer): DesignItem;
     querySelectorAll(selectors: string): NodeListOf<HTMLElement>;
     removeDesignerAttributesAndStylesFromChildren(): void;
-    updateChildrenFromNodesChildren(): void;
+    _internalUpdateChildrenFromNodesChildren(): any[];
+    _backupWhenEditContent: any;
+    _inEditContent: boolean;
+    editContent(): void;
+    editContentFinish(): void;
     constructor(node: Node, parsedNode: any, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer);
     setView(node: Element): void;
     openGroup(title: string): ChangeGroup;

package/dist/elements/item/DesignItem.js

@@ -339,7 +339,10 @@ export class DesignItem {
             }
             node.draggable = false; //even if it should be true, for better designer exp.
         }
-        designItem.updateChildrenFromNodesChildren();
+        designItem._childArray = designItem._internalUpdateChildrenFromNodesChildren();
+        for (let c of designItem._childArray) {
+            c._parent = designItem;
+        }
         return designItem;
     }
     querySelectorAll(selectors) {
@@ -360,25 +363,44 @@ export class DesignItem {
                 e.style.pointerEvents = '';
         }
     }
-    updateChildrenFromNodesChildren() {
-        this._childArray = [];
+    _internalUpdateChildrenFromNodesChildren() {
+        const newChilds = [];
         if (this.nodeType == NodeType.Element) {
             if (this.element instanceof HTMLTemplateElement) {
                 for (const c of this.element.content.childNodes) {
                     const di = DesignItem.createDesignItemFromInstance(c, this.serviceContainer, this.instanceServiceContainer);
-                    this._childArray.push(di);
-                    di._parent = this;
+                    newChilds.push(di);
                 }
             }
             else {
                 for (const c of this.element.childNodes) {
                     const di = DesignItem.createDesignItemFromInstance(c, this.serviceContainer, this.instanceServiceContainer);
-                    this._childArray.push(di);
-                    di._parent = this;
+                    newChilds.push(di);
                 }
             }
         }
-        this._refreshIfStyleSheet();
+        return newChilds;
+    }
+    _backupWhenEditContent;
+    _inEditContent = false;
+    editContent() {
+        this._inEditContent = true;
+        this._backupWhenEditContent = [...this.element.childNodes];
+        const nn = this.element.innerHTML;
+        this.element.innerHTML = '';
+        this.element.innerHTML = nn;
+        this.element.setAttribute('contenteditable', '');
+    }
+    editContentFinish() {
+        if (this._inEditContent) {
+            this._inEditContent = false;
+            this.element.removeAttribute('contenteditable');
+            this.element.innerHTML = '';
+            for (let n of this._backupWhenEditContent) {
+                this.element.appendChild(n);
+            }
+            this._backupWhenEditContent = null;
+        }
     }
     constructor(node, parsedNode, serviceContainer, instanceServiceContainer) {
         this.node = node;

package/dist/elements/item/IDesignItem.d.ts

@@ -37,7 +37,8 @@ export interface IDesignItem {
     remove(): any;
     clearChildren(): any;
     removeDesignerAttributesAndStylesFromChildren(): any;
-    updateChildrenFromNodesChildren(): any;
+    editContent(): any;
+    editContentFinish(): any;
     readonly hasContent: boolean;
     content: string;
     innerHTML?: string;

package/dist/elements/services/designItemService/BaseCustomWebcomponentDesignItemService.d.ts

@@ -0,0 +1,8 @@
+import { IDesignItem } from "../../item/IDesignItem.js";
+import { InstanceServiceContainer } from "../InstanceServiceContainer.js";
+import { ServiceContainer } from "../ServiceContainer.js";
+import { IDesignItemService } from "./IDesignItemService.js";
+export declare class BaseCustomWebcomponentDesignItemService implements IDesignItemService {
+    createDesignItem(node: Node, parsedNode: any, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer): IDesignItem;
+    instancateNode(parent: Element, node: Node, append?: boolean): Element;
+}

package/dist/elements/services/designItemService/BaseCustomWebcomponentDesignItemService.js

@@ -0,0 +1,36 @@
+import { DesignItem } from "../../item/DesignItem.js";
+export class BaseCustomWebcomponentDesignItemService {
+    createDesignItem(node, parsedNode, serviceContainer, instanceServiceContainer) {
+        const di = new DesignItem(node, parsedNode, serviceContainer, instanceServiceContainer);
+        if (node instanceof HTMLTemplateElement) {
+            requestAnimationFrame(() => {
+                let repeatCount = 1;
+                const attr = node.getAttribute('sample-repeat-count');
+                if (attr) {
+                    repeatCount = parseInt(attr);
+                }
+                for (let n = 0; n < repeatCount; n++) {
+                    let par = node;
+                    for (const n of node.content.childNodes) {
+                        par = this.instancateNode(par, n);
+                    }
+                }
+            });
+        }
+        return di;
+    }
+    instancateNode(parent, node, append = false) {
+        const nd = node.cloneNode(false);
+        if (append)
+            parent.appendChild(nd);
+        else {
+            parent.parentNode.insertBefore(nd, parent.nextSibling);
+            //parent.insertAdjacentElement('afterend', <Element>nd);
+        }
+        DesignItem.GetDesignItem(node).setView(nd);
+        for (const n of node.childNodes) {
+            this.instancateNode(nd, n, true);
+        }
+        return nd;
+    }
+}

package/dist/elements/services/designItemService/DesignItemService copy.d.ts

@@ -0,0 +1,7 @@
+import { IDesignItem } from "../../item/IDesignItem.js";
+import { InstanceServiceContainer } from "../InstanceServiceContainer.js";
+import { ServiceContainer } from "../ServiceContainer.js";
+import { IDesignItemService } from "./IDesignItemService.js";
+export declare class DesignItemService implements IDesignItemService {
+    createDesignItem(node: Node, parsedNode: any, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer): IDesignItem;
+}

package/dist/elements/services/designItemService/DesignItemService copy.js

@@ -0,0 +1,6 @@
+import { DesignItem } from "../../item/DesignItem.js";
+export class DesignItemService {
+    createDesignItem(node, parsedNode, serviceContainer, instanceServiceContainer) {
+        return new DesignItem(node, parsedNode, serviceContainer, instanceServiceContainer);
+    }
+}

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

@@ -10,6 +10,7 @@ export declare class EditTextExtension extends AbstractExtension implements hand
     private _foreignObject;
     private _path;
     private _toolbar;
+    private _selectionChangedListener;
     constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
     extend(): void;
     refresh(): void;

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

@@ -35,6 +35,7 @@ export class EditTextExtension extends AbstractExtension {
     _foreignObject;
     _path;
     _toolbar;
+    _selectionChangedListener;
     constructor(extensionManager, designerView, extendedItem) {
         super(extensionManager, designerView, extendedItem);
     }
@@ -44,6 +45,12 @@ export class EditTextExtension extends AbstractExtension {
         this.extendedItem.instanceServiceContainer.selectionService.clearSelectedElements();
         this.extendedItem.removeDesignerAttributesAndStylesFromChildren();
         this.extendedItem.element.setAttribute('contenteditable', '');
+        //@ts-ignore
+        this.extendedItem.editContent();
+        this._selectionChangedListener = this.extendedItem.instanceServiceContainer.selectionService.onSelectionChanged.on(() => {
+            this.commitchanges();
+            this.extensionManager.removeExtensionInstance(this.extendedItem, this);
+        });
         this.extendedItem.element.focus();
         let itemRect = this.extendedItem.element.getBoundingClientRect();
         this._toolbar = this.createToolbar(EditTextExtension.template, 300, 24);
@@ -80,14 +87,16 @@ export class EditTextExtension extends AbstractExtension {
         this._path.setAttribute("d", data);
     }
     dispose() {
+        this._selectionChangedListener.dispose();
         this._removeAllOverlays();
-        this.extendedItem.element.removeAttribute('contenteditable');
+        this.extendedItem.editContentFinish();
         this.designerCanvas.clickOverlay.style.pointerEvents = 'auto';
     }
     commitchanges() {
         this._removeAllOverlays();
-        this.extendedItem.element.removeAttribute('contenteditable');
-        this.extendedItem.updateChildrenFromNodesChildren();
+        const newHTML = this.extendedItem.element.innerHTML;
+        this.extendedItem.editContentFinish();
+        this.extendedItem.innerHTML = newHTML;
         this.designerCanvas.clickOverlay.style.pointerEvents = 'auto';
     }
     handlesPointerEvent(designerCanvas, event, currentElement) {

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

@@ -2,6 +2,8 @@ import { EditTextExtension } from "./EditTextExtension.js";
 import { css } from '@node-projects/base-custom-webcomponent';
 export class EditTextExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
+        if (designItem.isRootItem)
+            return false;
         if (designItem.name === 'input')
             return false;
         return true;

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

@@ -2,7 +2,7 @@ import { ElementDragTitleExtension } from './ElementDragTitleExtension.js';
 import { css } from "@node-projects/base-custom-webcomponent";
 export class ElementDragTitleExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        return !designItem.isRootItem;
+        return !designItem.isRootItem && !(designItem.element instanceof HTMLTemplateElement);
     }
     getExtension(extensionManager, designerView, designItem) {
         return new ElementDragTitleExtension(extensionManager, designerView, designItem);

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

@@ -2,7 +2,7 @@ import { HighlightElementExtension } from './HighlightElementExtension.js';
 import { css } from "@node-projects/base-custom-webcomponent";
 export class HighlightElementExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        return true;
+        return !(designItem.element instanceof HTMLTemplateElement);
     }
     getExtension(extensionManager, designerView, designItem) {
         return new HighlightElementExtension(extensionManager, designerView, designItem);

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

@@ -2,12 +2,12 @@ import { css } from "@node-projects/base-custom-webcomponent";
 import { MultipleSelectionRectExtension as MultipleSelectionRectExtension } from './MultipleSelectionRectExtension.js';
 export class MultipleSelectionRectExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        return !designItem.isRootItem;
+        return !designItem.isRootItem && !(designItem.element instanceof HTMLTemplateElement);
     }
     getExtension(extensionManager, designerView, designItem) {
         return new MultipleSelectionRectExtension(extensionManager, designerView, designItem);
     }
-    style = css `
-    .svg-multiple-rect-selection { stroke: #909090; stroke-dasharray: 3; fill: transparent; stroke-width: 2; /*pointer-events: all;*/ }
+    style = css `
+    .svg-multiple-rect-selection { stroke: #909090; stroke-dasharray: 3; fill: transparent; stroke-width: 2; /*pointer-events: all;*/ }
   `;
 }

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

@@ -2,7 +2,7 @@ import { PositionExtension } from './PositionExtension.js';
 import { css } from "@node-projects/base-custom-webcomponent";
 export class PositionExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        if (!designItem?.parent)
+        if (!designItem?.parent || designItem.element instanceof HTMLTemplateElement)
             return false;
         const cs = getComputedStyle(designItem.element);
         if (cs.position === 'relative' || cs.position === 'absolute')

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

@@ -7,7 +7,7 @@ export class ResizeExtensionProvider {
         this.resizeAllSelected = resizeAllSelected;
     }
     shouldExtend(extensionManager, designerView, designItem) {
-        if (designItem.element instanceof SVGElement)
+        if (designItem.element instanceof SVGElement || designItem.element instanceof HTMLTemplateElement)
             return false;
         return !designItem.isRootItem && designItem.nodeType == NodeType.Element;
     }

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

@@ -2,7 +2,7 @@ import { RotateExtension } from './RotateExtension.js';
 import { css } from "@node-projects/base-custom-webcomponent";
 export class RotateExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        if (designItem.element instanceof SVGElement) {
+        if (designItem.element instanceof SVGElement || designItem.element instanceof HTMLTemplateElement) {
             return false;
         }
         return !designItem.isRootItem;

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

@@ -3,7 +3,7 @@ import { css } from "@node-projects/base-custom-webcomponent";
 import { NodeType } from '../../../item/NodeType.js';
 export class SelectionDefaultExtensionProvider {
     shouldExtend(extensionManager, designerView, designItem) {
-        return !designItem.isRootItem && designItem.nodeType != NodeType.Comment;
+        return !designItem.isRootItem && designItem.nodeType != NodeType.Comment && !(designItem.element instanceof HTMLTemplateElement);
     }
     getExtension(extensionManager, designerView, designItem) {
         return new SelectionDefaultExtension(extensionManager, designerView, designItem);

package/dist/index.d.ts

@@ -52,6 +52,7 @@ export * from "./elements/services/designItemDocumentPositionService/DesignItemD
 export type { IDesignItemDocumentPositionService } from "./elements/services/designItemDocumentPositionService/IDesignItemDocumentPositionService.js";
 export type { IConfigUiService } from "./elements/services/configUiService/IConfigUiService.js";
 export * from "./elements/services/designItemService/DesignItemService.js";
+export * from "./elements/services/designItemService/BaseCustomWebcomponentDesignItemService.js";
 export type { IDesignItemService } from "./elements/services/designItemService/IDesignItemService.js";
 export * from "./elements/services/dragDropService/ExternalDragDropService.js";
 export type { IExternalDragDropService } from "./elements/services/dragDropService/IExternalDragDropService.js";

package/dist/index.js

@@ -35,6 +35,7 @@ export * from "./elements/services/demoProviderService/IframeDemoProviderService
 export * from "./elements/services/demoProviderService/SimpleDemoProviderService.js";
 export * from "./elements/services/designItemDocumentPositionService/DesignItemDocumentPositionService.js";
 export * from "./elements/services/designItemService/DesignItemService.js";
+export * from "./elements/services/designItemService/BaseCustomWebcomponentDesignItemService.js";
 export * from "./elements/services/dragDropService/ExternalDragDropService.js";
 export * from "./elements/services/dragDropService/DragDropService.js";
 export * from "./elements/services/elementsService/JsonFileElementsService.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A WYSIWYG designer webcomponent for html components",
   "name": "@node-projects/web-component-designer",
-  "version": "0.1.124",
+  "version": "0.1.126",
   "type": "module",
   "main": "./dist/index.js",
   "author": "jochen.kuehner@gmx.de",

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

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

package/dist/elements/services/selectionService/ISelectionChangedEvent copy.js

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

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

@@ -1,9 +0,0 @@
-import { AbstractExtension } from "./AbstractExtension.js";
-import { IPoint } from "../../../../interfaces/IPoint.js";
-export declare abstract class AbstractToolbarExtension extends AbstractExtension {
-    abstract template: HTMLTemplateElement;
-    protected _toolbarContainer: SVGForeignObjectElement;
-    extend(cache: Record<string | symbol, any>, event: MouseEvent): void;
-    refresh(cache: Record<string | symbol, any>, event?: MouseEvent): void;
-    protected updateToolbarPosition(position: IPoint): void;
-}

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

@@ -1,30 +0,0 @@
-import { OverlayLayer } from "../OverlayLayer.js";
-import { AbstractExtension } from "./AbstractExtension.js";
-export class AbstractToolbarExtension extends AbstractExtension {
-    _toolbarContainer;
-    extend(cache, event) {
-        const element = this.template.content.cloneNode(true);
-        element.querySelectorAll('*').forEach(x => x.onpointerdown = (e) => {
-            this.designerCanvas.ignoreEvent(e);
-        });
-        const foreignObject = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
-        this._toolbarContainer = foreignObject;
-        foreignObject.classList.add('svg-toolbar-container');
-        foreignObject.setAttribute('width', '1');
-        foreignObject.setAttribute('height', '1');
-        foreignObject.appendChild(element);
-        this.refresh(cache, event);
-        this._addOverlay(foreignObject, OverlayLayer.Foreground);
-    }
-    refresh(cache, event) {
-        if (event) {
-            const pos = this.designerCanvas.getNormalizedEventCoordinates(event);
-            this._toolbarContainer.setAttribute('x', '' + (pos.x - 16));
-            this._toolbarContainer.setAttribute('y', '' + (pos.y - 36));
-        }
-    }
-    updateToolbarPosition(position) {
-        this._toolbarContainer.setAttribute('x', '' + position.x);
-        this._toolbarContainer.setAttribute('y', '' + position.y);
-    }
-}

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

@@ -1,20 +0,0 @@
-import { AbstractExtension, toolbarObject } from "./AbstractExtension.js";
-import { IExtensionManager } from "./IExtensionManger.js";
-import { IDesignerCanvas } from "../IDesignerCanvas.js";
-import { IDesignItem } from "../../../item/IDesignItem.js";
-export declare class BasicStackedToolbarExtension extends AbstractExtension {
-    protected static basicTemplate: string;
-    protected _toolbar: toolbarObject;
-    protected _size: {
-        width: number;
-        height: number;
-    };
-    protected _display: string;
-    protected _inline: string;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(cache: Record<string | symbol, any>, event: MouseEvent): void;
-    updateDisplayValue(): Promise<void>;
-    refresh(cache: Record<string | symbol, any>, event?: MouseEvent): void;
-    protected _addStyleButton(styleAndControlName: string): void;
-    dispose(): void;
-}

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

@@ -1,68 +0,0 @@
-import { assetsPath } from "../../../../Constants.js";
-import { AbstractExtension } from "./AbstractExtension.js";
-export class BasicStackedToolbarExtension extends AbstractExtension {
-    static basicTemplate = `
-      <node-projects-image-button-list-selector id="inline" no-value-in-header property="inline">
-        <img data-value="block" title="block" src="${assetsPath}images/display/block.svg">
-        <img data-value="inline" title="inline" src="${assetsPath}images/display/inline.svg">
-      </node-projects-image-button-list-selector>
-      <select title="display" id="displayType" style="pointer-events: all; height: 24px; width: 70px; padding: 0; font-weight: 900; text-transform: uppercase; margin-left: 5px; margin-right: 10px;">
-        <option>block</option>
-        <option>flex</option>
-        <option>grid</option>
-      </select>
-  `;
-    _toolbar;
-    _size = { width: 200, height: 30 };
-    _display;
-    _inline;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend(cache, event) {
-        const cs = getComputedStyle(this.extendedItem.element);
-        this._display = cs.display.replace('inline-', '').replace('inline', 'block');
-        this._inline = cs.display.startsWith('inline') ? 'inline' : 'block';
-        //@ts-ignore
-        this._toolbar = this.createToolbar(this.constructor.template, this._size.width, this._size.height);
-        const displayTypeEl = this._toolbar.getById('displayType');
-        displayTypeEl.value = this._display;
-        displayTypeEl.onchange = async () => {
-            this._display = displayTypeEl.value;
-            await this.updateDisplayValue();
-            this.extensionManager.reapplyAllAppliedExtentions([this.extendedItem]);
-        };
-        const inlineEl = this._toolbar.getById('inline');
-        inlineEl.value = this._inline;
-        inlineEl.addEventListener('value-changed', async () => {
-            this._inline = inlineEl.value;
-            if (this._inline && cs.position === 'absolute')
-                this.extendedItem.setStyle('position', 'static');
-            await this.updateDisplayValue();
-            this.extensionManager.reapplyAllAppliedExtentions([this.extendedItem]);
-        });
-    }
-    async updateDisplayValue() {
-        let v = (this._inline == 'inline' ? 'inline ' : '') + this._display;
-        if (v === 'inline block')
-            v = 'inline';
-        await this.extendedItem.updateStyleInSheetOrLocalAsync('display', v);
-    }
-    refresh(cache, event) {
-        if (event) {
-            const pos = this.designerCanvas.getNormalizedEventCoordinates(event);
-            this._toolbar.updatePosition({ x: (pos.x - (16 / this.designerCanvas.zoomFactor)), y: (pos.y - (44 / this.designerCanvas.zoomFactor)) });
-        }
-    }
-    _addStyleButton(styleAndControlName) {
-        const cs = getComputedStyle(this.extendedItem.element);
-        const ctl = this._toolbar.getById(styleAndControlName);
-        ctl.addEventListener('value-changed', async () => {
-            await this.extendedItem.updateStyleInSheetOrLocalAsync(styleAndControlName, ctl.value);
-        });
-        ctl.value = cs[styleAndControlName];
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,12 +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 BlockToolbarExtension extends AbstractExtension {
-    private static template;
-    private _toolbar;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(cache: Record<string | symbol, any>, event: MouseEvent): void;
-    refresh(cache: Record<string | symbol, any>, event?: MouseEvent): void;
-    dispose(): void;
-}

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

@@ -1,40 +0,0 @@
-import { html } from "@node-projects/base-custom-webcomponent";
-import { AbstractExtension } from "../AbstractExtension.js";
-import { assetsPath } from "../../../../../Constants.js";
-export class BlockToolbarExtension extends AbstractExtension {
-    static template = html `
-    <div style="height: 100%; width: 100%;">
-      <node-projects-image-button-list-selector>
-        <img data-value="block" title="block" src="${assetsPath}images/display/block.svg">
-        <img data-value="inline" title="inline" src="${assetsPath}images/display/inline.svg">
-      </node-projects-image-button-list-selector>
-      <select title="display" id="displayType" style="pointer-events: all; height: 24px; width: 70px; padding: 0; font-weight: 900; text-transform: uppercase; margin-right: 10px;">
-        <option selected>block</option>
-        <option>flex</option>
-        <option>grid</option>
-      </select>
-    </div>
-  `;
-    _toolbar;
-    constructor(extensionManager, designerView, extendedItem) {
-        super(extensionManager, designerView, extendedItem);
-    }
-    extend(cache, event) {
-        this._toolbar = this.createToolbar(BlockToolbarExtension.template, 200, 30);
-        const displayTypeEl = this._toolbar.getById('displayType');
-        displayTypeEl.onchange = () => {
-            this.extendedItem.updateStyleInSheetOrLocal('display', displayTypeEl.value);
-            this.extensionManager.reapplyAllAppliedExtentions([this.extendedItem]);
-        };
-        this.refresh(cache, event);
-    }
-    refresh(cache, event) {
-        if (event) {
-            const pos = this.designerCanvas.getNormalizedEventCoordinates(event);
-            this._toolbar.updatePosition({ x: (pos.x - (16 / this.designerCanvas.zoomFactor)), y: (pos.y - (44 / this.designerCanvas.zoomFactor)) });
-        }
-    }
-    dispose() {
-        this._removeAllOverlays();
-    }
-}

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

@@ -1,13 +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 ConditionExtensionProvider implements IDesignerExtensionProvider {
-    constructor(extensionProvider: IDesignerExtensionProvider, condition: (designItem: IDesignItem) => boolean);
-    extensionProvider: IDesignerExtensionProvider;
-    condition: (designItem: IDesignItem) => boolean;
-    style: CSSStyleSheet;
-    shouldExtend(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): boolean;
-    getExtension(extensionManager: IExtensionManager, designerView: IDesignerCanvas, designItem: IDesignItem): IDesignerExtension;
-}

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

@@ -1,18 +0,0 @@
-export class ConditionExtensionProvider {
-    constructor(extensionProvider, condition) {
-        this.extensionProvider = extensionProvider;
-        this.condition = condition;
-        this.style = extensionProvider.style;
-    }
-    extensionProvider;
-    condition;
-    style;
-    shouldExtend(extensionManager, designerView, designItem) {
-        if (!this.condition(designItem))
-            return false;
-        return this.extensionProvider.shouldExtend(extensionManager, designerView, designItem);
-    }
-    getExtension(extensionManager, designerView, designItem) {
-        return this.extensionProvider.getExtension(extensionManager, designerView, designItem);
-    }
-}

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

@@ -1,18 +0,0 @@
-import { IDesignItem } from '../../../../item/IDesignItem.js';
-import { IDesignerCanvas } from '../../IDesignerCanvas.js';
-import { AbstractExtension } from "../AbstractExtension.js";
-import { IExtensionManager } from '../IExtensionManger.js';
-export type handlesPointerEvent = {
-    handlesPointerEvent(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): boolean;
-};
-export declare class EditTextExtension extends AbstractExtension implements handlesPointerEvent {
-    private static template;
-    private _foreignObject;
-    private _path;
-    constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
-    extend(): void;
-    refresh(): void;
-    dispose(): void;
-    handlesPointerEvent(designerCanvas: IDesignerCanvas, event: PointerEvent, currentElement: Element): boolean;
-    _formatSelection(type: string, value?: string): void;
-}