"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const recompose_1 = require("recompose");
const prop_types_1 = __importDefault(require("prop-types"));
class ScrollObserver extends react_1.default.Component {
    constructor() {
        super(...arguments);
        this.isBottomReached = () => {
            const { setShouldSendBottomEvent, shouldSendBottomEvent, onBottomReachedThreshold, } = this.props;
            if (this.el) {
                const bottom = this.el.getBoundingClientRect().bottom;
                const offset = onBottomReachedThreshold;
                if (bottom > window.innerHeight + offset) {
                    if (!shouldSendBottomEvent) {
                        // turn on event sending
                        setShouldSendBottomEvent(true);
                    }
                }
                return bottom <= window.innerHeight + offset;
            }
        };
        this.isTopReached = () => {
            const { setShouldSendTopEvent, onTopReachedThreshold, shouldSendTopEvent, } = this.props;
            if (this.el) {
                const top = this.el.getBoundingClientRect().top;
                const offset = onTopReachedThreshold;
                if (top + offset < 0) {
                    if (!shouldSendTopEvent) {
                        // turn on event sending
                        setShouldSendTopEvent(true);
                    }
                }
                return top + offset >= 0;
            }
        };
        this.observeScrolling = () => {
            const { onBottomReached, onTopReached, setShouldSendBottomEvent, setShouldSendTopEvent, shouldSendTopEvent, shouldSendBottomEvent, } = this.props;
            if (onBottomReached && this.isBottomReached() && shouldSendBottomEvent) {
                onBottomReached(this.el);
                setShouldSendBottomEvent(false);
            }
            if (onTopReached && this.isTopReached() && shouldSendTopEvent) {
                onTopReached(this.el);
                setShouldSendTopEvent(false);
            }
        };
    }
    componentDidMount() {
        // call observeScrolling first time manually when component mount
        // this will be helpful when screen height is too big and total fetch records are occupying less height then screen height
        this.observeScrolling();
        document.addEventListener('scroll', this.observeScrolling);
    }
    componentWillUnmount() {
        document.removeEventListener('scroll', this.observeScrolling);
    }
    render() {
        return react_1.default.createElement("span", { ref: ref => (this.el = ref) }, this.props.children);
    }
}
ScrollObserver.propTypes = {
    onBottomReached: prop_types_1.default.func,
    onBottomReachedThreshold: prop_types_1.default.number,
    onTopReached: prop_types_1.default.func,
    onTopReachedThreshold: prop_types_1.default.number,
};
ScrollObserver.defaultProps = {
    onBottomReachedThreshold: 0,
    onTopReachedThreshold: 0,
};
exports.default = recompose_1.compose(recompose_1.withState('shouldSendBottomEvent', 'setShouldSendBottomEvent', true), recompose_1.withState('shouldSendTopEvent', 'setShouldSendTopEvent', true))(ScrollObserver);
//# sourceMappingURL=index.js.map