@htmlplus/element 0.4.1 → 0.4.2

package/client/decorators/event.js

@@ -1,3 +1,4 @@
+import { paramCase } from 'change-case';
 import { defineProperty, dispatch, host } from '../utils/index.js';
 export function Event(options = {}) {
     return function (target, propertyKey) {
@@ -6,7 +7,7 @@ export function Event(options = {}) {
                 return (detail) => {
                     var _a;
                     (_a = options.bubbles) !== null && _a !== void 0 ? _a : (options.bubbles = false);
-                    const name = options.name || String(propertyKey);
+                    const name = paramCase(options.name || String(propertyKey));
                     const event = new CustomEvent(name, Object.assign(Object.assign({}, options), { detail }));
                     dispatch(host(this), event);
                     return event;

package/client/decorators/property.js

@@ -5,7 +5,7 @@ export function Property(options) {
     return function (target, propertyKey) {
         const name = String(propertyKey);
         const attribute = paramCase(name);
-        const type = getMembers(target)[name].at(0);
+        const type = getMembers(target)[name][0];
         const values = new Map();
         function get() {
             return values.get(this);

package/client/utils/config.d.ts

@@ -0,0 +1,10 @@
+interface Options {
+    event?: OptionsEvent;
+}
+interface OptionsEvent {
+    dispatch?: (target: OptionsEventTarget, event: Event) => boolean;
+}
+declare type OptionsEventTarget = Window | Document | Element;
+export declare const getConfig: () => Options;
+export declare const setConfig: (config: Options) => void;
+export {};

package/client/utils/config.js

@@ -0,0 +1,8 @@
+// TODO
+let options = {};
+export const getConfig = () => {
+    return options;
+};
+export const setConfig = (config) => {
+    options = config || {};
+};

package/client/utils/event.js

@@ -1,5 +1,7 @@
+import { getConfig } from './config.js';
 export const dispatch = (target, event) => {
-    return target.dispatchEvent(event);
+    var _a, _b;
+    return ((_b = (_a = getConfig().event) === null || _a === void 0 ? void 0 : _a.dispatch) === null || _b === void 0 ? void 0 : _b.call(_a, target, event)) || target.dispatchEvent(event);
 };
 export const on = (target, type, handler, options) => {
     target.addEventListener(type, handler, options);

package/client/utils/index.d.ts

@@ -1,5 +1,6 @@
 export * from './appendToMethod.js';
 export * from './call.js';
+export * from './config.js';
 export * from './defineProperty.js';
 export * from './event.js';
 export * from './getMembers.js';

package/client/utils/index.js

@@ -1,5 +1,6 @@
 export * from './appendToMethod.js';
 export * from './call.js';
+export * from './config.js';
 export * from './defineProperty.js';
 export * from './event.js';
 export * from './getMembers.js';

package/compiler/plugins/customElementReact/customElementReact.js

@@ -96,7 +96,7 @@ export const customElementReact = (options) => {
                 return {
                     all,
                     filterd: all.slice(1),
-                    root: all.at(0),
+                    root: all[0],
                     single: all.length == 1
                 };
             })

package/compiler/plugins/customElementReact/templates/src/components/{{fileName}}.compact.ts.hbs

@@ -9,7 +9,7 @@
 import { {{componentClassNamePrune}} } from './{{fileName}}';
 {{/each}}
 
-const All = /*@__PURE__*/ Object.assign({{root.componentClassNamePrune}}, {
+const All = Object.assign({{root.componentClassNamePrune}}, {
   {{#each filterd}}
   {{componentClassNameInCategory}}: {{componentClassNamePrune}},
   {{/each}}

package/compiler/plugins/customElementReact/templates/src/components/{{fileName}}.ts.hbs

@@ -19,7 +19,7 @@ type Renamed = Rename<{{importerComponentType.variable}}, {
   {{/each}}
 }>
 
-export const {{componentClassNamePrune}} = /*@__PURE__*/ proxy<{{componentInterfaceName}}, Renamed>(
+export const {{componentClassNamePrune}} = proxy<{{componentInterfaceName}}, Renamed>(
   '{{componentTag}}', 
   [{{#each classProperties}}'{{key.name}}', {{/each}}], 
   [{{#each classEvents}}'{{key.name}}', {{/each}}],

package/compiler/plugins/extract.js

@@ -35,7 +35,17 @@ export const extract = (options) => {
                     ])));
                     return;
                 }
-            }
+            },
+            JSXElement(path) {
+                var _a;
+                const { openingElement } = path.node;
+                const name = openingElement.name.name;
+                if (!/-/g.test(name))
+                    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.directoryPath = path.dirname(context.filePath);
         context.directoryName = path.basename(context.directoryPath);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@htmlplus/element",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "license": "MIT",
   "author": "Masood Abdolian <m.abdolian@gmail.com>",
   "description": "Compiler of HTMLPlus",

package/types/context.d.ts

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