"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var vdom_1 = require("@dojo/framework/core/vdom");
var icache_1 = require("@dojo/framework/core/middleware/icache");
var i18n_1 = require("@dojo/framework/core/middleware/i18n");
var focus_1 = require("@dojo/framework/core/middleware/focus");
var date_utils_1 = require("./date-utils");
var util_1 = require("../common/util");
var theme_1 = require("../middleware/theme");
var calendar_1 = require("../calendar");
var text_input_1 = require("../text-input");
var icon_1 = require("../icon");
var trigger_popup_1 = require("../trigger-popup");
var textInputCss = require("../theme/default/text-input.m.css");
var css = require("../theme/default/date-input.m.css");
var DateInput_1 = require("./nls/DateInput");
var icache = icache_1.createICacheMiddleware();
var factory = vdom_1.create({ theme: theme_1.default, icache: icache, i18n: i18n_1.i18n, focus: focus_1.focus })
    .properties()
    .children();
exports.default = factory(function (_a) {
    var properties = _a.properties, children = _a.children, _b = _a.middleware, theme = _b.theme, icache = _b.icache, i18n = _b.i18n, focus = _b.focus;
    var _c = properties(), initialValue = _c.initialValue, name = _c.name, onValue = _c.onValue, onValidate = _c.onValidate, controlledValue = _c.value, themeProp = _c.theme, variant = _c.variant, classes = _c.classes;
    var messages = i18n.localize(DateInput_1.default).messages;
    var themedCss = theme.classes(css);
    var max = date_utils_1.parseDate(properties().max);
    var min = date_utils_1.parseDate(properties().min);
    if (initialValue !== undefined &&
        controlledValue === undefined &&
        icache.get('initialValue') !== initialValue) {
        var parsed = initialValue && date_utils_1.parseDate(initialValue);
        if (parsed) {
            icache.set('inputValue', date_utils_1.formatDate(parsed));
        }
        icache.set('initialValue', initialValue);
        icache.set('shouldValidate', true);
    }
    if (controlledValue !== undefined && icache.get('lastValue') !== controlledValue) {
        var parsed = controlledValue && date_utils_1.parseDate(controlledValue);
        if (parsed) {
            icache.set('inputValue', date_utils_1.formatDate(parsed));
            icache.set('value', parsed);
        }
        icache.set('lastValue', controlledValue);
    }
    var inputValue = icache.getOrSet('inputValue', function () {
        var parsed = initialValue && date_utils_1.parseDate(initialValue);
        return date_utils_1.formatDate(parsed || new Date());
    });
    var shouldValidate = icache.getOrSet('shouldValidate', true);
    var shouldFocus = focus.shouldFocus();
    var focusNode = icache.getOrSet('focusNode', 'input');
    var _d = tslib_1.__read(children(), 1), labelChild = _d[0];
    var label = util_1.isRenderResult(labelChild) ? labelChild : labelChild.label;
    if (shouldValidate) {
        var testValue = icache.get('nextValue') || inputValue;
        var isValid = void 0;
        var validationMessages = [];
        // if min & max create an impossible range, no need to validate anything else
        if (min && max && min > max) {
            validationMessages.push(messages.invalidProps);
            isValid = false;
        }
        else {
            var newDate = date_utils_1.parseDate(testValue);
            if (newDate !== undefined) {
                if (min && newDate < min) {
                    validationMessages.push(messages.tooEarly);
                }
                else if (max && newDate > max) {
                    validationMessages.push(messages.tooLate);
                }
                else {
                    if (controlledValue === undefined) {
                        icache.set('value', newDate);
                        icache.set('inputValue', date_utils_1.formatDate(newDate));
                    }
                    if (onValue) {
                        onValue(date_utils_1.formatDateISO(newDate));
                    }
                }
            }
            else {
                validationMessages.push(messages.invalidDate);
            }
            isValid = validationMessages.length === 0;
        }
        var validationMessage = validationMessages.join('; ');
        onValidate && onValidate(isValid, validationMessage);
        icache.set('validationMessage', validationMessage);
        icache.set('shouldValidate', false);
    }
    return (vdom_1.tsx("div", { classes: [theme.variant(), themedCss.root] },
        vdom_1.tsx("input", { type: "hidden", name: name, value: date_utils_1.formatDateISO(icache.get('value')), "aria-hidden": "true" }),
        vdom_1.tsx(trigger_popup_1.default, { key: "popup", theme: themeProp, classes: classes, variant: variant }, {
            trigger: function (toggleOpen) {
                function openCalendar() {
                    icache.set('focusNode', 'calendar');
                    focus.focus();
                    toggleOpen();
                }
                return (vdom_1.tsx("div", { classes: themedCss.input },
                    vdom_1.tsx(text_input_1.default, { key: "input", focus: function () { return shouldFocus && focusNode === 'input'; }, theme: theme.compose(textInputCss, css, 'input'), type: "text", initialValue: icache.get('inputValue'), onBlur: function () { return icache.set('shouldValidate', true); }, onValue: function (v) {
                            icache.set(controlledValue === undefined
                                ? 'inputValue'
                                : 'nextValue', v || '');
                        }, helperText: icache.get('validationMessage'), onKeyDown: function (key) {
                            if (key === util_1.Keys.Down ||
                                key === util_1.Keys.Space ||
                                key === util_1.Keys.Enter) {
                                openCalendar();
                            }
                        }, classes: classes, variant: variant }, {
                        label: label,
                        trailing: (vdom_1.tsx(text_input_1.Addon, { theme: themeProp, classes: classes, variant: variant },
                            vdom_1.tsx("button", { key: "dateIcon", onclick: function (e) {
                                    e.stopPropagation();
                                    openCalendar();
                                }, classes: themedCss.toggleCalendarButton, type: "button" },
                                vdom_1.tsx(icon_1.default, { type: "dateIcon" }))))
                    })));
            },
            content: function (onClose) {
                function closeCalendar() {
                    icache.set('focusNode', 'input');
                    focus.focus();
                    onClose();
                }
                return (vdom_1.tsx("div", { classes: themedCss.popup },
                    vdom_1.tsx(calendar_1.default, { key: "calendar", focus: function () { return shouldFocus && focusNode === 'calendar'; }, maxDate: max, minDate: min, initialValue: icache.get('value'), onValue: function (date) {
                            icache.set(controlledValue === undefined
                                ? 'inputValue'
                                : 'nextValue', date_utils_1.formatDate(date));
                            icache.set('shouldValidate', true);
                            closeCalendar();
                        }, theme: themeProp, classes: classes, variant: variant })));
            }
        })));
});

/*# sourceMappingURL=index.js.map*/