office-ui-fabric-react/lib-amd/common/ConnectedHost.js

Reusable React components for building experiences for Office 365.

define(["require", "exports", "tslib", "react", "prop-types", "../Utilities"], function (require, exports, tslib_1, React, PropTypes, Utilities_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    // Track all components that require changes.
    var _changedComponents;
    var ConnectedHost = (function (_super) {
        tslib_1.__extends(ConnectedHost, _super);
        function ConnectedHost(props) {
            var _this = _super.call(this, props) || this;
            _this.state = {
                props: null
            };
            return _this;
        }
        ConnectedHost.prototype.componentWillMount = function () {
            var _this = this;
            if (this.props.storesToSubscribe && this.props.storesToSubscribe.length > 0) {
                if (!this.context.stores) {
                    throw "A connected component was hosted in an environment where no stores were hosted. Use the StoreHost to host components.";
                }
                // Resolve and subscribe to stores.
                this._stores = this.props.storesToSubscribe.map(function (storeKey) {
                    var store = _this.context.stores.getStore(storeKey);
                    if (!store) {
                        throw "The \"" + storeKey.name + "\" store was required by a connected component, but not exposed.";
                    }
                    _this._disposables.push(store.subscribe(_this._onStoreChanged));
                    return store;
                });
            }
            // We can only initialize state at this point, where context has been resolved.
            this.state = {
                props: this._getComponentProps(this.props)
            };
        };
        ConnectedHost.prototype.componentDidMount = function () {
            this._isMounted = true;
        };
        ConnectedHost.prototype.componentWillUnmount = function () {
            this._isMounted = false;
        };
        ConnectedHost.prototype.componentWillReceiveProps = function (newProps) {
            this._updateProps(newProps);
        };
        ConnectedHost.prototype.shouldComponentUpdate = function (newProps, newState) {
            var inputPropsHaveChanged = !Utilities_1.shallowCompare(this.props.componentProps, newProps.componentProps);
            var computedPropsHaveChanged = !Utilities_1.shallowCompare(this.state.props, newState.props);
            var shouldUpdate = inputPropsHaveChanged || computedPropsHaveChanged;
            return shouldUpdate;
        };
        ConnectedHost.prototype.render = function () {
            var Component = this.props.component;
            var props = this.state.props;
            return props ? React.createElement(Component, tslib_1.__assign({}, props)) : null;
        };
        ConnectedHost.prototype._onStoreChanged = function () {
            var storesToSubscribe = this.props.storesToSubscribe;
            if (!storesToSubscribe || storesToSubscribe.length < 2) {
                this._updateProps();
            }
            else if (!this._changeEnqueued) {
                if (!_changedComponents) {
                    _changedComponents = [];
                    this._async.setImmediate(function () {
                        _changedComponents.forEach(function (comp) { return comp._updateProps(); });
                        _changedComponents = null;
                    });
                }
                _changedComponents.push(this);
                this._changeEnqueued = true;
            }
        };
        ConnectedHost.prototype._updateProps = function (props) {
            this._changeEnqueued = false;
            props = this._getComponentProps(props || this.props);
            this.setState({ props: props });
        };
        ConnectedHost.prototype._getComponentProps = function (props) {
            var newProps = Utilities_1.assign({}, props.componentProps, props.getProps.apply(props, [props.componentProps].concat(this._stores)));
            return newProps;
        };
        return ConnectedHost;
    }(Utilities_1.BaseComponent));
    ConnectedHost.contextTypes = {
        stores: PropTypes.object
    };
    tslib_1.__decorate([
        Utilities_1.autobind
    ], ConnectedHost.prototype, "_onStoreChanged", null);
    tslib_1.__decorate([
        Utilities_1.autobind
    ], ConnectedHost.prototype, "_updateProps", null);
    exports.ConnectedHost = ConnectedHost;
});

//# sourceMappingURL=ConnectedHost.js.map