@node-projects/web-component-designer 0.0.284 → 0.0.286

package/dist/elements/helper/NpmPackageLoader.js

@@ -307,7 +307,10 @@ export class NpmPackageLoader {
             if (packageJsonObj.unpkg && !mainImport)
                 mainImport = packageJsonObj.unpkg;
             if (!importMap.imports[packageJsonObj.name]) {
-                importMap.imports[packageJsonObj.name] = baseUrl + removeTrailing(mainImport, '/');
+                if (mainImport)
+                    importMap.imports[packageJsonObj.name] = baseUrl + removeTrailing(mainImport, '/');
+                else
+                    console.warn('package: ' + baseUrl + 'no main import found');
             }
             importMap.imports[packageJsonObj.name + '/'] = baseUrl;
             //@ts-ignore

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

@@ -9,6 +9,7 @@ import { IDesignerExtension } from '../widgets/designerView/extensions/IDesigner
 import { ISize } from '../../interfaces/ISize.js';
 import { IDesignerExtensionProvider } from '../widgets/designerView/extensions/IDesignerExtensionProvider.js';
 import { IStyleRule } from '../services/stylesheetService/IStylesheetService.js';
+import { TypedEvent } from '@node-projects/base-custom-webcomponent';
 import { IPlacementService } from '../services/placementService/IPlacementService.js';
 export declare class DesignItem implements IDesignItem {
     lastContainerSize: ISize;
@@ -18,6 +19,7 @@ export declare class DesignItem implements IDesignItem {
     instanceServiceContainer: InstanceServiceContainer;
     appliedDesignerExtensions: Map<ExtensionType, IDesignerExtension[]>;
     shouldAppliedDesignerExtensions: Map<ExtensionType, IDesignerExtensionProvider[]>;
+    nodeReplaced: TypedEvent<void>;
     clone(): Promise<IDesignItem>;
     allMatching(selectors: string): Generator<IDesignItem, void, undefined>;
     replaceNode(newNode: Node): void;

package/dist/elements/item/DesignItem.js

@@ -9,7 +9,7 @@ import { DomConverter } from '../widgets/designerView/DomConverter.js';
 import { DeleteAction } from '../services/undoService/transactionItems/DeleteAction.js';
 import { enableStylesheetService } from '../widgets/designerView/extensions/buttons/StylesheetServiceDesignViewConfigButtons.js';
 import { AbstractStylesheetService } from '../services/stylesheetService/AbstractStylesheetService.js';
-import { cssFromString } from '@node-projects/base-custom-webcomponent';
+import { TypedEvent, cssFromString } from '@node-projects/base-custom-webcomponent';
 const hideAtDesignTimeAttributeName = 'node-projects-hide-at-design-time';
 const hideAtRunTimeAttributeName = 'node-projects-hide-at-run-time';
 const lockAtDesignTimeAttributeName = 'node-projects-lock-at-design-time';
@@ -21,6 +21,7 @@ export class DesignItem {
     instanceServiceContainer;
     appliedDesignerExtensions = new Map();
     shouldAppliedDesignerExtensions = new Map();
+    nodeReplaced = new TypedEvent;
     async clone() {
         try {
             const html = DomConverter.ConvertToString([this], false);
@@ -46,6 +47,7 @@ export class DesignItem {
         DesignItem._designItemMap.delete(this.node);
         DesignItem._designItemMap.set(newNode, this);
         this.node = newNode;
+        this.nodeReplaced.emit();
     }
     get nodeType() {
         if (this.node instanceof Comment)

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

@@ -8,9 +8,11 @@ import { ISize } from "../../interfaces/ISize.js";
 import { IDesignerExtensionProvider } from '../widgets/designerView/extensions/IDesignerExtensionProvider.js';
 import { IStyleRule } from '../services/stylesheetService/IStylesheetService.js';
 import { IPlacementService } from '../services/placementService/IPlacementService.js';
+import { TypedEvent } from '@node-projects/base-custom-webcomponent';
 export interface IDesignItem {
     lastContainerSize: ISize;
     replaceNode(newNode: Node): any;
+    nodeReplaced: TypedEvent<void>;
     clone(): Promise<IDesignItem>;
     readonly nodeType: NodeType;
     readonly name: string;

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

@@ -9,6 +9,7 @@ export declare class PropertyGrid extends BaseCustomWebComponentLazyAppend {
     private _propertyGridPropertyLists;
     private _propertyGridPropertyListsDict;
     private _itemsObserver;
+    private _nodeReplacedCb;
     private _instanceServiceContainer;
     private _selectionChangedHandler;
     static readonly style: CSSStyleSheet;
@@ -18,5 +19,5 @@ export declare class PropertyGrid extends BaseCustomWebComponentLazyAppend {
     set instanceServiceContainer(value: InstanceServiceContainer);
     get selectedItems(): IDesignItem[];
     set selectedItems(items: IDesignItem[]);
-    private _observeItems;
+    private _observePrimarySelectionForChanges;
 }

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

@@ -9,6 +9,7 @@ export class PropertyGrid extends BaseCustomWebComponentLazyAppend {
     _propertyGridPropertyLists;
     _propertyGridPropertyListsDict;
     _itemsObserver;
+    _nodeReplacedCb;
     _instanceServiceContainer;
     _selectionChangedHandler;
     static style = css `
@@ -100,17 +101,21 @@ export class PropertyGrid extends BaseCustomWebComponentLazyAppend {
                         if (visibleDict.has(a.title))
                             a.refreshForDesignItems(items);
                     }
-                    this._observeItems();
+                    this._observePrimarySelectionForChanges();
                 }
             }
             else {
                 this._itemsObserver.disconnect();
+                this._nodeReplacedCb?.dispose();
+                this._nodeReplacedCb = null;
             }
         }
     }
-    _observeItems() {
+    _observePrimarySelectionForChanges() {
+        this._nodeReplacedCb?.dispose();
         this._itemsObserver.disconnect();
         this._itemsObserver.observe(this._selectedItems[0].element, { attributes: true, childList: false, characterData: false });
+        this._nodeReplacedCb = this._selectedItems[0].nodeReplaced.on(() => this._observePrimarySelectionForChanges());
     }
 }
 customElements.define('node-projects-property-grid', PropertyGrid);

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A UI designer for Polymer apps",
   "name": "@node-projects/web-component-designer",
-  "version": "0.0.284",
+  "version": "0.0.286",
   "type": "module",
   "main": "./dist/index.js",
   "author": "",