@esportsplus/template 0.28.1 → 0.29.1

package/build/html/parser.js

@@ -1,165 +0,0 @@
-import { NODE_CLOSING, NODE_ELEMENT, NODE_SLOT, NODE_VOID, NODE_WHITELIST, REGEX_EMPTY_TEXT_NODES, REGEX_EVENTS, REGEX_SLOT_ATTRIBUTES, REGEX_SLOT_NODES, SLOT_HTML, SLOT_MARKER } from '../constants.js';
-import { firstElementChild, nextElementSibling } from '../utilities/element.js';
-import { firstChild, nextSibling } from '../utilities/node.js';
-import { fragment } from '../utilities/fragment.js';
-import a from '../attributes.js';
-import s from '../slot/index.js';
-let cache = new WeakMap();
-function build(literals) {
-    let n = literals.length - 1;
-    if (n === 0) {
-        return set(literals, literals[0]);
-    }
-    let attributes = {}, buffer = '', events = false, html = literals.join(SLOT_MARKER)
-        .replace(REGEX_EMPTY_TEXT_NODES, '$1$2')
-        .trim(), index = 0, level = 0, levels = [{
-            children: 0,
-            elements: 0,
-            path: []
-        }], parsed = html.split(SLOT_MARKER), slot = 0, slots = [];
-    {
-        let attribute = '', buffer = '', char = '', match, quote = '';
-        REGEX_SLOT_ATTRIBUTES.lastIndex = 0;
-        while (match = REGEX_SLOT_ATTRIBUTES.exec(html)) {
-            let found = match[1], metadata = attributes[found];
-            if (metadata) {
-                continue;
-            }
-            metadata = attributes[found] = [];
-            for (let i = 0, n = found.length; i < n; i++) {
-                char = found[i];
-                if (char === ' ') {
-                    buffer = '';
-                }
-                else if (char === '=') {
-                    attribute = buffer;
-                    buffer = '';
-                }
-                else if (char === '"' || char === "'") {
-                    if (!attribute) {
-                        continue;
-                    }
-                    else if (!quote) {
-                        quote = char;
-                    }
-                    else if (quote === char) {
-                        attribute = '';
-                        buffer = '';
-                        quote = '';
-                    }
-                }
-                else if (char === '{' && char !== buffer) {
-                    buffer = char;
-                }
-                else {
-                    buffer += char;
-                    if (buffer === SLOT_MARKER) {
-                        buffer = '';
-                        if (attribute) {
-                            metadata.push(attribute);
-                            if (!quote) {
-                                attribute = '';
-                            }
-                        }
-                        else {
-                            metadata.push(null);
-                        }
-                    }
-                    else if (buffer === 'on') {
-                        events = true;
-                    }
-                }
-            }
-        }
-    }
-    REGEX_SLOT_NODES.lastIndex = 0;
-    {
-        let match;
-        while (match = REGEX_SLOT_NODES.exec(html)) {
-            let parent = levels[level], type = match[1] === undefined ? NODE_SLOT : (NODE_WHITELIST[match[1].toLowerCase()] || NODE_ELEMENT);
-            if ((match.index || 1) - 1 > index) {
-                parent.children++;
-            }
-            if (type === NODE_ELEMENT || type === NODE_VOID) {
-                let attr = match[2], path = parent.path.length
-                    ? methods(parent.elements, parent.path, firstElementChild, nextElementSibling)
-                    : methods(parent.children, [], firstChild, nextSibling);
-                if (attr) {
-                    let metadata = attributes[attr];
-                    if (!metadata) {
-                        throw new Error(`Template: attribute metadata could not be found for '${attr}'`);
-                    }
-                    for (let i = 0, n = metadata.length; i < n; i++) {
-                        let name = metadata[i];
-                        slots.push({
-                            fn: name === null ? a.spread : a.set,
-                            name,
-                            path
-                        });
-                        buffer += parsed[slot++];
-                    }
-                }
-                if (type === NODE_ELEMENT) {
-                    levels[++level] = {
-                        children: 0,
-                        elements: 0,
-                        path
-                    };
-                }
-                parent.elements++;
-            }
-            else if (type === NODE_SLOT) {
-                buffer += parsed[slot++] + SLOT_HTML;
-                slots.push({
-                    fn: s,
-                    name: null,
-                    path: methods(parent.children, parent.path, firstChild, nextSibling)
-                });
-            }
-            if (n === slot) {
-                buffer += parsed[slot];
-                break;
-            }
-            if (type === NODE_CLOSING) {
-                level--;
-            }
-            else {
-                parent.children++;
-            }
-            index = (match.index || 0) + match[0].length;
-        }
-    }
-    if (events) {
-        buffer = buffer.replace(REGEX_EVENTS, '');
-    }
-    return set(literals, buffer, slots);
-}
-function methods(children, copy, first, next) {
-    let length = copy.length, methods = new Array(length + 1 + children);
-    for (let i = 0, n = length; i < n; i++) {
-        methods[i] = copy[i];
-    }
-    methods[length] = first;
-    for (let i = 0, n = children; i < n; i++) {
-        methods[length + 1 + i] = next;
-    }
-    return methods;
-}
-function set(literals, html, slots = null) {
-    let value = {
-        fragment: fragment(html),
-        html,
-        literals,
-        slots
-    };
-    cache.set(literals, value);
-    return value;
-}
-const parse = (literals) => {
-    let result = cache.get(literals);
-    if (result === undefined) {
-        result = build(literals);
-    }
-    return result;
-};
-export default { parse };

package/build/utilities/element.d.ts

@@ -1,11 +0,0 @@
-declare const addEventListener: {
-    <K extends keyof ElementEventMap>(type: K, listener: (this: Element, ev: ElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-    (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-};
-declare const className: (v: any) => void;
-declare const innerHTML: (v: any) => void;
-declare const firstElementChild: () => any;
-declare const nextElementSibling: () => any;
-declare const removeAttribute: (qualifiedName: string) => void;
-declare const setAttribute: (qualifiedName: string, value: string) => void;
-export { addEventListener, className, innerHTML, firstElementChild, nextElementSibling, removeAttribute, setAttribute };

package/build/utilities/element.js

@@ -1,9 +0,0 @@
-let getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor, prototype = Element.prototype;
-const addEventListener = prototype.addEventListener;
-const className = getOwnPropertyDescriptor(prototype, 'className').set;
-const innerHTML = getOwnPropertyDescriptor(prototype, 'innerHTML').set;
-const firstElementChild = getOwnPropertyDescriptor(prototype, 'firstElementChild').get;
-const nextElementSibling = getOwnPropertyDescriptor(prototype, 'nextElementSibling').get;
-const removeAttribute = prototype.removeAttribute;
-const setAttribute = prototype.setAttribute;
-export { addEventListener, className, innerHTML, firstElementChild, nextElementSibling, removeAttribute, setAttribute };

package/build/utilities/fragment.d.ts

@@ -1,3 +0,0 @@
-declare const append: (...nodes: (Node | string)[]) => void;
-declare const fragment: (html: string) => DocumentFragment;
-export { append, fragment };

package/build/utilities/fragment.js

@@ -1,10 +0,0 @@
-import { innerHTML } from './element.js';
-import { cloneNode } from './node.js';
-let template = document.createElement('template');
-const append = DocumentFragment.prototype.append;
-const fragment = (html) => {
-    let element = cloneNode.call(template);
-    innerHTML.call(element, html);
-    return element.content;
-};
-export { append, fragment };

package/build/utilities/marker.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;

package/build/utilities/marker.js

@@ -1,4 +0,0 @@
-import { SLOT_HTML } from '../constants.js';
-import { fragment } from './fragment.js';
-import { firstChild } from './node.js';
-export default firstChild.call(fragment(SLOT_HTML));

package/build/utilities/node.d.ts

@@ -1,9 +0,0 @@
-declare const appendChild: <T extends Node>(node: T) => T;
-declare const cloneNode: (subtree?: boolean) => Node;
-declare const firstChild: () => any;
-declare const lastChild: () => any;
-declare const nextSibling: () => any;
-declare const nodeValue: (v: any) => void;
-declare const parentElement: () => any;
-declare const previousSibling: () => any;
-export { appendChild, cloneNode, firstChild, lastChild, nextSibling, nodeValue, parentElement, previousSibling };

package/build/utilities/node.js

@@ -1,10 +0,0 @@
-let getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor, prototype = Node.prototype;
-const appendChild = prototype.appendChild;
-const cloneNode = prototype.cloneNode;
-const firstChild = getOwnPropertyDescriptor(prototype, 'firstChild').get;
-const lastChild = getOwnPropertyDescriptor(prototype, 'lastChild').get;
-const nextSibling = getOwnPropertyDescriptor(prototype, 'nextSibling').get;
-const nodeValue = getOwnPropertyDescriptor(prototype, 'nodeValue').set;
-const parentElement = getOwnPropertyDescriptor(prototype, 'parentElement').get;
-const previousSibling = getOwnPropertyDescriptor(prototype, 'previousSibling').get;
-export { appendChild, cloneNode, firstChild, lastChild, nextSibling, nodeValue, parentElement, previousSibling };

package/build/utilities/raf.d.ts

@@ -1,2 +0,0 @@
-declare const _default: typeof requestAnimationFrame;
-export default _default;

package/build/utilities/raf.js

@@ -1 +0,0 @@
-export default globalThis?.requestAnimationFrame;

package/build/utilities/text.d.ts

@@ -1,2 +0,0 @@
-declare const _default: (value: string) => Node;
-export default _default;

package/build/utilities/text.js

@@ -1,9 +0,0 @@
-import { cloneNode, nodeValue } from './node.js';
-let text = document.createTextNode('');
-export default (value) => {
-    let element = cloneNode.call(text);
-    if (value !== '') {
-        nodeValue.call(element, value);
-    }
-    return element;
-};

package/src/html/index.ts

@@ -1,48 +0,0 @@
-import { ReactiveArray } from '@esportsplus/reactivity';
-import { Attribute, Attributes, Renderable } from '~/types';
-import { cloneNode } from '~/utilities/node';
-import { ArraySlot } from '~/slot/array';
-import parser from './parser';
-import attributes from '~/attributes';
-import slot from '~/slot';
-
-
-type Values<T> = Attribute | Attributes<any> | ArraySlot<T> | Renderable<T>;
-
-
-const html = <T>(literals: TemplateStringsArray, ...values: (Values<T> | Values<T>[])[]) => {
-    let { fragment, slots } = parser.parse(literals),
-        clone = cloneNode.call(fragment, true);
-
-    if (slots !== null) {
-        let e, p;
-
-        for (let i = slots.length - 1; i >= 0; i--) {
-            let { fn, name, path } = slots[i];
-
-            if (p !== path) {
-                e = clone;
-
-                for (let i = 0, n = path.length; i < n; i++) {
-                    e = path[i].call(e);
-                }
-            }
-
-            if (name === null) {
-                (fn as typeof attributes.spread | typeof slot)(e, values[i] as any);
-            }
-            else {
-                (fn as typeof attributes.set)(e, name, values[i]);
-            }
-        }
-    }
-
-    return clone;
-};
-
-html.reactive = <T>(arr: ReactiveArray<T>, template: (value: T) => ReturnType<typeof html>) => {
-    return new ArraySlot(arr, template);
-};
-
-
-export default html;

package/src/html/parser.ts

@@ -1,235 +0,0 @@
-import {
-    NODE_CLOSING, NODE_ELEMENT, NODE_SLOT, NODE_VOID, NODE_WHITELIST,
-    REGEX_EMPTY_TEXT_NODES, REGEX_EVENTS, REGEX_SLOT_ATTRIBUTES, REGEX_SLOT_NODES,
-    SLOT_HTML, SLOT_MARKER
-} from '~/constants';
-import { Template } from '~/types';
-import { firstElementChild, nextElementSibling } from '~/utilities/element';
-import { firstChild, nextSibling } from '~/utilities/node';
-import { fragment } from '~/utilities/fragment';
-import a from '~/attributes';
-import s from '~/slot';
-
-
-let cache = new WeakMap<TemplateStringsArray, Template>();
-
-
-function build(literals: TemplateStringsArray) {
-    let n = literals.length - 1;
-
-    if (n === 0) {
-        return set(literals, literals[0]);
-    }
-
-    let attributes: Record<string, (null | string)[]> = {},
-        buffer = '',
-        events = false,
-        html = literals.join(SLOT_MARKER)
-            .replace(REGEX_EMPTY_TEXT_NODES, '$1$2')
-            .trim(),
-        index = 0,
-        level = 0,
-        levels = [{
-            children: 0,
-            elements: 0,
-            path: [] as NonNullable<Template['slots']>[number]['path']
-        }],
-        parsed = html.split(SLOT_MARKER),
-        slot = 0,
-        slots: Template['slots'] = [];
-
-    {
-        let attribute = '',
-            buffer = '',
-            char = '',
-            match: RegExpExecArray | null,
-            quote = '';
-
-        REGEX_SLOT_ATTRIBUTES.lastIndex = 0;
-
-        while (match = REGEX_SLOT_ATTRIBUTES.exec(html)) {
-            let found = match[1],
-                metadata = attributes[found];
-
-            if (metadata) {
-                continue;
-            }
-
-            metadata = attributes[found] = [];
-
-            for (let i = 0, n = found.length; i < n; i++) {
-                char = found[i];
-
-                if (char === ' ') {
-                    buffer = '';
-                }
-                else if (char === '=') {
-                    attribute = buffer;
-                    buffer = '';
-                }
-                else if (char === '"' || char === "'") {
-                    if (!attribute) {
-                        continue;
-                    }
-                    else if (!quote) {
-                        quote = char;
-                    }
-                    else if (quote === char) {
-                        attribute = '';
-                        buffer = '';
-                        quote = '';
-                    }
-                }
-                else if (char === '{' && char !== buffer) {
-                    buffer = char;
-                }
-                else {
-                    buffer += char;
-
-                    if (buffer === SLOT_MARKER) {
-                        buffer = '';
-
-                        if (attribute) {
-                            metadata.push(attribute);
-
-                            if (!quote) {
-                                attribute = '';
-                            }
-                        }
-                        else {
-                            metadata.push(null);
-                        }
-                    }
-                    else if (buffer === 'on') {
-                        events = true;
-                    }
-                }
-            }
-        }
-    }
-
-    REGEX_SLOT_NODES.lastIndex = 0;
-
-    {
-        let match: RegExpExecArray | null;
-
-        while (match = REGEX_SLOT_NODES.exec(html)) {
-        let parent = levels[level],
-            type = match[1] === undefined ? NODE_SLOT : (NODE_WHITELIST[match[1].toLowerCase()] || NODE_ELEMENT);
-
-        // Text nodes
-        if ((match.index || 1) - 1 > index) {
-            parent.children++;
-        }
-
-        if (type === NODE_ELEMENT || type === NODE_VOID) {
-            let attr = match[2],
-                path = parent.path.length
-                    ? methods(parent.elements, parent.path, firstElementChild, nextElementSibling)
-                    : methods(parent.children, [], firstChild, nextSibling);
-
-            if (attr) {
-                let metadata = attributes[attr];
-
-                if (!metadata) {
-                    throw new Error(`Template: attribute metadata could not be found for '${attr}'`);
-                }
-
-                for (let i = 0, n = metadata.length; i < n; i++) {
-                    let name = metadata[i];
-
-                    slots.push({
-                        fn: name === null ? a.spread : a.set,
-                        name,
-                        path
-                    });
-
-                    buffer += parsed[slot++];
-                }
-            }
-
-            if (type === NODE_ELEMENT) {
-                levels[++level] = {
-                    children: 0,
-                    elements: 0,
-                    path
-                };
-            }
-
-            parent.elements++;
-        }
-        else if (type === NODE_SLOT) {
-            buffer += parsed[slot++] + SLOT_HTML;
-            slots.push({
-                fn: s,
-                name: null,
-                path: methods(parent.children, parent.path, firstChild, nextSibling)
-            });
-        }
-
-        if (n === slot) {
-            buffer += parsed[slot];
-            break;
-        }
-
-        if (type === NODE_CLOSING) {
-            level--;
-        }
-        else {
-            parent.children++;
-        }
-
-            index = (match.index || 0) + match[0].length;
-        }
-    }
-
-    if (events) {
-        buffer = buffer.replace(REGEX_EVENTS, '');
-    }
-
-    return set(literals, buffer, slots);
-}
-
-function methods(children: number, copy: (typeof firstChild)[], first: (typeof firstChild), next: (typeof firstChild)) {
-    let length = copy.length,
-        methods: (typeof firstChild)[] = new Array(length + 1 + children);
-
-    for (let i = 0, n = length; i < n; i++) {
-        methods[i] = copy[i];
-    }
-
-    methods[length] = first;
-
-    for (let i = 0, n = children; i < n; i++) {
-        methods[length + 1 + i] = next;
-    }
-
-    return methods;
-}
-
-function set(literals: TemplateStringsArray, html: string, slots: Template['slots'] = null) {
-    let value = {
-            fragment: fragment(html),
-            html,
-            literals,
-            slots
-        };
-
-    cache.set(literals, value);
-
-    return value;
-}
-
-
-const parse = (literals: TemplateStringsArray) => {
-    let result = cache.get(literals);
-
-    if (result === undefined) {
-        result = build(literals);
-    }
-
-    return result;
-};
-
-
-export default { parse };

package/src/utilities/element.ts

@@ -1,28 +0,0 @@
-let getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor,
-    prototype = Element.prototype;
-
-
-const addEventListener = prototype.addEventListener;
-
-const className = getOwnPropertyDescriptor(prototype, 'className')!.set!;
-
-const innerHTML = getOwnPropertyDescriptor(prototype, 'innerHTML')!.set!;
-
-const firstElementChild = getOwnPropertyDescriptor(prototype, 'firstElementChild')!.get!;
-
-const nextElementSibling = getOwnPropertyDescriptor(prototype, 'nextElementSibling')!.get!;
-
-const removeAttribute = prototype.removeAttribute;
-
-const setAttribute = prototype.setAttribute;
-
-
-export {
-    addEventListener,
-    className,
-    innerHTML,
-    firstElementChild,
-    nextElementSibling,
-    removeAttribute,
-    setAttribute
-};

package/src/utilities/fragment.ts

@@ -1,19 +0,0 @@
-import { innerHTML } from './element';
-import { cloneNode } from './node';
-
-
-let template = document.createElement('template');
-
-
-const append = DocumentFragment.prototype.append;
-
-const fragment = (html: string): DocumentFragment => {
-    let element = cloneNode.call(template) as HTMLTemplateElement;
-
-    innerHTML.call(element, html);
-
-    return element.content;
-};
-
-
-export { append, fragment };

package/src/utilities/marker.ts

@@ -1,6 +0,0 @@
-import { SLOT_HTML } from '~/constants';
-import { fragment } from './fragment';
-import { firstChild } from './node';
-
-
-export default firstChild.call( fragment(SLOT_HTML) );

package/src/utilities/node.ts

@@ -1,29 +0,0 @@
-let getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor,
-    prototype = Node.prototype;
-
-
-const appendChild = prototype.appendChild;
-
-const cloneNode = prototype.cloneNode;
-
-const firstChild = getOwnPropertyDescriptor(prototype, 'firstChild')!.get!;
-
-const lastChild = getOwnPropertyDescriptor(prototype, 'lastChild')!.get!;
-
-const nextSibling = getOwnPropertyDescriptor(prototype, 'nextSibling')!.get!;
-
-const nodeValue = getOwnPropertyDescriptor(prototype, 'nodeValue')!.set!;
-
-const parentElement = getOwnPropertyDescriptor(prototype, 'parentElement')!.get!;
-
-const previousSibling = getOwnPropertyDescriptor(prototype, 'previousSibling')!.get!;
-
-
-export {
-    appendChild,
-    cloneNode,
-    firstChild,
-    lastChild,
-    nextSibling, nodeValue,
-    parentElement, previousSibling
-};

package/src/utilities/raf.ts

@@ -1 +0,0 @@
-export default globalThis?.requestAnimationFrame;

package/src/utilities/text.ts

@@ -1,15 +0,0 @@
-import { cloneNode, nodeValue } from './node';
-
-
-let text = document.createTextNode('');
-
-
-export default (value: string) => {
-    let element = cloneNode.call(text);
-
-    if (value !== '') {
-        nodeValue.call(element, value);
-    }
-
-    return element;
-};