@twobirds/microcomponents 0.0.82 → 0.0.83

package/public/test/MC.ts

@@ -267,13 +267,14 @@ function bubbleEvent(target: HTMLElement, ev: McEvent) {
 }
 
 class McBase {
-	#target: WeakRef<any>; // avoid circular reference
+	private _target: WeakRef<any>; // avoid circular reference
+	private __mc: LooseObject = {};
 
 	constructor(target?: { [key: string]: any }, debug: boolean = false) {
 		let that: unknown = this,
 			element = that as MC | DC;
 
-		this.#target = new WeakRef(target || {});
+		this._target = new WeakRef(target || {});
 
 		init(element); // async lifecycle event
 
@@ -281,13 +282,15 @@ class McBase {
 	}
 
 	get target(): any {
-		return this.#target.deref();
+		return this._target.deref();
+	}
+
+	get _mc(): any {
+		return this.__mc;
 	}
 }
 
 class MC extends McBase {
-	_mc?: LooseObject = {};
-
 	constructor(target?: any) {
 		super(target);
 	}
@@ -364,8 +367,6 @@ class MC extends McBase {
 }
 
 class DC extends McBase {
-	_mc?: LooseObject = {};
-
 	constructor(target: HTMLElement, debug: boolean = false) {
 		super(target);
 	}
@@ -410,45 +411,15 @@ class DC extends McBase {
 	}
 }
 
-/*
-unresolvedCEs (code below this comment):
-
-a repository (a hashmap) of undefined custom elements: 
-the name is the tagname of the micro component (like "my-custom-component")
-if they are loading, the value is a script element
-if they are loaded, the entry is deleted and the browser instanciates it automatically
-if they cannot be loaded, the browser will throw an error
+const loadingMCs = new Set<string>();
 
-If the custom element ( defined by its tagname, like "my-custom-component") is not defined, it will be on-demand loaded:
-The file name is assumed to be "/my/custom/component.js"
-The file must define a custom element via the defineCE() function included in the "elements" module. 
-This function is a wrapper for customElementRegistry.define(), which you can also use directly in the imported code.
+function makeLoadScript( element: string ) {
 
-In general this behaves like a custom runtime import for custom elements in the browser.
-The only difference is that the micro component is loaded only when needed, and not on page load.
-*/	
+	if ( loadingMCs.has( element ) ) return; // already loading
 
-const CEs = new Map();
-
-/*
-loadedMCs (code below this comment): 
-a repository (a hashmap) of micro components: 
-the name is the name of the micro component (like "my-mc")
-if they are loading, the value is a script element
-if they are loaded, the value is the micro component class itself
-
-This is mostly used for old style progressive enhancement:
-If the micro component ( defined in the HTMLElements "_mc" attribute, like "my-mc") is not defined, it will be on-demand loaded:
-The file name is assumed to be "/my/mc.js"
-The file needs to have a default export, and it should be a class that extends the DC class ( since it is in a HTMLElements attribute )
-
-In general this behaves like a custom runtime import for classes in the browser.
-The only difference is that the micro component is loaded only when needed, and not on page load.
-*/	
-const MCs = new Map(); 
-
-function makeLoadScript( element: string ): HTMLScriptElement {
+	loadingMCs.add( element );
 
+	//console.log( 'makeLoadScript:', element);
 	const fileName: string = './' + element.split('-').join('/')+'.js';	
 
 	const se: HTMLScriptElement = document.createElement('script');
@@ -457,123 +428,76 @@ function makeLoadScript( element: string ): HTMLScriptElement {
 	se.setAttribute('blocking', 'render');
 	se.async = true;
 	se.setAttribute('type', 'module');
-	se.setAttribute( 'name', element);
+	se.setAttribute( 'data-name', element);
 	se.setAttribute( 'loading', '');
 
-	addListener( se, 'load', (ev) => {
-		// console.info('loaded MC', elementName);
-		se.removeAttribute( 'loading' );
-		se.setAttribute( 'loaded', '');
-	});
+	const loadedPromise = customElements.whenDefined( element );
 
-	addListener( se, 'error', (ev) => {
-		console.error('could not load Custom Element code from', fileName);
-	});
+	loadedPromise.then( () => {
+		const elements: HTMLElement[] = Array
+					.from(document.querySelectorAll(`[_mc*="${element}"]`))
+					.filter( element => element instanceof HTMLElement );
 
-	return se;
-}
+		if ( elements.length === 0 ) return;
 
-function onLoadCallback( script: HTMLScriptElement ) {
-	// create callback script tag
-	// it is essential to do this in a timeout and via another script tag, 
-	// to force it to be a top level module allowing for the use of "import"
-	setTimeout( function(){
-		// create callback script tag
-		const importFileName = script.getAttribute('src');
-		const elementName = script.getAttribute('name');
-		
-		const se: HTMLScriptElement = document.createElement('script');
-
-		se.async = true;
-		se.setAttribute( 'type', 'module');
-
-		// --- autoload script
-		const code = /*javascript*/`
-
-			import _ from "${importFileName}";
-			import { DC } from "./microcomponents.js";
-
-			const elements = Array.from(document.querySelectorAll('[_mc*="${elementName}"]')).filter( element => element instanceof HTMLElement );
-
-			elements.forEach((element) => {
-				// add class to MCs repository
-				autoload.state.MCs.set( '${elementName}', _ );
-				// add instance to HTMLElement 
-				DC.add(element, _.name, new _(element));
-				// remove instance name from elements "_mc" attribute
-				element.setAttribute('_mc', element.getAttribute('_mc').replace('${elementName}', '').replace( /\w\w/g, ' ').trim()); 
-			});
+		//console.log( 'loadedPromise elements', elements );
 
-			setTimeout( () => {
-				document.body.querySelector('script[name="${elementName}]"')?.remove();
-			},0);
+		const klass = customElements.get( element );
 
-		`;
-		// --- end autoload script
+		elements.forEach((node: HTMLElement) => {
+			//console.log( 'add', klass!.name, 'to', node );
+			DC.add(node, klass!.name, new klass!(node));
 
-		se.innerHTML = code;
-		document.body.append(se);
-	}, 0);
+			//@ts-ignore
+			const new_mc = node
+				.getAttribute( '_mc' )
+				.split(' ')
+				.filter( (name) => name !== element && name !== '' )
+				.join(' ');
+
+			//@ts-ignore
+			node.setAttribute( 
+				'_mc',
+				//@ts-ignore
+				new_mc
+			)
+		});
+
+		document.head.querySelector('script[data-name="${elementName}]"')?.remove();
+	});
+
+	addListener( se, 'load', (ev) => {
+		loadingMCs.delete( element );
+	});
+
+	addListener( se, 'error', (ev) => {
+		console.error('could not load MC code from', fileName);
+	});
+
+	document.head.append(se);
 }
 
-function loadUndefinedMicroComponents() {
+function loadUndefinedMCs() {
 
-	// load unresolved custom eleents
-	[ ...document.querySelectorAll(':not(:defined)') ] // undefined custom elements
+	// load unresolved custom elements
+	[ ...document.querySelectorAll(':not(:defined)') ]
 		.filter( (element) => !!element 
 			&& !customElements.get(element.tagName.toLowerCase()) // not in CustomElementsRegistry
-			&& !CEs.has(element.tagName.toLowerCase()) // not in loading list
+			&& !loadingMCs.has(element.tagName.toLowerCase()) // not in loading list
 		)
 		.forEach((el) => {
-			const elementName = el.tagName.toLowerCase(),
-				fileName: string = './'+elementName.split('-').join('/')+'.js';	
-
-			const se: HTMLScriptElement = makeLoadScript( elementName );
-
-			addListener( se, 'load', () => { 
-				CEs.set( elementName, customElements.get(el.tagName.toLowerCase()) );
-			});
-
-			CEs.set( elementName, 'loading');
-			document.head.append(se);
-
-			// instanciation of the micro component will be handled by the browser automatically
-			// module code must define the micro component class and add it to the customElementRegistry
+			//console.log( 'detected CE', el.tagName.toLowerCase() );
+			makeLoadScript( el.tagName.toLowerCase() );
 		});
 
-	[ ...document.querySelectorAll('[_mc]:not([_mc=""]') ] // undefined DOM components
+	// load unresolved  MCs defined in _mc attribute
+	[ ...document.querySelectorAll('[_mc]:not([_mc=""]') ]
 		.filter( (element) => !!element )
 		.forEach((el) => {
-			const elements = el.getAttribute('_mc')?.split(' ').filter( m => !!m ) || [];
-			const elementsToBeLoaded = elements.filter( m => !MCs.has( m ) );
-
-			// load MC components that do not exist yet
-			elementsToBeLoaded?.forEach( elementName => {
-				const se: HTMLScriptElement = makeLoadScript( elementName );
-
-				addListener( se, 'load', () => onLoadCallback( document.head.querySelector(`script[name="${elementName}"]`) as HTMLScriptElement) );
-			
-				MCs.set( elementName, 'loading');
-
-				document.head.append(se);
-			});
-
-			// loading MC components already have callbacks attached
-			const elementsAlreadyLoaded = elements.filter( m => MCs.has( m ) && !MCs.get( m )!.length); 
-
-			// MCs that are already loaded will trigger the onLoadCallback manually
-			elementsAlreadyLoaded?.forEach( elementName => {
-				setTimeout( ()=>{
-					//console.log('attaching', elementName, (autoload as any).state.MCs.get(elementName));
-					DC.add(el, elementName, new ( (autoload as any).state.MCs.get(elementName) as any)(el)); // add instance to DOM
-					
-					const newAttribute = (el as any).getAttribute('_mc')
-						.replace('${elementName}', '')
-						.replace( /\w\w/g, ' ')
-						.trim() || '_mc';
-
-					(el as any).setAttribute('_mc', ); // set new "_mc" attribute
-				}, 5);
+			const _mc = el.getAttribute('_mc')?.split(' ').filter( name => name !== '' );
+			_mc?.forEach( dc => {
+				//console.log( 'detected DC', dc );
+				makeLoadScript( dc );
 			});
 		});
 }
@@ -590,11 +514,11 @@ function autoload(enable: boolean = true): boolean {
 	}
 
 	autoloadEnabled = enable;
-	observer = new MutationObserver(loadUndefinedMicroComponents);
+	observer = new MutationObserver(loadUndefinedMCs);
 
 	setTimeout(() => {
 		observer!.observe(document.body, { childList: true, subtree: true });
-		loadUndefinedMicroComponents();
+		loadUndefinedMCs();
 	}, 5);
 
 	(window as any).autoload = (window as any).autoload || autoload;
@@ -602,7 +526,7 @@ function autoload(enable: boolean = true): boolean {
 	return autoloadEnabled;
 }
 
-(autoload as LooseObject).state = { CEs, MCs };
+(autoload as LooseObject).state = { loadingMCs };
 
 export { addListener, removeListener, McBase, MC, DC, McEvent, autoload };
 

package/public/test/elements.d.ts

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

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

@@ -1 +1 @@
-{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAkCA,wBAAgB,QAAQ,CACvB,OAAO,EAAE,MAAM,EACf,eAAe,EAAE;IAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAA;CAAE,EAC9C,kBAAkB,GAAE,MAAM,EAAO,QAkCjC;AAED,wBAAgB,KAAK,CAAC,OAAO,EAAE,MAAM,GAAG,wBAAwB,GAAG,SAAS,CAE3E"}
+{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAuCA,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/test/elements.js

@@ -1,5 +1,5 @@
 'use strict';
-import { DC } from './MC.js';
+import { DC, McBase } from './MC.js';
 import { kebabToPascal } from './helpers.js';
 class CeBaseClass extends HTMLElement {
     constructor() {
@@ -21,6 +21,10 @@ class CeBaseClass extends HTMLElement {
 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!`);
@@ -30,11 +34,21 @@ export function defineCE(tagName, DefinitionClass, observedAttributes = []) {
         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();
-            let instance = new DefinitionClass(this, data);
+            const instance = isClass(DefinitionClass)
+                ? new DefinitionClass(this, data)
+                : DefinitionClass;
             DC.add(this, name, instance);
         }
         static get observedAttributes() {

package/public/test/elements.min.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.elements=e():t.elements=e()}(this,(()=>(()=>{"use strict";var t={d:(e,r)=>{for(var n in r)t.o(r,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{defineCE:()=>_,getCE:()=>w});var r=new Function("try {return this===window;}catch(e){ return false;}");let n=new Set;r()&&Object.keys(HTMLElement.prototype).filter((t=>/^on/.test(t))).forEach((t=>n.add(t)));class o{#t;#e=!1;#r=!1;constructor(t,e={},r="l"){this.#t=t,this.data=e,this.bubble=r}get type(){return this.#t}get stopped(){return this.#e}get immediateStopped(){return this.#r}stopPropagation(){this.#e=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var i=new Function("try {return this===window;}catch(e){ return false;}");let c=new Set;function s(t,e){let r=[];return t.forEach((t=>{if(t&&t instanceof HTMLElement){const n=t?._mc;!e&&n?r=r.concat(Object.values(t._mc)):e&&n&&n[e]&&r.push(n[e])}})),r}function a(t,e,r=!0){let n=[];for(;t;){if(t._mc&&(e?e&&t._mc[e]&&n.push(t._mc[e]):n=n.concat(Object.values(t._mc)),r))return n;t=t.parentNode}return n}function u(t){return t&&t instanceof HTMLElement}function l(t,e,r={}){let n=t;if(!n._mc){let e=b?.debug;b.debug=!1,n._mc=new b(t),b.debug=e,delete n._mc._mc}const o=n._mc;return e.length&&!o[e]&&(o[e]=r,t instanceof HTMLElement&&!t.getAttribute("_mc")&&t.setAttribute("_mc","")),r}function p(t,e){if(!e)return;const r=t?._mc||{};r&&r[e]&&delete r[e],!Object.keys(r).length&&t instanceof HTMLElement&&t.hasAttribute("_mc")&&t.removeAttribute("_mc")}function d(t,e,r={},n="l"){let i=t?._mc;if(!i)return;let c=e instanceof o?new o(e.type,e.data,"l"):new o(e,r,"l"),s="string"!=typeof e?e:new o(e,r,n);[...Object.values(i)].forEach((t=>{t?.trigger&&"function"==typeof t?.trigger&&t?.trigger(c)})),/[ud]/.test(s.bubble)&&f(t,s)}function f(t,e){/[ud]/.test(e.bubble)&&setTimeout((()=>{if(-1===e.bubble.indexOf("l")&&(e.bubble+="l"),e.bubble.indexOf("u")>-1){let r=a(t,"",!0)?.[0].target;r&&b.trigger(r,e)}e.bubble.indexOf("d")>-1&&new Set(t._mc.children().map((t=>t?.target))).forEach((t=>{t&&b.trigger(t,e)}))}),0)}i()&&Object.keys(HTMLElement.prototype).filter((t=>/^on/.test(t))).forEach((t=>c.add(t)));class g{_target;__mc={};constructor(t,e=!1){var r;this._target=new WeakRef(t||{}),(r=this).constructor!==b&&setTimeout((()=>{r.trigger("Init")}),0),function(t){if(!i()||t.constructor===b)return;const e=t.target;if(e instanceof HTMLElement){let r=t;Object.getOwnPropertyNames(r.constructor.prototype).filter((t=>/^on[A-Z]|one[A-Z]/.test(t)&&"function"==typeof r.constructor.prototype[t])).forEach((n=>{let o=/^one/.test(n),i=n.replace(/^on[e]{0,1}/,""),s=i.toLowerCase();o&&Object.defineProperty(t,"on"+i,{configurable:!0,enumerable:!1,writable:!0,value:t=>{r.constructor.prototype[n].bind(r)(t)}}),c.has("on"+s)&&function(t,e,r,n=!1,o=!1){let i={once:!1};n&&(i.capture=n),o&&(i.once=o),t.addEventListener(e,r,i)}(e,s,(t=>{r.trigger(i,t)}),!1,o)}))}}(this)}get target(){return this._target.deref()}get _mc(){return this.__mc}}class m extends g{constructor(t){super(t)}static trigger=d;trigger(t,e={},r="l"){let n=this;if(n.constructor===m||n.constructor===b){let i=t instanceof o?new o(t.type,t.data,"l"):new o(t,e,"l"),c="string"!=typeof t?t:new o(t,e,r);return[...Object.getOwnPropertyNames(n)].forEach((t=>{n[t]?.trigger&&"function"==typeof n[t]?.trigger&&n[t]?.trigger(i)})),void(/[ud]/.test(c.bubble)&&f(n.target,c))}if(n instanceof m||n instanceof b){const n=this,i="string"!=typeof t?t:new o(t,e,r),c="on"+i.type[0].toUpperCase()+i.type.slice(1);if(i.bubble.indexOf("l")>-1&&(i.immediateStopped||"function"!=typeof n[c]||(n[c](i),n.hasOwnProperty(c)&&delete n[c])),i.stopped||"l"===i.bubble)return n;/[ud]/.test(i.bubble)&&f(n.target,i)}}}class b extends g{constructor(t,e=!1){super(t)}static add=l;static remove=p;static trigger=d;trigger(t,e={},r){m.prototype.trigger.call(this,t,e,r)}parent(t=""){let e=this.target;return u(e)?a(e.parentNode,t,!0):[]}ancestors(t=""){let e=this?.target;return u(e)?a(this.target.parentNode,t,!1):[]}children(t=""){let e=this?.target;if(!u(e))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';e.setAttribute("temp_id",r);const o=s([...e.querySelectorAll(n)],t);return e.removeAttribute("temp_id"),o}descendants(t=""){let e=this?.target;return u(e)?s([...e.querySelectorAll("*[_mc]")],t):[]}}new Set;class h extends HTMLElement{constructor(){super()}connectedCallback(){b.trigger(this,"Connected")}disconnectedCallback(){b.trigger(this,"Disconnected")}adoptedCallback(){b.trigger(this,"Adopted")}attributeChangedCallback(t,e,r){b.trigger(this,"AttributeChanged",{name:t,oldValue:e,newValue:r})}}function y(t){return"function"==typeof t&&/^class\s/.test(Function.prototype.toString.call(t))}function _(t,e,r=[]){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 n=t.split("-").map((t=>t.charAt(0).toUpperCase()+t.slice(1))).join("");y(e.prototype.constructor)&&e.prototype instanceof g?customElements.define(t,function(t,e){return Object.defineProperty(e,"name",{value:t})}(n,class extends h{instance;constructor(t){super();const r=y(e)?new e(this,t):e;b.add(this,n,r)}static get observedAttributes(){return r}})):customElements.define(t,e)}function w(t){return customElements.get(t)}return e})()));

package/public/test/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 {
@@ -32,9 +32,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 +55,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 +85,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/test/formValues.min.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.formValues=t():e.formValues=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){let t={};return[...Object.keys(e)].sort().forEach((n=>{var o;(o=e[n])&&o.constructor&&o.constructor===Object?t[n]=r(e[n]):t[n]=e[n]})),t}function n(e,t=!0){let o={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const r=n(e[t],!1);for(const e in r)o[t+"."+e]=r[e]}else o[t]=e[t]})),t?r(o):o}function o(e,t){return JSON.stringify(n(e))===JSON.stringify(n(t))}function s(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function c(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{formValues:()=>q});var a=new Function("try {return this===window;}catch(e){ return false;}");let i=new Set;a()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>i.add(e)));class l{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var u=new Function("try {return this===window;}catch(e){ return false;}");let f=new Set;function d(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function p(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function h(e){return e&&e instanceof HTMLElement}function b(e,t,r,n=!1,o=!1){let s={once:!1};n&&(s.capture=n),o&&(s.once=o),e.addEventListener(t,r,s)}function g(e,t,r={}){let n=e;if(!n._mc){let t=E?.debug;E.debug=!1,n._mc=new E(e),E.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&!e.getAttribute("_mc")&&e.setAttribute("_mc","")),r}function m(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function y(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let s=t instanceof l?new l(t.type,t.data,"l"):new l(t,r,"l"),c="string"!=typeof t?t:new l(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(s)})),/[ud]/.test(c.bubble)&&O(e,c)}function O(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=p(e,"",!0)?.[0].target;r&&E.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&E.trigger(e,t)}))}),0)}u()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>f.add(e)));class v{_target;__mc={};constructor(e,t=!1){var r;this._target=new WeakRef(e||{}),(r=this).constructor!==E&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!u()||e.constructor===E)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),s=n.replace(/^on[e]{0,1}/,""),c=s.toLowerCase();o&&Object.defineProperty(e,"on"+s,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),f.has("on"+c)&&b(t,c,(e=>{r.trigger(s,e)}),!1,o)}))}}(this)}get target(){return this._target.deref()}get _mc(){return this.__mc}}class w extends v{constructor(e){super(e)}static trigger=y;trigger(e,t={},r="l"){let n=this;if(n.constructor===w||n.constructor===E){let o=e instanceof l?new l(e.type,e.data,"l"):new l(e,t,"l"),s="string"!=typeof e?e:new l(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(s.bubble)&&O(n.target,s))}if(n instanceof w||n instanceof E){const n=this,o="string"!=typeof e?e:new l(e,t,r),s="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[s]||(n[s](o),n.hasOwnProperty(s)&&delete n[s])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&O(n.target,o)}}}class E extends v{constructor(e,t=!1){super(e)}static add=g;static remove=m;static trigger=y;trigger(e,t={},r){w.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return h(t)?p(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return h(t)?p(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!h(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=d([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return h(t)?d([...t.querySelectorAll("*[_mc]")],e):[]}}function _(e){return null!=e&&"object"==typeof e}function j(e){let t=new Set,r=/\{[^\{\}]*\}/g;return(e.getAttributeNames?e.getAttributeNames():[]).filter((t=>e.getAttribute(t)?.match(r))).forEach((t=>{let n=new Set(e.getAttribute(t)?.match(r));n.forEach((e=>n.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}new Set;const S=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class A extends E{data={};oldDisplay="";constructor(e){super(e),j(e).forEach((e=>this.data[e]="")),T(this),this.#n()}#n(){let e=this.target,t=!1;(e.getAttributeNames?e.getAttributeNames():[]).filter((t=>e.getAttribute(t)?.match(/\{[^\{\}]*\}/g))).forEach((t=>{let r=new Set(e.getAttribute(t)?.match(/\{[^\{\}]*\}/g));var n;this.data.observe((n=e.getAttribute(t),o=>{let s=n;r.forEach((e=>{s=s.replace(e,o[e.replace(/[\{\}]/g,"")])})),e.setAttribute(t,s)}))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((r=>{t=!0;let n=new Set(r.nodeValue.match(/\{[^\{\}]*\}/g));this.data.observe((t=>o=>{let s=t;n.forEach((e=>{s=s.replace(e,o[e.replace(/[\{\}]/g,"")])})),this.oldDisplay?e.style=this.oldDisplay:e.removeAttribute("style"),delete this.oldDisplay,r.nodeValue=s})(r.nodeValue)),this.oldDisplay=e.getAttribute("style)")||"",t&&!S.includes(e.constructor)&&"FIELDSET"!==e.tagName&&(e.style.display="none")}))}onData(e){let t={};Object.keys(e.data).forEach((r=>{this.data.hasOwnProperty(r)&&(t[r]=e.data[r])})),JSON.stringify(t)!==JSON.stringify(this.data)&&Object.assign(this.data,t)}}const k={};function N(e){let t=e.constructor.name;return k[t]||function(e){const t=e.constructor,r=t.name;let o=class extends t{#o=!0;#s=[];constructor(e){super(e),this.constructor.callbacks=[],_(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}get callbacks(){return this.#s}set callbacks(e){this.#s=e}observe(e){return this.#s.push(e),this}bind(e){if(_(this.valueOf())){!function(e){var t;(t=e,[t].concat([...t.querySelectorAll("*")]).filter((e=>!!j(e).length)).filter((e=>"STYLE"!==e?.tagName)).reverse()).forEach((e=>{e?._mc?._placeholders||E.add(e,"_placeholders",new A(e))}))}(e);const t=[e,...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),r=function(e){let r=n(e);t.forEach((e=>{e&&e._mc.trigger("data",r)}))};this.#s.push(r),this.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof this.valueOf(),this);return this}notify(e){let t=_(this.valueOf())&&this.valueOf()instanceof Array==0?structuredClone(Object.assign({},this)):this.valueOf();return void 0!==e&&(this.#o=e),this.#s.forEach((e=>{e(t)})),this}};return k[r]=o,o}(e)}const T=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if(e.hasOwnProperty(t)&&"function"!=typeof e[t]&&!e?.[t]?.constructor?.prototype?.observe){if("_"===t[0]||void 0===e?.[t])return e;let r=e[t],n=new(N(r))(r);Object.defineProperty(e,t,{enumerable:!0,get(){if(_(n.valueOf())){let e=structuredClone(Object.assign({},n));setTimeout(s((function(){o(structuredClone(Object.assign({},n)),e)||n.notify()}),0),0)}return n},set(e){if(typeof e==typeof n.valueOf())if(_(n.valueOf())&&n.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},n));void 0===n?.constructor?.prototype?.observe&&(n=new(N(e))(structuredClone(Object.assign({},e))),c(e,n),n.seal()),Object.assign(n,e),setTimeout(s((function(){o(structuredClone(Object.assign({},n)),t)||n.notify()}),0),0)}else{let t=n.valueOf(),r=n.callbacks;e!==t&&(n=new(N(e))(e),n.callbacks=r,n.notify())}else console.warn("IGNORED - cannot change observable types, IS:",typeof n.valueOf(),n,"- CANNOT BECOME:",typeof e)}}),e[t]=r}})),e);class x{constructor(e){}}class P extends x{#c;constructor(e){super(e),this.#c=e}get val(){return new FormData(this.#c.form).get(this.#c.name)}set val(e){[...this.#c.form.querySelectorAll(`input[type="radio"][name="${this.#c.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class L extends x{#c;constructor(e){super(e),this.#c=e}get val(){return this.#c.checked}set val(e){this.#c.checked=e}}class C extends x{#c;constructor(e){super(e),this.#c=e}get val(){return this.#c.value}set val(e){this.#c.value=e}}class M extends x{#c;#a=!1;constructor(e){super(e),this.#c=e,this.#a=e.multiple}get val(){const e=[];return[...this.#c.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#a?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#c.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class D extends x{#c;constructor(e){super(e),this.#c=e}get val(){return this.#c.value||""}set val(e){this.#c.value=e}}const H=e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new P(e);break;case"checkbox":n=new L(e);break;default:n=new C(e)}break;case"select":n=new M(e);break;case"textarea":n=new D(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(E.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r};function q(e,t,r){let n=H(r);e[t]=Object.assign({},n),T(e,t),c(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{b(r,"input",(r=>{e[t].notify()}))}))}return t})()));

package/public/test/grandparent.css

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

package/public/test/microcomponents.min.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.microcomponents=t():e.microcomponents=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){return e&&e.constructor&&e.constructor===Object}function n(e){let t={};return[...Object.keys(e)].sort().forEach((o=>{r(e[o])?t[o]=n(e[o]):t[o]=e[o]})),t}function o(e,t=!0){let r={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const n=o(e[t],!1);for(const e in n)r[t+"."+e]=n[e]}else r[t]=e[t]})),t?n(r):r}function c(e,t){return JSON.stringify(o(e))===JSON.stringify(o(t))}function s(e,t={}){let r=e.constructor===String?e.split("."):e;if(t&&r[0]&&t[r[0]])return t[r[0]].constructor===Object&&r.length>1?s(r.splice(1),t[r[0]]):t[r[0]];console.warn("ns",r[0],"not in",t)}function a(e,t){var n=Array.from(arguments);if(n.length>2){for(;n.length>1;)n[0]=a(n[0],n[1]),n.splice(1,1);return n[0]}if("string"==typeof e)e.match(/\{[^\{\}]*\}/g)?.forEach((function(r){var n=s(r.substring(1,r.length-1),t);void 0!==n&&(e=e.replace(r,n))}));else if(r(e))switch(e.constructor){case Object:Object.keys(e).forEach((function(r){e.hasOwnProperty(r)&&(e[r]=a(e[r],t))}));break;case Array:e.forEach((function(r,n,o){o[n]=a(e[n],t)}))}return e}function i(e){return e.split("-").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join("")}function l(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function u(e){let t=document.createElement("template");return e=e.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi,"<$1$2></$1>"),t.innerHTML=e,t.content.normalize(),Array.from(t.content.childNodes)}function d(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{DC:()=>k,MC:()=>C,McBase:()=>S,McEvent:()=>p,addListener:()=>v,autoload:()=>D,copyGettersSetters:()=>d,debounce:()=>l,deepEqual:()=>c,defineCE:()=>q,flattenObject:()=>o,formValues:()=>X,getCE:()=>$,htmlToElements:()=>u,isNativeObject:()=>r,kebabToPascal:()=>i,nameSpace:()=>s,observe:()=>Z,parse:()=>a,removeListener:()=>E,sortObject:()=>n});var f=new Function("try {return this===window;}catch(e){ return false;}");let m=new Set;f()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>m.add(e)));class p{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var b=new Function("try {return this===window;}catch(e){ return false;}");let g=new Set;function h(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function y(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function O(e){return e&&e instanceof HTMLElement}function v(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}function E(e,t,r){e.removeEventListener(t,r)}function w(e,t,r={}){let n=e;if(!n._mc){let t=k?.debug;k.debug=!1,n._mc=new k(e),k.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&!e.getAttribute("_mc")&&e.setAttribute("_mc","")),r}function A(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function j(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof p?new p(t.type,t.data,"l"):new p(t,r,"l"),s="string"!=typeof t?t:new p(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(s.bubble)&&_(e,s)}function _(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=y(e,"",!0)?.[0].target;r&&k.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&k.trigger(e,t)}))}),0)}b()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>g.add(e)));class S{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==k&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!b()||e.constructor===k)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),s=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),g.has("on"+s)&&v(t,s,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this.#n.deref()}}class C extends S{_mc={};constructor(e){super(e)}static trigger=j;trigger(e,t={},r="l"){let n=this;if(n.constructor===C||n.constructor===k){let o=e instanceof p?new p(e.type,e.data,"l"):new p(e,t,"l"),c="string"!=typeof e?e:new p(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&_(n.target,c))}if(n instanceof C||n instanceof k){const n=this,o="string"!=typeof e?e:new p(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&_(n.target,o)}}}class k extends S{_mc={};constructor(e,t=!1){super(e)}static add=w;static remove=A;static trigger=j;trigger(e,t={},r){C.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return O(t)?y(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return O(t)?y(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!O(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=h([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return O(t)?h([...t.querySelectorAll("*[_mc]")],e):[]}}const T=new Map,N=new Map;function L(e){const t="./"+e.split("-").join("/")+".js",r=document.createElement("script");return r.setAttribute("src",t),r.setAttribute("blocking","render"),r.async=!0,r.setAttribute("type","module"),r.setAttribute("name",e),r.setAttribute("loading",""),v(r,"load",(e=>{r.removeAttribute("loading"),r.setAttribute("loaded","")})),v(r,"error",(e=>{console.error("could not load Custom Element code from",t)})),r}function M(){[...document.querySelectorAll(":not(:defined)")].filter((e=>!!e&&!customElements.get(e.tagName.toLowerCase())&&!T.has(e.tagName.toLowerCase()))).forEach((e=>{const t=e.tagName.toLowerCase(),r=(t.split("-").join("/"),L(t));v(r,"load",(()=>{T.set(t,customElements.get(e.tagName.toLowerCase()))})),T.set(t,"loading"),document.head.append(r)})),[...document.querySelectorAll('[_mc]:not([_mc=""]')].filter((e=>!!e)).forEach((e=>{const t=e.getAttribute("_mc")?.split(" ").filter((e=>!!e))||[],r=t.filter((e=>!N.has(e)));r?.forEach((e=>{const t=L(e);v(t,"load",(()=>{return t=document.head.querySelector(`script[name="${e}"]`),void setTimeout((function(){const e=t.getAttribute("src"),r=t.getAttribute("name"),n=document.createElement("script");n.async=!0,n.setAttribute("type","module");const o=`\n\n\t\t\timport _ from "${e}";\n\t\t\timport { DC } from "./microcomponents.js";\n\n\t\t\tconst elements = Array.from(document.querySelectorAll('[_mc*="${r}"]')).filter( element => element instanceof HTMLElement );\n\n\t\t\telements.forEach((element) => {\n\t\t\t\t// add class to MCs repository\n\t\t\t\tautoload.state.MCs.set( '${r}', _ );\n\t\t\t\t// add instance to HTMLElement \n\t\t\t\tDC.add(element, _.name, new _(element));\n\t\t\t\t// remove instance name from elements "_mc" attribute\n\t\t\t\telement.setAttribute('_mc', element.getAttribute('_mc').replace('${r}', '').replace( /ww/g, ' ').trim()); \n\t\t\t});\n\n\t\t\tsetTimeout( () => {\n\t\t\t\tdocument.body.querySelector('script[name="${r}]"')?.remove();\n\t\t\t},0);\n\n\t\t`;n.innerHTML=o,document.body.append(n)}),0);var t})),N.set(e,"loading"),document.head.append(t)}));const n=t.filter((e=>N.has(e)&&!N.get(e).length));n?.forEach((t=>{setTimeout((()=>{k.add(e,t,new(D.state.MCs.get(t))(e)),e.getAttribute("_mc").replace("${elementName}","").replace(/\w\w/g," ").trim(),e.setAttribute("_mc")}),5)}))}))}let x=!1,P=null;function D(e=!0){return e?(x=e,P=new MutationObserver(M),setTimeout((()=>{P.observe(document.body,{childList:!0,subtree:!0}),M()}),5),window.autoload=window.autoload||D,x):(P?.disconnect(),P=null,x)}D.state={CEs:T,MCs:N};class H extends HTMLElement{constructor(){super()}connectedCallback(){k.trigger(this,"Connected")}disconnectedCallback(){k.trigger(this,"Disconnected")}adoptedCallback(){k.trigger(this,"Adopted")}attributeChangedCallback(e,t,r){k.trigger(this,"AttributeChanged",{name:e,oldValue:t,newValue:r})}}function q(e,t,r=[]){if(customElements.get(e))return void console.warn(`IGNORED: Custom element "${e}" is already defined!`);if(!e.includes("-"))throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');let n=i(e);customElements.define(e,function(e,t){return Object.defineProperty(t,"name",{value:e})}(n,class extends H{instance;constructor(e){super();let r=new t(this,e);k.add(this,n,r)}static get observedAttributes(){return r}}))}function $(e){return customElements.get(e)}function I(e){return null!=e&&"object"==typeof e}function V(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}const F=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class G extends k{data={};oldDisplay="";constructor(e){super(e);let t=this;V(e).forEach((e=>t.data[e]="")),Z(t),t.#o(),delete t._mc}#o(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var o;e.data.observe((o=t.getAttribute(r),e=>{let c=o;n.forEach((t=>{c=c.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,c)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let o=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var c;e.data.observe((c=n.nodeValue,r=>{let s=c;o.forEach((e=>{s=s.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=s})),e.oldDisplay=t.getAttribute("style)")||"",r&&!F.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const J={};function R(e){let t=e.constructor.name;return J[t]||function(e){const t=e.constructor,r=t.name;let n=class extends t{#c=!0;#s=[];constructor(e){super(e),this.constructor.callbacks=[],I(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}get callbacks(){return this.#s}set callbacks(e){this.#s=e}observe(e){return this.#s.push(e),this}bind(e){const t=this;if(I(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!V(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||k.add(e,"_placeholders",new G(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),n=function(e){let t=o(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.#s.push(n),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=I(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#c=e),t.#s.forEach((e=>{e(r)})),t}};return J[r]=n,n}(e)}const Z=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if(e.hasOwnProperty(t)&&"function"!=typeof e[t]&&!e?.[t]?.constructor?.prototype?.observe){if("_"===t[0]||void 0===e?.[t])return e;let r=e[t],n=new(R(r))(r);Object.defineProperty(e,t,{enumerable:!0,get(){if(I(n.valueOf())){let e=structuredClone(Object.assign({},n));setTimeout(l((function(){c(structuredClone(Object.assign({},n)),e)||n.notify()}),0),0)}return n},set(e){if(typeof e==typeof n.valueOf())if(I(n.valueOf())&&n.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},n));void 0===n?.constructor?.prototype?.observe&&(n=new(R(e))(structuredClone(Object.assign({},e))),d(e,n),n.seal()),Object.assign(n,e),setTimeout(l((function(){c(structuredClone(Object.assign({},n)),t)||n.notify()}),0),0)}else{let t=n.valueOf(),r=n.callbacks;e!==t&&(n=new(R(e))(e),n.callbacks=r,n.notify())}else console.warn("IGNORED - cannot change observable types, IS:",typeof n.valueOf(),n,"- CANNOT BECOME:",typeof e)}}),e[t]=r}})),e);class z{constructor(e){}}class B extends z{#a;constructor(e){super(e),this.#a=e}get val(){return new FormData(this.#a.form).get(this.#a.name)}set val(e){[...this.#a.form.querySelectorAll(`input[type="radio"][name="${this.#a.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class U extends z{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.checked}set val(e){this.#a.checked=e}}class W extends z{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value}set val(e){this.#a.value=e}}class Y extends z{#a;#i=!1;constructor(e){super(e),this.#a=e,this.#i=e.multiple}get val(){const e=[];return[...this.#a.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#i?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#a.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class K extends z{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value||""}set val(e){this.#a.value=e}}const Q=e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new B(e);break;case"checkbox":n=new U(e);break;default:n=new W(e)}break;case"select":n=new Y(e);break;case"textarea":n=new K(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(k.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r};function X(e,t,r){let n=Q(r);e[t]=Object.assign({},n),Z(e,t),d(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{v(r,"input",(r=>{e[t].notify()}))}))}return t})()));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.microcomponents=t():e.microcomponents=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){return e&&e.constructor&&e.constructor===Object}function n(e){let t={};return[...Object.keys(e)].sort().forEach((o=>{r(e[o])?t[o]=n(e[o]):t[o]=e[o]})),t}function o(e,t=!0){let r={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const n=o(e[t],!1);for(const e in n)r[t+"."+e]=n[e]}else r[t]=e[t]})),t?n(r):r}function c(e,t){return JSON.stringify(o(e))===JSON.stringify(o(t))}function s(e,t={}){let r=e.constructor===String?e.split("."):e;if(t&&r[0]&&t[r[0]])return t[r[0]].constructor===Object&&r.length>1?s(r.splice(1),t[r[0]]):t[r[0]];console.warn("ns",r[0],"not in",t)}function a(e,t){var n=Array.from(arguments);if(n.length>2){for(;n.length>1;)n[0]=a(n[0],n[1]),n.splice(1,1);return n[0]}if("string"==typeof e)e.match(/\{[^\{\}]*\}/g)?.forEach((function(r){var n=s(r.substring(1,r.length-1),t);void 0!==n&&(e=e.replace(r,n))}));else if(r(e))switch(e.constructor){case Object:Object.keys(e).forEach((function(r){e.hasOwnProperty(r)&&(e[r]=a(e[r],t))}));break;case Array:e.forEach((function(r,n,o){o[n]=a(e[n],t)}))}return e}function i(e){return e.split("-").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join("")}function l(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function u(e){let t=document.createElement("template");return e=e.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi,"<$1$2></$1>"),t.innerHTML=e,t.content.normalize(),Array.from(t.content.childNodes)}function f(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{DC:()=>N,MC:()=>k,McBase:()=>S,McEvent:()=>h,addListener:()=>v,autoload:()=>P,copyGettersSetters:()=>f,debounce:()=>l,deepEqual:()=>c,defineCE:()=>H,flattenObject:()=>o,formValues:()=>X,getCE:()=>I,htmlToElements:()=>u,isNativeObject:()=>r,kebabToPascal:()=>i,nameSpace:()=>s,observe:()=>Z,parse:()=>a,removeListener:()=>E,sortObject:()=>n});var d=new Function("try {return this===window;}catch(e){ return false;}");let p=new Set;d()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>p.add(e)));class h{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var m=new Function("try {return this===window;}catch(e){ return false;}");let b=new Set;function g(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function y(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function O(e){return e&&e instanceof HTMLElement}function v(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}function E(e,t,r){e.removeEventListener(t,r)}function w(e,t,r={}){let n=e;if(!n._mc){let t=N?.debug;N.debug=!1,n._mc=new N(e),N.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&!e.getAttribute("_mc")&&e.setAttribute("_mc","")),r}function A(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function j(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof h?new h(t.type,t.data,"l"):new h(t,r,"l"),s="string"!=typeof t?t:new h(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(s.bubble)&&_(e,s)}function _(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=y(e,"",!0)?.[0].target;r&&N.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&N.trigger(e,t)}))}),0)}m()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>b.add(e)));class S{_target;__mc={};constructor(e,t=!1){var r;this._target=new WeakRef(e||{}),(r=this).constructor!==N&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!m()||e.constructor===N)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),s=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),b.has("on"+s)&&v(t,s,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this._target.deref()}get _mc(){return this.__mc}}class k extends S{constructor(e){super(e)}static trigger=j;trigger(e,t={},r="l"){let n=this;if(n.constructor===k||n.constructor===N){let o=e instanceof h?new h(e.type,e.data,"l"):new h(e,t,"l"),c="string"!=typeof e?e:new h(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&_(n.target,c))}if(n instanceof k||n instanceof N){const n=this,o="string"!=typeof e?e:new h(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&_(n.target,o)}}}class N extends S{constructor(e,t=!1){super(e)}static add=w;static remove=A;static trigger=j;trigger(e,t={},r){k.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return O(t)?y(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return O(t)?y(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!O(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=g([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return O(t)?g([...t.querySelectorAll("*[_mc]")],e):[]}}const C=new Set;function T(e){if(C.has(e))return;C.add(e);const t="./"+e.split("-").join("/")+".js",r=document.createElement("script");r.setAttribute("src",t),r.setAttribute("blocking","render"),r.async=!0,r.setAttribute("type","module"),r.setAttribute("data-name",e),r.setAttribute("loading",""),customElements.whenDefined(e).then((()=>{const t=Array.from(document.querySelectorAll(`[_mc*="${e}"]`)).filter((e=>e instanceof HTMLElement));if(0===t.length)return;const r=customElements.get(e);t.forEach((t=>{N.add(t,r.name,new r(t));const n=t.getAttribute("_mc").split(" ").filter((t=>t!==e&&""!==t)).join(" ");t.setAttribute("_mc",n)})),document.head.querySelector('script[data-name="${elementName}]"')?.remove()})),v(r,"load",(t=>{C.delete(e)})),v(r,"error",(e=>{console.error("could not load MC code from",t)})),document.head.append(r)}function L(){[...document.querySelectorAll(":not(:defined)")].filter((e=>!!e&&!customElements.get(e.tagName.toLowerCase())&&!C.has(e.tagName.toLowerCase()))).forEach((e=>{T(e.tagName.toLowerCase())})),[...document.querySelectorAll('[_mc]:not([_mc=""]')].filter((e=>!!e)).forEach((e=>{const t=e.getAttribute("_mc")?.split(" ").filter((e=>""!==e));t?.forEach((e=>{T(e)}))}))}let x=!1,M=null;function P(e=!0){return e?(x=e,M=new MutationObserver(L),setTimeout((()=>{M.observe(document.body,{childList:!0,subtree:!0}),L()}),5),window.autoload=window.autoload||P,x):(M?.disconnect(),M=null,x)}P.state={loadingMCs:C};class D extends HTMLElement{constructor(){super()}connectedCallback(){N.trigger(this,"Connected")}disconnectedCallback(){N.trigger(this,"Disconnected")}adoptedCallback(){N.trigger(this,"Adopted")}attributeChangedCallback(e,t,r){N.trigger(this,"AttributeChanged",{name:e,oldValue:t,newValue:r})}}function q(e){return"function"==typeof e&&/^class\s/.test(Function.prototype.toString.call(e))}function H(e,t,r=[]){if(customElements.get(e))return void console.warn(`IGNORED: Custom element "${e}" is already defined!`);if(!e.includes("-"))throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');let n=i(e);q(t.prototype.constructor)&&t.prototype instanceof S?customElements.define(e,function(e,t){return Object.defineProperty(t,"name",{value:e})}(n,class extends D{instance;constructor(e){super();const r=q(t)?new t(this,e):t;N.add(this,n,r)}static get observedAttributes(){return r}})):customElements.define(e,t)}function I(e){return customElements.get(e)}function V(e){return null!=e&&"object"==typeof e}function $(e){let t=new Set,r=/\{[^\{\}]*\}/g;return(e.getAttributeNames?e.getAttributeNames():[]).filter((t=>e.getAttribute(t)?.match(r))).forEach((t=>{let n=new Set(e.getAttribute(t)?.match(r));n.forEach((e=>n.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}const F=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class G extends N{data={};oldDisplay="";constructor(e){super(e),$(e).forEach((e=>this.data[e]="")),Z(this),this.#n()}#n(){let e=this.target,t=!1;(e.getAttributeNames?e.getAttributeNames():[]).filter((t=>e.getAttribute(t)?.match(/\{[^\{\}]*\}/g))).forEach((t=>{let r=new Set(e.getAttribute(t)?.match(/\{[^\{\}]*\}/g));var n;this.data.observe((n=e.getAttribute(t),o=>{let c=n;r.forEach((e=>{c=c.replace(e,o[e.replace(/[\{\}]/g,"")])})),e.setAttribute(t,c)}))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((r=>{t=!0;let n=new Set(r.nodeValue.match(/\{[^\{\}]*\}/g));this.data.observe((t=>o=>{let c=t;n.forEach((e=>{c=c.replace(e,o[e.replace(/[\{\}]/g,"")])})),this.oldDisplay?e.style=this.oldDisplay:e.removeAttribute("style"),delete this.oldDisplay,r.nodeValue=c})(r.nodeValue)),this.oldDisplay=e.getAttribute("style)")||"",t&&!F.includes(e.constructor)&&"FIELDSET"!==e.tagName&&(e.style.display="none")}))}onData(e){let t={};Object.keys(e.data).forEach((r=>{this.data.hasOwnProperty(r)&&(t[r]=e.data[r])})),JSON.stringify(t)!==JSON.stringify(this.data)&&Object.assign(this.data,t)}}const J={};function R(e){let t=e.constructor.name;return J[t]||function(e){const t=e.constructor,r=t.name;let n=class extends t{#o=!0;#c=[];constructor(e){super(e),this.constructor.callbacks=[],V(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}get callbacks(){return this.#c}set callbacks(e){this.#c=e}observe(e){return this.#c.push(e),this}bind(e){if(V(this.valueOf())){!function(e){var t;(t=e,[t].concat([...t.querySelectorAll("*")]).filter((e=>!!$(e).length)).filter((e=>"STYLE"!==e?.tagName)).reverse()).forEach((e=>{e?._mc?._placeholders||N.add(e,"_placeholders",new G(e))}))}(e);const t=[e,...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),r=function(e){let r=o(e);t.forEach((e=>{e&&e._mc.trigger("data",r)}))};this.#c.push(r),this.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof this.valueOf(),this);return this}notify(e){let t=V(this.valueOf())&&this.valueOf()instanceof Array==0?structuredClone(Object.assign({},this)):this.valueOf();return void 0!==e&&(this.#o=e),this.#c.forEach((e=>{e(t)})),this}};return J[r]=n,n}(e)}const Z=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if(e.hasOwnProperty(t)&&"function"!=typeof e[t]&&!e?.[t]?.constructor?.prototype?.observe){if("_"===t[0]||void 0===e?.[t])return e;let r=e[t],n=new(R(r))(r);Object.defineProperty(e,t,{enumerable:!0,get(){if(V(n.valueOf())){let e=structuredClone(Object.assign({},n));setTimeout(l((function(){c(structuredClone(Object.assign({},n)),e)||n.notify()}),0),0)}return n},set(e){if(typeof e==typeof n.valueOf())if(V(n.valueOf())&&n.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},n));void 0===n?.constructor?.prototype?.observe&&(n=new(R(e))(structuredClone(Object.assign({},e))),f(e,n),n.seal()),Object.assign(n,e),setTimeout(l((function(){c(structuredClone(Object.assign({},n)),t)||n.notify()}),0),0)}else{let t=n.valueOf(),r=n.callbacks;e!==t&&(n=new(R(e))(e),n.callbacks=r,n.notify())}else console.warn("IGNORED - cannot change observable types, IS:",typeof n.valueOf(),n,"- CANNOT BECOME:",typeof e)}}),e[t]=r}})),e);class z{constructor(e){}}class B extends z{#s;constructor(e){super(e),this.#s=e}get val(){return new FormData(this.#s.form).get(this.#s.name)}set val(e){[...this.#s.form.querySelectorAll(`input[type="radio"][name="${this.#s.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class U extends z{#s;constructor(e){super(e),this.#s=e}get val(){return this.#s.checked}set val(e){this.#s.checked=e}}class W extends z{#s;constructor(e){super(e),this.#s=e}get val(){return this.#s.value}set val(e){this.#s.value=e}}class Y extends z{#s;#a=!1;constructor(e){super(e),this.#s=e,this.#a=e.multiple}get val(){const e=[];return[...this.#s.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#a?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#s.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class K extends z{#s;constructor(e){super(e),this.#s=e}get val(){return this.#s.value||""}set val(e){this.#s.value=e}}const Q=e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new B(e);break;case"checkbox":n=new U(e);break;default:n=new W(e)}break;case"select":n=new Y(e);break;case"textarea":n=new K(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(N.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r};function X(e,t,r){let n=Q(r);e[t]=Object.assign({},n),Z(e,t),f(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{v(r,"input",(r=>{e[t].notify()}))}))}return t})()));

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

@@ -1 +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;AAiLrC,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;AAoHF,eAAO,MAAM,OAAO,WACX,WAAW,iBACJ,MAAM,KACnB,WAuGF,CAAC"}
+{"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;AA8KrC,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;AAkHF,eAAO,MAAM,OAAO,WACX,WAAW,iBACJ,MAAM,KACnB,WAuGF,CAAC"}