"use strict";
/**
 * @file LazyComponent
 * @description
 * @author fex
 */
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var VisibilitySensor = require("react-visibility-sensor");
var LazyComponent = /** @class */ (function (_super) {
    tslib_1.__extends(LazyComponent, _super);
    function LazyComponent(props) {
        var _this = _super.call(this, props) || this;
        _this.mounted = false;
        _this.handleVisibleChange = _this.handleVisibleChange.bind(_this);
        _this.state = {
            visible: false,
            component: props.component,
        };
        return _this;
    }
    LazyComponent.prototype.componentWillMount = function () {
        this.mounted = true;
    };
    LazyComponent.prototype.componentWillUnmount = function () {
        this.mounted = false;
    };
    LazyComponent.prototype.handleVisibleChange = function (visible) {
        var _this = this;
        this.setState({
            visible: visible,
        });
        if (!visible || this.state.component || !this.props.getComponent) {
            return;
        }
        this.props
            .getComponent()
            .then(function (component) {
            return _this.mounted && typeof component === 'function' && _this.setState({
                component: component,
            });
        })
            .catch(function (reason) {
            return _this.mounted && _this.setState({
                component: function () { return React.createElement("div", { className: "alert alert-danger" }, String(reason)); },
            });
        });
    };
    LazyComponent.prototype.render = function () {
        var _a = this.props, placeholder = _a.placeholder, unMountOnHidden = _a.unMountOnHidden, childProps = _a.childProps, visiblilityProps = _a.visiblilityProps, partialVisibility = _a.partialVisibility, rest = tslib_1.__rest(_a, ["placeholder", "unMountOnHidden", "childProps", "visiblilityProps", "partialVisibility"]);
        var _b = this.state, visible = _b.visible, Component = _b.component;
        // 需要监听从可见到不可见。
        if (unMountOnHidden) {
            return (React.createElement(VisibilitySensor, tslib_1.__assign({}, visiblilityProps, { partialVisibility: partialVisibility, onChange: this.handleVisibleChange }),
                React.createElement("div", { className: "visibility-sensor" }, Component && visible ? React.createElement(Component, tslib_1.__assign({}, rest, childProps)) : placeholder)));
        }
        if (!visible) {
            return (React.createElement(VisibilitySensor, tslib_1.__assign({}, visiblilityProps, { partialVisibility: partialVisibility, onChange: this.handleVisibleChange }),
                React.createElement("div", { className: "visibility-sensor" }, placeholder)));
        }
        else if (Component) {
            // 只监听不可见到可见，一旦可见了，就销毁检查。
            return React.createElement(Component, tslib_1.__assign({}, rest, childProps));
        }
        return React.createElement("div", null, placeholder);
    };
    LazyComponent.defaultProps = {
        placeholder: '加载中...',
        unMountOnHidden: false,
        partialVisibility: true,
    };
    return LazyComponent;
}(React.Component));
exports.default = LazyComponent;
//# sourceMappingURL=./components/LazyComponent.js.map
