@htmlplus/element 0.4.3 → 0.4.5

package/compiler/plugins/document.js

@@ -1,254 +1,247 @@
 import { capitalCase, paramCase } from 'change-case';
-import fs from 'fs';
+import fs from 'fs-extra';
 import glob from 'glob';
 import path from 'path';
 import { getInitializer, getTag, getTags, getTypeReference, hasTag, parseTag, print } from '../utils/index.js';
+const defaults = {};
 export const document = (options) => {
     const name = 'document';
-    const start = (global) => {
-        global.document = {
+    options = Object.assign({}, defaults, options);
+    const finish = (global) => {
+        var _a;
+        const json = {
             components: []
         };
-    };
-    const next = (context, global) => {
-        var _a;
-        const events = context.classEvents.map((event) => {
-            var _a, _b, _c;
-            const isCancelable = (() => {
-                if (!event.decorators)
-                    return false;
-                try {
-                    for (const decorator of event.decorators) {
-                        for (const argument of decorator.expression['arguments']) {
-                            for (const property of argument.properties) {
-                                if (property.key.name != 'cancelable')
-                                    continue;
-                                if (property.value.type != 'BooleanLiteral')
-                                    continue;
-                                if (!property.value.value)
-                                    continue;
-                                return true;
+        for (const context of global.contexts) {
+            const events = context.classEvents.map((event) => {
+                var _a, _b, _c;
+                const isCancelable = (() => {
+                    if (!event.decorators)
+                        return false;
+                    try {
+                        for (const decorator of event.decorators) {
+                            for (const argument of decorator.expression['arguments']) {
+                                for (const property of argument.properties) {
+                                    if (property.key.name != 'cancelable')
+                                        continue;
+                                    if (property.value.type != 'BooleanLiteral')
+                                        continue;
+                                    if (!property.value.value)
+                                        continue;
+                                    return true;
+                                }
                             }
                         }
                     }
-                }
-                catch (_a) { }
-                return false;
-            })();
-            const description = (_a = getTags(event).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
-            const detail = print((_b = event.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation']);
-            const detailReference = getTypeReference(context.fileAST, (_c = event.typeAnnotation) === null || _c === void 0 ? void 0 : _c['typeAnnotation'].typeParameters.params[0]);
-            const isExperimental = hasTag(event, 'experimental');
-            const isModel = hasTag(event, 'model');
-            const name = event.key['name'];
-            const tags = getTags(event);
-            return {
-                description,
-                detail,
-                detailReference,
-                isCancelable,
-                isExperimental,
-                isModel,
-                name,
-                tags
-            };
-        });
-        const group = (_a = getTag(context.class, 'group')) === null || _a === void 0 ? void 0 : _a.value;
-        const isDeprecated = hasTag(context.class, 'deprecated');
-        const isExperimental = hasTag(context.class, 'experimental');
-        const lastModified = glob
-            .sync(path.join(context.directoryPath, '**/*.*'))
-            .map((file) => fs.statSync(file).mtime)
-            .sort((a, b) => (a > b ? 1 : -1))
-            .pop();
-        const methods = context.classMethods.map((method) => {
-            var _a, _b, _c;
-            const description = (_a = getTags(method).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
-            const isAsync = method.async;
-            const isDeprecated = hasTag(method, 'deprecated');
-            const isExperimental = hasTag(method, 'experimental');
-            const name = method.key['name'];
-            const returns = print((_b = method.returnType) === null || _b === void 0 ? void 0 : _b['typeAnnotation']) || 'void';
-            const returnsReference = getTypeReference(context.fileAST, (_c = method.returnType) === null || _c === void 0 ? void 0 : _c['typeAnnotation']);
-            const tags = getTags(method);
-            // TODO
-            const parameters = method.params.map((param) => {
+                    catch (_a) { }
+                    return false;
+                })();
+                const description = (_a = getTags(event).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
+                const detail = print((_b = event.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation']);
+                const detailReference = getTypeReference(context.fileAST, (_c = event.typeAnnotation) === null || _c === void 0 ? void 0 : _c['typeAnnotation'].typeParameters.params[0]);
+                const isExperimental = hasTag(event, 'experimental');
+                const isModel = hasTag(event, 'model');
+                const name = event.key['name'];
+                const tags = getTags(event);
+                return {
+                    description,
+                    detail,
+                    detailReference,
+                    isCancelable,
+                    isExperimental,
+                    isModel,
+                    name,
+                    tags
+                };
+            });
+            const group = (_a = getTag(context.class, 'group')) === null || _a === void 0 ? void 0 : _a.value;
+            const isDeprecated = hasTag(context.class, 'deprecated');
+            const isExperimental = hasTag(context.class, 'experimental');
+            const lastModified = glob
+                .sync(path.join(context.directoryPath, '**/*.*'))
+                .map((file) => fs.statSync(file).mtime)
+                .sort((a, b) => (a > b ? 1 : -1))
+                .pop();
+            const methods = context.classMethods.map((method) => {
                 var _a, _b, _c;
-                return ({
-                    description: (_a = getTags(method, 'param')
-                        .map((tag) => parseTag(tag, ' '))
-                        .find((tag) => tag.name == param['name'])) === null || _a === void 0 ? void 0 : _a.description,
-                    isOptional: !!param['optional'],
-                    name: param['name'],
-                    type: print((_b = param === null || param === void 0 ? void 0 : param['typeAnnotation']) === null || _b === void 0 ? void 0 : _b.typeAnnotation) || undefined,
-                    typeReference: getTypeReference(context.fileAST, (_c = param === null || param === void 0 ? void 0 : param['typeAnnotation']) === null || _c === void 0 ? void 0 : _c.typeAnnotation)
+                const description = (_a = getTags(method).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
+                const isAsync = method.async;
+                const isDeprecated = hasTag(method, 'deprecated');
+                const isExperimental = hasTag(method, 'experimental');
+                const name = method.key['name'];
+                const returns = print((_b = method.returnType) === null || _b === void 0 ? void 0 : _b['typeAnnotation']) || 'void';
+                const returnsReference = getTypeReference(context.fileAST, (_c = method.returnType) === null || _c === void 0 ? void 0 : _c['typeAnnotation']);
+                const tags = getTags(method);
+                // TODO
+                const parameters = method.params.map((param) => {
+                    var _a, _b, _c;
+                    return ({
+                        description: (_a = getTags(method, 'param')
+                            .map((tag) => parseTag(tag, ' '))
+                            .find((tag) => tag.name == param['name'])) === null || _a === void 0 ? void 0 : _a.description,
+                        isOptional: !!param['optional'],
+                        name: param['name'],
+                        type: print((_b = param === null || param === void 0 ? void 0 : param['typeAnnotation']) === null || _b === void 0 ? void 0 : _b.typeAnnotation) || undefined,
+                        typeReference: getTypeReference(context.fileAST, (_c = param === null || param === void 0 ? void 0 : param['typeAnnotation']) === null || _c === void 0 ? void 0 : _c.typeAnnotation)
+                    });
                 });
+                const signature = [
+                    method.key['name'],
+                    '(',
+                    parameters
+                        .map((parameter) => {
+                        var _a;
+                        let string = '';
+                        string += parameter.name;
+                        string += parameter.isOptional ? '?' : '';
+                        string += parameter.type ? ': ' : '';
+                        string += (_a = parameter.type) !== null && _a !== void 0 ? _a : '';
+                        return string;
+                    })
+                        .join(', '),
+                    ')',
+                    ' => ',
+                    returns
+                ].join('');
+                return {
+                    description,
+                    isAsync,
+                    isDeprecated,
+                    isExperimental,
+                    name,
+                    returns,
+                    returnsReference,
+                    tags,
+                    parameters,
+                    signature
+                };
             });
-            const signature = [
-                method.key['name'],
-                '(',
-                parameters
-                    .map((parameter) => {
-                    var _a;
-                    let string = '';
-                    string += parameter.name;
-                    string += parameter.isOptional ? '?' : '';
-                    string += parameter.type ? ': ' : '';
-                    string += (_a = parameter.type) !== null && _a !== void 0 ? _a : '';
-                    return string;
-                })
-                    .join(', '),
-                ')',
-                ' => ',
-                returns
-            ].join('');
-            return {
-                description,
-                isAsync,
-                isDeprecated,
-                isExperimental,
-                name,
-                returns,
-                returnsReference,
-                tags,
-                parameters,
-                signature
-            };
-        });
-        const parts = getTags(context.class, 'part').map((tag) => parseTag(tag));
-        const properties = context.classProperties.map((property) => {
-            var _a, _b, _c;
-            const attribute = paramCase(property.key['name']);
-            const description = (_a = getTags(property).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
-            // TODO
-            const hasReflect = (() => {
-                if (!property.decorators)
-                    return false;
-                try {
-                    for (const decorator of property.decorators) {
-                        for (const argument of decorator.expression['arguments']) {
-                            for (const property of argument.properties) {
-                                if (property.key.name != 'reflect')
-                                    continue;
-                                if (property.value.type != 'BooleanLiteral')
-                                    continue;
-                                if (!property.value.value)
-                                    continue;
-                                return true;
+            const parts = getTags(context.class, 'part').map((tag) => parseTag(tag));
+            const properties = context.classProperties.map((property) => {
+                var _a, _b, _c;
+                const attribute = paramCase(property.key['name']);
+                const description = (_a = getTags(property).find((tag) => !tag.key)) === null || _a === void 0 ? void 0 : _a.value;
+                // TODO
+                const hasReflect = (() => {
+                    if (!property.decorators)
+                        return false;
+                    try {
+                        for (const decorator of property.decorators) {
+                            for (const argument of decorator.expression['arguments']) {
+                                for (const property of argument.properties) {
+                                    if (property.key.name != 'reflect')
+                                        continue;
+                                    if (property.value.type != 'BooleanLiteral')
+                                        continue;
+                                    if (!property.value.value)
+                                        continue;
+                                    return true;
+                                }
                             }
                         }
                     }
+                    catch (_a) { }
+                    return false;
+                })();
+                // TODO
+                const initializer = getInitializer(property.value);
+                const isDeprecated = hasTag(property, 'deprecated');
+                const isExperimental = hasTag(property, 'experimental');
+                const isModel = hasTag(property, 'model');
+                const isRequired = !property.optional;
+                const name = property.key['name'];
+                const tags = getTags(property);
+                const type = print((_b = property.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation']);
+                const typeReference = getTypeReference(context.fileAST, (_c = property.typeAnnotation) === null || _c === void 0 ? void 0 : _c['typeAnnotation']);
+                return {
+                    attribute,
+                    description,
+                    hasReflect,
+                    initializer,
+                    isDeprecated,
+                    isExperimental,
+                    isModel,
+                    isRequired,
+                    name,
+                    tags,
+                    type,
+                    typeReference
+                };
+            });
+            const readme = (() => {
+                try {
+                    const source = path.join(context.directoryPath, `${context.fileName}.md`);
+                    return fs.readFileSync(source, 'utf8');
                 }
                 catch (_a) { }
-                return false;
             })();
+            const readmeDescription = (() => {
+                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 slots = getTags(context.class, 'slot').map((tag) => parseTag(tag));
             // TODO
-            const initializer = getInitializer(property.value);
-            const isDeprecated = hasTag(property, 'deprecated');
-            const isExperimental = hasTag(property, 'experimental');
-            const isModel = hasTag(property, 'model');
-            const isRequired = !property.optional;
-            const name = property.key['name'];
-            const tags = getTags(property);
-            const type = print((_b = property.typeAnnotation) === null || _b === void 0 ? void 0 : _b['typeAnnotation']);
-            const typeReference = getTypeReference(context.fileAST, (_c = property.typeAnnotation) === null || _c === void 0 ? void 0 : _c['typeAnnotation']);
-            return {
-                attribute,
-                description,
-                hasReflect,
-                initializer,
+            const styles = (() => {
+                if (!context.stylePath)
+                    return [];
+                return fs
+                    .readFileSync(context.stylePath, 'utf8')
+                    .split('@prop')
+                    .slice(1)
+                    .map((section) => {
+                    var _a;
+                    let [description, name] = section.split(/\n/);
+                    name = name.split(':').slice(0, -1).join(':').trim();
+                    description = description.trim();
+                    let [initializer] = ((_a = context.styleParsed) === null || _a === void 0 ? void 0 : _a.split(name).slice(1, 2)) || [];
+                    if (initializer)
+                        initializer = initializer.split(/;|}/)[0].replace(':', '').trim();
+                    return {
+                        description,
+                        initializer,
+                        name
+                    };
+                });
+            })();
+            const tag = context.componentTag;
+            const tags = getTags(context.class);
+            const title = capitalCase(context.componentKey);
+            json.components.push({
+                // TODO
+                // main
+                // development
+                // source
+                events,
+                group,
                 isDeprecated,
                 isExperimental,
-                isModel,
-                isRequired,
-                name,
+                key: context.componentKey,
+                lastModified,
+                methods,
+                parts,
+                properties,
+                readme,
+                readmeDescription,
+                slots,
+                styles,
+                tag,
                 tags,
-                type,
-                typeReference
-            };
-        });
-        const readme = (() => {
-            try {
-                const source = path.join(context.directoryPath, `${context.fileName}.md`);
-                return fs.readFileSync(source, 'utf8');
-            }
-            catch (_a) { }
-        })();
-        const readmeDescription = (() => {
-            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 slots = getTags(context.class, 'slot').map((tag) => parseTag(tag));
-        // TODO
-        const styles = (() => {
-            if (!context.stylePath)
-                return [];
-            return fs
-                .readFileSync(context.stylePath, 'utf8')
-                .split('@prop')
-                .slice(1)
-                .map((section) => {
-                var _a;
-                let [description, name] = section.split(/\n/);
-                name = name.split(':').slice(0, -1).join(':').trim();
-                description = description.trim();
-                let [initializer] = ((_a = context.styleParsed) === null || _a === void 0 ? void 0 : _a.split(name).slice(1, 2)) || [];
-                if (initializer)
-                    initializer = initializer.split(/;|}/)[0].replace(':', '').trim();
-                return {
-                    description,
-                    initializer,
-                    name
-                };
+                title
             });
-        })();
-        const tag = context.componentTag;
-        const tags = getTags(context.class);
-        const title = capitalCase(context.componentKey);
-        global.document.components.push({
-            // TODO
-            // main
-            // development
-            // source
-            events,
-            group,
-            isDeprecated,
-            isExperimental,
-            key: context.componentKey,
-            lastModified,
-            methods,
-            parts,
-            properties,
-            readme,
-            readmeDescription,
-            slots,
-            styles,
-            tag,
-            tags,
-            title
-        });
-    };
-    const finish = (global) => {
+        }
+        json.components = json.components.sort((a, b) => (a.title > b.title ? 1 : -1));
         const dirname = path.dirname(options.destination);
-        global.document.components = global.document.components.sort((a, b) => (a.title > b.title ? 1 : -1));
-        if (!fs.existsSync(dirname))
-            fs.mkdirSync(dirname, { recursive: true });
-        JSON.stringify(global.document, null, 2);
-        fs.writeFileSync(options.destination, JSON.stringify(global.document, null, 2), 'utf8');
-    };
-    return {
-        name,
-        start,
-        next,
-        finish
+        fs.ensureDirSync(dirname);
+        fs.writeJSONSync(options.destination, json, { encoding: 'utf8', spaces: 2 });
     };
+    return { name, finish };
 };

package/compiler/plugins/extract.js

@@ -3,8 +3,10 @@ import { pascalCase, paramCase } from 'change-case';
 import path from 'path';
 import * as CONSTANTS from '../../constants/index.js';
 import { hasDecorator, visitor } from '../utils/index.js';
+const defaults = {};
 export const extract = (options) => {
     const name = 'extract';
+    options = Object.assign({}, defaults, options);
     const next = (context) => {
         var _a, _b;
         visitor(context.fileAST, {
@@ -44,8 +46,10 @@ export const extract = (options) => {
                     return;
                 (_a = context.customElementNames) !== null && _a !== void 0 ? _a : (context.customElementNames = []);
                 context.customElementNames.push(name);
-                context.customElementNames = context.customElementNames.filter((item, index, items) => items.indexOf(item) === index).sort();
-            },
+                context.customElementNames = context.customElementNames
+                    .filter((item, index, items) => items.indexOf(item) === index)
+                    .sort();
+            }
         });
         context.directoryPath = path.dirname(context.filePath);
         context.directoryName = path.basename(context.directoryPath);
@@ -65,8 +69,5 @@ export const extract = (options) => {
         context.classHasUnmount = (context.classMembers || []).some((member) => member['key'].name == CONSTANTS.LIFECYCLE_DISCONNECTED);
         context.classRender = (context.classMembers || []).find((member) => member['key'].name == CONSTANTS.METHOD_RENDER);
     };
-    return {
-        name,
-        next
-    };
+    return { name, next };
 };

package/compiler/plugins/index.d.ts

@@ -1,9 +1,10 @@
+export * from './assets.js';
 export * from './customElementReact/index.js';
 export * from './customElement.js';
 export * from './document.js';
-export * from './external.js';
 export * from './extract.js';
 export * from './parse.js';
 export * from './read.js';
 export * from './style.js';
 export * from './validate.js';
+export * from './webTypes.js';

package/compiler/plugins/index.js

@@ -1,9 +1,10 @@
+export * from './assets.js';
 export * from './customElementReact/index.js';
 export * from './customElement.js';
 export * from './document.js';
-export * from './external.js';
 export * from './extract.js';
 export * from './parse.js';
 export * from './read.js';
 export * from './style.js';
 export * from './validate.js';
+export * from './webTypes.js';

package/compiler/plugins/parse.js

@@ -9,8 +9,5 @@ export const parse = () => {
             plugins: ['jsx', 'typescript', 'decorators-legacy']
         });
     };
-    return {
-        name,
-        next
-    };
+    return { name, next };
 };

package/compiler/plugins/read.js

@@ -1,13 +1,9 @@
-import fs from 'fs';
+import fs from 'fs-extra';
 export const read = () => {
     const name = 'read';
     const next = (context) => {
-        if (!!context.fileContent)
-            return;
-        context.fileContent = fs.readFileSync(context.filePath, 'utf8');
-    };
-    return {
-        name,
-        next
+        var _a;
+        context.fileContent = (_a = context.fileContent) !== null && _a !== void 0 ? _a : fs.readFileSync(context.filePath, 'utf8');
     };
+    return { name, next };
 };

package/compiler/plugins/style.d.ts

@@ -1,8 +1,6 @@
 import { Context } from '../../types/index.js';
 export declare type StyleOptions = {
-    extensions?: Array<string>;
-    directory?: (context: Context) => string;
-    filename?: (context: Context) => string;
+    references?: (context: Context) => string[];
 };
 export declare const style: (options: StyleOptions) => {
     name: string;

package/compiler/plugins/style.js

@@ -1,36 +1,34 @@
 import t from '@babel/types';
-import fs from 'fs';
+import fs from 'fs-extra';
 import path from 'path';
 import * as CONSTANTS from '../../constants/index.js';
+import { addDependency } from '../utils/index.js';
 const defaults = {
-    extensions: ['scss', 'css'],
-    directory(context) {
-        return context.directoryPath;
-    },
-    filename(context) {
-        return context.fileName;
+    references(context) {
+        return [
+            path.join(context.directoryPath, `${context.fileName}.css`),
+            path.join(context.directoryPath, `${context.fileName}.less`),
+            path.join(context.directoryPath, `${context.fileName}.sass`),
+            path.join(context.directoryPath, `${context.fileName}.scss`),
+            path.join(context.directoryPath, `${context.fileName}.styl`)
+        ];
     }
 };
 export const style = (options) => {
     const name = 'style';
-    options = Object.assign(Object.assign({}, defaults), options);
+    options = Object.assign({}, defaults, options);
     const next = (context) => {
-        const filename = options.filename(context);
-        const directory = options.directory(context);
-        for (let extension of options.extensions) {
-            const stylePath = path.join(directory, `${filename}.${extension}`);
-            if (!fs.existsSync(stylePath))
+        const references = options.references(context);
+        for (const reference of references) {
+            if (!fs.existsSync(reference))
                 continue;
-            context.stylePath = stylePath;
-            break;
+            context.stylePath = reference;
         }
         if (!context.stylePath)
             return;
-        context.fileAST.program.body.unshift(t.importDeclaration([t.importDefaultSpecifier(t.identifier('AUTO_IMPORT_STYLE'))], t.stringLiteral(context.stylePath)));
-        context.class.body.body.unshift(t.classProperty(t.identifier(CONSTANTS.STATIC_STYLES), t.identifier('AUTO_IMPORT_STYLE'), undefined, null, undefined, true));
-    };
-    return {
-        name,
-        next
+        const local = addDependency(context.fileAST, context.stylePath, 'AUTO_IMPORT_STYLE', undefined, true);
+        const property = t.classProperty(t.identifier(CONSTANTS.STATIC_STYLES), t.identifier(local), undefined, null, undefined, true);
+        context.class.body.body.unshift(property);
     };
+    return { name, next };
 };

package/compiler/plugins/validate.js

@@ -33,8 +33,5 @@ export const validate = () => {
         });
         context.isInvalid = !hasValidImport || !hasValidExport;
     };
-    return {
-        name,
-        next
-    };
+    return { name, next };
 };

package/compiler/plugins/visualStudioCode.d.ts

@@ -0,0 +1,8 @@
+import { Global } from '../../types/index.js';
+export interface VisualStudioCodeOptions {
+    destination: string;
+}
+export declare const visualStudioCode: (options: VisualStudioCodeOptions) => {
+    name: string;
+    finish: (global: Global) => void;
+};