@twobirds/microcomponents 0.1.1 → 0.1.3

package/public/test/MC.js

@@ -1,287 +0,0 @@
-'use strict';
-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 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;
-    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);
-    }
-}
-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 || {});
-        init(element);
-        autoAttachListeners(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) => {
-            DC.add(node, klass.name, new klass(node));
-            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 autoloadEnabled = false;
-let observer = null;
-function autoload(enable = true) {
-    if (!enable) {
-        observer?.disconnect();
-        observer = null;
-        return autoloadEnabled;
-    }
-    autoloadEnabled = enable;
-    observer = new MutationObserver(loadUndefinedMCs);
-    setTimeout(() => {
-        observer.observe(document.body, { childList: true, subtree: true });
-        loadUndefinedMCs();
-    }, 5);
-    window.autoload = window.autoload || autoload;
-    return autoloadEnabled;
-}
-autoload.state = loadingDCs;
-export { McBase, MC, DC, autoload, on, one, off, trigger };
-//# sourceMappingURL=MC.js.map

package/public/test/MC.min.js

@@ -1,348 +0,0 @@
-(function webpackUniversalModuleDefinition(root, factory) {
-	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory();
-	else if(typeof define === 'function' && define.amd)
-		define([], factory);
-	else if(typeof exports === 'object')
-		exports["MC"] = factory();
-	else
-		root["MC"] = factory();
-})(this, () => {
-return /******/ (() => { // webpackBootstrap
-/******/ 	"use strict";
-/******/ 	// 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))
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/make namespace object */
-/******/ 	(() => {
-/******/ 		// define __esModule on exports
-/******/ 		__webpack_require__.r = (exports) => {
-/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 			}
-/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/************************************************************************/
-var __webpack_exports__ = {};
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   DC: () => (/* binding */ DC),
-/* harmony export */   MC: () => (/* binding */ MC),
-/* harmony export */   McBase: () => (/* binding */ McBase),
-/* harmony export */   autoload: () => (/* binding */ autoload),
-/* harmony export */   off: () => (/* binding */ off),
-/* harmony export */   on: () => (/* binding */ on),
-/* harmony export */   one: () => (/* binding */ one),
-/* harmony export */   trigger: () => (/* binding */ trigger)
-/* harmony export */ });
-
-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 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;
-    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);
-    }
-}
-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 || {});
-        init(element);
-        autoAttachListeners(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) => {
-            DC.add(node, klass.name, new klass(node));
-            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 autoloadEnabled = false;
-let observer = null;
-function autoload(enable = true) {
-    if (!enable) {
-        observer?.disconnect();
-        observer = null;
-        return autoloadEnabled;
-    }
-    autoloadEnabled = enable;
-    observer = new MutationObserver(loadUndefinedMCs);
-    setTimeout(() => {
-        observer.observe(document.body, { childList: true, subtree: true });
-        loadUndefinedMCs();
-    }, 5);
-    window.autoload = window.autoload || autoload;
-    return autoloadEnabled;
-}
-autoload.state = loadingDCs;
-
-
-/******/ 	return __webpack_exports__;
-/******/ })()
-;
-});