@node-projects/web-component-designer 0.0.216 → 0.0.217

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

@@ -1,13 +1,13 @@
-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 class CommonPropertiesService extends AbstractPropertiesService {
-    getRefreshMode(designItem: IDesignItem): RefreshMode;
-    private commonProperties;
-    name: string;
-    isHandledElement(designItem: IDesignItem): boolean;
-    getProperty(designItem: IDesignItem, name: string): IProperty;
-    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
-}
+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 class CommonPropertiesService extends AbstractPropertiesService {
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
+    private commonProperties;
+    name: string;
+    isHandledElement(designItem: IDesignItem): boolean;
+    getProperty(designItem: IDesignItem, name: string): IProperty;
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
+}

package/dist/elements/services/propertiesService/services/CommonPropertiesService.js

@@ -1,44 +1,44 @@
-import { PropertyType } from '../PropertyType.js';
-import { AbstractPropertiesService } from './AbstractPropertiesService.js';
-import { RefreshMode } from '../IPropertiesService.js';
-export class CommonPropertiesService extends AbstractPropertiesService {
-    getRefreshMode(designItem) {
-        return RefreshMode.none;
-    }
-    //@ts-ignore
-    commonProperties = [
-        {
-            name: "id",
-            type: "string",
-            service: this,
-            propertyType: PropertyType.propertyAndAttribute
-        }, {
-            name: "class",
-            type: "string",
-            service: this,
-            attributeName: "class",
-            propertyName: "className",
-            propertyType: PropertyType.propertyAndAttribute
-        }, {
-            name: "title",
-            type: "string",
-            service: this,
-            propertyType: PropertyType.propertyAndAttribute
-        }, {
-            name: "tabindex",
-            type: "number",
-            service: this,
-            propertyType: PropertyType.propertyAndAttribute
-        }
-    ];
-    name = "common";
-    isHandledElement(designItem) {
-        return true;
-    }
-    getProperty(designItem, name) {
-        return this.commonProperties[name];
-    }
-    getProperties(designItem) {
-        return this.commonProperties;
-    }
-}
+import { PropertyType } from '../PropertyType.js';
+import { AbstractPropertiesService } from './AbstractPropertiesService.js';
+import { RefreshMode } from '../IPropertiesService.js';
+export class CommonPropertiesService extends AbstractPropertiesService {
+    getRefreshMode(designItem) {
+        return RefreshMode.none;
+    }
+    //@ts-ignore
+    commonProperties = [
+        {
+            name: "id",
+            type: "string",
+            service: this,
+            propertyType: PropertyType.propertyAndAttribute
+        }, {
+            name: "class",
+            type: "string",
+            service: this,
+            attributeName: "class",
+            propertyName: "className",
+            propertyType: PropertyType.propertyAndAttribute
+        }, {
+            name: "title",
+            type: "string",
+            service: this,
+            propertyType: PropertyType.propertyAndAttribute
+        }, {
+            name: "tabindex",
+            type: "number",
+            service: this,
+            propertyType: PropertyType.propertyAndAttribute
+        }
+    ];
+    name = "common";
+    isHandledElement(designItem) {
+        return true;
+    }
+    getProperty(designItem, name) {
+        return this.commonProperties[name];
+    }
+    getProperties(designItem) {
+        return this.commonProperties;
+    }
+}

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

@@ -1,34 +1,34 @@
-import { IProperty } from '../IProperty.js';
-import { IDesignItem } from '../../../item/IDesignItem.js';
-import { RefreshMode } from '../IPropertiesService.js';
-import { IPropertyGroup } from '../IPropertyGroup.js';
-import { IStyleDeclaration, IStyleRule } from '../../stylesheetService/IStylesheetService.js';
-import { CommonPropertiesService } from './CommonPropertiesService.js';
-import { ValueType } from '../ValueType.js';
-export declare class CssCurrentPropertiesService extends CommonPropertiesService {
-    getRefreshMode(designItem: IDesignItem): RefreshMode;
-    constructor();
-    isHandledElement(designItem: IDesignItem): boolean;
-    getProperty(designItem: IDesignItem, name: string): IProperty;
-    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
-    setValue(designItems: IDesignItem[], property: (IProperty & {
-        styleRule: IStyleRule;
-        styleDeclaration: IStyleDeclaration;
-    }), value: any): void;
-    clearValue(designItems: IDesignItem[], property: IProperty & {
-        styleRule: IStyleRule;
-        styleDeclaration: IStyleDeclaration;
-    }): void;
-    getValue(designItems: IDesignItem[], property: IProperty & {
-        styleRule: IStyleRule;
-        styleDeclaration: IStyleDeclaration;
-    }): any;
-    getUnsetValue(designItems: IDesignItem[], property: IProperty & {
-        styleRule: IStyleRule;
-        styleDeclaration: IStyleDeclaration;
-    }): any;
-    isSet(designItems: IDesignItem[], property: IProperty & {
-        styleRule: IStyleRule;
-        styleDeclaration: IStyleDeclaration;
-    }): ValueType;
-}
+import { IProperty } from '../IProperty.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { RefreshMode } from '../IPropertiesService.js';
+import { IPropertyGroup } from '../IPropertyGroup.js';
+import { IStyleDeclaration, IStyleRule } from '../../stylesheetService/IStylesheetService.js';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { ValueType } from '../ValueType.js';
+export declare class CssCurrentPropertiesService extends CommonPropertiesService {
+    getRefreshMode(designItem: IDesignItem): RefreshMode;
+    constructor();
+    isHandledElement(designItem: IDesignItem): boolean;
+    getProperty(designItem: IDesignItem, name: string): IProperty;
+    getProperties(designItem: IDesignItem): IProperty[] | IPropertyGroup[];
+    setValue(designItems: IDesignItem[], property: (IProperty & {
+        styleRule: IStyleRule;
+        styleDeclaration: IStyleDeclaration;
+    }), value: any): void;
+    clearValue(designItems: IDesignItem[], property: IProperty & {
+        styleRule: IStyleRule;
+        styleDeclaration: IStyleDeclaration;
+    }): void;
+    getValue(designItems: IDesignItem[], property: IProperty & {
+        styleRule: IStyleRule;
+        styleDeclaration: IStyleDeclaration;
+    }): any;
+    getUnsetValue(designItems: IDesignItem[], property: IProperty & {
+        styleRule: IStyleRule;
+        styleDeclaration: IStyleDeclaration;
+    }): any;
+    isSet(designItems: IDesignItem[], property: IProperty & {
+        styleRule: IStyleRule;
+        styleDeclaration: IStyleDeclaration;
+    }): ValueType;
+}

package/dist/elements/services/propertiesService/services/CssCurrentPropertiesService.js

@@ -1,103 +1,103 @@
-import { PropertyType } from '../PropertyType.js';
-import { RefreshMode } from '../IPropertiesService.js';
-import { CommonPropertiesService } from './CommonPropertiesService.js';
-import { ValueType } from '../ValueType.js';
-import { NodeType } from '../../../item/NodeType.js';
-//TODO: remove this code when import asserts are supported
-let cssProperties;
-//@ts-ignore
-if (window.importShim) {
-    const cssPropertiesUrl = import.meta.resolve('./CssProperties.json');
-    //@ts-ignore
-    cssProperties = await importShim(cssPropertiesUrl, { assert: { type: 'json' } });
-}
-else
-    //@ts-ignore
-    cssProperties = await import("./CssProperties.json", { assert: { type: 'json' } });
-const localName = '<local>';
-export class CssCurrentPropertiesService extends CommonPropertiesService {
-    getRefreshMode(designItem) {
-        return RefreshMode.fullOnValueChange;
-    }
-    constructor() {
-        super();
-        this.name = 'styles';
-    }
-    isHandledElement(designItem) {
-        return true;
-    }
-    getProperty(designItem, name) {
-        return { name: name, type: 'string', service: this, propertyType: PropertyType.cssValue };
-    }
-    getProperties(designItem) {
-        if (!designItem || designItem.nodeType != NodeType.Element)
-            return [];
-        let styles = designItem.getAllStyles();
-        let arr = styles.map(x => ({
-            name: x.selector ?? localName, description: x.stylesheetName ?? '', properties: [
-                ...x.declarations.map(y => ({
-                    name: y.name,
-                    renamable: true,
-                    type: cssProperties[y.name]?.type ?? 'string',
-                    values: cssProperties[y.name]?.values ? [...cssProperties[y.name]?.values, 'initial', 'inherit', 'unset'] : ['initial', 'inherit', 'unset'],
-                    service: this,
-                    propertyType: PropertyType.cssValue,
-                    styleRule: x,
-                    styleDeclaration: y
-                })),
-                { name: '', type: 'addNew', service: this, propertyType: PropertyType.complex, styleRule: x }
-            ]
-        }));
-        return arr;
-    }
-    setValue(designItems, property, value) {
-        // No selector means local style, styleDeclaration is null means new property
-        if (property.styleRule?.selector !== null && property.styleDeclaration) {
-            // styleDeclaration stored Propertygrid is not refreshed after entering a new value, so we need to reload
-            // TODO: we do not respect if a same style is found in a media query or another @rule, maybe we need a refresh in the stylesheet parser
-            const decls = designItems[0].instanceServiceContainer.stylesheetService?.getDeclarations(designItems[0], property.styleDeclaration.name);
-            const currentDecl = decls.find(x => x.parent.selector == property.styleDeclaration.parent.selector && x.parent.stylesheetName == property.styleDeclaration.parent.stylesheetName);
-            designItems[0].instanceServiceContainer.stylesheetService.updateDeclarationValue(currentDecl, value, false);
-            this._notifyChangedProperty(designItems[0], property, value);
-            return;
-        }
-        if (property.styleRule?.selector !== null && !property.styleDeclaration) {
-            designItems[0].instanceServiceContainer.stylesheetService.insertDeclarationIntoRule(property.styleRule, property.name, value, false);
-            this._notifyChangedProperty(designItems[0], property, value);
-            return;
-        }
-        for (const d of designItems) {
-            // Local style
-            d.setStyle(property.name, value);
-            //unkown css property names do not trigger the mutation observer of property grid, 
-            //fixed by assinging stle again to the attribute
-            d.element.setAttribute('style', d.element.getAttribute('style'));
-        }
-    }
-    clearValue(designItems, property) {
-        if (property.styleRule?.selector !== null && property.styleDeclaration) {
-            designItems[0].instanceServiceContainer.stylesheetService.removeDeclarationFromRule(property.styleRule, property.styleDeclaration.name);
-            return;
-        }
-        super.clearValue(designItems, property);
-    }
-    getValue(designItems, property) {
-        if (property.styleRule?.selector && property.styleDeclaration)
-            return property.styleDeclaration.value;
-        return super.getValue(designItems, property);
-    }
-    getUnsetValue(designItems, property) {
-        if (property.styleRule?.selector && property.styleDeclaration)
-            return property.styleDeclaration.value;
-        return super.getUnsetValue(designItems, property);
-    }
-    isSet(designItems, property) {
-        if (property.styleRule?.selector && property.styleDeclaration) {
-            if (designItems[0].hasStyle(property.name))
-                return ValueType.none;
-            //TODO: we need to check if this is the dec. with the highest specifity
-            return ValueType.all;
-        }
-        return super.isSet(designItems, property);
-    }
-}
+import { PropertyType } from '../PropertyType.js';
+import { RefreshMode } from '../IPropertiesService.js';
+import { CommonPropertiesService } from './CommonPropertiesService.js';
+import { ValueType } from '../ValueType.js';
+import { NodeType } from '../../../item/NodeType.js';
+//TODO: remove this code when import asserts are supported
+let cssProperties;
+//@ts-ignore
+if (window.importShim) {
+    const cssPropertiesUrl = import.meta.resolve('./CssProperties.json');
+    //@ts-ignore
+    cssProperties = await importShim(cssPropertiesUrl, { assert: { type: 'json' } });
+}
+else
+    //@ts-ignore
+    cssProperties = await import("./CssProperties.json", { assert: { type: 'json' } });
+const localName = '<local>';
+export class CssCurrentPropertiesService extends CommonPropertiesService {
+    getRefreshMode(designItem) {
+        return RefreshMode.fullOnValueChange;
+    }
+    constructor() {
+        super();
+        this.name = 'styles';
+    }
+    isHandledElement(designItem) {
+        return true;
+    }
+    getProperty(designItem, name) {
+        return { name: name, type: 'string', service: this, propertyType: PropertyType.cssValue };
+    }
+    getProperties(designItem) {
+        if (!designItem || designItem.nodeType != NodeType.Element)
+            return [];
+        let styles = designItem.getAllStyles();
+        let arr = styles.map(x => ({
+            name: x.selector ?? localName, description: x.stylesheetName ?? '', properties: [
+                ...x.declarations.map(y => ({
+                    name: y.name,
+                    renamable: true,
+                    type: cssProperties[y.name]?.type ?? 'string',
+                    values: cssProperties[y.name]?.values ? [...cssProperties[y.name]?.values, 'initial', 'inherit', 'unset'] : ['initial', 'inherit', 'unset'],
+                    service: this,
+                    propertyType: PropertyType.cssValue,
+                    styleRule: x,
+                    styleDeclaration: y
+                })),
+                { name: '', type: 'addNew', service: this, propertyType: PropertyType.complex, styleRule: x }
+            ]
+        }));
+        return arr;
+    }
+    setValue(designItems, property, value) {
+        // No selector means local style, styleDeclaration is null means new property
+        if (property.styleRule?.selector !== null && property.styleDeclaration) {
+            // styleDeclaration stored Propertygrid is not refreshed after entering a new value, so we need to reload
+            // TODO: we do not respect if a same style is found in a media query or another @rule, maybe we need a refresh in the stylesheet parser
+            const decls = designItems[0].instanceServiceContainer.stylesheetService?.getDeclarations(designItems[0], property.styleDeclaration.name);
+            const currentDecl = decls.find(x => x.parent.selector == property.styleDeclaration.parent.selector && x.parent.stylesheetName == property.styleDeclaration.parent.stylesheetName);
+            designItems[0].instanceServiceContainer.stylesheetService.updateDeclarationValue(currentDecl, value, false);
+            this._notifyChangedProperty(designItems[0], property, value);
+            return;
+        }
+        if (property.styleRule?.selector !== null && !property.styleDeclaration) {
+            designItems[0].instanceServiceContainer.stylesheetService.insertDeclarationIntoRule(property.styleRule, property.name, value, false);
+            this._notifyChangedProperty(designItems[0], property, value);
+            return;
+        }
+        for (const d of designItems) {
+            // Local style
+            d.setStyle(property.name, value);
+            //unkown css property names do not trigger the mutation observer of property grid, 
+            //fixed by assinging stle again to the attribute
+            d.element.setAttribute('style', d.element.getAttribute('style'));
+        }
+    }
+    clearValue(designItems, property) {
+        if (property.styleRule?.selector !== null && property.styleDeclaration) {
+            designItems[0].instanceServiceContainer.stylesheetService.removeDeclarationFromRule(property.styleRule, property.styleDeclaration.name);
+            return;
+        }
+        super.clearValue(designItems, property);
+    }
+    getValue(designItems, property) {
+        if (property.styleRule?.selector && property.styleDeclaration)
+            return property.styleDeclaration.value;
+        return super.getValue(designItems, property);
+    }
+    getUnsetValue(designItems, property) {
+        if (property.styleRule?.selector && property.styleDeclaration)
+            return property.styleDeclaration.value;
+        return super.getUnsetValue(designItems, property);
+    }
+    isSet(designItems, property) {
+        if (property.styleRule?.selector && property.styleDeclaration) {
+            if (designItems[0].hasStyle(property.name))
+                return ValueType.none;
+            //TODO: we need to check if this is the dec. with the highest specifity
+            return ValueType.all;
+        }
+        return super.isSet(designItems, property);
+    }
+}