var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var _a;
import React from 'react';
import { isEventSource } from '../../effects/ClickOutside';
import { useDateTime } from '../../state/DateTime';
import { Calendar as CalendarBase } from '../Calendar';
import { Card } from '../Card';
import { DateInput } from '../DateInput';
import { isValidYearRange } from '../DateInput/DateInput';
import { OverlayTrigger, useOverlayTriggerContext, } from '../OverlayTrigger';
var enableLogs = ((_a = process.env.TZ_LOG) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'true';
function consoleMessageChange(_a) {
    var date = _a.date;
    if (enableLogs) {
        console.log("core-react: DateInput onChange, relative start of day in destination time zone.\n", date);
    }
}
var showKeys = [];
var hideKeys = {
    target: ['Esc', 'Escape', 'Enter'],
    overlay: ['Esc', 'Escape'],
};
function lifecycleDefault() {
    return true;
}
function noop() { }
var Calendar = React.forwardRef(function Calendar(_a, ref) {
    var onSelect = _a.onSelect, props = __rest(_a, ["onSelect"]);
    var hide = useOverlayTriggerContext().hide;
    return (React.createElement(Card, { ref: ref, shadowStrength: 2 },
        React.createElement(CalendarBase, __assign({}, props, { onSelect: function (date) {
                onSelect === null || onSelect === void 0 ? void 0 : onSelect(date);
                hide(true);
            } }))));
});
/**

 We use date selects to allow users to enter a date into a form by either
 selecting it from a calendar or typing it into a date field.

 @since 10.19.0

 @see [Storybook](https://procore.github.io/core/latest/?path=/story/dateselect--basic)

 @see [Design Guidelines](https://design.procore.com/date-select)

 */
export var DateSelect = React.forwardRef(function DateSelect(_a, ref) {
    var _b = _a.beforeHide, beforeHide = _b === void 0 ? lifecycleDefault : _b, _c = _a.beforeShow, beforeShow = _c === void 0 ? lifecycleDefault : _c, _d = _a.afterHide, afterHide = _d === void 0 ? noop : _d, _e = _a.afterShow, afterShow = _e === void 0 ? noop : _e, disabledDate = _a.disabledDate, _f = _a.onChange, onChange = _f === void 0 ? noop : _f, _g = _a.onClear, onClear = _g === void 0 ? noop : _g, value = _a.value, props = __rest(_a, ["beforeHide", "beforeShow", "afterHide", "afterShow", "disabledDate", "onChange", "onClear", "value"]);
    var dateTime = useDateTime();
    var clearRef = React.useRef(null);
    var dateInputRef = ref;
    React.useRef(null);
    var monthRef = React.useRef(null);
    var yearRef = React.useRef(null);
    var segmentRefs = {
        segmentThree: React.useRef(null),
    };
    var _h = React.useState(value), selected = _h[0], setSelected = _h[1];
    var _j = React.useState(value || dateTime.newDate()), displayed = _j[0], setDisplayed = _j[1];
    React.useEffect(function () {
        setSelected(value);
        setDisplayed(value || dateTime.newDate());
    }, [value]);
    var overlay = (React.createElement(Calendar, { disabledDate: disabledDate, displayDate: displayed, monthRef: monthRef, onNavigate: setDisplayed, onSelect: function (date) {
            segmentRefs.segmentThree.current &&
                segmentRefs.segmentThree.current.focus();
            setDisplayed(date);
            setSelected(date);
            onChange(date);
        }, selectedStart: selected, selectedEnd: selected, yearRef: yearRef }));
    return (React.createElement(OverlayTrigger, { afterHide: afterHide, afterShow: afterShow, beforeHide: function (e) {
            if (e instanceof KeyboardEvent) {
                segmentRefs.segmentThree.current &&
                    segmentRefs.segmentThree.current.focus();
                return beforeHide(e);
            }
            if (isEventSource(dateInputRef, e) || isEventSource(clearRef, e)) {
                return false;
            }
            return beforeHide(e);
        }, beforeShow: function (e) {
            if (isEventSource(clearRef, e)) {
                return false;
            }
            return beforeShow(e);
        }, clickOutsideIgnoreRefs: [monthRef, yearRef], hideKeys: hideKeys, overlay: overlay, placement: "bottom-left", ref: dateInputRef, showKeys: showKeys },
        React.createElement(DateInput, __assign({}, props, { clearRef: clearRef, segmentRefs: segmentRefs, onChangeSegment: function (type, value) {
                if (value === -1) {
                    return;
                }
                if (type === 'month') {
                    setDisplayed(dateTime.newDate(displayed.setMonth(value - 1)));
                }
                else if (type === 'year') {
                    // isValidYearRange prevents calendar from changing, the display date
                    if (isValidYearRange(value)) {
                        setDisplayed(dateTime.newDate(displayed.setFullYear(value)));
                    }
                }
            }, onChange: function (date) {
                consoleMessageChange({ date: date });
                if (date) {
                    setSelected(date);
                    setDisplayed(date);
                }
                else {
                    setDisplayed(dateTime.newDate());
                    setSelected(undefined);
                }
                onChange(date);
            }, onClear: onClear, value: selected }))));
});
//# sourceMappingURL=DateSelect.js.map