@twobirds/microcomponents 0.0.50 → 0.0.51

package/src/formValues.ts

@@ -1,8 +1,8 @@
 'use strict';
 
 import { LooseObject, copyGettersSetters } from './helpers.js';
-import { DC, HTMLMcElement, addListener } from './MC.js';
-import { Observable, observe } from './observables.js';
+import { DC, addListener } from './MC.js';
+import { observe } from './observables.js';
 
 type inputTypes = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
 
@@ -160,8 +160,7 @@ const getInputHandlers = (e: HTMLElement | ShadowRoot): LooseObject => {
 		if (name) {
 			let h: InputBase,
 				type = (i as HTMLInputElement).type,
-				handler: any,
-				setter: DC;
+				handler: any;
 			switch (getInputName(i as inputTypes)) {
 				case 'input':
 					switch (type) {
@@ -172,26 +171,26 @@ const getInputHandlers = (e: HTMLElement | ShadowRoot): LooseObject => {
 									? e
 									: e.querySelector('form')) as HTMLFormElement
 							);
-							setter = DC.add(i, name, handler);
+							DC.add(i, name, handler);
 							break;
 						case 'checkbox':
 							handler = new CheckboxHandler(i as HTMLInputElement);
-							setter = DC.add(i, name, handler);
+							DC.add(i, name, handler);
 							break;
 						default:
 							handler = new InputHandler(i as HTMLInputElement);
-							setter = DC.add(i, name, handler);
+							DC.add(i, name, handler);
 					}
 
 					Object.defineProperty(handlers, name, {
 						enumerable: true,
 						configurable: true,
 						get: (): any => {
-							return (setter as unknown as SelectHandler).val;
+							return handler.val;
 						},
 						set: (value: any) => {
-							if ((setter as unknown as InputHandler).val !== value) {
-								(setter as unknown as InputHandler).val = value;
+							if (handler.val !== value) {
+								handler.val = value;
 							}
 						},
 					});
@@ -199,32 +198,32 @@ const getInputHandlers = (e: HTMLElement | ShadowRoot): LooseObject => {
 					break;
 				case 'select':
 					handler = new SelectHandler(i as HTMLSelectElement);
-					setter = DC.add(i, name, handler);
+					DC.add(i, name, handler);
 					Object.defineProperty(handlers, name, {
 						enumerable: true,
 						configurable: true,
 						get: (): any => {
-							return (setter as unknown as SelectHandler).val;
+							return handler.val;
 						},
 						set: (value: any) => {
-							if ((setter as unknown as SelectHandler).val !== value) {
-								(setter as unknown as SelectHandler).val = value;
+							if (handler.val !== value) {
+								handler.val = value;
 							}
 						},
 					});
 					break;
 				case 'textarea':
 					handler = new TextAreaHandler(i as HTMLTextAreaElement);
-					setter = DC.add(i, name, handler);
+					DC.add(i, name, handler);
 					Object.defineProperty(handlers, name, {
 						enumerable: true,
 						configurable: true,
 						get: (): any => {
-							return (setter as unknown as TextAreaHandler).val;
+							return handler.val;
 						},
 						set: (value: any) => {
-							if ((setter as unknown as TextAreaHandler).val !== value) {
-								(setter as unknown as TextAreaHandler).val = value;
+							if (handler.val !== value) {
+								handler.val = value;
 							}
 						},
 					});

package/public/3d.html

@@ -1,42 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>3D Positioned Image with CSS</title>
-    <style>
-        body {
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            background-color: #222;
-            perspective: 800px; /* Depth effect */
-        }
-
-        .container {
-            width: 300px;
-            height: 200px;
-            transform-style: preserve-3d; /* Needed for 3D transformations */
-        }
-
-        .image3d {
-            width: 100%;
-            height: 100%;
-            transform: rotateY(20deg) rotateX(10deg) translateZ(50px);
-            transition: transform 0.5s ease-in-out;
-            box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5);
-        }
-
-        /* Hover effect */
-        .container:hover .image3d {
-            transform: rotateY(-20deg) rotateX(-10deg) translateZ(100px);
-        }
-    </style>
-</head>
-<body>
-    <div class="container">
-        <img class="image3d" src="https://via.placeholder.com/300x200" alt="3D Image">
-    </div>
-</body>
-</html>

package/public/Grandparent.css

@@ -1,13 +0,0 @@
-test-grandparent,
-test-parent,
-test-child,
-test-grandchild,
-test-greatgrandchild {
-	display: inline-block;
-	padding: 2px;
-	margin: 1px;
-	border: 1px solid darkslategray;
-	border-radius: 2px;
-}
-
-/*# sourceMappingURL=GrandParent.css.map */

package/public/Grandparent.js

@@ -1,338 +0,0 @@
-!(function (t, e) {
-	'object' == typeof exports && 'object' == typeof module
-		? (module.exports = e())
-		: 'function' == typeof define && define.amd
-		? define([], e)
-		: 'object' == typeof exports
-		? (exports.Grandparent = e())
-		: (t.Grandparent = e());
-})(this, () =>
-	(() => {
-		'use strict';
-		var t = new Function('try {return this===window;}catch(e){ return false;}');
-		let e = new Set();
-		t() &&
-			Object.keys(HTMLElement.prototype)
-				.filter((t) => /^on/.test(t))
-				.forEach((t) => e.add(t));
-		class n {
-			#t;
-			#e = !1;
-			#n = !1;
-			constructor(t, e = {}, n = 'l') {
-				(this.#t = t), (this.data = e), (this.bubble = n);
-			}
-			get type() {
-				return this.#t;
-			}
-			get stopped() {
-				return this.#e;
-			}
-			get immediateStopped() {
-				return this.#n;
-			}
-			stopPropagation() {
-				this.#e = !0;
-			}
-			stopImmediatePropagation() {
-				this.stopPropagation(), (this.#n = !0);
-			}
-		}
-		var r = new Function('try {return this===window;}catch(e){ return false;}');
-		let o = new Set();
-		function s(t, e) {
-			let n = [];
-			return (
-				t.forEach((t) => {
-					if (t && t instanceof HTMLElement) {
-						const r = t?._mc;
-						!e && r
-							? (n = n.concat(Object.values(t._mc)))
-							: e && r && r[e] && n.push(r[e]);
-					}
-				}),
-				n
-			);
-		}
-		function c(t, e, n = !0) {
-			let r = [];
-			for (; t; ) {
-				if (
-					t._mc &&
-					(e
-						? e && t._mc[e] && r.push(t._mc[e])
-						: (r = r.concat(Object.values(t._mc))),
-					n)
-				)
-					return r;
-				t = t.parentNode;
-			}
-			return r;
-		}
-		function i(t) {
-			return t && t instanceof HTMLElement;
-		}
-		function a(t, e, n = {}) {
-			let r = t;
-			if (!r._mc) {
-				let e = f?.debug;
-				(f.debug = !1), (r._mc = new f(t)), (f.debug = e), delete r._mc._mc;
-			}
-			const o = r._mc;
-			return (
-				e.length &&
-					!o[e] &&
-					((o[e] = n), t instanceof HTMLElement && t.setAttribute('_mc', '')),
-				n
-			);
-		}
-		function u(t, e) {
-			if (!e) return;
-			const n = t?._mc || {};
-			n && n[e] && delete n[e],
-				!Object.keys(n).length &&
-					t instanceof HTMLElement &&
-					t.hasAttribute('_mc') &&
-					t.removeAttribute('_mc');
-		}
-		function l(t, e, r = {}, o = 'l') {
-			let s = t?._mc;
-			if (!s) return;
-			let c = e instanceof n ? new n(e.type, e.data, 'l') : new n(e, r, 'l'),
-				i = 'string' != typeof e ? e : new n(e, r, o);
-			[...Object.values(s)].forEach((t) => {
-				t?.trigger && 'function' == typeof t?.trigger && t?.trigger(c);
-			}),
-				/[ud]/.test(i.bubble) && p(t, i);
-		}
-		function p(t, e) {
-			/[ud]/.test(e.bubble) &&
-				setTimeout(() => {
-					if (
-						(-1 === e.bubble.indexOf('l') && (e.bubble += 'l'),
-						e.bubble.indexOf('u') > -1)
-					) {
-						let n = c(t, '', !0)?.[0].target;
-						n && f.trigger(n, e);
-					}
-					e.bubble.indexOf('d') > -1 &&
-						new Set(t._mc.children().map((t) => t?.target)).forEach((t) => {
-							t && f.trigger(t, e);
-						});
-				}, 0);
-		}
-		r() &&
-			Object.keys(HTMLElement.prototype)
-				.filter((t) => /^on/.test(t))
-				.forEach((t) => o.add(t));
-		class d {
-			#r;
-			constructor(t, e = !1) {
-				var n;
-				(this.#r = new WeakRef(t || {})),
-					(n = this).constructor !== f &&
-						setTimeout(() => {
-							n.trigger('Init');
-						}, 0),
-					(function (t) {
-						if (!r() || t.constructor === f) return;
-						const e = t.target;
-						if (e instanceof HTMLElement) {
-							let n = t;
-							Object.getOwnPropertyNames(n.constructor.prototype)
-								.filter(
-									(t) =>
-										/^on[A-Z]|one[A-Z]/.test(t) &&
-										'function' == typeof n.constructor.prototype[t]
-								)
-								.forEach((r) => {
-									let s = /^one/.test(r),
-										c = r.replace(/^on[e]{0,1}/, ''),
-										i = c.toLowerCase();
-									s &&
-										Object.defineProperty(t, 'on' + c, {
-											configurable: !0,
-											enumerable: !1,
-											writable: !0,
-											value: (t) => {
-												n.constructor.prototype[r].bind(n)(t);
-											},
-										}),
-										o.has('on' + i) &&
-											(function (t, e, n, r = !1, o = !1) {
-												let s = { once: !1 };
-												r && (s.capture = r),
-													o && (s.once = o),
-													t.addEventListener(e, n, s);
-											})(
-												e,
-												i,
-												(t) => {
-													n.trigger(c, t);
-												},
-												!1,
-												s
-											);
-								});
-						}
-					})(this);
-			}
-			get target() {
-				return this.#r.deref();
-			}
-		}
-		class g extends d {
-			_mc = {};
-			constructor(t) {
-				super(t);
-			}
-			static trigger = l;
-			trigger(t, e = {}, r = 'l') {
-				let o = this;
-				if (o.constructor === g || o.constructor === f) {
-					let s =
-							t instanceof n ? new n(t.type, t.data, 'l') : new n(t, e, 'l'),
-						c = 'string' != typeof t ? t : new n(t, e, r);
-					return (
-						[...Object.getOwnPropertyNames(o)].forEach((t) => {
-							o[t]?.trigger &&
-								'function' == typeof o[t]?.trigger &&
-								o[t]?.trigger(s);
-						}),
-						void (/[ud]/.test(c.bubble) && p(o.target, c))
-					);
-				}
-				if (o instanceof g || o instanceof f) {
-					const o = this,
-						s = 'string' != typeof t ? t : new n(t, e, r),
-						c = 'on' + s.type[0].toUpperCase() + s.type.slice(1);
-					if (
-						(s.bubble.indexOf('l') > -1 &&
-							(s.immediateStopped ||
-								'function' != typeof o[c] ||
-								(o[c](s), o.hasOwnProperty(c) && delete o[c])),
-						s.stopped || 'l' === s.bubble)
-					)
-						return o;
-					/[ud]/.test(s.bubble) && p(o.target, s);
-				}
-			}
-		}
-		class f extends d {
-			_mc = {};
-			constructor(t, e = !1) {
-				super(t);
-			}
-			static add = a;
-			static remove = u;
-			static trigger = l;
-			trigger(t, e = {}, n) {
-				g.prototype.trigger.call(this, t, e, n);
-			}
-			parent(t = '') {
-				let e = this.target;
-				return i(e) ? c(e.parentNode, t, !0) : [];
-			}
-			ancestors(t = '') {
-				let e = this?.target;
-				return i(e) ? c(this.target.parentNode, t, !1) : [];
-			}
-			children(t = '') {
-				let e = this?.target;
-				if (!i(e)) return [];
-				const n = Math.random().toString().replace('.', ''),
-					r = '[_mc]:not([temp_id="' + n + '"] [_mc] [_mc])';
-				e.setAttribute('temp_id', n);
-				const o = s([...e.querySelectorAll(r)], t);
-				return e.removeAttribute('temp_id'), o;
-			}
-			descendants(t = '') {
-				let e = this?.target;
-				return i(e) ? s([...e.querySelectorAll('*[_mc]')], t) : [];
-			}
-		}
-		new Map();
-		class m extends HTMLElement {
-			constructor() {
-				super();
-			}
-			connectedCallback() {
-				f.trigger(this, 'Connected');
-			}
-			disconnectedCallback() {
-				f.trigger(this, 'Disconnected');
-			}
-			adoptedCallback() {
-				f.trigger(this, 'Adopted');
-			}
-			attributeChangedCallback(t, e, n) {
-				f.trigger(this, 'AttributeChanged', {
-					name: t,
-					oldValue: e,
-					newValue: n,
-				});
-			}
-		}
-		function b(t, e, n = []) {
-			if (customElements.get(t))
-				return void console.warn(
-					`IGNORED: Custom element "${t}" is already defined!`
-				);
-			if (!t.includes('-'))
-				throw new Error(
-					'createCustomElement: tagName must contain at least one hyphen ("-").'
-				);
-			let r = t
-				.split('-')
-				.map((t) => t.charAt(0).toUpperCase() + t.slice(1))
-				.join('');
-			customElements.define(
-				t,
-				(function (t, e) {
-					return Object.defineProperty(e, 'name', { value: t });
-				})(
-					r,
-					class extends m {
-						instance;
-						constructor(t) {
-							super();
-							let n = new e(this, t);
-							f.add(this, r, n);
-						}
-						static get observedAttributes() {
-							return n;
-						}
-					}
-				)
-			);
-		}
-		b(
-			'test-parent',
-			class extends f {
-				constructor(t) {
-					super(t);
-				}
-				onConnected() {
-					console.log('TestParent onConnect');
-				}
-			}
-		);
-		const h = customElements.get('test-parent');
-		return (
-			b(
-				'test-grandparent',
-				class extends f {
-					constructor(t) {
-						super(t);
-					}
-					onConnected() {
-						let t = this;
-						for (let e = 0; e < 5; e++) t.target.append(new h());
-						console.log('Grandparent onConnect');
-					}
-				}
-			),
-			{}
-		);
-	})()
-);