@node-projects/web-component-designer 0.0.220 → 0.0.222

package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.d.ts

@@ -0,0 +1,11 @@
+import { InstanceServiceContainer } from '../InstanceServiceContainer.js';
+import { ServiceContainer } from '../ServiceContainer.js';
+import { IHtmlParserService } from './IHtmlParserService.js';
+import { IDesignItem } from '../../item/IDesignItem.js';
+export declare class BaseCustomWebcomponentParserService implements IHtmlParserService {
+    private htmlParser;
+    constructor(htmlParser: IHtmlParserService);
+    parse(code: string, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer, parseSnippet: boolean): Promise<IDesignItem[]>;
+    writeBack(code: string, html: string, css: string, newLineCrLf: boolean): string;
+    private parseTypescriptFile;
+}

package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.js

@@ -0,0 +1,90 @@
+function* findAllNodesOfKind(node, kind) {
+    if (node.kind == kind)
+        yield node;
+    for (const c of node.getChildren())
+        yield* findAllNodesOfKind(c, kind);
+}
+export class BaseCustomWebcomponentParserService {
+    htmlParser;
+    constructor(htmlParser) {
+        this.htmlParser = htmlParser;
+    }
+    async parse(code, serviceContainer, instanceServiceContainer, parseSnippet) {
+        const sourceFile = this.parseTypescriptFile(code);
+        let htmlCode = "";
+        let cssStyle = "";
+        //@ts-ignore
+        const nodes = findAllNodesOfKind(sourceFile, ts.SyntaxKind.TaggedTemplateExpression);
+        for (let nd of nodes) {
+            if (nd.tag.escapedText == 'html' && nd.parent.name.escapedText == "template")
+                htmlCode = nd.template.rawText;
+            if (nd.tag.escapedText == 'css' && nd.parent.name.escapedText == "style")
+                cssStyle = nd.template.rawText;
+        }
+        if (cssStyle)
+            instanceServiceContainer.stylesheetService.setStylesheets([{ name: 'css', content: cssStyle }]);
+        return this.htmlParser.parse(htmlCode, serviceContainer, instanceServiceContainer, parseSnippet);
+    }
+    writeBack(code, html, css, newLineCrLf) {
+        const sourceFile = this.parseTypescriptFile(code);
+        const transformTemplateLiterals = (context) => (rootNode) => {
+            function visit(node) {
+                //@ts-ignore
+                if (ts.isTemplateLiteral(node) &&
+                    //@ts-ignore
+                    ts.isTaggedTemplateExpression(node.parent) &&
+                    node.parent.tag.escapedText == 'html' &&
+                    node.parent.parent.name.escapedText == "template") {
+                    //@ts-ignore
+                    return ts.factory.createNoSubstitutionTemplateLiteral(html.replaceAll('\n', '\r\n'), html.replaceAll('\n', '\r\n'));
+                }
+                else if (css &&
+                    //@ts-ignore
+                    ts.isTemplateLiteral(node) &&
+                    //@ts-ignore
+                    ts.isTaggedTemplateExpression(node.parent) &&
+                    node.parent.tag.escapedText == 'css' &&
+                    node.parent.parent.name.escapedText == "style") {
+                    //@ts-ignore
+                    return ts.factory.createNoSubstitutionTemplateLiteral(css.replaceAll('\n', '\r\n'), css.replaceAll('\n', '\r\n'));
+                }
+                //@ts-ignore
+                return ts.visitEachChild(node, visit, context);
+            }
+            //@ts-ignore
+            return ts.visitNode(rootNode, visit);
+        };
+        //@ts-ignore
+        let transformed = ts.transform(sourceFile, [transformTemplateLiterals]).transformed[0];
+        //@ts-ignore
+        const printer = ts.createPrinter({ newLine: newLineCrLf ? ts.NewLineKind.CarriageReturnLineFeed : ts.NewLineKind.LineFeed });
+        //@ts-ignore
+        const result = printer.printNode(ts.EmitHint.Unspecified, transformed, transformed);
+        return result;
+    }
+    parseTypescriptFile(code) {
+        const compilerHost = {
+            fileExists: () => true,
+            getCanonicalFileName: filename => filename,
+            getCurrentDirectory: () => '',
+            getDefaultLibFileName: () => 'lib.d.ts',
+            getNewLine: () => '\n',
+            getSourceFile: filename => {
+                //@ts-ignore
+                return ts.createSourceFile(filename, code, ts.ScriptTarget.Latest, true);
+            },
+            readFile: () => null,
+            useCaseSensitiveFileNames: () => true,
+            writeFile: () => null,
+        };
+        const filename = 'aa.ts';
+        //@ts-ignore
+        const program = ts.createProgram([filename], {
+            noResolve: true,
+            //@ts-ignore
+            target: ts.ScriptTarget.Latest,
+        }, compilerHost);
+        const sourceFile = program.getSourceFile(filename);
+        return sourceFile;
+    }
+}

package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService.js

@@ -13,7 +13,8 @@ export class BaseCustomWebcomponentParserService {
         const sourceFile = this.parseTypescriptFile(code);
         let htmlCode = "";
         let cssStyle = "";
-        const nodes = findAllNodesOfKind(sourceFile, 212);
+        //@ts-ignore
+        const nodes = findAllNodesOfKind(sourceFile, ts.SyntaxKind.TaggedTemplateExpression);
         for (let nd of nodes) {
             if (nd.tag.escapedText == 'html' && nd.parent.name.escapedText == "template")
                 htmlCode = nd.template.rawText;

package/dist/elements/services/htmlParserService/NodeHtmlParserService.js

@@ -63,6 +63,8 @@ export class NodeHtmlParserService {
                     }
                 }
             }
+            if (!designItem.lockAtDesignTime && element.style)
+                element.style.pointerEvents = 'auto';
             element.draggable = false; //even if it should be true, for better designer exp.
             for (let c of item.childNodes) {
                 let di = this._createDesignItemsRecursive(c, serviceContainer, instanceServiceContainer, element instanceof SVGElement ? 'http://www.w3.org/2000/svg' : null, snippet);

package/dist/elements/services/htmlParserService/VueParserService.d.ts

@@ -0,0 +1,9 @@
+import { InstanceServiceContainer } from '../InstanceServiceContainer.js';
+import { ServiceContainer } from '../ServiceContainer.js';
+import { IHtmlParserService } from './IHtmlParserService.js';
+import { IDesignItem } from '../../item/IDesignItem.js';
+export declare class VueParserService implements IHtmlParserService {
+    private htmlParser;
+    constructor(htmlParser: IHtmlParserService);
+    parse(code: string, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer, parseSnippet: boolean): Promise<IDesignItem[]>;
+}

package/dist/elements/services/htmlParserService/VueParserService.js

@@ -0,0 +1,10 @@
+export class VueParserService {
+    htmlParser;
+    constructor(htmlParser) {
+        this.htmlParser = htmlParser;
+    }
+    async parse(code, serviceContainer, instanceServiceContainer, parseSnippet) {
+        const parsed = await this.htmlParser.parse(code, serviceContainer, instanceServiceContainer, parseSnippet);
+        return [parsed.find(x => x.name == 'template')];
+    }
+}

package/dist/elements/widgets/codeView/code-view-monaco.d.ts

@@ -11,6 +11,15 @@ export declare class CodeViewMonaco extends BaseCustomWebComponentLazyAppend imp
     elementsToPackages: Map<string, string>;
     code: string;
     onTextChanged: TypedEvent<string>;
+    language: string;
+    private _theme;
+    get theme(): string;
+    set theme(value: string);
+    static readonly properties: {
+        code: StringConstructor;
+        language: StringConstructor;
+        theme: StringConstructor;
+    };
     private _monacoEditor;
     private _editor;
     static readonly style: CSSStyleSheet;
@@ -18,6 +27,7 @@ export declare class CodeViewMonaco extends BaseCustomWebComponentLazyAppend imp
     executeCommand(command: IUiCommand): void;
     canExecuteCommand(command: IUiCommand): boolean;
     static initMonacoEditor(): Promise<void>;
+    constructor();
     ready(): Promise<void>;
     focusEditor(): void;
     activated(): void;

package/dist/elements/widgets/codeView/code-view-monaco.js

@@ -9,6 +9,21 @@ class CodeViewMonaco extends BaseCustomWebComponentLazyAppend {
     elementsToPackages;
     code;
     onTextChanged = new TypedEvent();
+    language = 'html';
+    _theme = 'webComponentDesignerTheme';
+    get theme() {
+        return this._theme;
+    }
+    set theme(value) {
+        this._theme = value;
+        //@ts-ignore
+        monaco.editor.setTheme(value);
+    }
+    static properties = {
+        code: String,
+        language: String,
+        theme: String
+    };
     //@ts-ignore
     _monacoEditor;
     _editor;
@@ -83,7 +98,12 @@ class CodeViewMonaco extends BaseCustomWebComponentLazyAppend {
             }
         });
     }
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+    }
     async ready() {
+        this._parseAttributesToProperties();
         let style;
         //@ts-ignore
         if (window.importShim)

package/dist/index.d.ts

@@ -61,6 +61,7 @@ export * from "./elements/services/htmlParserService/BaseCustomWebcomponentParse
 export * from "./elements/services/htmlParserService/DefaultHtmlParserService.js";
 export * from "./elements/services/htmlParserService/NodeHtmlParserService.js";
 export * from "./elements/services/htmlParserService/LitElementParserService.js";
+export * from "./elements/services/htmlParserService/VueParserService.js";
 export type { IHtmlParserService } from "./elements/services/htmlParserService/IHtmlParserService.js";
 export type { IIntializationService } from "./elements/services/initializationService/IIntializationService.js";
 export * from "./elements/services/instanceService/DefaultInstanceService.js";

package/dist/index.js

@@ -39,6 +39,7 @@ export * from "./elements/services/htmlParserService/BaseCustomWebcomponentParse
 export * from "./elements/services/htmlParserService/DefaultHtmlParserService.js";
 export * from "./elements/services/htmlParserService/NodeHtmlParserService.js";
 export * from "./elements/services/htmlParserService/LitElementParserService.js";
+export * from "./elements/services/htmlParserService/VueParserService.js";
 export * from "./elements/services/instanceService/DefaultInstanceService.js";
 export * from "./elements/services/manifestParsers/WebcomponentManifestParserService.js";
 export * from "./elements/services/modelCommandService/DefaultModelCommandService.js";

package/package.json

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