@htmlplus/element 0.8.5 → 1.0.0

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# 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/compiler/plugins/customElement.js

@@ -2,7 +2,7 @@ import template from '@babel/template';
 import t from '@babel/types';
 import { camelCase, kebabCase, pascalCase } from 'change-case';
 import * as CONSTANTS from '../../constants/index.js';
-import { addDependency, getType, print, toEventTypeAnnotation, toPropertySignature, visitor } from '../utils/index.js';
+import { addDependency, getType, print, visitor } from '../utils/index.js';
 export const CUSTOM_ELEMENT_OPTIONS = {
     prefix: undefined,
     typings: true
@@ -276,61 +276,82 @@ export const customElement = (options) => {
         if (options === null || options === void 0 ? void 0 : options.typings) {
             visitor(ast, {
                 Program(path) {
-                    const jsx = [
-                        ...context.classProperties.map((property) => {
-                            return toPropertySignature(property);
-                        }),
-                        ...context.classEvents.map((event) => {
-                            return toPropertySignature(event, {
-                                optional: true,
-                                keyTransformer: (key) => camelCase('on-' + key),
-                                typeAnnotationTransformer: toEventTypeAnnotation
-                            });
-                        })
-                    ];
-                    const attributeJSX = [
-                        ...context.classProperties.map((property) => {
-                            return toPropertySignature(property, {
-                                keyTransformer: (key) => kebabCase(key)
-                            });
-                        }),
-                        ...context.classEvents.map((event) => {
-                            return toPropertySignature(event, {
-                                optional: true,
-                                keyTransformer: (key) => camelCase('on-' + key),
-                                typeAnnotationTransformer: toEventTypeAnnotation
-                            });
-                        })
-                    ];
-                    const globalInterface = context.classProperties.map((property) => {
-                        return toPropertySignature(property);
+                    const attributes = context.classProperties.map((property) => {
+                        const key = property.key;
+                        const typeAnnotation = property.typeAnnotation;
+                        return Object.assign(t.tSPropertySignature(t.stringLiteral(kebabCase(key.name)), typeAnnotation), {
+                            optional: property.optional,
+                            leadingComments: t.cloneNode(property, true).leadingComments
+                        });
+                    });
+                    const events = context.classEvents.map((event) => {
+                        var _a;
+                        const key = event.key;
+                        const typeAnnotation = event.typeAnnotation;
+                        return Object.assign(t.tSPropertySignature(t.identifier(camelCase('on-' + key.name)), t.tsTypeAnnotation(t.tsFunctionType(undefined, [
+                            Object.assign({}, t.identifier('event'), {
+                                typeAnnotation: t.tsTypeAnnotation(t.tsTypeReference(t.identifier('CustomEvent'), (_a = typeAnnotation === null || typeAnnotation === void 0 ? void 0 : typeAnnotation['typeAnnotation']) === null || _a === void 0 ? void 0 : _a.typeParameters))
+                            })
+                        ], t.tsTypeAnnotation(t.tsVoidKeyword())))), {
+                            optional: true,
+                            leadingComments: t.cloneNode(event, true).leadingComments
+                        });
+                    });
+                    const methods = context.classMethods.map((method) => {
+                        return Object.assign(t.tsMethodSignature(method.key, undefined, method.params, // TODO
+                        method.returnType // TODO
+                        ), {
+                            leadingComments: t.cloneNode(method, true).leadingComments
+                        });
+                    });
+                    const properties = context.classProperties.map((property) => {
+                        const key = property.key;
+                        const typeAnnotation = property.typeAnnotation;
+                        return Object.assign(t.tSPropertySignature(t.identifier(key.name), typeAnnotation), {
+                            optional: property.optional,
+                            leadingComments: t.cloneNode(property, true).leadingComments
+                        });
                     });
                     const ast = template.default.ast(`
-              export interface ${context.className}JSX {
-                ${jsx.map(print).join('')}
+              export interface ${context.className}Attributes {
+                ${attributes.map(print).join('')}
               }
-              export interface ${context.className}AttributeJSX {
-                ${attributeJSX.map(print).join('')}
+
+              export interface ${context.className}Events {
+                ${events.map(print).join('')}
               }
+
+              export interface ${context.className}Methods {
+                ${methods.map(print).join('')}
+              }
+
+              export interface ${context.className}Properties {
+                ${properties.map(print).join('')}
+              }
+
+              export interface ${context.className}JSX extends ${context.className}Events, ${context.className}Properties { }
+    
               declare global {
-                interface ${componentInterfaceName} extends HTMLElement {
-                  ${globalInterface.map(print).join('')}
-                }
+                interface ${componentInterfaceName} extends HTMLElement, ${context.className}Methods, ${context.className}Properties { }
+
                 var ${componentInterfaceName}: {
                   prototype: ${componentInterfaceName};
                   new (): ${componentInterfaceName};
                 };
+
                 interface HTMLElementTagNameMap {
                   "${tag}": ${componentInterfaceName};
                 }
+                
                 namespace JSX {
                   interface IntrinsicElements {
-                    "${tag}": ${context.className}AttributeJSX & {
+                    "${tag}": ${context.className}Events & ${context.className}Attributes & {
                       [key: string]: any;
                     };
                   }
                 }
               }
+
               export type ${context.className}Element = globalThis.${componentInterfaceName}
             `, {
                         plugins: ['typescript'],

package/compiler/utils/index.d.ts

@@ -10,6 +10,4 @@ export * from './print.js';
 export * from './removeUnusedImport.js';
 export * from './renderTemplate.js';
 export * from './tags.js';
-export * from './toEventTypeAnnotation.js';
-export * from './toPropertySignature.js';
 export * from './visitor.js';

package/compiler/utils/index.js

@@ -10,6 +10,4 @@ export * from './print.js';
 export * from './removeUnusedImport.js';
 export * from './renderTemplate.js';
 export * from './tags.js';
-export * from './toEventTypeAnnotation.js';
-export * from './toPropertySignature.js';
 export * from './visitor.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@htmlplus/element",
-  "version": "0.8.5",
+  "version": "1.0.0",
   "license": "MIT",
   "sideEffects": false,
   "author": "Masood Abdolian <m.abdolian@gmail.com>",
@@ -46,11 +46,18 @@
     "typescript": "^4.9.3"
   },
   "devDependencies": {
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/commit-analyzer": "^11.1.0",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/github": "^9.2.4",
+    "@semantic-release/npm": "^11.0.1",
+    "@semantic-release/release-notes-generator": "^12.1.0",
     "@trivago/prettier-plugin-sort-imports": "^4.0.0",
     "cpy": "^9.0.1",
     "prettier": "^2.8.0",
     "rimraf": "^3.0.2",
+    "semantic-release": "^22.0.8",
     "ts-node": "^10.9.1",
     "vite": "^3.2.4"
   }
-}
+}

package/compiler/utils/toEventTypeAnnotation.d.ts

@@ -1,2 +0,0 @@
-import t from '@babel/types';
-export declare const toEventTypeAnnotation: (typeAnnotation: t.Noop | t.TSTypeAnnotation | t.TypeAnnotation | null | undefined) => t.TSTypeAnnotation;

package/compiler/utils/toEventTypeAnnotation.js

@@ -1,9 +0,0 @@
-import t from '@babel/types';
-export const toEventTypeAnnotation = (typeAnnotation) => {
-    var _a;
-    return t.tsTypeAnnotation(t.tsFunctionType(undefined, [
-        Object.assign({}, t.identifier('event'), {
-            typeAnnotation: t.tsTypeAnnotation(t.tsTypeReference(t.identifier('CustomEvent'), (_a = typeAnnotation === null || typeAnnotation === void 0 ? void 0 : typeAnnotation['typeAnnotation']) === null || _a === void 0 ? void 0 : _a.typeParameters))
-        })
-    ], t.tsTypeAnnotation(t.tsVoidKeyword())));
-};

package/compiler/utils/toPropertySignature.d.ts

@@ -1,7 +0,0 @@
-import t from '@babel/types';
-export interface IToPropertySignatureOptions {
-    optional?: boolean;
-    keyTransformer?: (key: string) => string;
-    typeAnnotationTransformer?: (typeAnnotation: t.Noop | t.TSTypeAnnotation | t.TypeAnnotation | null | undefined) => t.TSTypeAnnotation | null | undefined;
-}
-export declare const toPropertySignature: (property: t.ClassProperty, options?: IToPropertySignatureOptions) => t.TSPropertySignature;

package/compiler/utils/toPropertySignature.js

@@ -1,10 +0,0 @@
-import t from '@babel/types';
-export const toPropertySignature = (property, options) => {
-    var _a, _b, _c;
-    const key = property.key;
-    const typeAnnotation = property.typeAnnotation;
-    return Object.assign(t.tSPropertySignature(t.stringLiteral(((_a = options === null || options === void 0 ? void 0 : options.keyTransformer) === null || _a === void 0 ? void 0 : _a.call(options, key.name)) || key.name), ((_b = options === null || options === void 0 ? void 0 : options.typeAnnotationTransformer) === null || _b === void 0 ? void 0 : _b.call(options, typeAnnotation)) || typeAnnotation), {
-        optional: (_c = options === null || options === void 0 ? void 0 : options.optional) !== null && _c !== void 0 ? _c : property.optional,
-        leadingComments: t.cloneNode(property, true).leadingComments
-    });
-};