@haiku/player/lib/renderers/dom/updateElement.js

Haiku Player is a JavaScript library for building user interfaces

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var applyLayout_1 = require("./applyLayout");
var assignAttributes_1 = require("./assignAttributes");
var cloneVirtualElement_1 = require("./cloneVirtualElement");
var getFlexId_1 = require("./getFlexId");
var getTypeAsString_1 = require("./getTypeAsString");
var isTextNode_1 = require("./isTextNode");
var normalizeName_1 = require("./normalizeName");
var renderTree_1 = require("./renderTree");
var replaceElement_1 = require("./replaceElement");
var replaceElementWithText_1 = require("./replaceElementWithText");
function updateElement(domElement, virtualElement, parentNode, parentVirtualElement, component, isPatchOperation) {
    var flexId = getFlexId_1.default(virtualElement);
    if (isTextNode_1.default(virtualElement)) {
        replaceElementWithText_1.default(domElement, virtualElement, component);
        return virtualElement;
    }
    if (!domElement.haiku) {
        domElement.haiku = {
            component: component,
        };
    }
    if (!component.cache[flexId]) {
        component.cache[flexId] = {};
    }
    if (!domElement.haiku.element) {
        domElement.haiku.element = cloneVirtualElement_1.default(virtualElement);
    }
    var domTagName = domElement.tagName.toLowerCase().trim();
    var elName = normalizeName_1.default(getTypeAsString_1.default(virtualElement));
    var virtualElementTagName = elName.toLowerCase().trim();
    var incomingKey = virtualElement.key || (virtualElement.attributes && virtualElement.attributes.key);
    var existingKey = domElement.haiku && domElement.haiku.key;
    var isKeyDifferent = incomingKey !== null && incomingKey !== undefined && incomingKey !== existingKey;
    if (!component._isHorizonElement(virtualElement)) {
        if (domTagName !== virtualElementTagName) {
            return replaceElement_1.default(domElement, virtualElement, parentNode, parentVirtualElement, component);
        }
        if (isKeyDifferent) {
            return replaceElement_1.default(domElement, virtualElement, parentNode, parentVirtualElement, component);
        }
    }
    if (virtualElement.attributes && typeof virtualElement.attributes === 'object') {
        assignAttributes_1.default(domElement, virtualElement, component, isPatchOperation);
    }
    applyLayout_1.default(domElement, virtualElement, parentNode, parentVirtualElement, component, isPatchOperation);
    if (incomingKey !== undefined && incomingKey !== null) {
        domElement.haiku.key = incomingKey;
    }
    var subcomponent = (virtualElement && virtualElement.__instance) || component;
    if (Array.isArray(virtualElement.children)) {
        var doSkipChildren = isPatchOperation && (typeof virtualElement.children[0] !== 'string');
        renderTree_1.default(domElement, virtualElement, virtualElement.children, subcomponent, isPatchOperation, doSkipChildren);
    }
    else if (!virtualElement.children) {
        renderTree_1.default(domElement, virtualElement, [], subcomponent, isPatchOperation, null);
    }
    return domElement;
}
exports.default = updateElement;
//# sourceMappingURL=updateElement.js.map