mostly-dom/lib/modules/props.js

A virtual-dom for TypeScript

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    }
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var BaseModule_1 = require("./BaseModule");
var emptyVNode_1 = require("./emptyVNode");
function createPropsModule() {
    return new PropsModule();
}
exports.createPropsModule = createPropsModule;
exports.PROPERTIES_TO_SKIP = {
    class: true,
    on: true,
    listener: true,
    focus: true,
    style: true,
    attrs: true,
    key: true,
    module: true,
    init: true,
    create: true,
    update: true,
    insert: true,
    remove: true,
    destroy: true,
    prepatch: true,
    postpatch: true,
};
exports.ATTRIBUTE_TO_REMOVE = {
    id: true,
};
var PropsModule = /** @class */ (function (_super) {
    __extends(PropsModule, _super);
    function PropsModule() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    PropsModule.prototype.create = function (vNode) {
        updateProps(emptyVNode_1.emptyVNode, vNode);
    };
    PropsModule.prototype.update = function (formerVNode, vNode) {
        updateProps(formerVNode, vNode);
    };
    return PropsModule;
}(BaseModule_1.BaseModule));
function updateProps(formerVNode, vNode) {
    var element = vNode.element;
    var formerProps = formerVNode.props;
    var props = vNode.props;
    if (!formerProps && !props)
        return;
    formerProps = formerProps || {};
    props = props || {};
    for (var key in formerProps) {
        var propertyIsMissing = !exports.PROPERTIES_TO_SKIP[key] && !props[key];
        var keyIsClassName = propertyIsMissing && key === 'className';
        var shouldRemoveAttribute = propertyIsMissing && exports.ATTRIBUTE_TO_REMOVE[key];
        if (propertyIsMissing)
            delete element[key];
        if (keyIsClassName)
            removePreviousClassName(formerProps[key], element);
        if (shouldRemoveAttribute)
            element.removeAttribute(key);
    }
    for (var key in props)
        if (!exports.PROPERTIES_TO_SKIP[key])
            element[key] = props[key];
}
function removePreviousClassName(className, element) {
    var _a;
    var shouldRemoveClassName = className && element.classList;
    var shouldRemoveClassAttribute = shouldRemoveClassName && element.getAttribute('class') === '';
    if (shouldRemoveClassName)
        (_a = element.classList).remove.apply(_a, className.split(' '));
    if (shouldRemoveClassAttribute)
        element.removeAttribute('class');
}
//# sourceMappingURL=props.js.map