@htmlplus/element 0.7.6 → 0.7.8

package/client/decorators/element.js

@@ -13,13 +13,15 @@ export function Element() {
             constructor() {
                 super();
                 this.attachShadow({ mode: 'open' });
-                this[CONSTANTS.API_INSTANCE] = new constructor();
-                Object.keys(members)
-                    .filter((key) => members[key].type != CONSTANTS.TYPE_FUNCTION)
-                    .forEach((key) => {
-                    members[key].default = this[CONSTANTS.API_INSTANCE][key];
+                const instance = (this[CONSTANTS.API_INSTANCE] = new constructor());
+                Object.keys(members).forEach((key) => {
+                    if (members[key].type != CONSTANTS.TYPE_FUNCTION) {
+                        members[key].default = instance[key];
+                    }
                 });
-                this[CONSTANTS.API_INSTANCE][CONSTANTS.API_HOST] = () => this;
+                instance[CONSTANTS.API_HOST] = () => this;
+                // TODO
+                call(instance, CONSTANTS.LIFECYCLE_CONSTRUCTED);
             }
             static get observedAttributes() {
                 return Object.keys(members)

package/client/decorators/property.js

@@ -22,7 +22,8 @@ export function Property(options) {
             });
         }
         defineProperty(target, propertyKey, { get, set });
-        appendToMethod(target, CONSTANTS.LIFECYCLE_CONNECTED, function () {
+        // TODO: check the lifecycle
+        appendToMethod(target, CONSTANTS.LIFECYCLE_CONSTRUCTED, function () {
             const element = host(this);
             // TODO: experimental for isolated options
             if (element === this)

package/compiler/plugins/document.js

@@ -195,7 +195,7 @@ export const document = (options) => {
                     };
                 });
             })();
-            const tags = getTags(context.class);
+            const tags = getTags(context.class).filter((tag) => !['part', 'slot'].includes(tag.key));
             const title = capitalCase(context.componentKey);
             const component = {
                 events,

package/compiler/utils/tags.js

@@ -32,7 +32,7 @@ export const getTags = (node, filter) => {
 export const hasTag = (node, name) => {
     return getTags(node).some((tag) => tag.key === name);
 };
-export const parseTag = (tag, spliter = '-') => {
+export const parseTag = (tag, spliter = ' - ') => {
     var _a, _b;
     const sections = ((_a = tag.value) === null || _a === void 0 ? void 0 : _a.split(spliter)) || [];
     const name = (_b = sections[0]) === null || _b === void 0 ? void 0 : _b.trim();

package/constants/index.d.ts

@@ -16,6 +16,7 @@ export declare const DECORATOR_METHOD = "Method";
 export declare const LIFECYCLE_ADOPTED = "adoptedCallback";
 export declare const LIFECYCLE_CONNECT = "connectCallback";
 export declare const LIFECYCLE_CONNECTED = "connectedCallback";
+export declare const LIFECYCLE_CONSTRUCTED = "constructedCallback";
 export declare const LIFECYCLE_DISCONNECTED = "disconnectedCallback";
 export declare const LIFECYCLE_LOADED = "loadedCallback";
 export declare const LIFECYCLE_UPDATE = "updateCallback";
@@ -27,16 +28,17 @@ export declare const STATIC_MEMBERS_TYPE = "type";
 export declare const STATIC_STYLES = "STYLES";
 export declare const STATIC_TAG = "TAG";
 export declare const STYLE_IMPORTED = "STYLE_IMPORTED";
-export declare const TYPE_ARRAY = 1;
-export declare const TYPE_BOOLEAN = 2;
-export declare const TYPE_DATE = 4;
-export declare const TYPE_ENUM = 8;
-export declare const TYPE_FUNCTION = 16;
-export declare const TYPE_NULL = 32;
-export declare const TYPE_NUMBER = 64;
-export declare const TYPE_OBJECT = 128;
-export declare const TYPE_STRING = 256;
-export declare const TYPE_UNDEFINED = 512;
+export declare const TYPE_ARRAY: number;
+export declare const TYPE_BOOLEAN: number;
+export declare const TYPE_DATE: number;
+export declare const TYPE_ENUM: number;
+export declare const TYPE_FUNCTION: number;
+export declare const TYPE_NULL: number;
+export declare const TYPE_NUMBER: number;
+export declare const TYPE_OBJECT: number;
+export declare const TYPE_STRING: number;
+export declare const TYPE_UNDEFINED: number;
+export declare const TYPE_UNIT: number;
 export declare const UTILS_ATTRIBUTES_IMPORTED = "attributes";
 export declare const UTILS_ATTRIBUTES_LOCAL = "UTILS_ATTRIBUTES";
 export declare const UTILS_HOST_IMPORTED = "host";

package/constants/index.js

@@ -20,6 +20,7 @@ export const DECORATOR_METHOD = 'Method';
 export const LIFECYCLE_ADOPTED = 'adoptedCallback';
 export const LIFECYCLE_CONNECT = 'connectCallback';
 export const LIFECYCLE_CONNECTED = 'connectedCallback';
+export const LIFECYCLE_CONSTRUCTED = 'constructedCallback';
 export const LIFECYCLE_DISCONNECTED = 'disconnectedCallback';
 export const LIFECYCLE_LOADED = 'loadedCallback';
 export const LIFECYCLE_UPDATE = 'updateCallback';
@@ -35,16 +36,17 @@ export const STATIC_TAG = 'TAG';
 // style
 export const STYLE_IMPORTED = 'STYLE_IMPORTED';
 // types
-export const TYPE_ARRAY = 1;
-export const TYPE_BOOLEAN = 2;
-export const TYPE_DATE = 4;
-export const TYPE_ENUM = 8;
-export const TYPE_FUNCTION = 16;
-export const TYPE_NULL = 32;
-export const TYPE_NUMBER = 64;
-export const TYPE_OBJECT = 128;
-export const TYPE_STRING = 256;
-export const TYPE_UNDEFINED = 512;
+export const TYPE_ARRAY = 2 ** 0;
+export const TYPE_BOOLEAN = 2 ** 1;
+export const TYPE_DATE = 2 ** 2;
+export const TYPE_ENUM = 2 ** 3;
+export const TYPE_FUNCTION = 2 ** 4;
+export const TYPE_NULL = 2 ** 5;
+export const TYPE_NUMBER = 2 ** 6;
+export const TYPE_OBJECT = 2 ** 7;
+export const TYPE_STRING = 2 ** 8;
+export const TYPE_UNDEFINED = 2 ** 9;
+export const TYPE_UNIT = 2 ** 10; // TODO
 // utils
 export const UTILS_ATTRIBUTES_IMPORTED = 'attributes';
 export const UTILS_ATTRIBUTES_LOCAL = 'UTILS_ATTRIBUTES';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@htmlplus/element",
-  "version": "0.7.6",
+  "version": "0.7.8",
   "license": "MIT",
   "sideEffects": false,
   "author": "Masood Abdolian <m.abdolian@gmail.com>",