"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MonthPicker = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const addYears_1 = require("@astral/utils/date/addYears");
const react_1 = require("react");
const ConfigProvider_1 = require("../../ConfigProvider");
const useLocaleDateTimeFormat_1 = require("../../useLocaleDateTimeFormat");
const constants_1 = require("../constants");
const DateCalendar_1 = require("../DateCalendar");
const useCalendarNavigate_1 = require("../hooks/useCalendarNavigate");
const hooks_1 = require("./hooks");
const MonthPicker = ({ date: initialDate, selectedDate, onChange, rangeDate, ...headProps }) => {
    const monthFormat = (0, useLocaleDateTimeFormat_1.useLocaleDateTimeFormat)({
        month: 'long',
    });
    const titleFormat = (0, useLocaleDateTimeFormat_1.useLocaleDateTimeFormat)({
        month: 'long',
        year: 'numeric',
    });
    const { baseDate, handlePrevClick, handleNextClick } = (0, useCalendarNavigate_1.useCalendarNavigate)({
        date: initialDate,
        addCb: addYears_1.addYears,
    });
    const grid = (0, hooks_1.useMonthsGrid)({
        baseDate,
        selectedDate,
        selectedRanges: selectedDate && rangeDate
            ? [{ dateA: selectedDate, dateB: rangeDate }]
            : null,
    });
    const { year: yearCaption } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext).datePickerLanguageMap;
    return ((0, jsx_runtime_1.jsxs)(DateCalendar_1.DateCalendarWrapper, { children: [(0, jsx_runtime_1.jsx)(DateCalendar_1.DateCalendarHead, { ...headProps, arrowPostfixTitle: yearCaption.single, onPrevClick: handlePrevClick, onNextClick: handleNextClick, headBtnText: baseDate.getUTCFullYear() }), (0, jsx_runtime_1.jsx)(DateCalendar_1.DateCalendarGridLarge, { className: constants_1.datePickerClassnames.monthsContainer, children: grid.map(({ month, date, isDisabled, isSelected, ...props }, index) => ((0, jsx_runtime_1.jsx)(DateCalendar_1.DateCalendarGridButtonLarge, { onClick: () => onChange?.(date), tooltipTitle: titleFormat(date), lengthInRow: constants_1.ELEMENTS_COUNT_IN_ROW_IN_LARGE_GRID, isPreviousItemInSelectedRange: grid[index - 1]?.isInSelectedRange, disabled: isDisabled, selected: isSelected, isTooltipActive: false, ...props, children: monthFormat(date) }, month))) })] }));
};
exports.MonthPicker = MonthPicker;
