"use strict";
exports.__esModule = true;
exports.CalendarInput = exports.cnCalendarInputDropdown = exports.cnCalendarInput = void 0;
var tslib_1 = require("tslib");
// @ts-nocheck
/* eslint-disable jsx-a11y/no-static-element-interactions */
/* eslint-disable jsx-a11y/click-events-have-key-events */
require("./CalendarInput.css");
var react_1 = (0, tslib_1.__importStar)(require("react"));
var react_transition_group_1 = require("react-transition-group");
var useClickOutside_1 = require("../../hooks/useClickOutside/useClickOutside");
var IconCalendar_1 = require("../../icons/IconCalendar/IconCalendar");
var bem_1 = require("../../utils/bem");
var date_1 = require("../../utils/date");
var type_guards_1 = require("../../utils/type-guards");
var Calendar_1 = require("../Calendar/Calendar");
var usePropsHandler_1 = require("../EventInterceptor/usePropsHandler");
var Popover_1 = require("../Popover/Popover");
var Tag_1 = require("../Tag/Tag");
exports.cnCalendarInput = (0, bem_1.cn)('CalendarInput');
exports.cnCalendarInputDropdown = (0, bem_1.cn)('CalendarInputDropdown');
exports.CalendarInput = react_1["default"].forwardRef(function (props, ref) {
    var _a = (0, usePropsHandler_1.usePropsHandler)((0, exports.cnCalendarInput)(), props), value = _a.value, _b = _a.direction, direction = _b === void 0 ? 'downStartRight' : _b, 
    // controlRef,
    _c = _a.size, 
    // controlRef,
    size = _c === void 0 ? 'm' : _c, _d = _a.view, view = _d === void 0 ? 'cultured' : _d, _e = _a.placeholder, placeholder = _e === void 0 ? 'выберите дату' : _e, _f = _a.rightSide, rightSide = _f === void 0 ? IconCalendar_1.IconCalendar : _f, onChange = _a.onChange, onCancel = _a.onCancel, type = _a.type;
    var RightIcon = rightSide;
    var rightSideIsString = typeof rightSide === 'string';
    var _g = (0, tslib_1.__read)((0, react_1.useState)(false), 2), isOpen = _g[0], setIsOpen = _g[1];
    // eslint-disable-next-line react-hooks/rules-of-hooks
    var calendarInputRef = ref || react_1["default"].useRef(null);
    // eslint-disable-next-line react-hooks/rules-of-hooks
    var dropdownRef = react_1["default"].useRef(null);
    var renderValue = function (value) {
        var valueFormatted = '';
        if ((0, type_guards_1.isDefined)(value[0])) {
            valueFormatted += (0, date_1.formatDate)(value[0]);
        }
        if ((0, type_guards_1.isDefined)(value[1])) {
            if ((0, type_guards_1.isDefined)(value[0]))
                valueFormatted += ' - ';
            valueFormatted += (0, date_1.formatDate)(value[1]);
        }
        return react_1["default"].createElement(Tag_1.Tag, { label: valueFormatted, mode: "cancel", onCancel: onCancel });
    };
    (0, useClickOutside_1.useClickOutside)({
        isActive: isOpen,
        ignoreClicksInsideRefs: [calendarInputRef, dropdownRef],
        handler: function () {
            setIsOpen(false);
        }
    });
    return (react_1["default"].createElement("div", { className: (0, exports.cnCalendarInput)({
            size: size,
            view: view,
            focused: isOpen,
            value: Boolean(value)
        }) },
        react_1["default"].createElement("div", { className: (0, exports.cnCalendarInput)('Control'), ref: calendarInputRef, onClick: function () {
                setIsOpen(!isOpen);
            } },
            react_1["default"].createElement("div", { className: (0, exports.cnCalendarInput)('ControlInner') },
                react_1["default"].createElement("div", { className: (0, exports.cnCalendarInput)('ControlValueContainer') },
                    value && renderValue(value),
                    !value && placeholder && (react_1["default"].createElement("span", { className: (0, exports.cnCalendarInput)('Placeholder'), title: "placeholder" }, placeholder)))),
            RightIcon && (react_1["default"].createElement("div", { className: (0, exports.cnCalendarInput)('Side', {
                    position: 'right',
                    type: rightSideIsString ? 'string' : 'icon'
                }), title: typeof rightSide === 'string' ? rightSide : undefined }, rightSideIsString ? (rightSide) : (react_1["default"].createElement(RightIcon, { className: (0, exports.cnCalendarInput)('Icon'), size: "s" }))))),
        react_1["default"].createElement(react_transition_group_1.CSSTransition, { "in": isOpen, unmountOnExit: true, appear: true, timeout: 200 },
            react_1["default"].createElement(Popover_1.Popover, { ref: dropdownRef, anchorRef: calendarInputRef, direction: direction, possibleDirections: ['downStartLeft', 'upStartLeft', 'downStartRight', 'upStartRight'], offset: 1, role: "listbox", className: (0, exports.cnCalendarInputDropdown)(), equalAnchorWidth: true },
                react_1["default"].createElement(Calendar_1.Calendar, { value: value, onChange: onChange, type: type })))));
});
