myra/myra.es.js

/** @license MIT https://github.com/jhdrn/myra/blob/master/LICENSE - Copyright (c) 2016-2021 Jonathan Hedrén */
/**
 * The renderingContext is used to obtain context varibles from within "hooks".
 */
var renderingContext;
function getRenderingContext() {
    return renderingContext;
}
/**
 * Renders the component and handles it's "lifecycle" by triggering any effects.
 */
function renderComponent(parentElement, newVNode, oldVNode, isSvg) {
    var oldNode;
    var newProps = newVNode.props, rendition = newVNode.rendition;
    if (rendition !== undefined) {
        oldNode = rendition.domRef;
    }
    if (renderingContext === undefined) {
        try {
            renderingContext = {
                vNode: newVNode,
                isSvg: isSvg,
                parentElement: parentElement,
                hookIndex: 0
            };
            var newView = newVNode.view(newProps);
            if (newView._ === 5 /* Memo */) {
                if (oldVNode !== undefined && newView.compare(newVNode.props, oldVNode.props)) {
                    newVNode.domRef = oldNode;
                    renderingContext = undefined;
                    return;
                }
                newView = newView.view(newProps);
            }
            renderingContext = undefined;
            render(parentElement, newView, newVNode.rendition, oldNode, isSvg);
            newVNode.rendition = newView;
            newVNode.domRef = newView.domRef;
            // Trigger synchronous effects (useLayoutEffect)
            triggerEffects(newVNode, parentElement, isSvg, true);
            // Trigger asynchronous effects (useEffect)
            triggerEffects(newVNode, parentElement, isSvg, false);
        }
        catch (err) {
            tryHandleComponentError(parentElement, newVNode, isSvg, err);
        }
    }
}
/**
 * Triggers all invokeable effects.
 */
function triggerEffects(newVNode, parentElement, isSvg, sync) {
    var effects = newVNode.effects;
    if (effects !== undefined) {
        var _loop_1 = function (i) {
            var t = effects[i];
            if (t.invoke) {
                if (t.sync && sync) {
                    attemptEffectCleanup(t);
                    t.cleanup = t.effect();
                    t.invoke = false;
                }
                else if (!sync) {
                    setTimeout(function () {
                        try {
                            attemptEffectCleanup(t);
                            t.cleanup = t.effect();
                        }
                        catch (err) {
                            tryHandleComponentError(parentElement, newVNode, isSvg, err);
                        }
                    }, 0);
                    t.invoke = false;
                }
            }
        };
        for (var i in effects) {
            _loop_1(i);
        }
    }
}
/**
 * Calls the cleanup function if it's set and then removes it from the wrapper
 */
function attemptEffectCleanup(t) {
    if (t.cleanup !== undefined) {
        try {
            t.cleanup();
        }
        catch (err) {
            console.error('An error occured during effect cleanup: ' + err);
        }
        t.cleanup = undefined;
    }
}
/**
 * Calls the error handler (if any) and renders the returned view.
 */
function tryHandleComponentError(parentElement, vNode, isSvg, err) {
    // Do nothing if the parentElement is not longer connected to the DOM
    if (parentElement.parentNode === null) {
        return;
    }
    if (vNode.errorHandler !== undefined) {
        renderingContext = undefined;
        var oldNode = void 0;
        if (vNode.rendition !== undefined) {
            oldNode = vNode.rendition.domRef;
        }
        var errorView = vNode.errorHandler(err);
        render(parentElement, errorView, vNode.rendition, oldNode, isSvg);
        vNode.rendition = errorView;
        vNode.domRef = errorView.domRef;
    }
    else {
        throw err;
    }
}
/**
 * Traverses the virtual node hierarchy and unmounts any components in the
 * hierarchy.
 */
function findAndUnmountComponentsRec(vNode) {
    if (vNode === undefined) {
        return;
    }
    if (vNode._ === 4 /* Component */) {
        // Attempt to call any "cleanup" function for all effects before unmount.
        var effects = vNode.effects;
        if (effects !== undefined) {
            for (var i in effects) {
                attemptEffectCleanup(effects[i]);
            }
        }
        findAndUnmountComponentsRec(vNode.rendition);
    }
    else if (vNode._ === 2 /* Element */ || vNode._ === 3 /* Fragment */) {
        for (var _i = 0, _a = vNode.props.children; _i < _a.length; _i++) {
            var c = _a[_i];
            findAndUnmountComponentsRec(c);
        }
    }
}
/**
 * Renders the view by traversing the virtual node tree recursively
 */
function render(parentDomNode, newVNode, oldVNode, existingDomNode, isSvg, action) {
    if (isSvg === void 0) { isSvg = false; }
    if (action === void 0) { action = null; }
    if (action === null) {
        // Decide what action to take
        if (newVNode._ === 3 /* Fragment */ && oldVNode !== undefined && oldVNode._ === 3 /* Fragment */) {
            action = 4 /* UPDATE */;
        }
        else if (oldVNode === undefined || oldVNode.domRef === undefined && oldVNode._ !== 3 /* Fragment */ && oldVNode._ !== 4 /* Component */) {
            action = 1 /* APPEND */;
        }
        else if (oldVNode.domRef !== undefined && existingDomNode === undefined) {
            action = 2 /* INSERT */;
        }
        else if (newVNode._ !== oldVNode._) {
            action = 3 /* REPLACE */;
        }
        else if (newVNode._ === 2 /* Element */ && oldVNode._ === 2 /* Element */ &&
            newVNode.tagName !== oldVNode.tagName) {
            action = 3 /* REPLACE */;
        }
        else if (newVNode._ === 4 /* Component */ && oldVNode._ === 4 /* Component */ &&
            newVNode.view !== oldVNode.view) {
            action = 3 /* REPLACE */;
        }
        else {
            action = 4 /* UPDATE */;
        }
    }
    if (newVNode.tagName === 'svg') {
        isSvg = true;
    }
    switch (action) {
        case 1 /* APPEND */:
        case 2 /* INSERT */:
        case 3 /* REPLACE */:
            renderCreate(parentDomNode, newVNode, oldVNode, existingDomNode, isSvg, action);
            break;
        case 4 /* UPDATE */:
            renderUpdate(parentDomNode, newVNode, oldVNode, existingDomNode, isSvg);
            break;
    }
}
/**
 * Creates a new DOM node from a VNode and then renders all it's children.
 */
function renderCreate(parentDomNode, newVNode, oldVNode, existingDomNode, isSvg, action) {
    if (isSvg === void 0) { isSvg = false; }
    if (action === void 0) { action = undefined; }
    if (newVNode._ === 4 /* Component */) {
        renderComponent(parentDomNode, newVNode, undefined, isSvg);
        var domNode = newVNode.domRef;
        if (domNode !== undefined) {
            if (action === 1 /* APPEND */) {
                parentDomNode.appendChild(domNode);
            }
            else if (action === 2 /* INSERT */) {
                parentDomNode.insertBefore(domNode, oldVNode.domRef);
            }
            else if (action === 3 /* REPLACE */) {
                // If it's a component node or an element node and it should be 
                // replaced, unmount any components in the tree.
                if (oldVNode._ === 4 /* Component */ || oldVNode._ === 2 /* Element */ || oldVNode._ === 3 /* Fragment */) {
                    findAndUnmountComponentsRec(oldVNode);
                }
                // When using fragments, we can have cases where several "steps" in
                // the hierarchy is skipped.
                if (oldVNode.domRef === undefined && (oldVNode._ === 3 /* Fragment */ || oldVNode._ === 4 /* Component */)) {
                    replaceAndRemoveFragmentNodes(parentDomNode, oldVNode, domNode);
                }
                else {
                    parentDomNode.replaceChild(domNode, existingDomNode);
                }
            }
        }
    }
    else if (newVNode._ === 3 /* Fragment */) {
        // Skip creating a node for the fragment, instead render the children
        // directly to the parent DOM node
        for (var _i = 0, _a = newVNode.props.children; _i < _a.length; _i++) {
            var c = _a[_i];
            if (c !== undefined) {
                render(parentDomNode, c, undefined, undefined, isSvg);
            }
        }
    }
    else if (newVNode._ !== 5 /* Memo */) {
        var newNode = createNode(newVNode, isSvg);
        newVNode.domRef = newNode;
        if (action === 1 /* APPEND */) {
            parentDomNode.appendChild(newNode);
        }
        else if (action === 2 /* INSERT */) {
            parentDomNode.insertBefore(newNode, oldVNode.domRef);
        }
        else { // action === ACTION_REPLACE
            // If it's a component node or an element node and it should be 
            // replaced, unmount any components in the tree.
            if (oldVNode._ === 4 /* Component */ || oldVNode._ === 2 /* Element */ || oldVNode._ === 3 /* Fragment */) {
                findAndUnmountComponentsRec(oldVNode);
            }
            // When using fragments, we can have cases where several "steps" in
            // the hierarchy is skipped, thus we might need to remove multiple 
            // DOM nodes in addition to replacing one.
            if (oldVNode.domRef === undefined && (oldVNode._ === 3 /* Fragment */ || oldVNode._ === 4 /* Component */)) {
                var fragmentNode = oldVNode;
                if (oldVNode._ === 4 /* Component */) {
                    fragmentNode = oldVNode.rendition;
                }
                replaceAndRemoveFragmentNodes(parentDomNode, fragmentNode, newNode);
            }
            else {
                // If it's an element node remove old event listeners before 
                // replacing the node. 
                if (oldVNode._ === 2 /* Element */) {
                    for (var attr in oldVNode.props) {
                        if (attr.indexOf('on') === 0) {
                            removeAttr(attr, existingDomNode);
                        }
                    }
                }
                parentDomNode.replaceChild(newNode, existingDomNode);
            }
        }
        // If it's an element node set attributes and event listeners
        if (newVNode._ === 2 /* Element */) {
            var props = newVNode.props;
            for (var name_1 in props) {
                if (name_1 === 'children' || name_1 === 'key') {
                    continue;
                }
                else if (name_1 === 'ref') {
                    props[name_1].current = newNode;
                }
                var attributeValue = props[name_1];
                if (attributeValue !== undefined) {
                    setAttr(newNode, name_1, attributeValue);
                }
            }
            for (var _b = 0, _c = props.children; _b < _c.length; _b++) {
                var c = _c[_b];
                if (c !== undefined) {
                    render(newNode, c, undefined, undefined, isSvg);
                }
            }
        }
    }
}
/**
 * Finds fragment child nodes, replaces the first one with newNode and removes
 * the rest.
 */
function replaceAndRemoveFragmentNodes(parentDomNode, fragmentVNode, newNode) {
    var childNodes = getFragmentChildDomNodesRec(fragmentVNode);
    for (var i = 0; i < childNodes.length; i++) {
        var child = childNodes[i];
        if (i === 0) {
            parentDomNode.replaceChild(newNode, child);
        }
        else {
            parentDomNode.removeChild(child);
        }
    }
}
/**
 * Updates a DOM not from a new VNode.
 */
function renderUpdate(parentDomNode, newVNode, oldVNode, existingDomNode, isSvg) {
    // if (!nodesEqual(oldVNode.node, existingDomNode)) {
    //     TODO: "debug mode" with warnings?
    //     console.error('The view is not matching the DOM. Are outside forces tampering with it?')
    // }
    if (isSvg === void 0) { isSvg = false; }
    // update existing node
    switch (newVNode._) {
        case 2 /* Element */:
            updateElementAttributes(newVNode, oldVNode, existingDomNode);
            updateElementVNode(newVNode, oldVNode, existingDomNode, isSvg);
            break;
        case 1 /* Text */:
            if (existingDomNode.textContent !== newVNode.value) {
                existingDomNode.textContent = newVNode.value;
            }
            break;
        case 4 /* Component */:
            newVNode.rendition = oldVNode.rendition;
            newVNode.data = oldVNode.data;
            newVNode.effects = oldVNode.effects;
            newVNode.errorHandler = oldVNode.errorHandler;
            newVNode.link = oldVNode.link;
            newVNode.link.vNode = newVNode;
            renderComponent(parentDomNode, newVNode, oldVNode, isSvg);
            break;
        case 3 /* Fragment */:
            updateElementVNode(newVNode, oldVNode, parentDomNode, // Fragments doesn´t reference any DOM node, instead pass the parent
            isSvg);
            break;
    }
    if (newVNode.domRef === undefined) {
        // add a reference to the node
        newVNode.domRef = existingDomNode;
    }
    if (newVNode !== oldVNode) {
        // clean up
        oldVNode.domRef = undefined;
    }
}
/**
 * Creates a DOM Node from a (non component or fragment) VNode.
 */
function createNode(vNode, isSvg) {
    switch (vNode._) {
        case 2 /* Element */:
            if (isSvg) {
                return document.createElementNS('http://www.w3.org/2000/svg', vNode.tagName);
            }
            return document.createElement(vNode.tagName);
        case 1 /* Text */:
            return document.createTextNode(vNode.value);
        case 0 /* Nothing */:
            return document.createComment('Nothing');
    }
}
/**
 * Updates an existing HTMLElement DOM node from a new VNode.
 */
function updateElementVNode(newVNode, oldVNode, existingDomNode, isSvg) {
    var _a;
    if (isSvg === void 0) { isSvg = false; }
    var newChildVNodes = newVNode.props.children;
    var oldChildVNodes = oldVNode.props.children;
    var diffNoOfChildNodes = oldChildVNodes.length - newChildVNodes.length;
    if (newChildVNodes.length > 0) {
        // Create a map holding references to all the old child 
        // VNodes indexed by key
        var keyMap = {};
        // Node "pool" for reuse
        var unkeyedNodes = [];
        // Prepare the map with the keys from the new nodes
        for (var i = 0; i < newChildVNodes.length; i++) {
            var newChildVNode = newChildVNodes[i];
            var props = newChildVNode.props;
            if (props !== undefined && props !== null && props.key !== undefined) {
                keyMap[props.key] = undefined;
            }
        }
        // Go through the old child VNodes to see if there are any old ones matching the new VNodes
        var matchingKeyedNodes = false;
        for (var i = 0; i < oldChildVNodes.length; i++) {
            var oldChildVNode = oldChildVNodes[i];
            var props = oldChildVNode.props;
            if (props !== undefined && props !== null && props.key !== undefined) {
                // If the key has been added (from a new VNode), update it's value
                if (props.key in keyMap) {
                    keyMap[props.key] = [oldChildVNode, oldChildVNode.domRef];
                    matchingKeyedNodes = true;
                }
                // else save the DOM node for reuse or removal
                else if (existingDomNode.contains(oldChildVNode.domRef)) {
                    unkeyedNodes.push(oldChildVNode.domRef);
                }
            }
        }
        // If there was no matching keyed nodes, remove all old 
        // DOM nodes
        if (!matchingKeyedNodes && Object.keys(keyMap).length > 0) {
            existingDomNode.innerHTML = '';
            unkeyedNodes.length = 0;
            for (var i = newChildVNodes.length + diffNoOfChildNodes - 1; i > -1; i--) {
                var oldChildVNode = oldChildVNodes[i];
                oldChildVNode.domRef = undefined;
                // Make sure any sub-components are "unmounted"
                findAndUnmountComponentsRec(oldChildVNode);
            }
        }
        var domNodeAtIndex = existingDomNode.firstChild;
        var nextDomNode = null;
        // Start iterating over the new nodes and render them
        for (var i = 0; i < newChildVNodes.length; i++) {
            var newChildVNode = newChildVNodes[i];
            var oldChildVNode = oldChildVNodes[i];
            var matchingChildDomNode = void 0;
            var childAction = void 0;
            if (domNodeAtIndex !== null) {
                nextDomNode = domNodeAtIndex.nextSibling;
            }
            // If there is an old VNode, it's DOM ref should be
            // treated as the current/matching DOM node
            if (oldChildVNode !== undefined) {
                matchingChildDomNode = oldChildVNode.domRef;
            }
            var newProps = newChildVNode.props;
            // Check if the new VNode is "keyed"
            if (newProps !== undefined
                && oldChildVNodes.length > 0) {
                var newChildVNodeKey = newProps.key;
                if (newChildVNodeKey !== undefined) {
                    // Fetch the old keyed item from the key map
                    var keyMapEntry = keyMap[newChildVNodeKey];
                    // If there was no old matching key, reuse an old unkeyed node
                    if (keyMapEntry === undefined) {
                        matchingChildDomNode = unkeyedNodes.shift();
                        if (matchingChildDomNode !== undefined) {
                            // Make sure that the DOM node will be
                            // recreated when rendered
                            childAction = 3 /* REPLACE */;
                        }
                    }
                    // If there was a matching key, use the old vNodes dom ref
                    else {
                        oldChildVNode = keyMapEntry[0], matchingChildDomNode = keyMapEntry[1];
                    }
                    // Move the matching dom node to it's new position
                    if (matchingChildDomNode !== undefined && matchingChildDomNode !== domNodeAtIndex) {
                        // If there is no DOM node at the current index, 
                        // the matching DOM node should be appended.
                        if (domNodeAtIndex === null) {
                            existingDomNode.appendChild(matchingChildDomNode);
                        }
                        // Move the node by replacing the node at the current index
                        else if (existingDomNode.contains(matchingChildDomNode)) {
                            existingDomNode.replaceChild(matchingChildDomNode, domNodeAtIndex);
                            nextDomNode = matchingChildDomNode.nextSibling;
                        }
                        else {
                            existingDomNode.insertBefore(matchingChildDomNode, domNodeAtIndex);
                        }
                    }
                }
            }
            render(existingDomNode, newChildVNode, oldChildVNode, matchingChildDomNode, isSvg, childAction);
            domNodeAtIndex = nextDomNode;
        }
    }
    if (diffNoOfChildNodes > 0) {
        // Remove old unused DOM nodes backwards from the end
        for (var i = newChildVNodes.length + diffNoOfChildNodes - 1; i > newChildVNodes.length - 1; i--) {
            var oldChildVNode = oldChildVNodes[i];
            // Make sure any sub-components are "unmounted"
            findAndUnmountComponentsRec(oldChildVNode);
            if (oldChildVNode._ === 3 /* Fragment */) {
                removeFragmentChildNodes(oldChildVNode, existingDomNode);
            }
            else if (oldChildVNode._ === 4 /* Component */ && ((_a = oldChildVNode.rendition) === null || _a === void 0 ? void 0 : _a._) === 3 /* Fragment */) {
                removeFragmentChildNodes(oldChildVNode.rendition, existingDomNode);
            }
            else {
                var oldChildDomNode = oldChildVNode.domRef;
                if (oldChildDomNode !== undefined && existingDomNode.contains(oldChildDomNode)) {
                    existingDomNode.removeChild(oldChildDomNode);
                }
            }
        }
    }
}
/**
 * Removes any Fragment child DOM nodes from parentDomElement
 */
function removeFragmentChildNodes(fragmentNode, parentDomElement) {
    var childNodes = getFragmentChildDomNodesRec(fragmentNode);
    for (var _i = 0, childNodes_1 = childNodes; _i < childNodes_1.length; _i++) {
        var c = childNodes_1[_i];
        parentDomElement.removeChild(c);
    }
}
/**
 * Recursively traverses the vNode tree and removes any Fragment child DOM nodes
 * from domElement
 */
function getFragmentChildDomNodesRec(fragmentNode, parentDomElement) {
    var _a;
    var nodes = [];
    for (var _i = 0, _b = fragmentNode.props.children; _i < _b.length; _i++) {
        var fragmentChild = _b[_i];
        if (fragmentChild._ === 3 /* Fragment */) {
            nodes.push.apply(nodes, getFragmentChildDomNodesRec(fragmentChild));
        }
        else if (fragmentChild._ === 4 /* Component */ && ((_a = fragmentChild.rendition) === null || _a === void 0 ? void 0 : _a._) === 3 /* Fragment */) {
            nodes.push.apply(nodes, getFragmentChildDomNodesRec(fragmentChild.rendition));
        }
        var childNode = fragmentChild.domRef;
        if (childNode !== undefined) {
            nodes.push(childNode);
        }
    }
    return nodes;
}
/**
 * Sets an attribute or event listener on an HTMLElement.
 */
function setAttr(element, attributeName, attributeValue) {
    // The the "value" attribute shoud be set explicitly (and only if it has 
    // changed) to prevent jumping cursors in some browsers (Safari)
    if (attributeName === 'value' && (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA' || element.tagName === 'SELECT')) {
        if (element.value !== attributeValue) {
            element.value = attributeValue;
        }
    }
    else if (attributeName in element) {
        try {
            element[attributeName] = attributeValue;
            return;
        }
        catch (_) {
            /** Ignore and use setAttribute instead  */
        }
    }
    var attrValueType = typeof attributeValue;
    if (attrValueType !== 'function' && attrValueType !== 'object') {
        element.setAttribute(attributeName, attributeValue);
    }
}
/**
 * Removes an attribute or event listener from an HTMLElement.
 */
function removeAttr(a, node) {
    if (a.indexOf('on') === 0) {
        node[a] = null;
    }
    else if (node.hasAttribute(a)) {
        node.removeAttribute(a);
    }
}
/**
 * Sets/removes attributes on an DOM element node
 */
function updateElementAttributes(newVNode, oldVNode, existingDomNode) {
    var newProps = newVNode.props;
    var oldProps = oldVNode.props;
    // remove any attributes that was added with the old virtual node but does 
    // not exist in the new virtual node or should be removed anyways (event listeners).
    for (var attributeName in oldProps) {
        if (attributeName === 'children' || attributeName === 'key' || attributeName === 'ref') {
            continue;
        }
        if (newProps[attributeName] === undefined || attributeName.indexOf('on') === 0) {
            removeAttr(attributeName, existingDomNode);
        }
    }
    var attributeValue;
    var oldAttributeValue;
    var hasAttr;
    // update any attribute where the attribute value has changed
    for (var name_2 in newProps) {
        if (name_2 === 'children' || name_2 === 'key') {
            continue;
        }
        else if (name_2 === 'ref') {
            newProps[name_2].current = existingDomNode;
            continue;
        }
        attributeValue = newProps[name_2];
        hasAttr = existingDomNode.hasAttribute(name_2);
        // We need to check the actual DOM value of the "value" property
        // otherwise it may not be updated if the new prop value equals the old 
        // prop value
        if (name_2 === 'value' && name_2 in existingDomNode) {
            oldAttributeValue = existingDomNode.value;
        }
        else {
            oldAttributeValue = oldProps[name_2];
        }
        if ((name_2.indexOf('on') === 0 || attributeValue !== oldAttributeValue ||
            !hasAttr) && attributeValue !== undefined) {
            setAttr(existingDomNode, name_2, attributeValue);
        }
        else if (attributeValue === undefined && hasAttr) {
            existingDomNode.removeAttribute(name_2);
        }
    }
}

function Fragment(props) {
    var _a;
    return {
        _: 3 /* Fragment */,
        props: {
            children: (_a = props.children) !== null && _a !== void 0 ? _a : [],
            key: props.key
        }
    };
}

function flattenChildren(children) {
    var flattenedChildren = [];
    for (var _i = 0, children_1 = children; _i < children_1.length; _i++) {
        var child = children_1[_i];
        if (child === null || child === undefined || typeof child === 'boolean') {
            flattenedChildren.push({ _: 0 /* Nothing */ });
        }
        else if (Array.isArray(child)) {
            for (var _a = 0, _b = flattenChildren(child); _a < _b.length; _a++) {
                var c = _b[_a];
                flattenedChildren.push(c);
            }
        }
        else if (child._ === undefined) {
            // Any node which is not a vNode will be converted to a TextVNode
            flattenedChildren.push({
                _: 1 /* Text */,
                value: child
            });
        }
        else {
            flattenedChildren.push(child);
        }
    }
    return flattenedChildren;
}
/**
 * Creates a JSX.Element/VNode from a JSX tag.
 */
function h(tagNameOrComponent, props) {
    var children = [];
    for (var _i = 2; _i < arguments.length; _i++) {
        children[_i - 2] = arguments[_i];
    }
    if (tagNameOrComponent === 'nothing' ||
        tagNameOrComponent === undefined ||
        tagNameOrComponent === null ||
        typeof tagNameOrComponent === 'boolean') {
        return { _: 0 /* Nothing */ };
    }
    if (props === null) {
        props = {};
    }
    props.children = flattenChildren(children);
    if (typeof tagNameOrComponent === 'string') {
        return {
            _: 2 /* Element */,
            tagName: tagNameOrComponent,
            props: props
        };
    }
    else if (tagNameOrComponent === Fragment) {
        return tagNameOrComponent(props);
    }
    var vNode = {
        _: 4 /* Component */,
        debounceRender: false,
        props: props,
        view: tagNameOrComponent
    };
    vNode.link = {
        vNode: vNode
    };
    return vNode;
}

/**
 * Better "typeof" which identifies arrays.
 */
function typeOf(obj) {
    var objType = typeof obj;
    if (objType === 'string' || objType === 'number' || objType === 'boolean' || objType === 'function') {
        return objType;
    }
    if (obj === undefined) {
        return 'undefined';
    }
    if (obj === null) {
        return 'null';
    }
    return ({}).toString.call(obj).slice(8, -1).toLowerCase();
}
var basicEqualityTypes = ['string', 'number', 'boolean', 'undefined', 'null', 'function'];
/**
 * Does a deep equality check.
 */
function equal(a, b) {
    var typeOfA = typeOf(a);
    var typeOfB = typeOf(b);
    if (basicEqualityTypes.indexOf(typeOfA) >= 0) {
        return a === b;
    }
    else if (typeOfA === 'object' && typeOfB === 'object') {
        if (a === b) {
            return true;
        }
        if (Object.keys(a).length !== Object.keys(b).length) {
            return false;
        }
        for (var k in a) {
            if (a.hasOwnProperty(k)) {
                if (!equal(a[k], b[k])) {
                    return false;
                }
            }
        }
        return true;
    }
    else if (typeOfA === 'array' && typeOfB === 'array') {
        if (a === b) {
            return true;
        }
        if (a.length !== b.length) {
            return false;
        }
        for (var i in a) {
            if (!equal(a[i], b[i])) {
                return false;
            }
        }
        return true;
    }
    else if (typeOfA === 'date' && typeOfB === 'date') {
        return a.getTime() === b.getTime();
    }
    else if (typeOfA === 'regexp' && typeOfB === 'regexp') {
        return a.toString() === b.toString();
    }
    else if (typeOfA === typeOfB) {
        return a === b;
    }
    return false;
}

/**
 *
 * @param initialState the initial state
 */
function useState(initialState) {
    var renderingContext = getRenderingContext();
    var _a = renderingContext, hookIndex = _a.hookIndex, isSvg = _a.isSvg, parentElement = _a.parentElement, vNode = _a.vNode;
    if (vNode.data === undefined) {
        vNode.data = [];
    }
    if (vNode.data[hookIndex] === undefined) {
        var link_1 = vNode.link;
        var evolve_1 = function (update) {
            var currentVNode = link_1.vNode;
            try {
                if (typeof update === 'function') {
                    update = update(currentVNode.data[hookIndex][0]);
                }
                currentVNode.data[hookIndex] = [update, evolve_1];
                if (!currentVNode.debounceRender) {
                    requestAnimationFrame(function () {
                        link_1.vNode.debounceRender = false;
                        renderComponent(parentElement, link_1.vNode, undefined, isSvg);
                    });
                }
                currentVNode.debounceRender = true;
            }
            catch (err) {
                requestAnimationFrame(function () {
                    tryHandleComponentError(parentElement, currentVNode, isSvg, err);
                });
            }
            return currentVNode.data[hookIndex][0];
        };
        if (typeof initialState === 'function') {
            initialState = initialState();
        }
        vNode.data[hookIndex] = [initialState, evolve_1];
    }
    var state = vNode.data[hookIndex];
    renderingContext.hookIndex++;
    return state;
}
/**
 *
 * @param current an optional value
 */
function useRef(current) {
    var renderingContext = getRenderingContext();
    var _a = renderingContext, hookIndex = _a.hookIndex, vNode = _a.vNode;
    if (vNode.data === undefined) {
        vNode.data = [];
    }
    if (vNode.data[hookIndex] === undefined) {
        var link_2 = vNode.link;
        vNode.data[hookIndex] = {
            current: current,
            get node() {
                return link_2.vNode.domRef;
            }
        };
    }
    renderingContext.hookIndex++;
    return vNode.data[hookIndex];
}
/**
 *
 * @param handler
 */
function useErrorHandler(handler) {
    var renderingContext = getRenderingContext();
    var vNode = renderingContext.vNode;
    vNode.errorHandler = handler;
}
/**
 *
 * @param effect
 * @param arg
 */
function useLayoutEffect(effect, arg) {
    useEffectInternal(true, effect, arg);
}
/**
 *
 * @param effect
 * @param arg
 */
function useEffect(effect, arg) {
    useEffectInternal(false, effect, arg);
}
function useEffectInternal(sync, effect, arg) {
    var renderingContext = getRenderingContext();
    var _a = renderingContext, hookIndex = _a.hookIndex, vNode = _a.vNode;
    if (vNode.effects === undefined) {
        vNode.effects = [];
    }
    var t = vNode.effects[hookIndex];
    if (t === undefined) {
        vNode.effects[hookIndex] = {
            arg: arg,
            sync: sync,
            invoke: true,
            effect: effect,
        };
    }
    else if (arg === undefined || !equal(t.arg, arg)) {
        t.arg = arg;
        t.effect = effect;
        t.invoke = true;
    }
    renderingContext.hookIndex++;
}
/**
 *
 * @param fn
 * @param inputs
 */
function useMemo(fn, inputs) {
    var renderingContext = getRenderingContext();
    var _a = renderingContext, hookIndex = _a.hookIndex, vNode = _a.vNode;
    if (vNode.data === undefined) {
        vNode.data = [];
    }
    var res;
    if (vNode.data[hookIndex] === undefined) {
        res = fn(inputs);
        vNode.data[hookIndex] = [res, inputs];
    }
    else {
        var _b = vNode.data[hookIndex], prevRes = _b[0], prevInputs = _b[1];
        if (equal(prevInputs, inputs)) {
            res = prevRes;
        }
        else {
            res = fn(inputs);
            vNode.data[hookIndex] = [res, inputs];
        }
    }
    renderingContext.hookIndex++;
    return res;
}

function shallowCompareProps(newProps, oldProps) {
    var newPropsKeys = Object.keys(newProps);
    if (newPropsKeys.length !== Object.keys(oldProps).length) {
        return false;
    }
    for (var _i = 0, newPropsKeys_1 = newPropsKeys; _i < newPropsKeys_1.length; _i++) {
        var k = newPropsKeys_1[_i];
        if (k === 'children') {
            continue;
        }
        if (newProps[k] !== oldProps[k]) {
            return false;
        }
    }
    return true;
}
/**
 * Memoizes a component view, preventing unnecessary renders.
 *
 * If no custom compare function is supplied, a shallow comparison of the props'
 * properties will decide whether the component will be rerendered or not.
 *
 * @param factory A component factory function
 * @param compare An optional props equality comparer function. If true is
 *                returned the memoized view will be kept, otherwise the view
 *                will be rerendered.
 */
function memo(factory, compare) {
    return function (props) {
        return {
            _: 5 /* Memo */,
            compare: compare || shallowCompareProps,
            view: factory,
            props: props
        };
    };
}

/**
 * Convenience function for type hinting
 *
 * @param fn
 */
function define(fn) {
    return fn;
}
/**
 * Mounts a virtual DOM node onto the supplied element.
 */
function mount(vNode, element) {
    requestAnimationFrame(function () {
        render(element, vNode, undefined, undefined);
    });
}

export { Fragment, define, equal, h, memo, mount, typeOf, useEffect, useErrorHandler, useLayoutEffect, useMemo, useRef, useState };