@twobirds/microcomponents 0.1.19 → 0.1.21

package/README.md

@@ -18,8 +18,6 @@ The distinguishing feature - compared to other frameworks - is its **minimalism*
 
 ## Status
 
-For a quick glance try [this](https://gitlab.com/twoBirds/mc_template_webcomponents)...
-
 In [manual testing](https://twobirds.gitlab.io/microcomponents/test/test.html) ( also a speed test).
 
 Check the [typedoc API reference](https://twobirds.gitlab.io/microcomponents/typedoc/index.html) if you want to drill into the source code.
@@ -30,9 +28,9 @@ The progress of coding is being streamed on [twitch](https://twitch.tv/frankieth
 
 ### **Micro Components**
 
-**Hint:** This code only shows how Micro Components are stored in the DOM.
+**Hint:** The following code only shows how Micro Components are stored in the DOM.
 
-before:
+html before:
 ```HTML
 <div></div>
 ```
@@ -69,7 +67,7 @@ element
 	.helloWorld();
 ```
 
-after:
+html after:
 ```HTML
 <div data-mc></div>
 ```
@@ -134,7 +132,7 @@ class MyMC extends DC{
 		this.state.bind( target ); // links the state to DOM placeholders
 
 		// attach your own callbacks
-		this.state.observe( (value) => { 
+		this.state.subscribe( (value) => { 
 			console.log(value); 
 		});
 
@@ -155,9 +153,10 @@ class MyMC extends DC{
 	constructor( target ){
 		super( target );
 
-		this.form = { textinput: 'Hello world!' };
-
-		this.target.innerHTML = '<input name="textinput" />'; 
+		this.target.innerHTML = /*HTML*/ `
+		<form>
+			<input name="textinput" value="Hallo Welt!"/>
+		</form>`; 
 		
 		// link the form property to the DOM input fields
 		formValues( this, 'form', this.target );
@@ -181,16 +180,13 @@ class MyMC extends DC{
 	constructor( target ){
 		super( target );
 
-		// attach event handlers programatically
-		const onClickHandler = this.on( 'click', () => {
-			// ...
-		});
-
-		this.one( 'click', () => {
+		// attach event handler programatically
+		let onHoverHandler = this.on( 'hover', () => {
 			// ...
 		});
 
-		this.off( 'click', onClickHandler );
+		// remove event handler
+		this.off( 'hover', onHoverHandler );
 	}
 
 	// this event handler is attached automatically

package/dist/MC.d.ts

@@ -0,0 +1,31 @@
+import { LooseObject } from './helpers.js';
+import { BubbleController } from './events.js';
+export interface HTMLMcElement extends HTMLElement {
+    _mc: LooseObject;
+}
+declare class McBase {
+    private _target;
+    constructor(target?: {
+        [key: string]: any;
+    });
+    get target(): any;
+}
+declare class MC extends McBase {
+    constructor(target?: any);
+}
+declare class DC extends McBase {
+    constructor(target: HTMLElement);
+    static add(target: HTMLElement, key: string, element?: any): HTMLMcElement;
+    static remove(target: HTMLElement, key: string): void;
+    off(eventName: string, handler: EventListenerOrEventListenerObject): void;
+    on(eventName: string, handler: EventListenerOrEventListenerObject): EventListenerOrEventListenerObject;
+    one(eventName: string, handler: EventListenerOrEventListenerObject): EventListenerOrEventListenerObject;
+    trigger(eventName: string, data?: any, bubble?: string, controller?: BubbleController): void;
+    ancestors(): DC[] | null;
+    closest(): DC | null;
+    children(): DC[] | null;
+    descendants(): DC[] | null;
+}
+declare function autoload(enable?: boolean): boolean;
+export { MC, DC, McBase, autoload };
+//# sourceMappingURL=MC.d.ts.map

package/dist/MC.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MC.d.ts","sourceRoot":"","sources":["../src/MC.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAyB,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAsBtE,MAAM,WAAW,aAAc,SAAQ,WAAW;IAajD,GAAG,EAAE,WAAW,CAAC;CACjB;AA+JD,cAAM,MAAM;IACX,OAAO,CAAC,OAAO,CAAe;gBAUlB,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE;IAmB3C,IAAI,MAAM,IAAI,GAAG,CAEhB;CACD;AAQD,cAAM,EAAG,SAAQ,MAAM;gBAMV,MAAM,CAAC,EAAE,GAAG;CAGxB;AASD,cAAM,EAAG,SAAQ,MAAM;gBACV,MAAM,EAAE,WAAW;IAgB/B,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,GAAE,GAAQ,GAAG,aAAa;IAc9E,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM;IAK9C,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC;IAalE,EAAE,CACD,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GACzC,kCAAkC;IAarC,GAAG,CACF,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GACzC,kCAAkC;IAcrC,OAAO,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY,EAAE,UAAU,CAAC,EAAE,gBAAgB;IAc9F,SAAS,IAAI,EAAE,EAAE,GAAG,IAAI;IAsBxB,OAAO,IAAI,EAAE,GAAG,IAAI;IAcpB,QAAQ,IAAI,EAAE,EAAE,GAAG,IAAI;IAcvB,WAAW,IAAI,EAAE,EAAE,GAAG,IAAI;CAQ1B;AAwKD,iBAAS,QAAQ,CAAC,MAAM,GAAE,OAAc,GAAG,OAAO,CAuBjD;AAUD,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC"}

package/dist/MC.js

@@ -0,0 +1,249 @@
+'use strict';
+import { trigger, on, one, off } from './events.js';
+const isBrowser = new Function('try {return this===window;}catch(e){ return false;}');
+function isDOM(element) {
+    return element && element instanceof HTMLElement;
+}
+function add(target, key, element = {}) {
+    let node = target;
+    if (!node._mc) {
+        node._mc = new DC(target);
+    }
+    const _mc = node._mc;
+    if (key.length && !_mc[key]) {
+        _mc[key] = element;
+        if (target instanceof HTMLElement && !target.getAttribute('data-mc')) {
+            target.setAttribute('data-mc', '');
+        }
+    }
+    return node;
+}
+function remove(target, key) {
+    if (!key)
+        return;
+    const _mc = target?._mc || {};
+    if (_mc && _mc[key]) {
+        delete _mc[key];
+    }
+    if (!Object.keys(_mc).length && target instanceof HTMLElement && target.hasAttribute('data-mc')) {
+        target.removeAttribute('data-mc');
+    }
+    return;
+}
+function init(element) {
+    setTimeout(() => {
+        if (element.constructor === DC)
+            return;
+        element.trigger('Init');
+    }, 0);
+}
+function autoAttachListeners(element) {
+    if (!isBrowser() || element.constructor === DC)
+        return;
+    const target = element.target;
+    if (target instanceof HTMLElement) {
+        let that = element;
+        Object.getOwnPropertyNames(that.constructor.prototype)
+            .filter((key) => /^(on[A-Z]|one[A-Z])/.test(key) && typeof that.constructor.prototype[key] === 'function')
+            .forEach((key) => {
+            let once = /^one/.test(key), withoutOnOne = key.replace(/^on[e]{0,1}/, ''), nativeEventName = withoutOnOne.toLowerCase();
+            if ('on' + nativeEventName in target) {
+                let listener = (ev) => {
+                    that[key](ev);
+                };
+                target.addEventListener(nativeEventName, listener);
+            }
+            else {
+                let listener = (ev) => {
+                    that[key](ev);
+                };
+                on(target, withoutOnOne, listener, once);
+            }
+        });
+    }
+}
+function getMcChildNodes(domNode) {
+    const id = Math.random().toString().replace('.', '');
+    const selector = '[data-mc]:not([temp_id="' + id + '"] [data-mc] [data-mc])';
+    domNode.setAttribute('temp_id', id);
+    const mcArray = [...domNode.querySelectorAll(selector)]
+        .filter((e) => !!e._mc)
+        .map((e) => e._mc);
+    domNode.removeAttribute('temp_id');
+    return mcArray.length ? mcArray : null;
+}
+class McBase {
+    _target;
+    constructor(target) {
+        let element = this;
+        this._target = new WeakRef(target || {});
+        autoAttachListeners(element);
+        init(element);
+    }
+    get target() {
+        return this._target.deref();
+    }
+}
+class MC extends McBase {
+    constructor(target) {
+        super(target);
+    }
+}
+class DC extends McBase {
+    constructor(target) {
+        super(target);
+    }
+    static add(target, key, element = {}) {
+        return add(target, key, element);
+    }
+    static remove(target, key) {
+        remove(target, key);
+    }
+    off(eventName, handler) {
+        off(this.target, eventName, handler);
+    }
+    on(eventName, handler) {
+        return on(this.target, eventName, handler);
+    }
+    one(eventName, handler) {
+        return one(this.target, eventName, handler);
+    }
+    trigger(eventName, data = {}, bubble = 'l', controller) {
+        trigger(this.target, eventName, data, bubble, controller);
+    }
+    ancestors() {
+        let currentNode = this?.target, result = [];
+        if (!isDOM(currentNode))
+            return [];
+        while ((currentNode = currentNode.closest('[data-mc]'))) {
+            if (currentNode?._mc) {
+                result.push(currentNode?._mc);
+            }
+        }
+        return result.length ? result : null;
+    }
+    closest() {
+        let target = this.target;
+        if (!isDOM(target))
+            return null;
+        return target.closest('[data-mc]')?._mc || null;
+    }
+    children() {
+        let target = this?.target;
+        if (!isDOM(target))
+            return null;
+        return getMcChildNodes(target);
+    }
+    descendants() {
+        const target = this?.target;
+        if (!isDOM(target))
+            return [];
+        const mcArray = [...target.querySelectorAll('[data-mc]')]
+            .filter((e) => !!e._mc)
+            .map((e) => e._mc);
+        return mcArray.length ? mcArray : null;
+    }
+}
+const loadingDCs = new Set();
+function attachDC(element) {
+    return () => {
+        const elements = Array.from(document.querySelectorAll(`[data-mc*="${element}"]`)).filter((element) => element instanceof HTMLElement);
+        if (elements.length === 0)
+            return;
+        const Klass = customElements.get(element);
+        elements.forEach((node) => {
+            try {
+                DC.add(node, Klass.name, new Klass(node));
+            }
+            catch (error) {
+                if (Klass['create']) {
+                    let element = Klass.create(node);
+                    element.setAttribute('data-mc', node.getAttribute('data-mc'));
+                    node.replaceWith(element);
+                    node = element;
+                }
+                else {
+                    throw `Class ${Klass.name} doesn't have a callable constructor AND class doesn't have a static .create() method.`;
+                }
+            }
+            const new_mc = node
+                .getAttribute('data-mc')
+                .split(' ')
+                .filter((name) => name !== element && name !== '')
+                .join(' ')
+                .trim();
+            node.setAttribute('data-mc', new_mc);
+        });
+    };
+}
+function makeLoadScript(element) {
+    if (loadingDCs.has(element))
+        return;
+    loadingDCs.add(element);
+    const fileName = './' + element.split('-').join('/') + '.js';
+    const se = document.createElement('script');
+    se.setAttribute('src', fileName);
+    se.setAttribute('blocking', 'render');
+    se.async = true;
+    se.setAttribute('type', 'module');
+    se.setAttribute('data-name', element);
+    se.setAttribute('loading', '');
+    const loadedPromise = customElements.whenDefined(element);
+    loadedPromise.then(attachDC(element));
+    se.addEventListener('load', (ev) => {
+        loadingDCs.delete(element);
+        document.head.querySelector(`script[data-name="${element}"]`)?.remove();
+    });
+    se.addEventListener('error', (ev) => {
+        console.error('could not load DC code from', fileName);
+    });
+    document.head.append(se);
+}
+function loadUndefinedMCs() {
+    [...document.querySelectorAll(':not(:defined)')]
+        .filter((element) => !!element &&
+        !customElements.get(element.tagName.toLowerCase()) &&
+        !loadingDCs.has(element.tagName.toLowerCase()))
+        .forEach((el) => {
+        makeLoadScript(el.tagName.toLowerCase());
+    });
+    [...document.querySelectorAll('[data-mc]:not([data-mc=""]')]
+        .filter((element) => !!element)
+        .forEach((el) => {
+        const _mc = el
+            .getAttribute('data-mc')
+            ?.split(' ')
+            .filter((name) => name !== '');
+        _mc?.forEach((element) => {
+            const isDefined = customElements.get(element);
+            if (!loadingDCs.has(element) && !isDefined) {
+                makeLoadScript(element);
+            }
+            else if (isDefined) {
+                attachDC(element)();
+            }
+        });
+    });
+}
+let observer = null;
+function autoload(enable = true) {
+    if (!enable) {
+        if (observer) {
+            observer.disconnect();
+            observer = null;
+        }
+        return false;
+    }
+    const wasEnabled = !!observer;
+    if (wasEnabled)
+        return true;
+    observer = new MutationObserver(loadUndefinedMCs);
+    setTimeout(() => {
+        observer.observe(document.body, { childList: true, subtree: true });
+        loadUndefinedMCs();
+    }, 5);
+    window.autoload = window.autoload || autoload;
+    return true;
+}
+autoload.state = loadingDCs;
+export { MC, DC, McBase, autoload };

package/dist/MC.min.js

@@ -0,0 +1,345 @@
+/******/ // The require scope
+/******/ var __webpack_require__ = {};
+/******/ 
+/************************************************************************/
+/******/ /* webpack/runtime/define property getters */
+/******/ (() => {
+/******/ 	// define getter functions for harmony exports
+/******/ 	__webpack_require__.d = (exports, definition) => {
+/******/ 		for(var key in definition) {
+/******/ 			if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 				Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 			}
+/******/ 		}
+/******/ 	};
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ 	__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ })();
+/******/ 
+/************************************************************************/
+var __webpack_exports__ = {};
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  DC: () => (/* binding */ DC),
+  MC: () => (/* binding */ MC),
+  O: () => (/* binding */ McBase),
+  E: () => (/* binding */ autoload)
+});
+
+;// ./build/events.js
+
+function getMcEventName(eventName) {
+    return '_mc' + eventName[0].toUpperCase() + eventName.substring(1);
+}
+function off(domNode, eventName, handler) {
+    domNode.removeEventListener(getMcEventName(eventName), handler);
+}
+function on(domNode, eventName, handler, once = false) {
+    domNode.addEventListener(getMcEventName(eventName), handler, { capture: false, once });
+    return handler;
+}
+function one(domNode, eventName, handler) {
+    on(domNode, eventName, handler, true);
+    return handler;
+}
+class BubbleController {
+    stopped = false;
+    constructor() { }
+    stop() {
+        this.stopped = true;
+    }
+}
+function trigger(domNode, event, data = {}, bubble = 'l', controller) {
+    const eventName = /^_mc/.test(event) ? event : getMcEventName(event), bubbleController = controller ? controller : new BubbleController(), ev = new CustomEvent(eventName, {
+        detail: { data, control: bubbleController },
+        bubbles: false,
+    });
+    if (bubbleController.stopped)
+        return;
+    if (/l/.test(bubble)) {
+        domNode.dispatchEvent(ev);
+        ev.stopImmediatePropagation();
+        if (bubbleController.stopped)
+            return;
+    }
+    if (/[ud]/.test(bubble)) {
+        if (bubble.indexOf('l') === -1) {
+            bubble += 'l';
+        }
+        setTimeout(() => {
+            if (bubble.indexOf('u') > -1) {
+                let parentMc = domNode.parentElement?.closest('[data-mc]');
+                if (parentMc) {
+                    parentMc?._mc.trigger(eventName, data, bubble, bubbleController);
+                }
+            }
+            if (bubble.indexOf('d') > -1) {
+                let childNodes = domNode._mc.children();
+                if (childNodes) {
+                    childNodes.forEach((_mc) => _mc.trigger(eventName, data, bubble));
+                }
+            }
+        }, 0);
+    }
+}
+
+;// ./build/MC.js
+
+
+const isBrowser = new Function('try {return this===window;}catch(e){ return false;}');
+function isDOM(element) {
+    return element && element instanceof HTMLElement;
+}
+function add(target, key, element = {}) {
+    let node = target;
+    if (!node._mc) {
+        node._mc = new DC(target);
+    }
+    const _mc = node._mc;
+    if (key.length && !_mc[key]) {
+        _mc[key] = element;
+        if (target instanceof HTMLElement && !target.getAttribute('data-mc')) {
+            target.setAttribute('data-mc', '');
+        }
+    }
+    return node;
+}
+function remove(target, key) {
+    if (!key)
+        return;
+    const _mc = target?._mc || {};
+    if (_mc && _mc[key]) {
+        delete _mc[key];
+    }
+    if (!Object.keys(_mc).length && target instanceof HTMLElement && target.hasAttribute('data-mc')) {
+        target.removeAttribute('data-mc');
+    }
+    return;
+}
+function init(element) {
+    setTimeout(() => {
+        if (element.constructor === DC)
+            return;
+        element.trigger('Init');
+    }, 0);
+}
+function autoAttachListeners(element) {
+    if (!isBrowser() || element.constructor === DC)
+        return;
+    const target = element.target;
+    if (target instanceof HTMLElement) {
+        let that = element;
+        Object.getOwnPropertyNames(that.constructor.prototype)
+            .filter((key) => /^(on[A-Z]|one[A-Z])/.test(key) && typeof that.constructor.prototype[key] === 'function')
+            .forEach((key) => {
+            let once = /^one/.test(key), withoutOnOne = key.replace(/^on[e]{0,1}/, ''), nativeEventName = withoutOnOne.toLowerCase();
+            if ('on' + nativeEventName in target) {
+                let listener = (ev) => {
+                    that[key](ev);
+                };
+                target.addEventListener(nativeEventName, listener);
+            }
+            else {
+                let listener = (ev) => {
+                    that[key](ev);
+                };
+                on(target, withoutOnOne, listener, once);
+            }
+        });
+    }
+}
+function getMcChildNodes(domNode) {
+    const id = Math.random().toString().replace('.', '');
+    const selector = '[data-mc]:not([temp_id="' + id + '"] [data-mc] [data-mc])';
+    domNode.setAttribute('temp_id', id);
+    const mcArray = [...domNode.querySelectorAll(selector)]
+        .filter((e) => !!e._mc)
+        .map((e) => e._mc);
+    domNode.removeAttribute('temp_id');
+    return mcArray.length ? mcArray : null;
+}
+class McBase {
+    _target;
+    constructor(target) {
+        let element = this;
+        this._target = new WeakRef(target || {});
+        autoAttachListeners(element);
+        init(element);
+    }
+    get target() {
+        return this._target.deref();
+    }
+}
+class MC extends McBase {
+    constructor(target) {
+        super(target);
+    }
+}
+class DC extends McBase {
+    constructor(target) {
+        super(target);
+    }
+    static add(target, key, element = {}) {
+        return add(target, key, element);
+    }
+    static remove(target, key) {
+        remove(target, key);
+    }
+    off(eventName, handler) {
+        off(this.target, eventName, handler);
+    }
+    on(eventName, handler) {
+        return on(this.target, eventName, handler);
+    }
+    one(eventName, handler) {
+        return one(this.target, eventName, handler);
+    }
+    trigger(eventName, data = {}, bubble = 'l', controller) {
+        trigger(this.target, eventName, data, bubble, controller);
+    }
+    ancestors() {
+        let currentNode = this?.target, result = [];
+        if (!isDOM(currentNode))
+            return [];
+        while ((currentNode = currentNode.closest('[data-mc]'))) {
+            if (currentNode?._mc) {
+                result.push(currentNode?._mc);
+            }
+        }
+        return result.length ? result : null;
+    }
+    closest() {
+        let target = this.target;
+        if (!isDOM(target))
+            return null;
+        return target.closest('[data-mc]')?._mc || null;
+    }
+    children() {
+        let target = this?.target;
+        if (!isDOM(target))
+            return null;
+        return getMcChildNodes(target);
+    }
+    descendants() {
+        const target = this?.target;
+        if (!isDOM(target))
+            return [];
+        const mcArray = [...target.querySelectorAll('[data-mc]')]
+            .filter((e) => !!e._mc)
+            .map((e) => e._mc);
+        return mcArray.length ? mcArray : null;
+    }
+}
+const loadingDCs = new Set();
+function attachDC(element) {
+    return () => {
+        const elements = Array.from(document.querySelectorAll(`[data-mc*="${element}"]`)).filter((element) => element instanceof HTMLElement);
+        if (elements.length === 0)
+            return;
+        const Klass = customElements.get(element);
+        elements.forEach((node) => {
+            try {
+                DC.add(node, Klass.name, new Klass(node));
+            }
+            catch (error) {
+                if (Klass['create']) {
+                    let element = Klass.create(node);
+                    element.setAttribute('data-mc', node.getAttribute('data-mc'));
+                    node.replaceWith(element);
+                    node = element;
+                }
+                else {
+                    throw `Class ${Klass.name} doesn't have a callable constructor AND class doesn't have a static .create() method.`;
+                }
+            }
+            const new_mc = node
+                .getAttribute('data-mc')
+                .split(' ')
+                .filter((name) => name !== element && name !== '')
+                .join(' ')
+                .trim();
+            node.setAttribute('data-mc', new_mc);
+        });
+    };
+}
+function makeLoadScript(element) {
+    if (loadingDCs.has(element))
+        return;
+    loadingDCs.add(element);
+    const fileName = './' + element.split('-').join('/') + '.js';
+    const se = document.createElement('script');
+    se.setAttribute('src', fileName);
+    se.setAttribute('blocking', 'render');
+    se.async = true;
+    se.setAttribute('type', 'module');
+    se.setAttribute('data-name', element);
+    se.setAttribute('loading', '');
+    const loadedPromise = customElements.whenDefined(element);
+    loadedPromise.then(attachDC(element));
+    se.addEventListener('load', (ev) => {
+        loadingDCs.delete(element);
+        document.head.querySelector(`script[data-name="${element}"]`)?.remove();
+    });
+    se.addEventListener('error', (ev) => {
+        console.error('could not load DC code from', fileName);
+    });
+    document.head.append(se);
+}
+function loadUndefinedMCs() {
+    [...document.querySelectorAll(':not(:defined)')]
+        .filter((element) => !!element &&
+        !customElements.get(element.tagName.toLowerCase()) &&
+        !loadingDCs.has(element.tagName.toLowerCase()))
+        .forEach((el) => {
+        makeLoadScript(el.tagName.toLowerCase());
+    });
+    [...document.querySelectorAll('[data-mc]:not([data-mc=""]')]
+        .filter((element) => !!element)
+        .forEach((el) => {
+        const _mc = el
+            .getAttribute('data-mc')
+            ?.split(' ')
+            .filter((name) => name !== '');
+        _mc?.forEach((element) => {
+            const isDefined = customElements.get(element);
+            if (!loadingDCs.has(element) && !isDefined) {
+                makeLoadScript(element);
+            }
+            else if (isDefined) {
+                attachDC(element)();
+            }
+        });
+    });
+}
+let observer = null;
+function autoload(enable = true) {
+    if (!enable) {
+        if (observer) {
+            observer.disconnect();
+            observer = null;
+        }
+        return false;
+    }
+    const wasEnabled = !!observer;
+    if (wasEnabled)
+        return true;
+    observer = new MutationObserver(loadUndefinedMCs);
+    setTimeout(() => {
+        observer.observe(document.body, { childList: true, subtree: true });
+        loadUndefinedMCs();
+    }, 5);
+    window.autoload = window.autoload || autoload;
+    return true;
+}
+autoload.state = loadingDCs;
+
+
+var __webpack_exports__DC = __webpack_exports__.DC;
+var __webpack_exports__MC = __webpack_exports__.MC;
+var __webpack_exports__McBase = __webpack_exports__.O;
+var __webpack_exports__autoload = __webpack_exports__.E;
+export { __webpack_exports__DC as DC, __webpack_exports__MC as MC, __webpack_exports__McBase as McBase, __webpack_exports__autoload as autoload };