@node-projects/web-component-designer 0.0.96 → 0.0.97

package/dist/elements/services/ServiceContainer.d.ts

@@ -1,78 +1,80 @@
-import { IPropertiesService } from "./propertiesService/IPropertiesService";
-import { IPlacementService } from './placementService/IPlacementService';
-import { IElementsService } from './elementsService/IElementsService';
-import { IInstanceService } from './instanceService/IInstanceService';
-import { IEditorTypesService } from './propertiesService/IEditorTypesService';
-import { BaseServiceContainer } from './BaseServiceContainer';
-import { IHtmlWriterService } from './htmlWriterService/IHtmlWriterService';
-import { ICodeView } from "../widgets/codeView/ICodeView";
-import { IHtmlParserService } from "./htmlParserService/IHtmlParserService";
-import { IIntializationService } from "./initializationService/IIntializationService";
-import { IDemoView } from '../widgets/demoView/IDemoView';
-import { ITool } from "../widgets/designerView/tools/ITool";
-import { ExtensionType } from "../widgets/designerView/extensions/ExtensionType";
-import { IDesignerExtensionProvider } from "../widgets/designerView/extensions/IDesignerExtensionProvider";
-import { NamedTools } from "../widgets/designerView/tools/NamedTools";
-import { IContextMenuExtension } from "../widgets/designerView/extensions/contextMenu/IContextMenuExtension";
-import { GlobalContext } from './GlobalContext';
-import { IBindingService } from "./bindingsService/IBindingService";
-import { IElementAtPointService } from './elementAtPointService/IElementAtPointService';
-import { ISnaplinesProviderService } from "./placementService/ISnaplinesProviderService.js";
-import { IDragDropService } from './dragDropService/IDragDropService';
-import { ICopyPasteService } from "./copyPasteService/ICopyPasteService.js";
-import { IDesignerPointerExtensionProvider } from "../widgets/designerView/extensions/pointerExtensions/IDesignerPointerExtensionProvider.js";
-import { IModelCommandService } from "./modelCommandService/IModelCommandService.js";
-import { IDesignViewConfigButtonsProvider } from "../widgets/designerView/IDesignViewConfigButtonsProvider.js";
-import { IDemoProviderService } from "./demoProviderService/IDemoProviderService.js";
-import { IBindableObjectsService } from "./bindableObjectsService/IBindableObjectsService.js";
-import { IBindableObjectDragDropService } from "./bindableObjectsService/IBindableObjectDragDropService.js";
-interface ServiceNameMap {
-    "propertyService": IPropertiesService;
-    "containerService": IPlacementService;
-    "snaplinesProviderService": ISnaplinesProviderService;
-    "elementsService": IElementsService;
-    "instanceService": IInstanceService;
-    "editorTypesService": IEditorTypesService;
-    "htmlWriterService": IHtmlWriterService;
-    "htmlParserService": IHtmlParserService;
-    "intializationService": IIntializationService;
-    "bindingService": IBindingService;
-    "bindableObjectsService": IBindableObjectsService;
-    "bindableObjectDragDropService": IBindableObjectDragDropService;
-    "elementAtPointService": IElementAtPointService;
-    "dragDropService": IDragDropService;
-    "copyPasteService": ICopyPasteService;
-    "modelCommandService": IModelCommandService;
-    "demoProviderService": IDemoProviderService;
-}
-export declare class ServiceContainer extends BaseServiceContainer<ServiceNameMap> {
-    readonly config: {
-        codeViewWidget: new (...args: any[]) => ICodeView & HTMLElement;
-        demoViewWidget: new (...args: any[]) => IDemoView & HTMLElement;
-    };
-    readonly designerExtensions: Map<(ExtensionType | string), IDesignerExtensionProvider[]>;
-    removeDesignerExtensionOfType(container: (ExtensionType | string), lambda: new (...args: any[]) => IDesignerExtensionProvider): void;
-    readonly designViewConfigButtons: IDesignViewConfigButtonsProvider[];
-    readonly designerPointerExtensions: IDesignerPointerExtensionProvider[];
-    designerContextMenuExtensions: IContextMenuExtension[];
-    readonly globalContext: GlobalContext;
-    readonly designerTools: Map<string | NamedTools, ITool>;
-    get bindingService(): IBindingService;
-    get bindableObjectsServices(): IBindableObjectsService[];
-    get bindableObjectDragDropService(): IBindableObjectDragDropService;
-    get propertiesServices(): IPropertiesService[];
-    get containerServices(): IPlacementService[];
-    get snaplinesProviderService(): ISnaplinesProviderService;
-    get elementsServices(): IElementsService[];
-    get instanceServices(): IInstanceService[];
-    get editorTypesServices(): IEditorTypesService[];
-    get htmlWriterService(): IHtmlWriterService;
-    get htmlParserService(): IHtmlParserService;
-    get intializationService(): IIntializationService;
-    get elementAtPointService(): IElementAtPointService;
-    get dragDropService(): IDragDropService;
-    get copyPasteService(): ICopyPasteService;
-    get modelCommandService(): IModelCommandService;
-    get demoProviderService(): IDemoProviderService;
-}
-export {};
+import { IPropertiesService } from "./propertiesService/IPropertiesService";
+import { IPlacementService } from './placementService/IPlacementService';
+import { IElementsService } from './elementsService/IElementsService';
+import { IInstanceService } from './instanceService/IInstanceService';
+import { IEditorTypesService } from './propertiesService/IEditorTypesService';
+import { BaseServiceContainer } from './BaseServiceContainer';
+import { IHtmlWriterService } from './htmlWriterService/IHtmlWriterService';
+import { ICodeView } from "../widgets/codeView/ICodeView";
+import { IHtmlParserService } from "./htmlParserService/IHtmlParserService";
+import { IIntializationService } from "./initializationService/IIntializationService";
+import { IDemoView } from '../widgets/demoView/IDemoView';
+import { ITool } from "../widgets/designerView/tools/ITool";
+import { ExtensionType } from "../widgets/designerView/extensions/ExtensionType";
+import { IDesignerExtensionProvider } from "../widgets/designerView/extensions/IDesignerExtensionProvider";
+import { NamedTools } from "../widgets/designerView/tools/NamedTools";
+import { IContextMenuExtension } from "../widgets/designerView/extensions/contextMenu/IContextMenuExtension";
+import { GlobalContext } from './GlobalContext';
+import { IBindingService } from "./bindingsService/IBindingService";
+import { IElementAtPointService } from './elementAtPointService/IElementAtPointService';
+import { ISnaplinesProviderService } from "./placementService/ISnaplinesProviderService.js";
+import { IDragDropService } from './dragDropService/IDragDropService';
+import { ICopyPasteService } from "./copyPasteService/ICopyPasteService.js";
+import { IDesignerPointerExtensionProvider } from "../widgets/designerView/extensions/pointerExtensions/IDesignerPointerExtensionProvider.js";
+import { IModelCommandService } from "./modelCommandService/IModelCommandService.js";
+import { IDesignViewConfigButtonsProvider } from "../widgets/designerView/IDesignViewConfigButtonsProvider.js";
+import { IDemoProviderService } from "./demoProviderService/IDemoProviderService.js";
+import { IBindableObjectsService } from "./bindableObjectsService/IBindableObjectsService.js";
+import { IBindableObjectDragDropService } from "./bindableObjectsService/IBindableObjectDragDropService.js";
+import { IDesignViewToolbarButtonProvider } from "../widgets/designerView/tools/toolBar/IDesignViewToolbarButtonProvider.js";
+interface ServiceNameMap {
+    "propertyService": IPropertiesService;
+    "containerService": IPlacementService;
+    "snaplinesProviderService": ISnaplinesProviderService;
+    "elementsService": IElementsService;
+    "instanceService": IInstanceService;
+    "editorTypesService": IEditorTypesService;
+    "htmlWriterService": IHtmlWriterService;
+    "htmlParserService": IHtmlParserService;
+    "intializationService": IIntializationService;
+    "bindingService": IBindingService;
+    "bindableObjectsService": IBindableObjectsService;
+    "bindableObjectDragDropService": IBindableObjectDragDropService;
+    "elementAtPointService": IElementAtPointService;
+    "dragDropService": IDragDropService;
+    "copyPasteService": ICopyPasteService;
+    "modelCommandService": IModelCommandService;
+    "demoProviderService": IDemoProviderService;
+}
+export declare class ServiceContainer extends BaseServiceContainer<ServiceNameMap> {
+    readonly config: {
+        codeViewWidget: new (...args: any[]) => ICodeView & HTMLElement;
+        demoViewWidget: new (...args: any[]) => IDemoView & HTMLElement;
+    };
+    readonly designerExtensions: Map<(ExtensionType | string), IDesignerExtensionProvider[]>;
+    removeDesignerExtensionOfType(container: (ExtensionType | string), lambda: new (...args: any[]) => IDesignerExtensionProvider): void;
+    readonly designViewConfigButtons: IDesignViewConfigButtonsProvider[];
+    readonly designViewToolbarButtons: IDesignViewToolbarButtonProvider[];
+    readonly designerPointerExtensions: IDesignerPointerExtensionProvider[];
+    designerContextMenuExtensions: IContextMenuExtension[];
+    readonly globalContext: GlobalContext;
+    readonly designerTools: Map<string | NamedTools, ITool>;
+    get bindingService(): IBindingService;
+    get bindableObjectsServices(): IBindableObjectsService[];
+    get bindableObjectDragDropService(): IBindableObjectDragDropService;
+    get propertiesServices(): IPropertiesService[];
+    get containerServices(): IPlacementService[];
+    get snaplinesProviderService(): ISnaplinesProviderService;
+    get elementsServices(): IElementsService[];
+    get instanceServices(): IInstanceService[];
+    get editorTypesServices(): IEditorTypesService[];
+    get htmlWriterService(): IHtmlWriterService;
+    get htmlParserService(): IHtmlParserService;
+    get intializationService(): IIntializationService;
+    get elementAtPointService(): IElementAtPointService;
+    get dragDropService(): IDragDropService;
+    get copyPasteService(): ICopyPasteService;
+    get modelCommandService(): IModelCommandService;
+    get demoProviderService(): IDemoProviderService;
+}
+export {};

package/dist/elements/services/ServiceContainer.js

@@ -1,75 +1,76 @@
-import { BaseServiceContainer } from './BaseServiceContainer';
-import { CodeViewMonaco } from "../widgets/codeView/code-view-monaco";
-import { DemoView } from '../widgets/demoView/demoView';
-import { GlobalContext } from './GlobalContext';
-export class ServiceContainer extends BaseServiceContainer {
-    config = {
-        codeViewWidget: CodeViewMonaco,
-        demoViewWidget: DemoView
-    };
-    designerExtensions = new Map();
-    removeDesignerExtensionOfType(container, lambda) {
-        const extContainer = this.designerExtensions.get(container);
-        for (let i = 0; i < extContainer.length; i++) {
-            if (extContainer[i].constructor === lambda) {
-                extContainer.splice(i, 1);
-            }
-        }
-    }
-    designViewConfigButtons = [];
-    designerPointerExtensions = [];
-    designerContextMenuExtensions;
-    globalContext = new GlobalContext(this);
-    designerTools = new Map();
-    get bindingService() {
-        return this.getLastService('bindingService');
-    }
-    get bindableObjectsServices() {
-        return this.getServices('bindableObjectsService');
-    }
-    get bindableObjectDragDropService() {
-        return this.getLastService('bindableObjectDragDropService');
-    }
-    get propertiesServices() {
-        return this.getServices('propertyService');
-    }
-    get containerServices() {
-        return this.getServices('containerService');
-    }
-    get snaplinesProviderService() {
-        return this.getLastService('snaplinesProviderService');
-    }
-    get elementsServices() {
-        return this.getServices('elementsService');
-    }
-    get instanceServices() {
-        return this.getServices('instanceService');
-    }
-    get editorTypesServices() {
-        return this.getServices('editorTypesService');
-    }
-    get htmlWriterService() {
-        return this.getLastService('htmlWriterService');
-    }
-    get htmlParserService() {
-        return this.getLastService('htmlParserService');
-    }
-    get intializationService() {
-        return this.getLastService('intializationService');
-    }
-    get elementAtPointService() {
-        return this.getLastService('elementAtPointService');
-    }
-    get dragDropService() {
-        return this.getLastService('dragDropService');
-    }
-    get copyPasteService() {
-        return this.getLastService('copyPasteService');
-    }
-    get modelCommandService() {
-        return this.getLastService('modelCommandService');
-    }
-    get demoProviderService() {
-        return this.getLastService('demoProviderService');
-    }
-}
+import { BaseServiceContainer } from './BaseServiceContainer';
+import { CodeViewMonaco } from "../widgets/codeView/code-view-monaco";
+import { DemoView } from '../widgets/demoView/demoView';
+import { GlobalContext } from './GlobalContext';
+export class ServiceContainer extends BaseServiceContainer {
+    config = {
+        codeViewWidget: CodeViewMonaco,
+        demoViewWidget: DemoView
+    };
+    designerExtensions = new Map();
+    removeDesignerExtensionOfType(container, lambda) {
+        const extContainer = this.designerExtensions.get(container);
+        for (let i = 0; i < extContainer.length; i++) {
+            if (extContainer[i].constructor === lambda) {
+                extContainer.splice(i, 1);
+            }
+        }
+    }
+    designViewConfigButtons = [];
+    designViewToolbarButtons = [];
+    designerPointerExtensions = [];
+    designerContextMenuExtensions;
+    globalContext = new GlobalContext(this);
+    designerTools = new Map();
+    get bindingService() {
+        return this.getLastService('bindingService');
+    }
+    get bindableObjectsServices() {
+        return this.getServices('bindableObjectsService');
+    }
+    get bindableObjectDragDropService() {
+        return this.getLastService('bindableObjectDragDropService');
+    }
+    get propertiesServices() {
+        return this.getServices('propertyService');
+    }
+    get containerServices() {
+        return this.getServices('containerService');
+    }
+    get snaplinesProviderService() {
+        return this.getLastService('snaplinesProviderService');
+    }
+    get elementsServices() {
+        return this.getServices('elementsService');
+    }
+    get instanceServices() {
+        return this.getServices('instanceService');
+    }
+    get editorTypesServices() {
+        return this.getServices('editorTypesService');
+    }
+    get htmlWriterService() {
+        return this.getLastService('htmlWriterService');
+    }
+    get htmlParserService() {
+        return this.getLastService('htmlParserService');
+    }
+    get intializationService() {
+        return this.getLastService('intializationService');
+    }
+    get elementAtPointService() {
+        return this.getLastService('elementAtPointService');
+    }
+    get dragDropService() {
+        return this.getLastService('dragDropService');
+    }
+    get copyPasteService() {
+        return this.getLastService('copyPasteService');
+    }
+    get modelCommandService() {
+        return this.getLastService('modelCommandService');
+    }
+    get demoProviderService() {
+        return this.getLastService('demoProviderService');
+    }
+}

package/dist/elements/services/bindableObjectsService/BindableObjectType.d.ts

@@ -1,9 +1,9 @@
-export declare enum BindableObjectType {
-    undefined = "undefined",
-    folder = "folder",
-    boolean = "boolean",
-    number = "number",
-    string = "string",
-    date = "date",
-    color = "color"
-}
+export declare enum BindableObjectType {
+    undefined = "undefined",
+    folder = "folder",
+    boolean = "boolean",
+    number = "number",
+    string = "string",
+    date = "date",
+    color = "color"
+}

package/dist/elements/services/bindableObjectsService/BindableObjectType.js

@@ -1,10 +1,10 @@
-export var BindableObjectType;
-(function (BindableObjectType) {
-    BindableObjectType["undefined"] = "undefined";
-    BindableObjectType["folder"] = "folder";
-    BindableObjectType["boolean"] = "boolean";
-    BindableObjectType["number"] = "number";
-    BindableObjectType["string"] = "string";
-    BindableObjectType["date"] = "date";
-    BindableObjectType["color"] = "color";
-})(BindableObjectType || (BindableObjectType = {}));
+export var BindableObjectType;
+(function (BindableObjectType) {
+    BindableObjectType["undefined"] = "undefined";
+    BindableObjectType["folder"] = "folder";
+    BindableObjectType["boolean"] = "boolean";
+    BindableObjectType["number"] = "number";
+    BindableObjectType["string"] = "string";
+    BindableObjectType["date"] = "date";
+    BindableObjectType["color"] = "color";
+})(BindableObjectType || (BindableObjectType = {}));

package/dist/elements/services/bindableObjectsService/IBindableObject.d.ts

@@ -1,8 +1,8 @@
-import { BindableObjectType } from "./BindableObjectType";
-export interface IBindableObject<T> {
-    readonly type: BindableObjectType;
-    readonly name: string;
-    readonly fullName: string;
-    readonly children?: false | IBindableObject<T>[];
-    readonly originalObject?: T;
-}
+import { BindableObjectType } from "./BindableObjectType";
+export interface IBindableObject<T> {
+    readonly type: BindableObjectType;
+    readonly name: string;
+    readonly fullName: string;
+    readonly children?: false | IBindableObject<T>[];
+    readonly originalObject?: T;
+}

package/dist/elements/services/bindableObjectsService/IBindableObject.js

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

package/dist/elements/services/bindableObjectsService/IBindableObjectDragDropService.d.ts

@@ -1,8 +1,8 @@
-import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
-import { IBindableObject } from "./IBindableObject.js";
-export interface IBindableObjectDragDropService {
-    dragEnter(designerCanvas: IDesignerCanvas, event: DragEvent): any;
-    dragLeave(designerCanvas: IDesignerCanvas, event: DragEvent): any;
-    dragOver(designerCanvas: IDesignerCanvas, event: DragEvent): 'none' | 'copy' | 'link' | 'move';
-    drop(designerCanvas: IDesignerCanvas, event: DragEvent, bindableObject: IBindableObject<any>): any;
-}
+import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
+import { IBindableObject } from "./IBindableObject.js";
+export interface IBindableObjectDragDropService {
+    dragEnter(designerCanvas: IDesignerCanvas, event: DragEvent): any;
+    dragLeave(designerCanvas: IDesignerCanvas, event: DragEvent): any;
+    dragOver(designerCanvas: IDesignerCanvas, event: DragEvent): 'none' | 'copy' | 'link' | 'move';
+    drop(designerCanvas: IDesignerCanvas, event: DragEvent, bindableObject: IBindableObject<any>): any;
+}

package/dist/elements/services/bindableObjectsService/IBindableObjectDragDropService.js

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

package/dist/elements/services/bindableObjectsService/IBindableObjectsService.d.ts

@@ -1,6 +1,6 @@
-import { IBindableObject } from "./IBindableObject";
-export interface IBindableObjectsService {
-    readonly name: string;
-    getBindableObject(fullName: string): Promise<IBindableObject<any>>;
-    getBindableObjects(parent?: IBindableObject<any>): Promise<IBindableObject<any>[]>;
-}
+import { IBindableObject } from "./IBindableObject";
+export interface IBindableObjectsService {
+    readonly name: string;
+    getBindableObject(fullName: string): Promise<IBindableObject<any>>;
+    getBindableObjects(parent?: IBindableObject<any>): Promise<IBindableObject<any>[]>;
+}

package/dist/elements/services/bindableObjectsService/IBindableObjectsService.js

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

package/dist/elements/services/bindableObjectsService/IDragDropService.d.ts

@@ -0,0 +1,5 @@
+import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
+export interface IDragDropService {
+    dragOver(event: DragEvent): 'none' | 'copy' | 'link' | 'move';
+    drop(designerView: IDesignerCanvas, event: DragEvent): any;
+}

package/dist/elements/services/bindableObjectsService/IDragDropService.js

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

package/dist/elements/services/bindingsService/BaseCustomWebcomponentBindingsService.d.ts

@@ -1,10 +1,10 @@
-import { IDesignItem } from "../../item/IDesignItem";
-import { IBinding } from '../../item/IBinding';
-import { IBindingService } from "./IBindingService";
-import { BindingTarget } from "../../item/BindingTarget.js";
-export declare class BaseCustomWebcomponentBindingsService implements IBindingService {
-    static type: string;
-    getBindings(designItem: IDesignItem): IBinding[];
-    setBinding(designItem: IDesignItem, binding: IBinding): boolean;
-    clearBinding(designItem: IDesignItem, propertyName: string, propertyTarget: BindingTarget): boolean;
-}
+import { IDesignItem } from "../../item/IDesignItem";
+import { IBinding } from '../../item/IBinding';
+import { IBindingService } from "./IBindingService";
+import { BindingTarget } from "../../item/BindingTarget.js";
+export declare class BaseCustomWebcomponentBindingsService implements IBindingService {
+    static type: string;
+    getBindings(designItem: IDesignItem): IBinding[];
+    setBinding(designItem: IDesignItem, binding: IBinding): boolean;
+    clearBinding(designItem: IDesignItem, propertyName: string, propertyTarget: BindingTarget): boolean;
+}

package/dist/elements/services/bindingsService/BaseCustomWebcomponentBindingsService.js

@@ -1,72 +1,72 @@
-import { BindingMode } from '../../item/BindingMode';
-import { BindingTarget } from "../../item/BindingTarget.js";
-export class BaseCustomWebcomponentBindingsService {
-    static type = 'base-custom-webcomponent-binding';
-    getBindings(designItem) {
-        let bindings = null;
-        for (let a of designItem.attributes) {
-            const name = a[0];
-            const value = a[1];
-            if ((value.startsWith('[[') || value.startsWith('{{')) && (value.endsWith('}}') || value.endsWith(']]'))) {
-                if (!bindings)
-                    bindings = [];
-                let bnd = { rawName: name, rawValue: value };
-                if (a[0].startsWith('css:')) {
-                    bnd.targetName = name.substring(4);
-                    bnd.target = BindingTarget.css;
-                    bnd.expression = value.substring(2, value.length - 4);
-                }
-                else if (a[0].startsWith('class:')) {
-                    bnd.targetName = name.substring(4);
-                    bnd.target = BindingTarget.class;
-                    bnd.expression = value.substring(2, value.length - 4);
-                }
-                else if (a[0].startsWith('$')) {
-                    bnd.targetName = name.substring(1);
-                    bnd.target = BindingTarget.attribute;
-                    bnd.expression = value.substring(2, value.length - 4);
-                }
-                else if (a[0].startsWith('@')) {
-                    bnd.targetName = name.substring(1);
-                    bnd.target = BindingTarget.event;
-                    bnd.expression = value.substring(2, value.length - 4);
-                }
-                else {
-                    bnd.targetName = name;
-                    bnd.target = BindingTarget.property;
-                    bnd.expression = value.substring(2, value.length - 4);
-                }
-                bnd.type = BaseCustomWebcomponentBindingsService.type;
-                bnd.targetName = bnd.targetName;
-                bindings.push(bnd);
-            }
-        }
-        return bindings;
-    }
-    setBinding(designItem, binding) {
-        if (binding.type !== BaseCustomWebcomponentBindingsService.type)
-            return false;
-        let nm = '';
-        switch (binding.target) {
-            case BindingTarget.css:
-                nm += 'css:';
-                break;
-            case BindingTarget.class:
-                nm += 'class';
-                break;
-            case BindingTarget.attribute:
-                nm += '$';
-                break;
-            case BindingTarget.event:
-                nm += '@';
-                break;
-        }
-        nm += binding.targetName;
-        let value = (binding.mode == BindingMode.oneWay ? '[[' : '{{') + binding.expression + (binding.mode == BindingMode.oneWay ? ']]' : '}}');
-        designItem.setAttribute(nm, value);
-        return true;
-    }
-    clearBinding(designItem, propertyName, propertyTarget) {
-        return true;
-    }
-}
+import { BindingMode } from '../../item/BindingMode';
+import { BindingTarget } from "../../item/BindingTarget.js";
+export class BaseCustomWebcomponentBindingsService {
+    static type = 'base-custom-webcomponent-binding';
+    getBindings(designItem) {
+        let bindings = null;
+        for (let a of designItem.attributes) {
+            const name = a[0];
+            const value = a[1];
+            if ((value.startsWith('[[') || value.startsWith('{{')) && (value.endsWith('}}') || value.endsWith(']]'))) {
+                if (!bindings)
+                    bindings = [];
+                let bnd = { rawName: name, rawValue: value };
+                if (a[0].startsWith('css:')) {
+                    bnd.targetName = name.substring(4);
+                    bnd.target = BindingTarget.css;
+                    bnd.expression = value.substring(2, value.length - 4);
+                }
+                else if (a[0].startsWith('class:')) {
+                    bnd.targetName = name.substring(4);
+                    bnd.target = BindingTarget.class;
+                    bnd.expression = value.substring(2, value.length - 4);
+                }
+                else if (a[0].startsWith('$')) {
+                    bnd.targetName = name.substring(1);
+                    bnd.target = BindingTarget.attribute;
+                    bnd.expression = value.substring(2, value.length - 4);
+                }
+                else if (a[0].startsWith('@')) {
+                    bnd.targetName = name.substring(1);
+                    bnd.target = BindingTarget.event;
+                    bnd.expression = value.substring(2, value.length - 4);
+                }
+                else {
+                    bnd.targetName = name;
+                    bnd.target = BindingTarget.property;
+                    bnd.expression = value.substring(2, value.length - 4);
+                }
+                bnd.type = BaseCustomWebcomponentBindingsService.type;
+                bnd.targetName = bnd.targetName;
+                bindings.push(bnd);
+            }
+        }
+        return bindings;
+    }
+    setBinding(designItem, binding) {
+        if (binding.type !== BaseCustomWebcomponentBindingsService.type)
+            return false;
+        let nm = '';
+        switch (binding.target) {
+            case BindingTarget.css:
+                nm += 'css:';
+                break;
+            case BindingTarget.class:
+                nm += 'class';
+                break;
+            case BindingTarget.attribute:
+                nm += '$';
+                break;
+            case BindingTarget.event:
+                nm += '@';
+                break;
+        }
+        nm += binding.targetName;
+        let value = (binding.mode == BindingMode.oneWay ? '[[' : '{{') + binding.expression + (binding.mode == BindingMode.oneWay ? ']]' : '}}');
+        designItem.setAttribute(nm, value);
+        return true;
+    }
+    clearBinding(designItem, propertyName, propertyTarget) {
+        return true;
+    }
+}

package/dist/elements/services/bindingsService/IBindingService.d.ts

@@ -1,13 +1,13 @@
-import { IDesignItem } from "../../item/IDesignItem";
-import { IBinding } from "../../item/IBinding";
-import { BindingTarget } from "../../item/BindingTarget";
-/**
- * Can be used to parse bindings wich are done via special HTML Attributes or special Elements
- * If your Bindings are to special, or HTML is not valid with them, maybe you need to parse the Bindings already in the
- * htmlParserService
- */
-export interface IBindingService {
-    getBindings(designItem: IDesignItem): IBinding[];
-    setBinding(designItem: IDesignItem, binding: IBinding): boolean;
-    clearBinding(designItem: IDesignItem, propertyName: string, propertyTarget: BindingTarget): boolean;
-}
+import { IDesignItem } from "../../item/IDesignItem";
+import { IBinding } from "../../item/IBinding";
+import { BindingTarget } from "../../item/BindingTarget";
+/**
+ * Can be used to parse bindings wich are done via special HTML Attributes or special Elements
+ * If your Bindings are to special, or HTML is not valid with them, maybe you need to parse the Bindings already in the
+ * htmlParserService
+ */
+export interface IBindingService {
+    getBindings(designItem: IDesignItem): IBinding[];
+    setBinding(designItem: IDesignItem, binding: IBinding): boolean;
+    clearBinding(designItem: IDesignItem, propertyName: string, propertyTarget: BindingTarget): boolean;
+}

package/dist/elements/services/bindingsService/IBindingService.js

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