(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@rxweb/localization'), require('@rxweb/angular/api')) :
    typeof define === 'function' && define.amd ? define('@rxweb/angular/datepicker', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@rxweb/localization', '@rxweb/angular/api'], factory) :
    (global = global || self, factory((global.rxweb = global.rxweb || {}, global.rxweb.angular = global.rxweb.angular || {}, global.rxweb.angular.datepicker = {}), global.ng.core, global.ng.common, global.ng.forms, global['@rxweb/localization'], global.rxweb.angular.api));
}(this, (function (exports, core, common, forms, localization, api) { 'use strict';

    var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
        return c > 3 && r && Object.defineProperty(target, key, r), r;
    };
    var RxPickerComponent = /** @class */ (function () {
        function RxPickerComponent() {
            this.weekStart = 2;
            this.viewMode = "Date";
            this.selectDate = new core.EventEmitter();
            this.hoverEvent = new core.EventEmitter();
        }
        RxPickerComponent.prototype.changeViewMode = function (mode, currentMonth, currentYear) {
            if (currentMonth) {
                this.month = currentMonth;
                this.year = currentYear;
            }
            this.viewMode = mode;
        };
        RxPickerComponent.prototype.onMouseover = function () {
            this.hoverEvent.emit(false);
        };
        RxPickerComponent.prototype.onMouseleave = function () {
            this.hoverEvent.emit(true);
        };
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "value", void 0);
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "weekStart", void 0);
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "viewMode", void 0);
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "disableWeekDays", void 0);
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "highlightWeekDays", void 0);
        __decorate([
            core.Input()
        ], RxPickerComponent.prototype, "datesDisabled", void 0);
        __decorate([
            core.Output()
        ], RxPickerComponent.prototype, "selectDate", void 0);
        __decorate([
            core.Output()
        ], RxPickerComponent.prototype, "hoverEvent", void 0);
        __decorate([
            core.HostListener('mouseover')
        ], RxPickerComponent.prototype, "onMouseover", null);
        __decorate([
            core.HostListener('mouseleave')
        ], RxPickerComponent.prototype, "onMouseleave", null);
        RxPickerComponent = __decorate([
            core.Component({
                selector: "rx-picker",
                template: "<rx-date-picker #datePicker [value]=\"value\" [disableWeekDays]=\"disableWeekDays\" [highlightWeekDays]=\"highlightWeekDays\" [datesDisabled]=\"datesDisabled\" [style.display]=\"viewMode === 'Date' ? '' : 'none'\" [weekStart]=\"weekStart\"></rx-date-picker>\n<rx-month-picker [month]=\"month\" [year]=\"year\" [style.display]=\"viewMode === 'Month' ? '' : 'none'\" (monthClick)=\"datePicker.show($event)\"></rx-month-picker>\n"
            })
        ], RxPickerComponent);
        return RxPickerComponent;
    }());

    var DateDisabled = /** @class */ (function () {
        function DateDisabled(date, title) {
            this.date = date;
            this.title = title;
        }
        return DateDisabled;
    }());
    var DateCollection = /** @class */ (function () {
        function DateCollection() {
        }
        return DateCollection;
    }());
    var Week = /** @class */ (function () {
        function Week() {
        }
        return Week;
    }());
    var Day = /** @class */ (function () {
        function Day(date, selected, isPreviousMonthDay, year, month, day, monthDate, isDisabled, isHighlighted, dateDisabled) {
            this.date = date;
            this.selected = selected;
            this.isPreviousMonthDay = isPreviousMonthDay;
            this.year = year;
            this.month = month;
            this.day = day;
            this.monthDate = monthDate;
            this.isDisabled = isDisabled;
            this.isHighlighted = isHighlighted;
            this.dateDisabled = dateDisabled;
        }
        return Day;
    }());

    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var daysShort = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
    var daysMin = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var monthsShort = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

    var __decorate$1 = (this && this.__decorate) || function (decorators, target, key, desc) {
        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
        return c > 3 && r && Object.defineProperty(target, key, r), r;
    };
    var __values = (this && this.__values) || function(o) {
        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
        if (m) return m.call(o);
        if (o && typeof o.length === "number") return {
            next: function () {
                if (o && i >= o.length) o = void 0;
                return { value: o && o[i++], done: !o };
            }
        };
        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
    };
    var RxDatePickerComponent = /** @class */ (function () {
        function RxDatePickerComponent(dateComponent) {
            this.dateComponent = dateComponent;
            this.weekStart = 0;
            this.viewModeClick = new core.EventEmitter();
            this.monthsShort = monthsShort;
        }
        RxDatePickerComponent.prototype.ngOnInit = function () {
            var _this = this;
            this.dayShortNames = new Array();
            var dayCount = this.weekStart;
            daysMin.forEach(function (t) {
                _this.dayShortNames.push(daysMin[dayCount]);
                if (dayCount == 6)
                    dayCount = 0;
                else
                    dayCount++;
            });
        };
        RxDatePickerComponent.prototype.ngAfterContentInit = function () {
            this.value = (this.value) ? this.value : new Date();
            this.currentMonth = this.value.getMonth();
            this.make(this.value);
        };
        RxDatePickerComponent.prototype.make = function (date) {
            var dc = this.dateComponent;
            this.dateCollection = new DateCollection();
            var year = date.getFullYear(), month = date.getMonth();
            this.dateCollection.nextMonth = this.utcDate(year, month + 1, 28);
            this.dateCollection.previousMonth = this.utcDate(year, month - 1, 28);
            var prevMonth = this.utcDate(year, month - 1, 28), day = this.daysInMonth(prevMonth.getFullYear(), prevMonth.getMonth());
            prevMonth.setDate(day);
            prevMonth.setDate(day - (prevMonth.getDay() - this.weekStart + 7) % 7);
            var nextMonth = new Date(prevMonth.toString());
            nextMonth.setDate(nextMonth.getDate() + 42);
            var nextMonthValueOf = nextMonth.valueOf();
            this.dateCollection.year = year;
            this.dateCollection.monthName = months[month];
            this.dateCollection.month = month;
            var dayCount = this.weekStart;
            this.dateCollection.weeks = new Array();
            var days;
            while (prevMonth.valueOf() < nextMonthValueOf) {
                if (dayCount === this.weekStart) {
                    var week = new Week();
                    week.days = new Array();
                }
                var isWeekDayDisable = (this.disableWeekDays && this.disableWeekDays.length && this.disableWeekDays.filter(function (t) { return t == dayCount; }).length !== 0);
                var isHighlightWeekDay = (this.highlightWeekDays && this.highlightWeekDays.length && this.highlightWeekDays.filter(function (t) { return t == dayCount; }).length !== 0);
                var dateDisabled = (this.datesDisabled &&
                    this.datesDisabled.length &&
                    this.datesDisabled.filter(function (t) {
                        return t.date.getMonth() == prevMonth.getMonth() &&
                            t.date.getFullYear() == prevMonth.getFullYear() &&
                            t.date.getDate() == prevMonth.getDate();
                    })[0]);
                week.days.push(new Day(this.utcDate(prevMonth.getFullYear(), prevMonth.getMonth(), prevMonth.getDate()), (this.value.getDate() == prevMonth.getDate() && this.value.getMonth() == prevMonth.getMonth()), prevMonth.getMonth() !== month, prevMonth.getFullYear(), prevMonth.getMonth(), prevMonth.getDay(), prevMonth.getDate(), isWeekDayDisable, isHighlightWeekDay, dateDisabled));
                prevMonth.setDate(prevMonth.getDate() + 1);
                if (dayCount == 6) {
                    dayCount = 0;
                    this.dateCollection.weeks.push(week);
                }
                else {
                    dayCount++;
                }
            }
        };
        RxDatePickerComponent.prototype.changeViewMode = function () {
            this.dateComponent.changeViewMode("Month", this.dateCollection.month, this.dateCollection.year);
        };
        RxDatePickerComponent.prototype.nextMonth = function (date) {
            this.make(date);
        };
        RxDatePickerComponent.prototype.previousMonth = function (date) {
            this.make(date);
        };
        RxDatePickerComponent.prototype.show = function (date) {
            this.make(date);
        };
        RxDatePickerComponent.prototype.select = function (day) {
            if (!day.isDisabled && !day.dateDisabled) {
                this.deSelect();
                day.selected = true;
                this.dateComponent.selectDate.emit(day.date);
            }
        };
        RxDatePickerComponent.prototype.deSelect = function () {
            var e_1, _a;
            try {
                for (var _b = __values(this.dateCollection.weeks), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var week = _c.value;
                    var selectedDay = week.days.filter(function (t) { return t.selected; });
                    if (selectedDay.length > 0)
                        selectedDay[0].selected = false;
                }
            }
            catch (e_1_1) { e_1 = { error: e_1_1 }; }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                }
                finally { if (e_1) throw e_1.error; }
            }
        };
        RxDatePickerComponent.prototype.isLeapYear = function (year) {
            return (((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0));
        };
        RxDatePickerComponent.prototype.daysInMonth = function (year, month) {
            return [31, (this.isLeapYear(year) ? 29 : 28), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month];
        };
        RxDatePickerComponent.prototype.utcDate = function (year, month, days) {
            return new Date(year, month, days);
        };
        RxDatePickerComponent.ctorParameters = function () { return [
            { type: RxPickerComponent }
        ]; };
        __decorate$1([
            core.Input()
        ], RxDatePickerComponent.prototype, "value", void 0);
        __decorate$1([
            core.Input()
        ], RxDatePickerComponent.prototype, "weekStart", void 0);
        __decorate$1([
            core.Input()
        ], RxDatePickerComponent.prototype, "disableWeekDays", void 0);
        __decorate$1([
            core.Input()
        ], RxDatePickerComponent.prototype, "highlightWeekDays", void 0);
        __decorate$1([
            core.Input()
        ], RxDatePickerComponent.prototype, "datesDisabled", void 0);
        __decorate$1([
            core.Output()
        ], RxDatePickerComponent.prototype, "viewModeClick", void 0);
        RxDatePickerComponent = __decorate$1([
            core.Component({
                selector: "rx-date-picker",
                template: "<div class=\"datepicker-days\" style=\"display: block;\">\n    <table class=\"table-condensed\">\n        <thead>\n          <tr>\n            <th class=\"next\" style=\"visibility: visible;\" (click)=\"previousMonth(dateCollection.previousMonth)\"><i class=\"fa fa-chevron-left\"></i></th>\n            <th colspan=\"5\" class=\"datepicker-switch\" (click)=\"changeViewMode()\">{{dateCollection.monthName }} {{dateCollection.year}}</th>\n            <th class=\"next\" style=\"visibility: visible;\" (click)=\"nextMonth(dateCollection.nextMonth)\"><i class=\"fa fa-chevron-right\"></i></th>\n          </tr>\n            <tr><th class=\"dow\" *ngFor=\"let week of dayShortNames\">{{week}}</th></tr>\n        </thead>\n        <tbody>\n            <tr *ngFor=\"let week of dateCollection.weeks\">\n                <td *ngFor=\"let day of week.days\" class=\"day\" (click)=\"select(day)\" [class.old]=\"day.isPreviousMonthDay\" [class.disabled]=\"day.isDisabled || day.dateDisabled\" [title]=\"day.dateDisabled ? day.dateDisabled.title : ''\" [class.highlighted]=\"day.isHighlighted\" [class.active]=\"day.selected\">{{day.monthDate}}</td>\n            </tr>\n        </tbody>\n        <tfoot>\n        </tfoot>\n    </table>\n</div>\n",
                exportAs: 'date-picker'
            })
        ], RxDatePickerComponent);
        return RxDatePickerComponent;
    }());

    var __decorate$2 = (this && this.__decorate) || function (decorators, target, key, desc) {
        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
        return c > 3 && r && Object.defineProperty(target, key, r), r;
    };
    var RxMonthPicker = /** @class */ (function () {
        function RxMonthPicker(dateComponent) {
            this.dateComponent = dateComponent;
            this.isLabelYear = true;
            this.monthClick = new core.EventEmitter();
            this.monthsShort = monthsShort;
        }
        RxMonthPicker.prototype.showDates = function (month) {
            this.dateComponent.changeViewMode("Date");
            var date = this.utcDate(this.year, month, 28);
            this.monthClick.emit(date);
        };
        RxMonthPicker.prototype.nextYear = function () {
            this.year = this.year + 1;
        };
        RxMonthPicker.prototype.previousYear = function () {
            this.year = this.year - 1;
        };
        RxMonthPicker.prototype.showYearInput = function () {
            this.isLabelYear = !this.isLabelYear;
        };
        RxMonthPicker.prototype.utcDate = function (year, month, days) {
            return new Date(Date.UTC.apply(Date, [year, month, days]));
        };
        RxMonthPicker.ctorParameters = function () { return [
            { type: RxPickerComponent }
        ]; };
        __decorate$2([
            core.Input()
        ], RxMonthPicker.prototype, "month", void 0);
        __decorate$2([
            core.Input()
        ], RxMonthPicker.prototype, "year", void 0);
        __decorate$2([
            core.Output()
        ], RxMonthPicker.prototype, "monthClick", void 0);
        RxMonthPicker = __decorate$2([
            core.Component({
                selector: "rx-month-picker",
                template: "<div class=\"datepicker-months\" style=\"display: block;\">\n    <table class=\"table-condensed\">\n        <thead>\n          <tr>\n            <th class=\"next\" style=\"visibility: visible;\" (click)=\"previousYear()\"><i class=\"fa fa-chevron-left\"></i></th>\n            <th colspan=\"5\" class=\"datepicker-switch\"><span *ngIf=\"isLabelYear\">{{year}}</span> <input *ngIf=\"!isLabelYear\" (blur)=\"showYearInput()\" type=\"number\" min=\"1900\" max=\"5000\" class=\"form-control\" [(ngModel)]=\"year\" /> </th>\n            <th class=\"next\" style=\"visibility: visible;\" (click)=\"nextYear()\"><i class=\"fa fa-chevron-right\"></i></th>\n          </tr>\n        </thead>\n        <tbody>\n            <tr>\n                <td colspan=\"7\"><span class=\"month\" (click)=\"showDates(monthIndex)\" *ngFor=\"let month of monthsShort; let monthIndex = index;\" [class.focus]=\"monthIndex == currentMonth\">{{month}} </span></td>\n            </tr>\n        </tbody>\n        <tfoot><tr><th colspan=\"7\" class=\"today\" style=\"display: none;\">Today</th></tr><tr><th colspan=\"7\" class=\"clear\" style=\"display: none;\">Clear</th></tr></tfoot>\n    </table>\n</div>\n"
            })
        ], RxMonthPicker);
        return RxMonthPicker;
    }());

    var __decorate$3 = (this && this.__decorate) || function (decorators, target, key, desc) {
        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
        return c > 3 && r && Object.defineProperty(target, key, r), r;
    };
    var __values$1 = (this && this.__values) || function(o) {
        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
        if (m) return m.call(o);
        if (o && typeof o.length === "number") return {
            next: function () {
                if (o && i >= o.length) o = void 0;
                return { value: o && o[i++], done: !o };
            }
        };
        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
    };
    var RxDateComponent = /** @class */ (function () {
        function RxDateComponent(elementRef, viewContainerRef, componentFactoryResolver) {
            this.elementRef = elementRef;
            this.viewContainerRef = viewContainerRef;
            this.componentFactoryResolver = componentFactoryResolver;
            this.isInValid = false;
            this.isValidationSuccess = true;
            this.propagateChange = function () { };
            this.dateFormatPattern = /^(\d*)(\.|-|\/)(\d*)(\.|-|\/)(\d*)$/;
            this.validateFn = function () { };
            this.isMouseLeave = true;
            this.isPrependClick = false;
            this.onSelected = new core.EventEmitter();
            this.weekStart = 0;
            this.viewMode = "Date";
            this.format = localization.MultiLingualData.get("internationalization.date.format");
            this.seperator = localization.MultiLingualData.get("internationalization.date.seperator");
            this.overlayViewHost = new api.OverlayViewHost(document);
            this.overlayPositionHost = new api.OverlayPositionHost();
            this.element = elementRef.nativeElement;
        }
        RxDateComponent_1 = RxDateComponent;
        RxDateComponent.prototype.registerOnChange = function (fn) {
            this.propagateChange = fn;
            if (this.value) {
                this.propagateChange(this.value);
            }
        };
        RxDateComponent.prototype.ngOnInit = function () {
            var _this = this;
            this.element.classList.add("custom-control-style");
            this.checkValid(true);
            if (this.conditional)
                this.conditionalSubscription = this.conditional.subscribe(function (t) { return _this.checkValid(t); });
        };
        RxDateComponent.prototype.checkValid = function (isValid) {
            var _this = this;
            if (isValid)
                this.timeOutId = window.setTimeout(function () {
                    for (var i = 0; i < _this.element.classList.length; i++) {
                        _this.isInValid = _this.element.classList[i] == "ng-invalid";
                    }
                    window.clearTimeout(_this.timeOutId);
                    _this.timeOutId = undefined;
                }, 500);
            else
                this.isInValid = isValid;
        };
        RxDateComponent.prototype.registerOnTouched = function () { };
        RxDateComponent.prototype.writeValue = function (value) {
            if (value) {
                if (typeof value === 'string') {
                    value = new Date(value);
                }
                this.value = value;
                this.selectedDate = this.makeDateString(value);
            }
            else {
                this.selectedDate = value;
            }
            this.onSelected.emit(this.value);
        };
        RxDateComponent.prototype.utcDate = function (year, month, days) {
            return new Date(year, month, days);
        };
        RxDateComponent.prototype.makeDateString = function (value) {
            var e_1, _a;
            var dateString = '';
            try {
                for (var _b = __values$1(this.format), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var character = _c.value;
                    switch (character) {
                        case 'm':
                            dateString += dateString.length == 0 ? (value.getMonth() + 1).toString() : this.seperator + (value.getMonth() + 1);
                            break;
                        case 'd':
                            dateString += dateString.length == 0 ? (value.getDate()).toString() : this.seperator + (value.getDate());
                            break;
                        case 'y':
                            dateString += dateString.length == 0 ? (value.getFullYear()).toString() : this.seperator + (value.getFullYear());
                            break;
                    }
                }
            }
            catch (e_1_1) { e_1 = { error: e_1_1 }; }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                }
                finally { if (e_1) throw e_1.error; }
            }
            return dateString;
        };
        RxDateComponent.prototype.isValidDate = function (value) {
            var e_2, _a;
            var date;
            var dateNumber;
            if (this.dateFormatPattern.test(value)) {
                var splitValue = value.split(this.seperator);
                var dateString = '';
                if (splitValue.length == 3) {
                    try {
                        for (var _b = __values$1('mdy'), _c = _b.next(); !_c.done; _c = _b.next()) {
                            var character = _c.value;
                            var index = this.format.indexOf(character);
                            dateString += dateString.length == 0 ? splitValue[index].toString() : "/" + splitValue[index].toString();
                            if (character == "d")
                                dateNumber = parseInt(splitValue[index]);
                            if (character === 'y') {
                                if (parseInt(splitValue[index]) > 1699 && parseInt(splitValue[index]) < 3001) {
                                    date = new Date(dateString);
                                }
                            }
                        }
                    }
                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
                    finally {
                        try {
                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                        }
                        finally { if (e_2) throw e_2.error; }
                    }
                }
            }
            if (date && dateNumber == date.getDate())
                return date;
            return undefined;
        };
        RxDateComponent.prototype.validate = function (formControl) {
            return (this.isValidationSuccess) ? null : { dateError: 'Invalid Date' };
        };
        RxDateComponent.prototype.changeViewMode = function (mode, currentMonth, currentYear) {
            if (currentMonth) {
                this.month = currentMonth;
                this.year = currentYear;
            }
            this.viewMode = mode;
        };
        RxDateComponent.prototype.onFocus = function (event) {
            if (!this.pickerDisabled)
                if (!this.componentView) {
                    this.createPicker();
                    this.isPrependClick = true;
                }
        };
        RxDateComponent.prototype.prependClick = function (event) {
            if (!this.pickerDisabled) {
                if (!this.componentView && !this.isPrependClick) {
                    this.inputDate.first.nativeElement.focus();
                    this.onFocus(event);
                }
                else {
                    this.isPrependClick = false;
                }
            }
        };
        RxDateComponent.prototype.onKeyup = function (value) {
            var _this = this;
            if (value) {
                var date = this.isValidDate(value);
                this.isValidationSuccess = date && date.toString() !== "Invalid Date";
                if (this.isValidationSuccess)
                    this.isInValid = false, this.propagateChange(this.utcDate(date.getFullYear(), date.getMonth(), date.getDate()));
                else
                    this.isInValid = true, this.propagateChange(undefined);
            }
            else
                this.propagateChange(undefined), window.setTimeout(function () { return _this.checkValid(true); }, 200);
        };
        RxDateComponent.prototype.onBlur = function (event, element) {
            if (this.isMouseLeave)
                this.removePicker();
            var date = this.isValidDate(element.value);
            this.isValidationSuccess = date && date.toString() !== "Invalid Date";
            if (this.isValidationSuccess)
                this.setValue(date, true);
            if (!this.isValidationSuccess) {
                element.value = '';
            }
        };
        RxDateComponent.prototype.createPicker = function () {
            var _this = this;
            this.setOverlay();
            if (this.timeOutId)
                window.clearTimeout(this.timeOutId);
            this.timeOutId = window.setTimeout(function () {
                _this.showPicker();
            }, 2);
        };
        RxDateComponent.prototype.setOverlay = function () {
            var pickerElement = this.createPickerComponent();
            this.overlayViewHost.createElement(["datepicker", "datepicker-dropdown", "dropdown-menu", "datepicker-orient-left", "datepicker-orient-bottom"]);
            this.overlayViewHost.appendChild(pickerElement);
        };
        RxDateComponent.prototype.removePicker = function () {
            if (this.componentView) {
                this.componentView.destroy();
                this.overlayViewHost.destroy();
                this.componentView = undefined;
                this.isPrependClick = false;
            }
        };
        RxDateComponent.prototype.showPicker = function () {
            var offSetModel = new api.OffSetModel("bottom", this.overlayPositionHost.getClientRectangle(this.elementRef.nativeElement), this.overlayPositionHost.getOffset(this.elementRef.nativeElement), this.overlayPositionHost.getOffset(this.overlayViewHost.element), false);
            var calculatedOffset = this.overlayPositionHost.getCalculatedOffset(offSetModel);
            this.overlayViewHost.applyPlacement(calculatedOffset);
            this.overlayViewHost.setStyle({ 'display': 'block', 'z-index': 9999 });
        };
        RxDateComponent.prototype.createPickerComponent = function () {
            var _this = this;
            this.componentView = new api.ComponentView(RxPickerComponent, this.viewContainerRef, this.componentFactoryResolver);
            this.componentView.create({
                'value': this.value,
                'weekStart': this.weekStart,
                'viewMode': this.viewMode,
                'disableWeekDays': this.disableWeekDays,
                'highlightWeekDays': this.highlightWeekDays,
                'datesDisabled': this.datesDisabled
            });
            var componentRef = this.componentView.getComponentRef();
            this.selectDateSubscription = componentRef.instance.selectDate.subscribe(function (t) {
                _this.setValue(t);
            });
            this.hoverSubscriber = componentRef.instance.hoverEvent.subscribe(function (t) { return _this.onHover(t); });
            return this.componentView.rootNode();
        };
        RxDateComponent.prototype.setValue = function (value, isBlur) {
            if (isBlur === void 0) { isBlur = false; }
            this.isInValid = false;
            this.propagateChange(value);
            this.writeValue(value);
            if (this.inputDate && !isBlur)
                this.inputDate.first.nativeElement.focus();
        };
        RxDateComponent.prototype.onHover = function (value) {
            this.isMouseLeave = value;
            if (this.isMouseLeave)
                this.removePicker();
        };
        RxDateComponent.prototype.ngOnDestroy = function () {
            this.removePicker();
            if (this.selectDateSubscription) {
                this.selectDateSubscription.unsubscribe();
                this.hoverSubscriber.unsubscribe();
            }
            if (this.conditionalSubscription)
                this.conditionalSubscription.unsubscribe();
        };
        var RxDateComponent_1;
        RxDateComponent.ctorParameters = function () { return [
            { type: core.ElementRef },
            { type: core.ViewContainerRef },
            { type: core.ComponentFactoryResolver }
        ]; };
        __decorate$3([
            core.ViewChildren('inputDate')
        ], RxDateComponent.prototype, "inputDate", void 0);
        __decorate$3([
            core.Output()
        ], RxDateComponent.prototype, "onSelected", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "weekStart", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "viewMode", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "disableWeekDays", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "highlightWeekDays", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "datesDisabled", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "pickerClass", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "conditional", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "pickerDisabled", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "showAddon", void 0);
        __decorate$3([
            core.Input()
        ], RxDateComponent.prototype, "controlTabIndex", void 0);
        RxDateComponent = RxDateComponent_1 = __decorate$3([
            core.Component({
                selector: "rx-date",
                template: "<div class=\"input-group\"><input [tabindex]=\"controlTabIndex\" type=\"text\" #inputDate [disabled]=\"pickerDisabled\" [placeholder]=\"placeholder\" [class]=\"pickerClass\" (click)=\"onFocus($event)\" (focus)=\"onFocus($event)\" \n                        (blur)=\"onBlur($event,$event.target)\" (keyup)=\"onKeyup($event.target.value)\" [(ngModel)]=\"selectedDate\" />\n    <div *ngIf=\"showAddon\" class=\"input-group-append\" (click)=\"prependClick($event)\">\n                              <span class=\"input-group-text\"><i class=\"fa fa-calendar\" ></i></span>\n                            </div></div>\n",
                providers: [
                    { provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef(function () { return RxDateComponent_1; }), multi: true },
                ],
                entryComponents: [RxPickerComponent]
            })
        ], RxDateComponent);
        return RxDateComponent;
    }());
    var RxDatePickerModule = /** @class */ (function () {
        function RxDatePickerModule() {
        }
        RxDatePickerModule = __decorate$3([
            core.NgModule({
                imports: [common.CommonModule, forms.FormsModule, forms.ReactiveFormsModule],
                exports: [RxDateComponent, RxDatePickerComponent, RxMonthPicker, RxPickerComponent],
                declarations: [RxDateComponent, RxDatePickerComponent, RxMonthPicker, RxPickerComponent]
            })
        ], RxDatePickerModule);
        return RxDatePickerModule;
    }());

    exports.DateCollection = DateCollection;
    exports.DateDisabled = DateDisabled;
    exports.Day = Day;
    exports.RxDateComponent = RxDateComponent;
    exports.RxDatePickerModule = RxDatePickerModule;
    exports.Week = Week;
    exports.ɵa = RxPickerComponent;
    exports.ɵb = RxDatePickerComponent;
    exports.ɵc = RxMonthPicker;

    Object.defineProperty(exports, '__esModule', { value: true });

})));
//# sourceMappingURL=rxweb-angular-datepicker.umd.js.map
