@node-projects/web-component-designer 0.0.84 → 0.0.88

package/dist/elements/widgets/propertyGrid/PropertyGridPropertyList.js

@@ -1,13 +1,13 @@
-import { BaseCustomWebComponentLazyAppend, css, DomHelper } from '@node-projects/base-custom-webcomponent';
-import { ContextMenuHelper } from '../../helper/contextMenu/ContextMenuHelper';
-import { ValueType } from '../../services/propertiesService/ValueType';
-export class PropertyGridPropertyList extends BaseCustomWebComponentLazyAppend {
-    _div;
-    _propertyMap = new Map();
-    _serviceContainer;
-    _propertiesService;
-    _designItems;
-    static get style() {
+import { BaseCustomWebComponentLazyAppend, css, DomHelper } from '@node-projects/base-custom-webcomponent';
+import { ContextMenuHelper } from '../../helper/contextMenu/ContextMenuHelper';
+import { ValueType } from '../../services/propertiesService/ValueType';
+export class PropertyGridPropertyList extends BaseCustomWebComponentLazyAppend {
+    _div;
+    _propertyMap = new Map();
+    _serviceContainer;
+    _propertiesService;
+    _designItems;
+    static get style() {
         return css `
     :host{
       display: block;
@@ -74,84 +74,84 @@ export class PropertyGridPropertyList extends BaseCustomWebComponentLazyAppend {
     .unset-value:focus {
       color: white
     }
-    `;
-    }
-    constructor(serviceContainer) {
-        super();
-        this._serviceContainer = serviceContainer;
-        this._div = document.createElement("div");
-        this._div.className = "content-wrapper";
-        this.shadowRoot.appendChild(this._div);
-    }
-    setPropertiesService(propertiesService) {
-        this._propertiesService = propertiesService;
-        DomHelper.removeAllChildnodes(this._div);
-        this._propertyMap.clear();
-    }
-    createElements(designItem) {
-        DomHelper.removeAllChildnodes(this._div);
-        this._propertyMap.clear();
-        if (this._propertiesService) {
-            let properties = this._propertiesService.getProperties(designItem);
-            if (properties) {
-                for (const p of properties) {
-                    let editor;
-                    if (p.createEditor)
-                        editor = p.createEditor(p);
-                    else {
-                        editor = this._serviceContainer.forSomeServicesTillResult("editorTypesService", x => x.getEditorForProperty(p));
-                    }
-                    if (editor) {
-                        let rectContainer = document.createElement("div");
-                        rectContainer.style.width = '20px';
-                        rectContainer.style.height = '20px';
-                        rectContainer.style.display = 'flex';
-                        rectContainer.style.alignItems = 'center';
-                        let rect = document.createElement("div");
-                        rect.style.width = '7px';
-                        rect.style.height = '7px';
-                        rect.style.border = '1px white solid';
-                        rectContainer.appendChild(rect);
-                        this._div.appendChild(rectContainer);
-                        ContextMenuHelper.addContextMenu(rectContainer, [
-                            { title: 'clear', action: (e) => p.service.clearValue(this._designItems, p) },
-                            { title: 'new binding', action: (e) => alert('new binding() ' + p.name) }
-                        ]);
-                        let label = document.createElement("label");
-                        label.htmlFor = p.name;
-                        label.textContent = p.name;
-                        label.title = p.name;
-                        this._div.appendChild(label);
-                        editor.element.id = p.name;
-                        this._div.appendChild(editor.element);
-                        this._propertyMap.set(p, { isSetElement: rect, editor: editor });
-                    }
-                }
-            }
-        }
-    }
-    designItemsChanged(designItems) {
-        this._designItems = designItems;
-        for (let m of this._propertyMap) {
-            m[1].editor.designItemsChanged(designItems);
-        }
-    }
-    refreshForDesignItems(items) {
-        for (let m of this._propertyMap) {
-            let s = this._propertiesService.isSet(items, m[0]);
-            let v = this._propertiesService.getValue(items, m[0]);
-            if (s == ValueType.none) {
-                m[1].isSetElement.style.background = '';
-                v = this._propertiesService.getUnsetValue(items, m[0]);
-            }
-            else if (s == ValueType.all)
-                m[1].isSetElement.style.background = 'white';
-            else if (s == ValueType.some)
-                m[1].isSetElement.style.background = 'gray';
-            else if (s == ValueType.bound)
-                m[1].isSetElement.style.background = 'orange';
-            m[1].editor.refreshValueWithoutNotification(s, v);
-        }
-    }
-}
-customElements.define('node-projects-property-grid-property-list', PropertyGridPropertyList);
+    `;
+    }
+    constructor(serviceContainer) {
+        super();
+        this._serviceContainer = serviceContainer;
+        this._div = document.createElement("div");
+        this._div.className = "content-wrapper";
+        this.shadowRoot.appendChild(this._div);
+    }
+    setPropertiesService(propertiesService) {
+        this._propertiesService = propertiesService;
+        DomHelper.removeAllChildnodes(this._div);
+        this._propertyMap.clear();
+    }
+    createElements(designItem) {
+        DomHelper.removeAllChildnodes(this._div);
+        this._propertyMap.clear();
+        if (this._propertiesService) {
+            let properties = this._propertiesService.getProperties(designItem);
+            if (properties) {
+                for (const p of properties) {
+                    let editor;
+                    if (p.createEditor)
+                        editor = p.createEditor(p);
+                    else {
+                        editor = this._serviceContainer.forSomeServicesTillResult("editorTypesService", x => x.getEditorForProperty(p));
+                    }
+                    if (editor) {
+                        let rectContainer = document.createElement("div");
+                        rectContainer.style.width = '20px';
+                        rectContainer.style.height = '20px';
+                        rectContainer.style.display = 'flex';
+                        rectContainer.style.alignItems = 'center';
+                        let rect = document.createElement("div");
+                        rect.style.width = '7px';
+                        rect.style.height = '7px';
+                        rect.style.border = '1px white solid';
+                        rectContainer.appendChild(rect);
+                        this._div.appendChild(rectContainer);
+                        ContextMenuHelper.addContextMenu(rectContainer, [
+                            { title: 'clear', action: (e) => p.service.clearValue(this._designItems, p) },
+                            { title: 'new binding', action: (e) => alert('new binding() ' + p.name) }
+                        ]);
+                        let label = document.createElement("label");
+                        label.htmlFor = p.name;
+                        label.textContent = p.name;
+                        label.title = p.name;
+                        this._div.appendChild(label);
+                        editor.element.id = p.name;
+                        this._div.appendChild(editor.element);
+                        this._propertyMap.set(p, { isSetElement: rect, editor: editor });
+                    }
+                }
+            }
+        }
+    }
+    designItemsChanged(designItems) {
+        this._designItems = designItems;
+        for (let m of this._propertyMap) {
+            m[1].editor.designItemsChanged(designItems);
+        }
+    }
+    refreshForDesignItems(items) {
+        for (let m of this._propertyMap) {
+            let s = this._propertiesService.isSet(items, m[0]);
+            let v = this._propertiesService.getValue(items, m[0]);
+            if (s == ValueType.none) {
+                m[1].isSetElement.style.background = '';
+                v = this._propertiesService.getUnsetValue(items, m[0]);
+            }
+            else if (s == ValueType.all)
+                m[1].isSetElement.style.background = 'white';
+            else if (s == ValueType.some)
+                m[1].isSetElement.style.background = 'gray';
+            else if (s == ValueType.bound)
+                m[1].isSetElement.style.background = 'orange';
+            m[1].editor.refreshValueWithoutNotification(s, v);
+        }
+    }
+}
+customElements.define('node-projects-property-grid-property-list', PropertyGridPropertyList);

package/dist/elements/widgets/propertyGrid/PropertyGridWithHeader.d.ts

@@ -1,15 +1,15 @@
-import { ServiceContainer } from '../../services/ServiceContainer';
-import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
-import { InstanceServiceContainer } from '../../services/InstanceServiceContainer';
-export declare class PropertyGridWithHeader extends BaseCustomWebComponentLazyAppend {
-    static readonly style: CSSStyleSheet;
-    static readonly template: HTMLTemplateElement;
-    private _type;
-    private _id;
-    private _pg;
-    private _selectionChangedHandler;
-    private _instanceServiceContainer;
-    constructor();
-    set serviceContainer(value: ServiceContainer);
-    set instanceServiceContainer(value: InstanceServiceContainer);
-}
+import { ServiceContainer } from '../../services/ServiceContainer';
+import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
+import { InstanceServiceContainer } from '../../services/InstanceServiceContainer';
+export declare class PropertyGridWithHeader extends BaseCustomWebComponentLazyAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    private _type;
+    private _id;
+    private _pg;
+    private _selectionChangedHandler;
+    private _instanceServiceContainer;
+    constructor();
+    set serviceContainer(value: ServiceContainer);
+    set instanceServiceContainer(value: InstanceServiceContainer);
+}

package/dist/elements/widgets/propertyGrid/PropertyGridWithHeader.js

@@ -1,6 +1,6 @@
-import { BaseCustomWebComponentLazyAppend, css, html } from '@node-projects/base-custom-webcomponent';
-import { sleep } from '../../helper/Helper.js';
-export class PropertyGridWithHeader extends BaseCustomWebComponentLazyAppend {
+import { BaseCustomWebComponentLazyAppend, css, html } from '@node-projects/base-custom-webcomponent';
+import { sleep } from '../../helper/Helper.js';
+export class PropertyGridWithHeader extends BaseCustomWebComponentLazyAppend {
     static style = css `
     :host {
       display: block;
@@ -38,53 +38,53 @@ export class PropertyGridWithHeader extends BaseCustomWebComponentLazyAppend {
     #pg {
       height: calc(100% - 45px);
     }
-    `;
+    `;
     static template = html `
   <div>
     <span class="desc">Type:</span><span id="type"></span>
     <span class="desc">Id:</span><input type="text" id="id">
   </div>
   <node-projects-property-grid id="pg"></node-projects-property-grid>
-  `;
-    _type;
-    _id;
-    _pg;
-    _selectionChangedHandler;
-    _instanceServiceContainer;
-    constructor() {
-        super();
-        this._type = this._getDomElement('type');
-        this._id = this._getDomElement('id');
-        this._pg = this._getDomElement('pg');
-        this._id.onkeydown = e => {
-            if (e.key == 'Enter')
-                this._instanceServiceContainer.selectionService.primarySelection.id = this._id.value;
-            else if (e.key == 'Escape') {
-                this._id.value = this._instanceServiceContainer.selectionService.primarySelection?.id ?? '';
-                e.preventDefault();
-                e.stopPropagation();
-            }
-        };
-        let pSel;
-        this._id.onfocus = e => {
-            pSel = this._instanceServiceContainer.selectionService.primarySelection;
-        };
-        this._id.onblur = e => {
-            pSel.id = this._id.value;
-        };
-    }
-    set serviceContainer(value) {
-        this._waitForChildrenReady().then(() => this._pg.serviceContainer = value);
-    }
-    set instanceServiceContainer(value) {
-        this._instanceServiceContainer = value;
-        this._selectionChangedHandler?.dispose();
-        this._selectionChangedHandler = this._instanceServiceContainer.selectionService.onSelectionChanged.on(async (e) => {
-            this._pg.instanceServiceContainer = value;
-            await sleep(20); // delay assignment a little bit, so onblur above could still set the value.
-            this._type.innerText = this._instanceServiceContainer.selectionService.primarySelection?.name ?? '';
-            this._id.value = this._instanceServiceContainer.selectionService.primarySelection?.id ?? '';
-        });
-    }
-}
-customElements.define('node-projects-property-grid-with-header', PropertyGridWithHeader);
+  `;
+    _type;
+    _id;
+    _pg;
+    _selectionChangedHandler;
+    _instanceServiceContainer;
+    constructor() {
+        super();
+        this._type = this._getDomElement('type');
+        this._id = this._getDomElement('id');
+        this._pg = this._getDomElement('pg');
+        this._id.onkeydown = e => {
+            if (e.key == 'Enter')
+                this._instanceServiceContainer.selectionService.primarySelection.id = this._id.value;
+            else if (e.key == 'Escape') {
+                this._id.value = this._instanceServiceContainer.selectionService.primarySelection?.id ?? '';
+                e.preventDefault();
+                e.stopPropagation();
+            }
+        };
+        let pSel;
+        this._id.onfocus = e => {
+            pSel = this._instanceServiceContainer.selectionService.primarySelection;
+        };
+        this._id.onblur = e => {
+            pSel.id = this._id.value;
+        };
+    }
+    set serviceContainer(value) {
+        this._waitForChildrenReady().then(() => this._pg.serviceContainer = value);
+    }
+    set instanceServiceContainer(value) {
+        this._instanceServiceContainer = value;
+        this._selectionChangedHandler?.dispose();
+        this._selectionChangedHandler = this._instanceServiceContainer.selectionService.onSelectionChanged.on(async (e) => {
+            this._pg.instanceServiceContainer = value;
+            await sleep(20); // delay assignment a little bit, so onblur above could still set the value.
+            this._type.innerText = this._instanceServiceContainer.selectionService.primarySelection?.name ?? '';
+            this._id.value = this._instanceServiceContainer.selectionService.primarySelection?.id ?? '';
+        });
+    }
+}
+customElements.define('node-projects-property-grid-with-header', PropertyGridWithHeader);

package/dist/elements/widgets/treeView/ITreeView.d.ts

@@ -1,6 +1,6 @@
-import { IDesignItem } from "../../item/IDesignItem";
-import { ISelectionChangedEvent } from "../../services/selectionService/ISelectionChangedEvent";
-export interface ITreeView {
-    createTree(rootItem: IDesignItem): any;
-    selectionChanged(event: ISelectionChangedEvent): any;
-}
+import { IDesignItem } from "../../item/IDesignItem";
+import { ISelectionChangedEvent } from "../../services/selectionService/ISelectionChangedEvent";
+export interface ITreeView {
+    createTree(rootItem: IDesignItem): any;
+    selectionChanged(event: ISelectionChangedEvent): any;
+}

package/dist/elements/widgets/treeView/ITreeView.js

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

package/dist/elements/widgets/treeView/treeView.d.ts

@@ -1,28 +1,28 @@
-import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
-import { ISelectionChangedEvent } from '../../services/selectionService/ISelectionChangedEvent';
-import { IDesignItem } from '../../item/IDesignItem';
-import { ITreeView } from './ITreeView';
-import { InstanceServiceContainer } from '../../services/InstanceServiceContainer.js';
-export declare class TreeView extends BaseCustomWebComponentLazyAppend implements ITreeView {
-    private _items;
-    private _index;
-    private _previouslySelected;
-    private _treeDiv;
-    private _instanceServiceContainer;
-    private _selectionChangedHandler;
-    private _contentChangedHandler;
-    private _mapElementTreeitem;
-    private _rootItem;
-    static readonly style: CSSStyleSheet;
-    constructor();
-    createTree(rootItem: IDesignItem): void;
-    set instanceServiceContainer(value: InstanceServiceContainer);
-    selectionChanged(event: ISelectionChangedEvent): void;
-    private _recomputeTree;
-    private _makeButton;
-    private _getChildren;
-    private _clickElement;
-    private _selectTreeElements;
-    private _selectDesignerElement;
-    private _highlight;
-}
+import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
+import { ISelectionChangedEvent } from '../../services/selectionService/ISelectionChangedEvent';
+import { IDesignItem } from '../../item/IDesignItem';
+import { ITreeView } from './ITreeView';
+import { InstanceServiceContainer } from '../../services/InstanceServiceContainer.js';
+export declare class TreeView extends BaseCustomWebComponentLazyAppend implements ITreeView {
+    private _items;
+    private _index;
+    private _previouslySelected;
+    private _treeDiv;
+    private _instanceServiceContainer;
+    private _selectionChangedHandler;
+    private _contentChangedHandler;
+    private _mapElementTreeitem;
+    private _rootItem;
+    static readonly style: CSSStyleSheet;
+    constructor();
+    createTree(rootItem: IDesignItem): void;
+    set instanceServiceContainer(value: InstanceServiceContainer);
+    selectionChanged(event: ISelectionChangedEvent): void;
+    private _recomputeTree;
+    private _makeButton;
+    private _getChildren;
+    private _clickElement;
+    private _selectTreeElements;
+    private _selectDesignerElement;
+    private _highlight;
+}