A really dumb JSX library using the regular DOM. Needs work

element.js

const query = q => document.querySelector(q);
const queryAll = q => document.querySelectorAll(q);

const append = (p, c) => {
    p.appendChild(c);
    return p;
};
const text = t => document.createTextNode(t);

const element = (tag, attrs, children) => {
    // console.log(tag, attrs, children)
    let el = document.createElement(tag);
    if (el instanceof HTMLElement) {
        Object.assign(el, attrs);
        // Object.assign(el, attrs.filter( (k,v) => {} ));
        console.log(tag);
        console.dir(children);
        if (children === null) {
            // No kids!!! yayyyy!!
        } else if (children instanceof HTMLElement ){
            el.appendChild(children);
        } else if (typeof children == typeof [] ){
            for (let child of children) {
                if (child instanceof HTMLElement) el.appendChild(child);
                else el.appendChild(text(child));
            }
        } else if (typeof children === typeof ""){
            el.appendChild(
                document.createTextNode(children)
            );
        } else children = null;
        return el;
    }else {
        return document.createTextNode(tag);
    }
};
const style = (el) => {
    return (args, ...vs) => {
        let template = args.reduce((a, v, i) => a + v + vs[i]);
        let lines = template.replace(/[\s]+[\s][\b]?/g, "\n").split("\n").filter(it => it !== "");
        console.log(lines);
        lines.forEach( l => {
            let kvp = l.split(": ");
            let k = kvp[0]/* .replace(/(?<=\-)[aA-zZ]/g, match => {
                return match.toUpperCase();
            }) */, v = kvp[1].replace(";","");
            let temp = {};
            temp[k] = v;
            console.log(temp);
            Object.assign(el.style, temp);
        });

        return el;
    }
}

export {element, style, text, append, query, queryAll};