@twobirds/microcomponents 0.0.82 → 0.0.84

package/public/src/elements.d.ts

@@ -0,0 +1,5 @@
+export declare function defineCE(tagName: string, DefinitionClass: {
+    new (...args: any[]): any;
+} | Function, observedAttributes?: string[]): void;
+export declare function getCE(tagName: string): CustomElementConstructor | undefined;
+//# sourceMappingURL=elements.d.ts.map

package/public/src/elements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAoDA,wBAAgB,QAAQ,CACvB,OAAO,EAAE,MAAM,EACf,eAAe,EAAE;IAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAA;CAAE,GAAG,QAAQ,EACzD,kBAAkB,GAAE,MAAM,EAAO,QA2DjC;AAED,wBAAgB,KAAK,CAAC,OAAO,EAAE,MAAM,GAAG,wBAAwB,GAAG,SAAS,CAE3E"}

package/public/src/elements.js

@@ -0,0 +1,68 @@
+'use strict';
+import { DC, McBase } from './MC.js';
+import { kebabToPascal } from './helpers.js';
+class CeBaseClass extends HTMLElement {
+    constructor() {
+        super();
+    }
+    connectedCallback() {
+        this.dispatchEvent(new CustomEvent('_mcConnected'));
+    }
+    connectedMoveCallback() {
+        this.dispatchEvent(new CustomEvent('_mcConnectedMove'));
+    }
+    disconnectedCallback() {
+        this.dispatchEvent(new CustomEvent('_mcDisconnected'));
+    }
+    adoptedCallback() {
+        this.dispatchEvent(new CustomEvent('_mcAdopted'));
+    }
+    attributeChangedCallback(name, oldValue, newValue) {
+        this.dispatchEvent(new CustomEvent('_mcAttributeChanged', { detail: { name, oldValue, newValue } }));
+    }
+    formResetCallback() {
+        this.dispatchEvent(new CustomEvent('_mcFormReset'));
+    }
+}
+function createNamedClass(name, ClassBody) {
+    return Object.defineProperty(ClassBody, 'name', { value: name });
+}
+function isClass(func) {
+    return typeof func === 'function'
+        && /^class\s/.test(Function.prototype.toString.call(func));
+}
+export function defineCE(tagName, DefinitionClass, observedAttributes = []) {
+    if (customElements.get(tagName)) {
+        console.warn(`IGNORED: Custom element "${tagName}" is already defined!`);
+        return;
+    }
+    if (!tagName.includes('-')) {
+        throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');
+    }
+    let name = kebabToPascal(tagName);
+    if (!isClass(DefinitionClass.prototype.constructor)) {
+        customElements.define(tagName, DefinitionClass);
+        return;
+    }
+    if (!(DefinitionClass.prototype instanceof McBase)) {
+        customElements.define(tagName, DefinitionClass);
+        return;
+    }
+    customElements.define(tagName, createNamedClass(name, class extends CeBaseClass {
+        instance;
+        constructor(data) {
+            super();
+            const instance = isClass(DefinitionClass)
+                ? new DefinitionClass(this, data)
+                : DefinitionClass;
+            DC.add(this, name, instance);
+        }
+        static get observedAttributes() {
+            return observedAttributes;
+        }
+    }));
+}
+export function getCE(tagName) {
+    return customElements.get(tagName);
+}
+//# sourceMappingURL=elements.js.map

package/public/src/elements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elements.js","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"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"}

package/public/src/elements.ts

@@ -1,6 +1,6 @@
 'use strict';
 
-import { DC } from './MC.js';
+import { DC, McBase } from './MC.js';
 import { kebabToPascal } from './helpers.js';
 
 class CeBaseClass extends HTMLElement {
@@ -9,19 +9,32 @@ class CeBaseClass extends HTMLElement {
 	}
 
 	connectedCallback() {
-		(DC as any).trigger(this, 'Connected');
+		this.dispatchEvent( new CustomEvent('_mcConnected') );
+	}
+
+	connectedMoveCallback() {
+		this.dispatchEvent( new CustomEvent('_mcConnectedMove') );
 	}
 
 	disconnectedCallback() {
-		(DC as any).trigger(this, 'Disconnected');
+		this.dispatchEvent( new CustomEvent('_mcDisconnected') );
 	}
 
 	adoptedCallback() {
-		(DC as any).trigger(this, 'Adopted');
+		this.dispatchEvent( new CustomEvent('_mcAdopted') );
 	}
 
 	attributeChangedCallback(name: string, oldValue: any, newValue: any) {
-		(DC as any).trigger(this, 'AttributeChanged', { name, oldValue, newValue });
+		this.dispatchEvent( 
+			new CustomEvent(
+				'_mcAttributeChanged', 
+				{ detail: { name, oldValue, newValue } } 
+			) 
+		);
+	}
+
+	formResetCallback(){
+		this.dispatchEvent( new CustomEvent('_mcFormReset') );
 	}
 }
 
@@ -32,9 +45,14 @@ function createNamedClass(
 	return Object.defineProperty(ClassBody, 'name', { value: name });
 }
 
+function isClass(func: any) {
+  return typeof func === 'function' 
+    && /^class\s/.test(Function.prototype.toString.call(func));
+}
+
 export function defineCE(
 	tagName: string,
-	DefinitionClass: { new (...args: any[]): any },
+	DefinitionClass: { new (...args: any[]): any } | Function,
 	observedAttributes: string[] = []
 ) {
 	if (customElements.get(tagName)) {
@@ -50,6 +68,27 @@ export function defineCE(
 
 	let name = kebabToPascal(tagName);
 
+	// not a class, but a function
+	if ( !isClass( DefinitionClass.prototype.constructor ) ){
+		customElements.define(
+			tagName,
+			// @ts-ignore
+			DefinitionClass
+		);
+		return;
+	}
+
+	// a class, but not a MC
+	if ( !( DefinitionClass.prototype instanceof McBase ) ){
+		customElements.define(
+			tagName,
+			// @ts-ignore
+			DefinitionClass
+		);
+		return;
+	}
+
+	// a MC
 	customElements.define(
 		tagName,
 		createNamedClass(
@@ -59,7 +98,11 @@ export function defineCE(
 
 				constructor(data?: any) {
 					super();
-					let instance = new DefinitionClass(this, data);
+					// @ts-ignore
+					const instance = isClass( DefinitionClass ) 
+						// @ts-ignore
+						? new DefinitionClass(this, data)
+						: DefinitionClass;
 					DC.add(this, name, instance);
 				}
 

package/public/src/formValues.d.ts

@@ -0,0 +1,3 @@
+import { LooseObject } from './helpers.js';
+export declare function formValues(targetObject: LooseObject, propertyName: string, dom: HTMLElement | ShadowRoot): void;
+//# sourceMappingURL=formValues.d.ts.map

package/public/src/formValues.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formValues.d.ts","sourceRoot":"","sources":["../src/formValues.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAsB,MAAM,cAAc,CAAC;AA0M/D,wBAAgB,UAAU,CACzB,YAAY,EAAE,WAAW,EACzB,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,WAAW,GAAG,UAAU,QAgB7B"}

package/public/src/formValues.js

@@ -0,0 +1,162 @@
+'use strict';
+import { copyGettersSetters } from './helpers.js';
+import { DC } from './MC.js';
+import { observe } from './observables.js';
+const getInputName = (e) => {
+    return e.tagName.toLowerCase();
+};
+class InputBase {
+    constructor(e) { }
+}
+class RadioHandler extends InputBase {
+    #e;
+    constructor(e) {
+        super(e);
+        this.#e = e;
+    }
+    get val() {
+        let ret = new FormData(this.#e.form).get(this.#e.name);
+        return ret;
+    }
+    set val(value) {
+        let arr = [
+            ...this.#e.form.querySelectorAll(`input[type="radio"][name="${this.#e.name}"]`),
+        ];
+        arr
+            .filter((e) => e.getAttribute('value') === value)
+            .shift().checked = true;
+    }
+}
+class CheckboxHandler extends InputBase {
+    #e;
+    constructor(e) {
+        super(e);
+        this.#e = e;
+    }
+    get val() {
+        return this.#e.checked;
+    }
+    set val(value) {
+        this.#e.checked = value;
+    }
+}
+class InputHandler extends InputBase {
+    #e;
+    constructor(e) {
+        super(e);
+        this.#e = e;
+    }
+    get val() {
+        return this.#e.value;
+    }
+    set val(value) {
+        this.#e.value = value;
+    }
+}
+class SelectHandler extends InputBase {
+    #e;
+    #multi = false;
+    constructor(e) {
+        super(e);
+        this.#e = e;
+        this.#multi = e.multiple;
+    }
+    get val() {
+        const that = this, ret = [];
+        [...that.#e.querySelectorAll('option')]
+            .filter((o) => o.selected)
+            .forEach((o) => {
+            ret.push(o.value);
+        });
+        if (this.#multi)
+            return ret;
+        return ret.length ? ret[0] : '';
+    }
+    set val(value) {
+        const that = this;
+        value = typeof value === 'string' ? [value] : value;
+        [...that.#e.querySelectorAll('option')].forEach((o) => {
+            if (value.indexOf(o.value) > -1) {
+                o.selected = true;
+            }
+            else {
+                o.selected = false;
+            }
+        });
+    }
+}
+class TextAreaHandler extends InputBase {
+    #e;
+    constructor(e) {
+        super(e);
+        this.#e = e;
+    }
+    get val() {
+        return this.#e.value || '';
+    }
+    set val(value) {
+        this.#e.value = value;
+    }
+}
+const getInputHandlers = (e) => {
+    let inputList = [
+        ...(e || document).querySelectorAll('input,select,textarea'),
+    ], handlers = {};
+    inputList.forEach((i) => {
+        const name = i.getAttribute('name');
+        if (name) {
+            let handler = false;
+            switch (getInputName(i)) {
+                case 'input':
+                    switch (i.type) {
+                        case 'radio':
+                            handler = new RadioHandler(i);
+                            break;
+                        case 'checkbox':
+                            handler = new CheckboxHandler(i);
+                            break;
+                        default:
+                            handler = new InputHandler(i);
+                    }
+                    break;
+                case 'select':
+                    handler = new SelectHandler(i);
+                    break;
+                case 'textarea':
+                    handler = new TextAreaHandler(i);
+                    break;
+                default:
+                    console.warn('handler missing:', name, 'for', i.tagName.toLowerCase(), i);
+                    break;
+            }
+            if (handler) {
+                DC.add(i, name, handler);
+                Object.defineProperty(handlers, name, {
+                    enumerable: true,
+                    configurable: true,
+                    get: () => {
+                        return handler.val;
+                    },
+                    set: (value) => {
+                        if (handler.val !== value) {
+                            handler.val = value;
+                        }
+                    },
+                });
+            }
+        }
+    });
+    return handlers;
+};
+export function formValues(targetObject, propertyName, dom) {
+    let handlers = getInputHandlers(dom);
+    targetObject[propertyName] = Object.assign({}, handlers);
+    observe(targetObject, propertyName);
+    copyGettersSetters(handlers, targetObject[propertyName]);
+    [...dom.querySelectorAll('input, textarea, select')].forEach((input) => {
+        input.addEventListener('input', (ev) => {
+            targetObject[propertyName].notify();
+        });
+    });
+}
+//# sourceMappingURL=formValues.js.map

package/public/src/formValues.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formValues.js","sourceRoot":"","sources":["../src/formValues.ts"],"names":[],"mappings":"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"}

package/public/src/formValues.ts

@@ -1,7 +1,7 @@
 'use strict';
 
 import { LooseObject, copyGettersSetters } from './helpers.js';
-import { DC, addListener } from './MC.js';
+import { DC, on } from './MC.js';
 import { observe } from './observables.js';
 
 type inputTypes = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
@@ -216,8 +216,8 @@ export function formValues(
 	copyGettersSetters(handlers, targetObject[propertyName]);
 
 	[...dom.querySelectorAll('input, textarea, select')].forEach((input) => {
-		addListener(input as inputTypes, 'input', (ev: Event) => {
-			//console.log('keyup', ev);
+		input.addEventListener('input', (ev) => {
+			//console.log('input event', input, ev);
 			targetObject[propertyName].notify();
 		});
 	});

package/public/src/helpers.d.ts

@@ -0,0 +1,14 @@
+export interface LooseObject {
+    [key: string | symbol]: any;
+}
+export declare function isNativeObject(value: any): boolean;
+export declare function sortObject(o: LooseObject): LooseObject;
+export declare function flattenObject(o: LooseObject, doSort?: boolean): LooseObject;
+export declare function deepEqual(o1: LooseObject, o2: LooseObject): boolean;
+export declare function nameSpace(ns: string | string[], obj?: LooseObject): any;
+export declare function parse(what: string | Object | any[], parseThis: Object): any;
+export declare function kebabToPascal(str: string): string;
+export declare function debounce(func: Function, milliseconds: number): Function;
+export declare function htmlToElements(html: string): HTMLElement[];
+export declare function copyGettersSetters(source: LooseObject, target: LooseObject): void;
+//# sourceMappingURL=helpers.d.ts.map

package/public/src/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../src/helpers.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,WAAW;IAC3B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC;CAC5B;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,GAAG,GAAG,OAAO,CAElD;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,WAAW,GAAG,WAAW,CAatD;AAED,wBAAgB,aAAa,CAC5B,CAAC,EAAE,WAAW,EACd,MAAM,GAAE,OAAc,GACpB,WAAW,CAmBb;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,WAAW,GAAG,OAAO,CAInE;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,GAAG,GAAE,WAAgB,GAAG,GAAG,CAW3E;AAED,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,EAAE,EAAE,SAAS,EAAE,MAAM,OAyCrE;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,UAKxC;AAED,wBAAgB,QAAQ,CAAC,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,GAAG,QAAQ,CASvE;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,EAAE,CAU1D;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,QAO1E"}

package/public/src/helpers.js

@@ -0,0 +1,113 @@
+'use strict';
+export function isNativeObject(value) {
+    return value && value['constructor'] && value.constructor === Object;
+}
+export function sortObject(o) {
+    let result = {}, keys = [...Object.keys(o)].sort();
+    keys.forEach((key) => {
+        if (isNativeObject(o[key])) {
+            result[key] = sortObject(o[key]);
+        }
+        else {
+            result[key] = o[key];
+        }
+    });
+    return result;
+}
+export function flattenObject(o, doSort = true) {
+    let result = {};
+    [...Object.getOwnPropertyNames(o)].forEach((propName) => {
+        if (o[propName] &&
+            o[propName]['constructor'] &&
+            o[propName].constructor === Object) {
+            const temp = flattenObject(o[propName], false);
+            for (const j in temp) {
+                result[propName + '.' + j] = temp[j];
+            }
+        }
+        else {
+            result[propName] = o[propName];
+        }
+    });
+    return doSort ? sortObject(result) : result;
+}
+export function deepEqual(o1, o2) {
+    return (JSON.stringify(flattenObject(o1)) === JSON.stringify(flattenObject(o2)));
+}
+export function nameSpace(ns, obj = {}) {
+    let nsa = ns.constructor === String ? ns.split('.') : ns;
+    if (!obj || !nsa[0] || !obj[nsa[0]]) {
+        console.warn('ns', nsa[0], 'not in', obj);
+        return;
+    }
+    if (obj[nsa[0]].constructor === Object && nsa.length > 1) {
+        return nameSpace(nsa.splice(1), obj[nsa[0]]);
+    }
+    return obj[nsa[0]];
+}
+export function parse(what, parseThis) {
+    var args = Array.from(arguments);
+    if (args.length > 2) {
+        while (args.length > 1) {
+            args[0] = parse(args[0], args[1]);
+            args.splice(1, 1);
+        }
+        return args[0];
+    }
+    if (typeof what === 'string') {
+        what.match(/\{[^\{\}]*\}/g)?.forEach(function (pPropname) {
+            var propname = pPropname.substring(1, pPropname.length - 1), value = nameSpace(propname, parseThis);
+            if (typeof value !== 'undefined') {
+                what = what.replace(pPropname, value);
+            }
+        });
+    }
+    else if (isNativeObject(what)) {
+        switch (what.constructor) {
+            case Object:
+                Object.keys(what).forEach(function (pKey) {
+                    if (what.hasOwnProperty(pKey)) {
+                        what[pKey] = parse(what[pKey], parseThis);
+                    }
+                });
+                break;
+            case Array:
+                what.forEach(function (pValue, pKey, original) {
+                    original[pKey] = parse(what[pKey], parseThis);
+                });
+                break;
+        }
+    }
+    return what;
+}
+export function kebabToPascal(str) {
+    return str
+        .split('-')
+        .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+        .join('');
+}
+export function debounce(func, milliseconds) {
+    let timeout;
+    return () => {
+        clearTimeout(timeout);
+        timeout = setTimeout(function () {
+            func(...arguments);
+        }, milliseconds);
+    };
+}
+export function htmlToElements(html) {
+    let template = document.createElement('template');
+    html = html.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi, '<$1$2></$1>');
+    template.innerHTML = html;
+    template.content.normalize();
+    return Array.from(template.content.childNodes);
+}
+export function copyGettersSetters(source, target) {
+    const descriptors = Object.getOwnPropertyDescriptors(source);
+    for (const [key, descriptor] of Object.entries(descriptors)) {
+        if ('get' in descriptor || 'set' in descriptor) {
+            Object.defineProperty(target, key, descriptor);
+        }
+    }
+}
+//# sourceMappingURL=helpers.js.map

package/public/src/microcomponents.d.ts

@@ -0,0 +1,6 @@
+export * from './helpers.js';
+export * from './MC.js';
+export * from './elements.js';
+export * from './observables.js';
+export * from './formValues.js';
+//# sourceMappingURL=microcomponents.d.ts.map

package/public/src/microcomponents.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"microcomponents.d.ts","sourceRoot":"","sources":["../src/microcomponents.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AAExB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AAEjC,cAAc,iBAAiB,CAAC"}

package/public/src/microcomponents.js

@@ -0,0 +1,7 @@
+"use strict";
+export * from './helpers.js';
+export * from './MC.js';
+export * from './elements.js';
+export * from './observables.js';
+export * from './formValues.js';
+//# sourceMappingURL=microcomponents.js.map

package/public/src/microcomponents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"microcomponents.js","sourceRoot":"","sources":["../src/microcomponents.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AACb,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AAExB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AAEjC,cAAc,iBAAiB,CAAC"}

package/public/src/microcomponents.ts

@@ -1,7 +1,7 @@
 "use strict";
 export * from './helpers.js';
 export * from './MC.js';
-export * from './McEvent.js';
+//export * from './McEvent.js';
 export * from './elements.js';
 export * from './observables.js';
 //export * from './selectors.js';

package/public/src/observables.d.ts

@@ -0,0 +1,11 @@
+import { LooseObject } from './helpers.js';
+type Callback = (value: any) => void;
+export type Observable = {
+    observe: (cb: Callback) => void;
+    notify: () => void;
+    bind: (target: HTMLElement | DocumentFragment | ShadowRoot) => void;
+    callbacks: Array<Function>;
+};
+export declare const observe: (target: LooseObject, propertyName?: string) => LooseObject;
+export {};
+//# sourceMappingURL=observables.d.ts.map

package/public/src/observables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../src/observables.ts"],"names":[],"mappings":"AAEA,OAAO,EACN,WAAW,EAKX,MAAM,cAAc,CAAC;AAQtB,KAAK,QAAQ,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;AAuKrC,MAAM,MAAM,UAAU,GAAG;IACxB,OAAO,EAAE,CAAC,EAAE,EAAE,QAAQ,KAAK,IAAI,CAAC;IAChC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,CAAC,MAAM,EAAE,WAAW,GAAG,gBAAgB,GAAG,UAAU,KAAM,IAAI,CAAC;IACrE,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC3B,CAAC;AAyHF,eAAO,MAAM,OAAO,WACX,WAAW,iBACJ,MAAM,KACnB,WAuGF,CAAC"}