@node-projects/web-component-designer 0.0.283 → 0.0.285

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);

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/services/propertiesService/services/AbstractPolymerLikePropertiesService.d.ts

@@ -2,9 +2,10 @@ import { IProperty } from '../IProperty.js';
 import { IDesignItem } from '../../../item/IDesignItem.js';
 import { AbstractPropertiesService } from './AbstractPropertiesService.js';
 import { RefreshMode } from '../IPropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare abstract class AbstractPolymerLikePropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem: IDesignItem): RefreshMode;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
     protected parseProperties(list: any): IProperty[];
     getUnsetValue(designItems: IDesignItem[], property: IProperty): any;
 }

package/dist/elements/services/propertiesService/services/AttributesPropertiesService.d.ts

@@ -4,12 +4,13 @@ import { IDesignItem } from '../../../item/IDesignItem.js';
 import { ValueType } from '../ValueType.js';
 import { IBinding } from "../../../item/IBinding.js";
 import { BindingTarget } from '../../../item/BindingTarget.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare class AttributesPropertiesService implements IPropertiesService {
     name: string;
     getRefreshMode(designItem: IDesignItem): RefreshMode;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperty(designItem: IDesignItem, name: string): IProperty;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
     setValue(designItems: IDesignItem[], property: IProperty, value: any): void;
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
     clearValue(designItems: IDesignItem[], property: IProperty): void;

package/dist/elements/services/propertiesService/services/ListPropertiesService.d.ts

@@ -3,6 +3,7 @@ import { IDesignItem } from '../../../item/IDesignItem.js';
 import { IJsonPropertyDefinitions } from './IJsonPropertyDefinitions.js';
 import { AbstractPropertiesService } from './AbstractPropertiesService.js';
 import { RefreshMode } from '../IPropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare class ListPropertiesService extends AbstractPropertiesService {
     getRefreshMode(designItem: IDesignItem): RefreshMode;
     name: string;
@@ -10,5 +11,5 @@ export declare class ListPropertiesService extends AbstractPropertiesService {
     constructor(propertyDefinitions: IJsonPropertyDefinitions);
     isHandledElement(designItem: IDesignItem): boolean;
     protected _notifyChangedProperty(designItem: IDesignItem, property: IProperty, value: any): void;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
 }

package/dist/elements/services/propertiesService/services/Lit2PropertiesService.d.ts

@@ -1,9 +1,10 @@
 import { IProperty } from '../IProperty.js';
 import { IDesignItem } from '../../../item/IDesignItem.js';
 import { AbstractPolymerLikePropertiesService } from './AbstractPolymerLikePropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare class Lit2PropertiesService extends AbstractPolymerLikePropertiesService {
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
     protected _notifyChangedProperty(designItem: IDesignItem, property: IProperty, value: any): void;
 }

package/dist/elements/services/propertiesService/services/NativeElementsPropertiesService.d.ts

@@ -2,6 +2,7 @@ import { IProperty } from '../IProperty.js';
 import { IDesignItem } from '../../../item/IDesignItem.js';
 import { CommonPropertiesService } from './CommonPropertiesService.js';
 import { RefreshMode } from '../IPropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare class NativeElementsPropertiesService extends CommonPropertiesService {
     private inputProperties;
     private textareaProperties;
@@ -16,5 +17,5 @@ export declare class NativeElementsPropertiesService extends CommonPropertiesSer
     getRefreshMode(designItem: IDesignItem): RefreshMode;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperty(designItem: IDesignItem, name: string): IProperty;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
 }

package/dist/elements/services/propertiesService/services/SVGElementsPropertiesService.d.ts

@@ -1,6 +1,7 @@
 import { IProperty } from '../IProperty.js';
 import { IDesignItem } from '../../../item/IDesignItem.js';
 import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
 export declare class SVGElementsPropertiesService extends CommonPropertiesService {
     private rectProperties;
     private lineProperties;
@@ -11,5 +12,5 @@ export declare class SVGElementsPropertiesService extends CommonPropertiesServic
     name: string;
     isHandledElement(designItem: IDesignItem): boolean;
     getProperty(designItem: IDesignItem, name: string): IProperty;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
 }

package/dist/elements/services/propertiesService/services/WebcomponentManifestPropertiesService.d.ts

@@ -2,6 +2,7 @@ import { BindingTarget } from "../../../item/BindingTarget.js";
 import { IDesignItem } from "../../../item/IDesignItem.js";
 import { IPropertiesService, RefreshMode } from "../IPropertiesService.js";
 import { IProperty } from "../IProperty.js";
+import { IPropertyGroup } from "../IPropertyGroup.js";
 import { AbstractPropertiesService } from "./AbstractPropertiesService.js";
 export declare class WebcomponentManifestPropertiesService extends AbstractPropertiesService implements IPropertiesService {
     getRefreshMode(designItem: IDesignItem): RefreshMode;
@@ -12,7 +13,7 @@ export declare class WebcomponentManifestPropertiesService extends AbstractPrope
     private _parseManifest;
     private manifestClassPropertyTypeToEditorPropertyType;
     isHandledElement(designItem: IDesignItem): boolean;
-    getProperties(designItem: IDesignItem): IProperty[];
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
     getProperty(designItem: IDesignItem, name: string): IProperty;
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
     getUnsetValue(designItems: IDesignItem[], property: IProperty): any;

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.283",
+  "version": "0.0.285",
   "type": "module",
   "main": "./dist/index.js",
   "author": "",