@web-atoms/core-docs/dist/core/BindableProperty.js

Web Atoms Core

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "./AtomBinder"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    exports.BindableProperty = void 0;
    const AtomBinder_1 = require("./AtomBinder");
    /**
     * Use this decorator only to watch property changes in `onPropertyChanged` method.
     * This decorator also makes enumerable property.
     *
     * Do not use this on anything except UI control
     * @param target control
     * @param key name of property
     */
    function BindableProperty(target, key) {
        // property value
        const iVal = target[key];
        const keyName = "_" + key;
        target[keyName] = iVal;
        // property getter
        const getter = function () {
            // console.log(`Get: ${key} => ${_val}`);
            return this[keyName];
        };
        // property setter
        const setter = function (newVal) {
            // console.log(`Set: ${key} => ${newVal}`);
            const oldValue = this[keyName];
            // tslint:disable-next-line:triple-equals
            if (oldValue === undefined ? oldValue === newVal : oldValue == newVal) {
                return;
            }
            const ce = this;
            if (ce.onPropertyChanging) {
                ce.onPropertyChanging(key, oldValue, newVal);
            }
            this[keyName] = newVal;
            AtomBinder_1.AtomBinder.refreshValue(this, key);
        };
        // delete property
        if (delete target[key]) {
            // create new property with getter and setter
            Object.defineProperty(target, key, {
                get: getter,
                set: setter,
                enumerable: true,
                configurable: true
            });
        }
    }
    exports.BindableProperty = BindableProperty;
});
//# sourceMappingURL=BindableProperty.js.map