"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 moment = require("moment");
var React = require("react");
var PropTypes = require("prop-types");
var classnames = require("classnames");
var react_datepicker_1 = require("react-datepicker");
var ReactDateTime = require("react-datetime");
var Forms_1 = require("../utils/Forms");
require("./DateInput.less");
require("../less/forms.less");
var popperPlacementPositions = {
    BOTTOM: "bottom",
    BOTTOM_END: "bottom-end",
    BOTTOM_START: "bottom-start",
    LEFT: "left",
    LEFT_END: "left-end",
    LEFT_START: "left-start",
    RIGHT: "right",
    RIGHT_END: "right-end",
    RIGHT_START: "right-start",
    TOP: "top",
    TOP_END: "top-end",
    TOP_START: "top-start",
};
var dateType = PropTypes.oneOfType([
    PropTypes.instanceOf(Date),
    PropTypes.instanceOf(moment),
]);
var propTypes = {
    disabled: PropTypes.bool,
    error: PropTypes.string,
    label: PropTypes.string,
    name: PropTypes.string.isRequired,
    onChange: PropTypes.func,
    placeholder: PropTypes.node,
    readOnly: PropTypes.bool,
    required: PropTypes.bool,
    type: PropTypes.string,
    value: dateType,
    className: PropTypes.string,
    min: dateType,
    max: dateType,
    useTime: PropTypes.bool,
    popperPlacement: PropTypes.oneOf(Object.values(popperPlacementPositions)),
    size: PropTypes.oneOf(Object.values(Forms_1.FormElementSize)),
    dateFormat: PropTypes.arrayOf(PropTypes.string),
};
var DateInput = /** @class */ (function (_super) {
    __extends(DateInput, _super);
    function DateInput(props) {
        var _this = _super.call(this, props) || this;
        _this.state = { inFocus: false, hasBeenFocused: false };
        _this.isValidDate = _this.isValidDate.bind(_this);
        return _this;
    }
    DateInput.prototype.isValidDate = function (current) {
        var afterMin = true;
        var beforeMax = true;
        if (this.props.min) {
            afterMin = current.isSameOrAfter(this.props.min);
        }
        if (this.props.max) {
            beforeMax = current.isSameOrBefore(this.props.max);
        }
        return afterMin && beforeMax;
    };
    DateInput.prototype.render = function () {
        var _this = this;
        var classes = ["DateInput"];
        // add additional wrapper classes
        if (this.props.error) {
            classes.push("DateInput--hasError");
        }
        // TODO:  throw error for mutually exclusive states
        if (this.props.readOnly) {
            classes.push("DateInput--readonly");
        }
        else if (this.props.disabled) {
            classes.push("DateInput--disabled");
        }
        else if (this.state.inFocus) {
            classes.push("DateInput--inFocus");
        }
        // placeholder shown
        if (!this.props.value && this.props.placeholder) {
            classes.push("DateInput--placeholder-shown");
        }
        // note on the upper right corner
        var inputNote;
        if (this.props.required) {
            inputNote = (React.createElement("span", { className: "DateInput--" + (this.state.hasBeenFocused && !this.props.value ? "error" : "required") }, "required"));
        }
        if (this.props.error) {
            inputNote = React.createElement("span", { className: "DateInput--error" }, this.props.error);
        }
        return (React.createElement("div", { className: classnames(classes, Forms_1.formElementSizeClassName(this.props.size), this.props.className) },
            React.createElement("div", { className: "DateInput--infoRow" },
                React.createElement("label", { className: "DateInput--label", htmlFor: this.props.name }, this.props.label),
                inputNote),
            this.props.useTime ? (React.createElement(ReactDateTime, { className: "DateTimePicker", onChange: this.props.onChange, value: this.props.value, onBlur: function () { return _this.setState({ inFocus: false, hasBeenFocused: true }); }, onFocus: function () { return _this.setState({ inFocus: true }); }, isValidDate: this.isValidDate, inputProps: {
                    className: "DateInput--input",
                    placeholder: this.props.placeholder,
                    name: this.props.name,
                    disabled: this.props.disabled || this.props.readOnly,
                    required: this.props.required,
                } })) : (React.createElement(react_datepicker_1.default, { fixedHeight: true, calendarClassName: "DatePicker", className: "DateInput--input", disabled: this.props.disabled || this.props.readOnly, maxDate: this.props.max, minDate: this.props.min, name: this.props.name, onBlur: function () { return _this.setState({ inFocus: false, hasBeenFocused: true }); }, onFocus: function () { return _this.setState({ inFocus: true }); }, placeholderText: this.props.placeholder, readOnly: this.props.readOnly, required: this.props.required, selected: this.props.value, popperClassName: "DatePicker--Popper", popperPlacement: this.props.popperPlacement, onChange: this.props.onChange, dateFormat: this.props.dateFormat }))));
    };
    DateInput.propTypes = propTypes;
    DateInput.popperPlacementPositions = popperPlacementPositions;
    DateInput.defaultProps = {
        size: Forms_1.FormElementSize.FULL_WIDTH,
    };
    return DateInput;
}(React.Component));
exports.default = DateInput;
