@htmlplus/element 2.1.4 → 2.1.5

package/client/utils/event.js

@@ -5,7 +5,9 @@ const outsides = [];
 export const off = (target, type, handler, options) => {
     if (type != 'outside')
         return target.removeEventListener(type, handler, options);
-    const index = outsides.findIndex((outside) => outside.target == target && outside.handler == handler && outside.options == options);
+    const index = outsides.findIndex((outside) => {
+        return outside.target == target && outside.handler == handler && outside.options == options;
+    });
     const outside = outsides[index];
     if (!outside)
         return;

package/client/utils/merge.js

@@ -8,7 +8,9 @@ export const merge = (target, ...sources) => {
             continue;
         }
         for (const key of Object.keys(source)) {
-            if (target[key] instanceof Object && source[key] instanceof Object && target[key] !== source[key]) {
+            if (target[key] instanceof Object &&
+                source[key] instanceof Object &&
+                target[key] !== source[key]) {
                 target[key] = merge(target[key], source[key]);
             }
             else {

package/client/utils/request.js

@@ -15,52 +15,52 @@ export const request = (target, name, previous, callback) => {
     var _a, _b;
     // Creates/Gets a stacks.
     const stacks = (target[_a = CONSTANTS.API_STACKS] || (target[_a] = new Map()));
-    // Creates/Updates a stack
+    // Creates/Updates a stack.
     const stack = stacks.get(name) || { callbacks: [], previous };
     // Adds the callback to the stack, if exists.
     callback && stack.callbacks.push(callback);
     // Stores the stack.
     stacks.set(name, stack);
-    // Creates/Gets a micro task function.
-    target[_b = CONSTANTS.API_REQUEST] || (target[_b] = task({
-        run: () => {
-            // Skips the rendering phase if DOM isn't ready.
-            if (!target[CONSTANTS.API_CONNECTED])
-                return;
-            // Calculates the states to pass into lifecycles' callbacks.
-            const states = new Map(Array.from(stacks)
-                .filter((stack) => stack[0])
-                .map((stack) => [stack[0], stack[1].previous]));
-            // Calls the lifecycle's callback before the rendering phase.
-            call(target, CONSTANTS.LIFECYCLE_UPDATE, states);
-            // Calculates the template.
-            const template = () => {
-                // Calculates the markup.
-                const markup = call(target, CONSTANTS.METHOD_RENDER);
-                // Calculates the styles.
-                const styles = getStyles(target);
-                // Returns the markup if styles don't exist.
-                if (!styles)
-                    return markup;
-                // Returns the markup and styles together.
-                return html `<style>${styles}</style>${markup}`;
-            };
-            // Renders template to the DOM.
-            render(shadowRoot(target), template);
-            // Invokes requests' callback.
-            stacks.forEach((state) => {
-                state.callbacks.forEach((callback, index, callbacks) => {
-                    callback(callbacks.length - 1 != index);
-                });
+    // Defines a handler.
+    const handler = () => {
+        // Skips the rendering phase if DOM isn't ready.
+        if (!target[CONSTANTS.API_CONNECTED])
+            return;
+        // Calculates the states to pass into lifecycles' callbacks.
+        const states = new Map(Array.from(stacks)
+            .filter((stack) => stack[0])
+            .map((stack) => [stack[0], stack[1].previous]));
+        // Calls the lifecycle's callback before the rendering phase.
+        call(target, CONSTANTS.LIFECYCLE_UPDATE, states);
+        // Calculates the template.
+        const template = () => {
+            // Calculates the markup.
+            const markup = call(target, CONSTANTS.METHOD_RENDER);
+            // Calculates the styles.
+            const styles = getStyles(target);
+            // Returns the markup if styles don't exist.
+            if (!styles)
+                return markup;
+            // Returns the markup and styles together.
+            return html `<style>${styles}</style>${markup}`;
+        };
+        // Renders template to the DOM.
+        render(shadowRoot(target), template);
+        // Invokes requests' callback.
+        stacks.forEach((state) => {
+            state.callbacks.forEach((callback, index, callbacks) => {
+                callback(callbacks.length - 1 != index);
             });
-            // Calls the lifecycle's callback after the rendering phase.
-            call(target, CONSTANTS.LIFECYCLE_UPDATED, states);
-            // Clears stacks.
-            stacks.clear();
-            // TODO: releated to the @Watch decorator.
-            target[CONSTANTS.API_RENDER_COMPLETED] = true;
-        }
-    }));
+        });
+        // Calls the lifecycle's callback after the rendering phase.
+        call(target, CONSTANTS.LIFECYCLE_UPDATED, states);
+        // Clears stacks.
+        stacks.clear();
+        // TODO: releated to the @Watch decorator.
+        target[CONSTANTS.API_RENDER_COMPLETED] = true;
+    };
+    // Creates/Gets a micro task function.
+    target[_b = CONSTANTS.API_REQUEST] || (target[_b] = task({ handler }));
     // Calls the micro task.
     call(target, CONSTANTS.API_REQUEST);
 };

package/client/utils/task.d.ts

@@ -1,6 +1,6 @@
 export interface QueueOptions {
     canStart?: () => boolean;
     canRun?: () => boolean;
-    run: () => void;
+    handler: () => void;
 }
 export declare const task: (options: QueueOptions) => () => Promise<boolean>;

package/client/utils/task.js

@@ -1,14 +1,14 @@
 export const task = (options) => {
-    let isPending, promise;
+    let running, promise;
     const run = () => {
         if (options.canStart && !options.canStart())
             return Promise.resolve(false);
-        if (!isPending)
+        if (!running)
             promise = enqueue();
         return promise;
     };
     const enqueue = async () => {
-        isPending = true;
+        running = true;
         try {
             await promise;
         }
@@ -16,17 +16,17 @@ export const task = (options) => {
             Promise.reject(error);
         }
         // TODO: maybe is optional
-        if (!isPending)
+        if (!running)
             return promise;
         try {
             if (options.canRun && !options.canRun())
-                return (isPending = false);
-            options.run();
-            isPending = false;
+                return (running = false);
+            options.handler();
+            running = false;
             return true;
         }
         catch (error) {
-            isPending = false;
+            running = false;
             throw error;
         }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@htmlplus/element",
-  "version": "2.1.4",
+  "version": "2.1.5",
   "license": "MIT",
   "sideEffects": false,
   "author": "Masood Abdolian <m.abdolian@gmail.com>",
@@ -37,11 +37,10 @@
     "@babel/template": "^7.23.9",
     "@babel/traverse": "^7.23.9",
     "@babel/types": "^7.23.9",
-    "@types/node": "^20.11.19",
+    "@types/node": "^20.11.20",
     "change-case": "^5.4.3",
     "fs-extra": "^11.2.0",
     "glob": "^10.3.10",
-    "handlebars": "^4.7.8",
     "ora": "^8.0.1",
     "typescript": "^4.9.5"
   },
@@ -58,6 +57,6 @@
     "rimraf": "^5.0.5",
     "semantic-release": "^23.0.2",
     "tsx": "^4.7.1",
-    "vite": "^5.1.3"
+    "vite": "^5.1.4"
   }
 }

package/transformer/plugins/customElement.js

@@ -48,7 +48,10 @@ export const customElement = (options) => {
                 const { name, value } = path.node;
                 if (name.name != 'className')
                     return;
-                const hasClass = path.parentPath.node.attributes.some((attribute) => { var _a; return ((_a = attribute.name) === null || _a === void 0 ? void 0 : _a.name) == 'class'; });
+                const hasClass = path.parentPath.node.attributes.some((attribute) => {
+                    var _a;
+                    return ((_a = attribute.name) === null || _a === void 0 ? void 0 : _a.name) == 'class';
+                });
                 if (hasClass)
                     return path.remove();
                 path.replaceWith(t.jsxAttribute(t.jsxIdentifier('class'), value));
@@ -108,7 +111,9 @@ export const customElement = (options) => {
                             const children = node.children.map(render).flat();
                             const parts = [];
                             parts.push('<', name);
-                            const hasSpreadAttribute = attributes.some((attribute) => attribute.type == 'JSXSpreadAttribute');
+                            const hasSpreadAttribute = attributes.some((attribute) => {
+                                return attribute.type == 'JSXSpreadAttribute';
+                            });
                             if (hasSpreadAttribute) {
                                 parts.push(' ', TODO(t.identifier('TODO'), attributes));
                             }
@@ -251,7 +256,8 @@ export const customElement = (options) => {
                             break;
                     }
                     // TODO
-                    if ((input === null || input === void 0 ? void 0 : input.type) == 'TSParenthesizedType' && ((_a = input === null || input === void 0 ? void 0 : input.typeAnnotation) === null || _a === void 0 ? void 0 : _a.type) == 'TSIntersectionType') {
+                    if ((input === null || input === void 0 ? void 0 : input.type) == 'TSParenthesizedType' &&
+                        ((_a = input === null || input === void 0 ? void 0 : input.typeAnnotation) === null || _a === void 0 ? void 0 : _a.type) == 'TSIntersectionType') {
                         let types = input.types || input.typeAnnotation.types;
                         if (types.length != 2)
                             return;

package/transformer/plugins/extract.js

@@ -14,7 +14,8 @@ export const extract = () => {
                     context.classMembers = ((_b = (_a = context.class) === null || _a === void 0 ? void 0 : _a.body) === null || _b === void 0 ? void 0 : _b.body) || [];
                     // TODO
                     if (path.parentPath.isExportNamedDeclaration() && !((_c = context.class) === null || _c === void 0 ? void 0 : _c.leadingComments)) {
-                        context.class['_leadingComments'] = t.cloneNode(path.parentPath.node, true).leadingComments || [];
+                        context.class['_leadingComments'] =
+                            t.cloneNode(path.parentPath.node, true).leadingComments || [];
                     }
                     path.skip();
                 }

package/transformer/utils/getType.js

@@ -1,6 +1,6 @@
 import { parse } from '@babel/parser';
-import { glob } from 'glob';
 import fs from 'fs-extra';
+import { glob } from 'glob';
 import { dirname, resolve } from 'path';
 import { join } from 'path';
 import { visitor } from './visitor.js';