"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Caption = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const isSameMonth_1 = tslib_1.__importDefault(require("date-fns/isSameMonth"));
const add_1 = tslib_1.__importDefault(require("date-fns/add"));
const CaptionLabel_1 = require("./CaptionLabel");
const react_day_picker_1 = require("react-day-picker");
/**
 * Render the caption of a month, which includes title and navigation buttons.
 * The caption has a different layout when setting the `numberOfMonths` prop.
 */
function Caption(props) {
    const { displayMonth } = props;
    const context = (0, react_day_picker_1.useDayPicker)();
    const { classNames, disableNavigation, styles, onMonthChange, dir } = context;
    const { goToMonth, displayMonths } = (0, react_day_picker_1.useNavigation)();
    const handlePreviousClick = () => {
        handleMonthChange((0, add_1.default)(displayMonth, { months: -1 }));
    };
    const handleNextClick = () => {
        handleMonthChange((0, add_1.default)(displayMonth, { months: 1 }));
    };
    const handleMonthChange = (newMonth) => {
        goToMonth(newMonth);
        onMonthChange === null || onMonthChange === void 0 ? void 0 : onMonthChange(newMonth);
    };
    const handleNextYearClick = () => {
        handleMonthChange((0, add_1.default)(displayMonth, { years: 1 }));
    };
    const handlePreviousYearClick = () => {
        handleMonthChange((0, add_1.default)(displayMonth, { years: -1 }));
    };
    const displayIndex = displayMonths.findIndex((month) => (0, isSameMonth_1.default)(displayMonth, month));
    let isFirst = displayIndex === 0;
    let isLast = displayIndex === displayMonths.length - 1;
    if (dir === 'rtl') {
        [isLast, isFirst] = [isFirst, isLast];
    }
    const captionLabel = React.createElement(CaptionLabel_1.CaptionLabel, { displayMonth: displayMonth });
    return (React.createElement("div", { className: classNames.caption, style: styles.caption },
        disableNavigation && captionLabel,
        !disableNavigation && (React.createElement(React.Fragment, null,
            React.createElement(CaptionLabel_1.CaptionLabel, { displayMonth: displayMonth, onPreviousYearClick: handlePreviousYearClick, onNextYearClick: handleNextYearClick, onNextMonthClick: handleNextClick, onPreviousMonthClick: handlePreviousClick })))));
}
exports.Caption = Caption;
