@htmlplus/element 0.4.3 → 0.4.5

package/compiler/plugins/visualStudioCode.js

@@ -0,0 +1,28 @@
+const defaults = {};
+export const visualStudioCode = (options) => {
+    const name = 'visualStudioCode';
+    options = Object.assign({}, defaults, options);
+    const finish = (global) => {
+        // TODO
+        // {
+        //   version: 1.1,
+        //   tags: [
+        //     {
+        //       name: context.componentKey,
+        //       description: {
+        //         kind: 'markdown',
+        //         value: description
+        //       },
+        //       attributes: properties,
+        //       references: [
+        //         {
+        //           name: 'Source code',
+        //           url: `https://github.com/htmlplus/core/tree/main/src/components/${context.directoryName}/${context.fileName}.tsx`
+        //         }
+        //       ]
+        //     }
+        //   ]
+        // };
+    };
+    return { name, finish };
+};

package/compiler/plugins/webTypes.d.ts

@@ -0,0 +1,11 @@
+import { Global } from '../../types/index.js';
+export interface WebTypesOptions {
+    destination: string;
+    packageName: string;
+    packageVersion: string;
+    docUrl: () => string;
+}
+export declare const webTypes: (options: WebTypesOptions) => {
+    name: string;
+    finish: (global: Global) => void;
+};

package/compiler/plugins/webTypes.js

@@ -0,0 +1,79 @@
+import { camelCase, paramCase } from 'change-case';
+import fs from 'fs-extra';
+import path from 'path';
+import { getTags, print } from '../utils/index.js';
+const defaults = {};
+export const webTypes = (options) => {
+    const name = 'webTypes';
+    options = Object.assign({}, defaults, options);
+    const finish = (global) => {
+        const json = {
+            '$schema': 'http://json.schemastore.org/web-types',
+            'name': options.packageName,
+            'version': options.packageVersion,
+            'description-markup': 'markdown',
+            'framework-config': {
+                'enable-when': {
+                    'node-packages': [options.packageName]
+                }
+            },
+            'contributions': {
+                html: {
+                    elements: global.contexts
+                        .sort((a, b) => ((a.componentTag || '') > (b.componentTag || '') ? 1 : -1))
+                        .map((context) => {
+                        var _a, _b;
+                        return ({
+                            'name': context.componentTag,
+                            'description': '',
+                            'doc-url': options.docUrl(),
+                            'js': {
+                                properties: [
+                                    ...(context.classProperties || []).map((property) => {
+                                        var _a, _b;
+                                        return ({
+                                            name: camelCase(property.key['name']),
+                                            description: (_a = getTags(property).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value,
+                                            value: {
+                                                type: print((_b = property.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation'])
+                                            }
+                                        });
+                                    }),
+                                    ...(context.classMethods || []).map((method) => {
+                                        var _a;
+                                        return ({
+                                            name: camelCase(method.key['name']),
+                                            description: (_a = getTags(method).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value,
+                                            value: {}
+                                        });
+                                    })
+                                ],
+                                events: (_a = context.classEvents) === null || _a === void 0 ? void 0 : _a.map((event) => {
+                                    var _a;
+                                    return ({
+                                        name: paramCase(event.key['name']),
+                                        description: (_a = getTags(event).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value
+                                    });
+                                })
+                            },
+                            'attributes': (_b = context.classProperties) === null || _b === void 0 ? void 0 : _b.map((property) => {
+                                var _a, _b;
+                                return ({
+                                    name: paramCase(property.key['name']),
+                                    description: (_a = getTags(property).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value,
+                                    value: {
+                                        type: print((_b = property.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation'])
+                                    }
+                                });
+                            })
+                        });
+                    })
+                }
+            }
+        };
+        const dirname = path.dirname(options.destination);
+        fs.ensureDirSync(dirname);
+        fs.writeJSONSync(options.destination, json, { encoding: 'utf8', spaces: 2 });
+    };
+    return { name, finish };
+};

package/compiler/utils/addDependency.d.ts

@@ -0,0 +1,2 @@
+import { File } from '@babel/types';
+export declare const addDependency: (file: File, source: string, imported: string, local?: string, isDefault?: boolean) => string;

package/compiler/utils/addDependency.js

@@ -0,0 +1,41 @@
+import t from '@babel/types';
+import { visitor } from './visitor.js';
+export const addDependency = (file, source, imported, local, isDefault) => {
+    let node;
+    visitor(file, {
+        ImportDeclaration(path) {
+            if (path.node.source.value != source)
+                return;
+            node = path.node;
+        }
+    });
+    let specifier = node === null || node === void 0 ? void 0 : node.specifiers.find((specifier) => {
+        var _a;
+        if (isDefault) {
+            return specifier.type == 'ImportDefaultSpecifier';
+        }
+        else {
+            return ((_a = specifier.imported) === null || _a === void 0 ? void 0 : _a.name) == imported;
+        }
+    });
+    if (specifier)
+        return specifier.local.name;
+    if (isDefault) {
+        specifier = t.importDefaultSpecifier(t.identifier(imported));
+    }
+    else {
+        specifier = t.importSpecifier(t.identifier(local !== null && local !== void 0 ? local : imported), t.identifier(imported));
+    }
+    if (node) {
+        if (isDefault) {
+            node.specifiers.unshift(specifier);
+        }
+        else {
+            node.specifiers.push(specifier);
+        }
+    }
+    else {
+        file.program.body.unshift(t.importDeclaration([specifier], t.stringLiteral(source)));
+    }
+    return isDefault ? imported : local !== null && local !== void 0 ? local : imported;
+};

package/compiler/utils/getType.js

@@ -1,5 +1,5 @@
 import { parse } from '@babel/parser';
-import fs from 'fs';
+import fs from 'fs-extra';
 import { dirname, resolve } from 'path';
 import { visitor } from './visitor.js';
 // TODO: return type

package/compiler/utils/index.d.ts

@@ -1,4 +1,5 @@
 export * from './__dirname.js';
+export * from './addDependency.js';
 export * from './getInitializer.js';
 export * from './getType.js';
 export * from './getTypeReference.js';

package/compiler/utils/index.js

@@ -1,4 +1,5 @@
 export * from './__dirname.js';
+export * from './addDependency.js';
 export * from './getInitializer.js';
 export * from './getType.js';
 export * from './getTypeReference.js';

package/compiler/utils/isDirectoryEmpty.js

@@ -1,4 +1,4 @@
-import fs from 'fs';
+import fs from 'fs-extra';
 export const isDirectoryEmpty = (directory) => {
     try {
         const files = fs.readdirSync(directory);

package/compiler/utils/renderTemplate.js

@@ -1,5 +1,5 @@
 import glob from 'fast-glob';
-import fs from 'fs';
+import fs from 'fs-extra';
 import handlebars from 'handlebars';
 import path from 'path';
 export const renderTemplate = (source, destination, options) => (context) => {
@@ -17,9 +17,7 @@ export const renderTemplate = (source, destination, options) => (context) => {
         const directory = path.dirname(to);
         const raw = fs.readFileSync(from, 'utf8');
         const template = handlebars.compile(raw)(context);
-        if (!fs.existsSync(directory)) {
-            fs.mkdirSync(directory, { recursive: true });
-        }
+        fs.ensureDirSync(directory);
         fs.writeFileSync(to, template, 'utf8');
     }
 };

package/constants/index.d.ts

@@ -20,3 +20,4 @@ export declare const TYPE_DATE = "date";
 export declare const TYPE_FUNCTION = "function";
 export declare const TYPE_STRING = "string";
 export declare const TYPE_NUMBER = "number";
+export declare const UTILS_STYLE_MAP = "styles";

package/constants/index.js

@@ -27,3 +27,5 @@ export const TYPE_DATE = 'date';
 export const TYPE_FUNCTION = 'function';
 export const TYPE_STRING = 'string';
 export const TYPE_NUMBER = 'number';
+// utils
+export const UTILS_STYLE_MAP = 'styles';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@htmlplus/element",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "license": "MIT",
   "author": "Masood Abdolian <m.abdolian@gmail.com>",
   "description": "Compiler of HTMLPlus",
@@ -41,7 +41,6 @@
     "fast-glob": "^3.2.11",
     "fs-extra": "^10.1.0",
     "handlebars": "^4.7.7",
-    "listr2": "^5.0.1",
     "ora": "^6.1.2",
     "typescript": "^4.7.4"
   },

package/types/context.d.ts

@@ -1,5 +1,6 @@
 import { ClassBody, ClassDeclaration, ClassMethod, ClassProperty, File } from '@babel/types';
 export interface Context {
+    assets?: string;
     customElementNames?: Array<string>;
     dependencies?: Array<Context>;
     dependenciesUnresolved?: Array<string>;

package/compiler/plugins/external.js

@@ -1,25 +0,0 @@
-import fs from 'fs-extra';
-import path from 'path';
-const defaults = {
-    source(context) {
-        return path.join(context.directoryPath, 'external');
-    },
-    destination(context) {
-        return '';
-    }
-};
-export const external = (options) => {
-    const name = 'external';
-    options = Object.assign(Object.assign({}, defaults), options);
-    const next = (context) => {
-        var _a;
-        const source = (_a = options.source) === null || _a === void 0 ? void 0 : _a.call(options, context);
-        if (!source || !fs.existsSync(source))
-            return;
-        fs.copySync(source, options.destination(context));
-    };
-    return {
-        name,
-        next
-    };
-};

package/compiler/plugins/vscode.d.ts

@@ -1,11 +0,0 @@
-import { Context } from '../../types/index.js';
-export interface VscodeOptions {
-    dist: string;
-    prefix: string;
-}
-export declare const vscode: (options: VscodeOptions) => {
-    name: string;
-    start: (global: any) => void;
-    next: (context: Context, global: any) => void;
-    finish: (global: any) => void;
-};

package/compiler/plugins/vscode.js

@@ -1,83 +0,0 @@
-import { paramCase } from 'change-case';
-import fs from 'fs';
-import path from 'path';
-import { getTags, getType, printType } from '../utils/index.js';
-export const vscode = (options) => {
-    const name = 'vscode';
-    const start = (global) => {
-        global.vscode = {
-            version: 1.1,
-            tags: []
-        };
-    };
-    const next = (context, global) => {
-        const readme = (() => {
-            try {
-                const source = path.resolve(context.directoryPath || '', `${context.fileName}.md`);
-                return fs.readFileSync(source, 'utf8');
-            }
-            catch (_a) { }
-        })();
-        const description = (() => {
-            const content = readme || '';
-            if (!content.startsWith('# '))
-                return '';
-            const sections = content.split('\n');
-            for (let i = 1; i < sections.length; i++) {
-                const section = sections[i].trim();
-                if (!section)
-                    continue;
-                return section;
-            }
-            return '';
-        })();
-        const properties = (context.classProperties || []).map((property) => {
-            var _a;
-            const name = paramCase(property.key['name']);
-            const description = (_a = getTags(property).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
-            const attribute = {
-                name,
-                description
-            };
-            // TODO
-            let { members = [] } = (() => {
-                const ast = getType(context.fileAST, (property.typeAnnotation || {})['typeAnnotation'], {
-                    directory: context.directoryPath
-                });
-                return printType(ast);
-            })();
-            // TODO
-            members = members.filter((member) => member.key !== member.type).map((member) => ({ name: member.key }));
-            if (members.length)
-                attribute.values = members;
-            return attribute;
-        });
-        global.vscode.tags.push({
-            name: context.componentKey,
-            description: {
-                kind: 'markdown',
-                value: description
-            },
-            attributes: properties,
-            references: [
-                {
-                    name: 'Source code',
-                    url: `https://github.com/htmlplus/core/tree/main/src/components/${context.directoryName}/${context.fileName}.tsx`
-                }
-            ]
-        });
-    };
-    const finish = (global) => {
-        global.vscode.tags = global.vscode.tags.sort((a, b) => (a.name > b.name ? 1 : -1));
-        // TODO
-        // fs.ensureDirSync(path.dirname(options.dist));
-        // TODO
-        // fs.writeJSONSync(options.dist, global.vscode, { replacer: null, spaces: 2 });
-    };
-    return {
-        name,
-        start,
-        next,
-        finish
-    };
-};