import React, { forwardRef } from "react";
import { cl } from "../../../utils/helpers/index.js";
import { consoleWarning } from "../../../utils/helpers/consoleWarning.js";
import { useDateLocale, useI18n } from "../../../utils/i18n/i18n.hooks.js";
import { DateTranslationContextProvider, getLocaleFromString, getTranslations, } from "../../Date.locale.js";
import { MonthPickerProvider } from "../MonthPicker.context.js";
import { MonthPickerCaption } from "./MonthPicker.Caption.js";
import { MonthPickerTable } from "./MonthPicker.Table.js";
export const MonthPickerStandalone = forwardRef(({ dropdownCaption = false, fromDate, toDate, disabled = [], selected, className, locale, translations, onMonthSelect, defaultSelected, year, onYearChange, }, ref) => {
    const translate = useI18n("DatePicker", translations, getTranslations(locale));
    const langProviderLocale = useDateLocale();
    if (dropdownCaption && (!fromDate || !toDate)) {
        consoleWarning("MonthPicker.Standalone: Using dropdownCaption requires `fromDate` and `toDate` props to be defined.");
        return null;
    }
    return (React.createElement("div", { ref: ref, className: cl("aksel-date__wrapper", className) },
        React.createElement(DateTranslationContextProvider, { translate: translate },
            React.createElement(MonthPickerProvider, { dropdownCaption: dropdownCaption, defaultSelected: defaultSelected, selected: selected, disabled: disabled, fromDate: fromDate, toDate: toDate, year: year, onYearChange: onYearChange, onMonthSelect: onMonthSelect, locale: locale ? getLocaleFromString(locale) : langProviderLocale },
                React.createElement("div", { className: "aksel-date rdp-month" },
                    React.createElement(MonthPickerCaption, null),
                    React.createElement(MonthPickerTable, null))))));
});
//# sourceMappingURL=MonthPicker.Standalone.js.map