@htmlplus/element 1.0.0 → 1.1.0

package/{compiler/compiler.js → transformer/transformer.js}

@@ -4,28 +4,31 @@ const logger = ora({
     color: 'yellow'
 });
 const log = (message, persist) => {
-    var _a, _b;
-    (_b = (_a = logger.start(`${new Date().toLocaleTimeString()} [HTMLPLUS] ${message}`))[persist ? 'succeed' : '']) === null || _b === void 0 ? void 0 : _b.call(_a);
+    const content = `${new Date().toLocaleTimeString()} [HTMLPLUS] ${message}`;
+    const log = logger.start(content);
+    if (!persist)
+        return;
+    log.succeed();
 };
-export const compiler = (...plugins) => {
+export const transformer = (...plugins) => {
     let global = {
         contexts: []
     };
-    log(`Starting...`, true);
-    log(`${plugins.length} plugins found.`, true);
     const start = async () => {
-        log(`Plugins are starting...`, true);
+        log(`Started.`, true);
+        log(`${plugins.length} plugins found.`, true);
+        log(`Plugins are starting.`, true);
         for (const plugin of plugins) {
             if (!plugin.start)
                 continue;
-            log(`Plugin '${plugin.name}' is starting...`);
+            log(`Plugin '${plugin.name}' is starting.`);
             global = (await plugin.start(global)) || global;
             log(`Plugin '${plugin.name}' started successfully.`);
         }
         log(`Plugins started successfully.`, true);
     };
     const run = async (filePath) => {
-        const key = filePath.split(/[\/|\\]/g).pop();
+        const key = path.join(filePath).split(path.sep).pop();
         let context = {
             filePath
         };
@@ -33,12 +36,13 @@ export const compiler = (...plugins) => {
         for (const plugin of plugins) {
             if (!plugin.run)
                 continue;
-            log(`Plugin '${plugin.name}' is executing on '${path.basename(parsed.dir)}/${parsed.base}' file.`);
+            const source = path.join(parsed.dir).split(path.sep).slice(-2).concat(parsed.base).join('/');
+            log(`Plugin '${plugin.name}' is executing on '${source}' file.`);
             try {
                 context = (await plugin.run(context, global)) || context;
             }
             catch (error) {
-                log(`Error in '${plugin.name}' plugin on '${path.basename(parsed.dir)}/${parsed.base}' file.`, true);
+                log(`Error in '${plugin.name}' plugin on '${source}' file.\n`, true);
                 throw error;
             }
             global.contexts = global.contexts
@@ -46,21 +50,17 @@ export const compiler = (...plugins) => {
                 return current.filePath != context.filePath;
             })
                 .concat(context);
-            log(`Plugin '${plugin.name}' executed successfully on '${path.basename(filePath)}' file.`);
-            if (context.isInvalid)
-                break;
+            log(`Plugin '${plugin.name}' executed successfully on '${source}' file.`);
         }
         logger.stop();
-        if (context.isInvalid)
-            log(`File '${key}' break executing because file is invalid.`, true);
         return context;
     };
     const finish = async () => {
-        log(`Plugins are finishing...`, true);
+        log(`Plugins are finishing.`, true);
         for (const plugin of plugins) {
             if (!plugin.finish)
                 continue;
-            log(`Plugin '${plugin.name}' is finishing...`);
+            log(`Plugin '${plugin.name}' is finishing.`);
             global = (await plugin.finish(global)) || global;
             log(`Plugin '${plugin.name}' finished successfully.`);
         }

package/transformer/transformer.types.d.ts

@@ -0,0 +1,50 @@
+import { ClassBody, ClassDeclaration, ClassMethod, ClassProperty, File } from '@babel/types';
+type Return<T> = void | T | Promise<void | T>;
+export interface TransformerPluginContext {
+    skipped?: boolean;
+    script?: string;
+    assetsDestination?: string;
+    assetsSource?: string;
+    class?: ClassDeclaration;
+    classEvents?: Array<ClassProperty>;
+    classHasMount?: boolean;
+    classHasUnmount?: boolean;
+    classMembers?: ClassBody['body'];
+    classMethods?: Array<ClassMethod>;
+    className?: string;
+    classProperties?: Array<ClassProperty>;
+    classRender?: ClassMethod;
+    classStates?: Array<ClassProperty>;
+    directoryName?: string;
+    directoryPath?: string;
+    elementKey?: string;
+    elementInterfaceName?: string;
+    elementTagName?: string;
+    fileAST?: File;
+    fileContent?: string;
+    fileExtension?: string;
+    fileName?: string;
+    filePath?: string;
+    metadata?: {
+        [key: string]: any;
+    };
+    readmeContent?: string;
+    readmeExtension?: string;
+    readmeName?: string;
+    readmePath?: string;
+    styleContent?: string;
+    styleExtension?: string;
+    styleName?: string;
+    stylePath?: string;
+}
+export interface TransformerPluginGlobal {
+    contexts: Array<TransformerPluginContext>;
+}
+export interface TransformerPlugin {
+    name: string;
+    options?: any;
+    start?: (global: TransformerPluginGlobal) => Return<TransformerPluginGlobal>;
+    run?: (context: TransformerPluginContext, global: TransformerPluginGlobal) => Return<TransformerPluginContext>;
+    finish?: (global: TransformerPluginGlobal) => Return<TransformerPluginGlobal>;
+}
+export {};

package/{compiler → transformer}/utils/printType.js

@@ -2,8 +2,8 @@ import { print } from './print.js';
 // TODO
 // args types
 // return type
-// components\grid-item\grid-item.types.ts
-// components\portal\portal.tsx
+// elements\grid-item\grid-item.types.ts
+// elements\portal\portal.tsx
 export const printType = (ast) => {
     if (!ast)
         return ast;

package/{compiler → transformer}/utils/renderTemplate.js

@@ -5,7 +5,9 @@ import path from 'path';
 export const renderTemplate = (source, destination, options) => (context) => {
     const files = glob.sync(source, options);
     for (const file of files) {
+        // TODO
         const from = path.resolve((options === null || options === void 0 ? void 0 : options.cwd) || '', file);
+        // TODO
         const to = path.join(destination, path
             .normalize(file)
             .split(path.sep)

package/types/index.d.ts

@@ -1,4 +1,2 @@
-export * from './context';
-export * from './global';
-export * from './plugin';
-export * from './plusElement';
+export interface PlusElement {
+}

package/types/index.js

@@ -1,4 +1 @@
-export * from './context';
-export * from './global';
-export * from './plugin';
-export * from './plusElement';
+export {};

package/CHANGELOG.md

@@ -1,7 +0,0 @@
-# 1.0.0 (2023-12-03)
-
-
-### Bug Fixes
-
-* **package:** fix mistake import ([40180d6](https://github.com/htmlplus/element/commit/40180d64ff1f7fcc4e9edc10c03431dfc8172fa3))
-* **prettier:** fix extra tabs ([22fbad9](https://github.com/htmlplus/element/commit/22fbad962636fd7a8ad53da64dd22078633e4147))

package/bundlers/index.d.ts

@@ -1,2 +0,0 @@
-export * from './rollup.js';
-export * from './vite.js';

package/bundlers/index.js

@@ -1,2 +0,0 @@
-export * from './rollup.js';
-export * from './vite.js';

package/client/helpers/index.d.ts

@@ -1 +0,0 @@
-export { classes, direction, getConfig, host, isRTL, isServer, on, off, slots, styles, toUnit, setConfig } from '../utils/index.js';

package/client/helpers/index.js

@@ -1 +0,0 @@
-export { classes, direction, getConfig, host, isRTL, isServer, on, off, slots, styles, toUnit, setConfig } from '../utils/index.js';

package/client/services/index.d.ts

@@ -1 +0,0 @@
-export * from './link.js';

package/client/services/index.js

@@ -1 +0,0 @@
-export * from './link.js';

package/client/services/link.d.ts

@@ -1,4 +0,0 @@
-export type LinkConfig = {
-    scope?: Function;
-};
-export declare const createLink: (namespace: string) => any;

package/client/services/link.js

@@ -1,196 +0,0 @@
-import { defineProperty, host } from '../utils/index.js';
-const links = new Map();
-// TODO: return type
-export const createLink = (namespace) => {
-    if (links.has(namespace))
-        return links.get(namespace);
-    const config = {
-        scope: (i) => i.connector
-    };
-    let disconnecting = false;
-    const children = new Map();
-    const parents = new Map();
-    const properties = [];
-    const find = (source) => {
-        return properties.find((destination) => destination.instance === source.instance && destination.name === source.name);
-    };
-    const register = (source) => {
-        properties.push(source);
-        if (!children.has(source.instance))
-            children.set(source.instance, new Set());
-        // TODO: any
-        const siblings = children.get(source.instance);
-        siblings.add(source);
-    };
-    const unregister = (source) => {
-        // TODO: any
-        source = find(source);
-        const index = properties.findIndex((property) => property === source);
-        if (index === -1)
-            return;
-        properties.splice(index, 1);
-        // TODO: any
-        const siblings = children.get(source.instance);
-        siblings.delete(source);
-        if (siblings.size)
-            return;
-        children.delete(source.instance);
-        parents.delete(source.instance);
-    };
-    const get = (source) => {
-        // TODO: any
-        return source.instance[source.name];
-    };
-    const set = (source, value) => {
-        // TODO: any
-        source.instance[source.name] = value;
-    };
-    const reset = (source) => {
-        if (source.type === 'action')
-            return;
-        if (source.type === 'inject')
-            return set(source, source.value /* TODO */);
-        // TODO: any
-        defineProperty(source.instance, source.name, {
-            value: get(source) /* TODO */,
-            enumerable: true,
-            configurable: true
-        });
-    };
-    const map = (source, destination) => {
-        let value = get(source);
-        if (typeof value === 'function')
-            value = value.bind(source.instance);
-        set(destination, value);
-    };
-    const proxy = (source) => {
-        let value = get(source);
-        // TODO: any
-        defineProperty(source.instance, source.name, {
-            enumerable: true,
-            configurable: true,
-            get() {
-                return value;
-            },
-            set(input) {
-                if (input === value)
-                    return;
-                value = input;
-                siblings(source, ['inject']).map((destination) => set(destination, value));
-            }
-        });
-    };
-    const parent = (source) => {
-        var _a;
-        const cache = parents.get(source.instance);
-        if (cache)
-            return cache;
-        // TODO: element? and any
-        let parent = (_a = source.element) === null || _a === void 0 ? void 0 : _a.parentElement;
-        while (parent) {
-            if (parent.shadowRoot) {
-                const item = properties.find((property) => property.element === parent && property.name === source.name);
-                if (item) {
-                    parents.set(source.instance, item);
-                    return item;
-                }
-            }
-            parent = parent.parentElement;
-        }
-    };
-    const scope = (source) => {
-        var _a, _b;
-        if (!source)
-            return;
-        // TODO
-        if (disconnecting)
-            return source.instance['$scope-prev'];
-        // TODO: &&
-        let input = config.scope && config.scope(source.instance);
-        if (typeof input !== 'undefined')
-            return input;
-        // TODO: any
-        return ((_b = (_a = scope(parent(source))) !== null && _a !== void 0 ? _a : source.instance['$scope-auto']) !== null && _b !== void 0 ? _b : (source.instance['$scope-auto'] = Math.random()));
-    };
-    const siblings = (source, types) => {
-        return properties.filter((destination) => {
-            // TODO: any
-            if (!types.includes(destination.type))
-                return false;
-            if (source === destination)
-                return false;
-            if (source.name !== destination.name)
-                return false;
-            if (scope(source) !== scope(destination))
-                return false;
-            return true;
-        });
-    };
-    const connect = (source) => {
-        // TODO
-        source.instance['$scope-prev'] = scope(source);
-        register(source);
-        switch (source.type) {
-            case 'action':
-                siblings(source, ['inject']).forEach((destination) => map(source, destination));
-                break;
-            case 'observable':
-                proxy(source);
-                siblings(source, ['inject']).forEach((destination) => map(source, destination));
-                break;
-            case 'inject':
-                siblings(source, ['action', 'observable']).forEach((destination) => map(destination, source));
-                break;
-        }
-    };
-    const disconnect = (source) => {
-        reset(source);
-        if (source.type === 'inject')
-            return unregister(source);
-        siblings(source, ['inject']).forEach(reset);
-        unregister(source);
-    };
-    const reconnect = (instance) => {
-        const p = properties.filter((property) => property.instance === instance);
-        disconnecting = true;
-        p.forEach(disconnect);
-        disconnecting = false;
-        p.forEach(connect);
-    };
-    const decorator = (type) => () => (target, name) => {
-        const connected = target.connectedCallback;
-        target.connectedCallback = function () {
-            connected && connected.bind(this)();
-            const property = {
-                element: host(this),
-                instance: this,
-                name,
-                type,
-                value: this[name]
-            };
-            if (find(property))
-                console.error('TODO: Error log');
-            connect(property);
-        };
-        const disconnected = target.disconnectedCallback;
-        target.disconnectedCallback = function () {
-            disconnected && disconnected.bind(this)();
-            const property = find({ instance: this, name });
-            if (!property)
-                console.error('TODO: Error log');
-            // TODO: any
-            disconnect(property);
-        };
-    };
-    const Action = decorator('action');
-    const Inject = decorator('inject');
-    const Observable = decorator('observable');
-    const result = {
-        Action,
-        Inject,
-        Observable,
-        reconnect
-    };
-    links.set(namespace, result);
-    return result;
-};

package/client/utils/getNamespace.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types';
-export declare const getNamespace: (instance: PlusElement) => string;

package/client/utils/getNamespace.js

@@ -1,4 +0,0 @@
-import { getTag } from './getTag.js';
-export const getNamespace = (instance) => {
-    return getTag(instance).split('-')[0].toUpperCase();
-};

package/client/vendors/uhtml.d.ts

@@ -1,29 +0,0 @@
-declare namespace _default {
-    export { Hole };
-    export { html };
-    export { render };
-    export { svg };
-}
-export default _default;
-/**
- * Holds all details wrappers needed to render the content further on.
- * @constructor
- * @param {string} type The hole type, either `html` or `svg`.
- * @param {string[]} template The template literals used to the define the content.
- * @param {Array} values Zero, one, or more interpolated values to render.
- */
-export class Hole {
-    constructor(type: any, template: any, values: any);
-    type: any;
-    template: any;
-    values: any;
-}
-export const html: ((template: any, ...values: any[]) => Hole) & {
-    for(ref: any, id: any): any;
-    node: (template: any, ...values: any[]) => any;
-};
-export function render(where: any, what: any): any;
-export const svg: ((template: any, ...values: any[]) => Hole) & {
-    for(ref: any, id: any): any;
-    node: (template: any, ...values: any[]) => any;
-};