This commit is contained in:
freedakgmail
2025-11-22 19:52:55 +08:00
commit 43c8389705
28950 changed files with 3640981 additions and 0 deletions
@@ -0,0 +1,11 @@
import React from "react";
import type { DayPickerProps } from "./types/index.js";
/**
* Renders the DayPicker calendar component.
*
* @param initialProps - The props for the DayPicker component.
* @returns The rendered DayPicker component.
* @group DayPicker
* @see https://daypicker.dev
*/
export declare function DayPicker(initialProps: DayPickerProps): React.JSX.Element;
@@ -0,0 +1,323 @@
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.DayPicker = DayPicker;
const react_1 = __importStar(require("react"));
const tz_1 = require("@date-fns/tz");
const UI_js_1 = require("./UI.js");
const DateLib_js_1 = require("./classes/DateLib.js");
const createGetModifiers_js_1 = require("./helpers/createGetModifiers.js");
const getClassNamesForModifiers_js_1 = require("./helpers/getClassNamesForModifiers.js");
const getComponents_js_1 = require("./helpers/getComponents.js");
const getDataAttributes_js_1 = require("./helpers/getDataAttributes.js");
const getDefaultClassNames_js_1 = require("./helpers/getDefaultClassNames.js");
const getFormatters_js_1 = require("./helpers/getFormatters.js");
const getMonthOptions_js_1 = require("./helpers/getMonthOptions.js");
const getStyleForModifiers_js_1 = require("./helpers/getStyleForModifiers.js");
const getWeekdays_js_1 = require("./helpers/getWeekdays.js");
const getYearOptions_js_1 = require("./helpers/getYearOptions.js");
const defaultLabels = __importStar(require("./labels/index.js"));
const useAnimation_js_1 = require("./useAnimation.js");
const useCalendar_js_1 = require("./useCalendar.js");
const useDayPicker_js_1 = require("./useDayPicker.js");
const useFocus_js_1 = require("./useFocus.js");
const useSelection_js_1 = require("./useSelection.js");
const rangeIncludesDate_js_1 = require("./utils/rangeIncludesDate.js");
const typeguards_js_1 = require("./utils/typeguards.js");
/**
* Renders the DayPicker calendar component.
*
* @param initialProps - The props for the DayPicker component.
* @returns The rendered DayPicker component.
* @group DayPicker
* @see https://daypicker.dev
*/
function DayPicker(initialProps) {
let props = initialProps;
if (props.timeZone) {
props = {
...initialProps
};
if (props.today) {
props.today = new tz_1.TZDate(props.today, props.timeZone);
}
if (props.month) {
props.month = new tz_1.TZDate(props.month, props.timeZone);
}
if (props.defaultMonth) {
props.defaultMonth = new tz_1.TZDate(props.defaultMonth, props.timeZone);
}
if (props.startMonth) {
props.startMonth = new tz_1.TZDate(props.startMonth, props.timeZone);
}
if (props.endMonth) {
props.endMonth = new tz_1.TZDate(props.endMonth, props.timeZone);
}
if (props.mode === "single" && props.selected) {
props.selected = new tz_1.TZDate(props.selected, props.timeZone);
}
else if (props.mode === "multiple" && props.selected) {
props.selected = props.selected?.map((date) => new tz_1.TZDate(date, props.timeZone));
}
else if (props.mode === "range" && props.selected) {
props.selected = {
from: props.selected.from
? new tz_1.TZDate(props.selected.from, props.timeZone)
: undefined,
to: props.selected.to
? new tz_1.TZDate(props.selected.to, props.timeZone)
: undefined
};
}
}
const { components, formatters, labels, dateLib, locale, classNames } = (0, react_1.useMemo)(() => {
const locale = { ...DateLib_js_1.defaultLocale, ...props.locale };
const dateLib = new DateLib_js_1.DateLib({
locale,
weekStartsOn: props.broadcastCalendar ? 1 : props.weekStartsOn,
firstWeekContainsDate: props.firstWeekContainsDate,
useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens,
timeZone: props.timeZone,
numerals: props.numerals
}, props.dateLib);
return {
dateLib,
components: (0, getComponents_js_1.getComponents)(props.components),
formatters: (0, getFormatters_js_1.getFormatters)(props.formatters),
labels: { ...defaultLabels, ...props.labels },
locale,
classNames: { ...(0, getDefaultClassNames_js_1.getDefaultClassNames)(), ...props.classNames }
};
}, [
props.locale,
props.broadcastCalendar,
props.weekStartsOn,
props.firstWeekContainsDate,
props.useAdditionalWeekYearTokens,
props.useAdditionalDayOfYearTokens,
props.timeZone,
props.numerals,
props.dateLib,
props.components,
props.formatters,
props.labels,
props.classNames
]);
const { captionLayout, mode, navLayout, numberOfMonths = 1, onDayBlur, onDayClick, onDayFocus, onDayKeyDown, onDayMouseEnter, onDayMouseLeave, onNextClick, onPrevClick, showWeekNumber, styles } = props;
const { formatCaption, formatDay, formatMonthDropdown, formatWeekNumber, formatWeekNumberHeader, formatWeekdayName, formatYearDropdown } = formatters;
const calendar = (0, useCalendar_js_1.useCalendar)(props, dateLib);
const { days, months, navStart, navEnd, previousMonth, nextMonth, goToMonth } = calendar;
const getModifiers = (0, createGetModifiers_js_1.createGetModifiers)(days, props, navStart, navEnd, dateLib);
const { isSelected, select, selected: selectedValue } = (0, useSelection_js_1.useSelection)(props, dateLib) ?? {};
const { blur, focused, isFocusTarget, moveFocus, setFocused } = (0, useFocus_js_1.useFocus)(props, calendar, getModifiers, isSelected ?? (() => false), dateLib);
const { labelDayButton, labelGridcell, labelGrid, labelMonthDropdown, labelNav, labelPrevious, labelNext, labelWeekday, labelWeekNumber, labelWeekNumberHeader, labelYearDropdown } = labels;
const weekdays = (0, react_1.useMemo)(() => (0, getWeekdays_js_1.getWeekdays)(dateLib, props.ISOWeek), [dateLib, props.ISOWeek]);
const isInteractive = mode !== undefined || onDayClick !== undefined;
const handlePreviousClick = (0, react_1.useCallback)(() => {
if (!previousMonth)
return;
goToMonth(previousMonth);
onPrevClick?.(previousMonth);
}, [previousMonth, goToMonth, onPrevClick]);
const handleNextClick = (0, react_1.useCallback)(() => {
if (!nextMonth)
return;
goToMonth(nextMonth);
onNextClick?.(nextMonth);
}, [goToMonth, nextMonth, onNextClick]);
const handleDayClick = (0, react_1.useCallback)((day, m) => (e) => {
e.preventDefault();
e.stopPropagation();
setFocused(day);
select?.(day.date, m, e);
onDayClick?.(day.date, m, e);
}, [select, onDayClick, setFocused]);
const handleDayFocus = (0, react_1.useCallback)((day, m) => (e) => {
setFocused(day);
onDayFocus?.(day.date, m, e);
}, [onDayFocus, setFocused]);
const handleDayBlur = (0, react_1.useCallback)((day, m) => (e) => {
blur();
onDayBlur?.(day.date, m, e);
}, [blur, onDayBlur]);
const handleDayKeyDown = (0, react_1.useCallback)((day, modifiers) => (e) => {
const keyMap = {
ArrowLeft: [
e.shiftKey ? "month" : "day",
props.dir === "rtl" ? "after" : "before"
],
ArrowRight: [
e.shiftKey ? "month" : "day",
props.dir === "rtl" ? "before" : "after"
],
ArrowDown: [e.shiftKey ? "year" : "week", "after"],
ArrowUp: [e.shiftKey ? "year" : "week", "before"],
PageUp: [e.shiftKey ? "year" : "month", "before"],
PageDown: [e.shiftKey ? "year" : "month", "after"],
Home: ["startOfWeek", "before"],
End: ["endOfWeek", "after"]
};
if (keyMap[e.key]) {
e.preventDefault();
e.stopPropagation();
const [moveBy, moveDir] = keyMap[e.key];
moveFocus(moveBy, moveDir);
}
onDayKeyDown?.(day.date, modifiers, e);
}, [moveFocus, onDayKeyDown, props.dir]);
const handleDayMouseEnter = (0, react_1.useCallback)((day, modifiers) => (e) => {
onDayMouseEnter?.(day.date, modifiers, e);
}, [onDayMouseEnter]);
const handleDayMouseLeave = (0, react_1.useCallback)((day, modifiers) => (e) => {
onDayMouseLeave?.(day.date, modifiers, e);
}, [onDayMouseLeave]);
const handleMonthChange = (0, react_1.useCallback)((date) => (e) => {
const selectedMonth = Number(e.target.value);
const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
goToMonth(month);
}, [dateLib, goToMonth]);
const handleYearChange = (0, react_1.useCallback)((date) => (e) => {
const selectedYear = Number(e.target.value);
const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
goToMonth(month);
}, [dateLib, goToMonth]);
const { className, style } = (0, react_1.useMemo)(() => ({
className: [classNames[UI_js_1.UI.Root], props.className]
.filter(Boolean)
.join(" "),
style: { ...styles?.[UI_js_1.UI.Root], ...props.style }
}), [classNames, props.className, props.style, styles]);
const dataAttributes = (0, getDataAttributes_js_1.getDataAttributes)(props);
const rootElRef = (0, react_1.useRef)(null);
(0, useAnimation_js_1.useAnimation)(rootElRef, Boolean(props.animate), {
classNames,
months,
focused,
dateLib
});
const contextValue = {
dayPickerProps: props,
selected: selectedValue,
select: select,
isSelected,
months,
nextMonth,
previousMonth,
goToMonth,
getModifiers,
components,
classNames,
styles,
labels,
formatters
};
return (react_1.default.createElement(useDayPicker_js_1.dayPickerContext.Provider, { value: contextValue },
react_1.default.createElement(components.Root, { rootRef: props.animate ? rootElRef : undefined, className: className, style: style, dir: props.dir, id: props.id, lang: props.lang, nonce: props.nonce, title: props.title, role: props.role, "aria-label": props["aria-label"], ...dataAttributes },
react_1.default.createElement(components.Months, { className: classNames[UI_js_1.UI.Months], style: styles?.[UI_js_1.UI.Months] },
!props.hideNavigation && !navLayout && (react_1.default.createElement(components.Nav, { "data-animated-nav": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.Nav], style: styles?.[UI_js_1.UI.Nav], "aria-label": labelNav(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth: previousMonth, nextMonth: nextMonth })),
months.map((calendarMonth, displayIndex) => {
const dropdownMonths = (0, getMonthOptions_js_1.getMonthOptions)(calendarMonth.date, navStart, navEnd, formatters, dateLib);
const dropdownYears = (0, getYearOptions_js_1.getYearOptions)(navStart, navEnd, formatters, dateLib);
return (react_1.default.createElement(components.Month, { "data-animated-month": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.Month], style: styles?.[UI_js_1.UI.Month], key: displayIndex, displayIndex: displayIndex, calendarMonth: calendarMonth },
navLayout === "around" &&
!props.hideNavigation &&
displayIndex === 0 && (react_1.default.createElement(components.PreviousMonthButton, { type: "button", className: classNames[UI_js_1.UI.PreviousMonthButton], tabIndex: previousMonth ? undefined : -1, "aria-disabled": previousMonth ? undefined : true, "aria-label": labelPrevious(previousMonth), onClick: handlePreviousClick, "data-animated-button": props.animate ? "true" : undefined },
react_1.default.createElement(components.Chevron, { disabled: previousMonth ? undefined : true, className: classNames[UI_js_1.UI.Chevron], orientation: props.dir === "rtl" ? "right" : "left" }))),
react_1.default.createElement(components.MonthCaption, { "data-animated-caption": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.MonthCaption], style: styles?.[UI_js_1.UI.MonthCaption], calendarMonth: calendarMonth, displayIndex: displayIndex }, captionLayout?.startsWith("dropdown") ? (react_1.default.createElement(components.DropdownNav, { className: classNames[UI_js_1.UI.Dropdowns], style: styles?.[UI_js_1.UI.Dropdowns] },
captionLayout === "dropdown" ||
captionLayout === "dropdown-months" ? (react_1.default.createElement(components.MonthsDropdown, { className: classNames[UI_js_1.UI.MonthsDropdown], "aria-label": labelMonthDropdown(), classNames: classNames, components: components, disabled: Boolean(props.disableNavigation), onChange: handleMonthChange(calendarMonth.date), options: dropdownMonths, style: styles?.[UI_js_1.UI.Dropdown], value: dateLib.getMonth(calendarMonth.date) })) : (react_1.default.createElement("span", null, formatMonthDropdown(calendarMonth.date, dateLib))),
captionLayout === "dropdown" ||
captionLayout === "dropdown-years" ? (react_1.default.createElement(components.YearsDropdown, { className: classNames[UI_js_1.UI.YearsDropdown], "aria-label": labelYearDropdown(dateLib.options), classNames: classNames, components: components, disabled: Boolean(props.disableNavigation), onChange: handleYearChange(calendarMonth.date), options: dropdownYears, style: styles?.[UI_js_1.UI.Dropdown], value: dateLib.getYear(calendarMonth.date) })) : (react_1.default.createElement("span", null, formatYearDropdown(calendarMonth.date, dateLib))),
react_1.default.createElement("span", { role: "status", "aria-live": "polite", style: {
border: 0,
clip: "rect(0 0 0 0)",
height: "1px",
margin: "-1px",
overflow: "hidden",
padding: 0,
position: "absolute",
width: "1px",
whiteSpace: "nowrap",
wordWrap: "normal"
} }, formatCaption(calendarMonth.date, dateLib.options, dateLib)))) : (react_1.default.createElement(components.CaptionLabel, { className: classNames[UI_js_1.UI.CaptionLabel], role: "status", "aria-live": "polite" }, formatCaption(calendarMonth.date, dateLib.options, dateLib)))),
navLayout === "around" &&
!props.hideNavigation &&
displayIndex === numberOfMonths - 1 && (react_1.default.createElement(components.NextMonthButton, { type: "button", className: classNames[UI_js_1.UI.NextMonthButton], tabIndex: nextMonth ? undefined : -1, "aria-disabled": nextMonth ? undefined : true, "aria-label": labelNext(nextMonth), onClick: handleNextClick, "data-animated-button": props.animate ? "true" : undefined },
react_1.default.createElement(components.Chevron, { disabled: nextMonth ? undefined : true, className: classNames[UI_js_1.UI.Chevron], orientation: props.dir === "rtl" ? "left" : "right" }))),
displayIndex === numberOfMonths - 1 &&
navLayout === "after" &&
!props.hideNavigation && (react_1.default.createElement(components.Nav, { "data-animated-nav": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.Nav], style: styles?.[UI_js_1.UI.Nav], "aria-label": labelNav(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth: previousMonth, nextMonth: nextMonth })),
react_1.default.createElement(components.MonthGrid, { role: "grid", "aria-multiselectable": mode === "multiple" || mode === "range", "aria-label": labelGrid(calendarMonth.date, dateLib.options, dateLib) ||
undefined, className: classNames[UI_js_1.UI.MonthGrid], style: styles?.[UI_js_1.UI.MonthGrid] },
!props.hideWeekdays && (react_1.default.createElement(components.Weekdays, { "data-animated-weekdays": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.Weekdays], style: styles?.[UI_js_1.UI.Weekdays] },
showWeekNumber && (react_1.default.createElement(components.WeekNumberHeader, { "aria-label": labelWeekNumberHeader(dateLib.options), className: classNames[UI_js_1.UI.WeekNumberHeader], style: styles?.[UI_js_1.UI.WeekNumberHeader], scope: "col" }, formatWeekNumberHeader())),
weekdays.map((weekday, i) => (react_1.default.createElement(components.Weekday, { "aria-label": labelWeekday(weekday, dateLib.options, dateLib), className: classNames[UI_js_1.UI.Weekday], key: i, style: styles?.[UI_js_1.UI.Weekday], scope: "col" }, formatWeekdayName(weekday, dateLib.options, dateLib)))))),
react_1.default.createElement(components.Weeks, { "data-animated-weeks": props.animate ? "true" : undefined, className: classNames[UI_js_1.UI.Weeks], style: styles?.[UI_js_1.UI.Weeks] }, calendarMonth.weeks.map((week, weekIndex) => {
return (react_1.default.createElement(components.Week, { className: classNames[UI_js_1.UI.Week], key: week.weekNumber, style: styles?.[UI_js_1.UI.Week], week: week },
showWeekNumber && (react_1.default.createElement(components.WeekNumber, { week: week, style: styles?.[UI_js_1.UI.WeekNumber], "aria-label": labelWeekNumber(week.weekNumber, {
locale
}), className: classNames[UI_js_1.UI.WeekNumber], scope: "row", role: "rowheader" }, formatWeekNumber(week.weekNumber, dateLib))),
week.days.map((day) => {
const { date } = day;
const modifiers = getModifiers(day);
modifiers[UI_js_1.DayFlag.focused] =
!modifiers.hidden &&
Boolean(focused?.isEqualTo(day));
modifiers[UI_js_1.SelectionState.selected] =
isSelected?.(date) || modifiers.selected;
if ((0, typeguards_js_1.isDateRange)(selectedValue)) {
// add range modifiers
const { from, to } = selectedValue;
modifiers[UI_js_1.SelectionState.range_start] = Boolean(from && to && dateLib.isSameDay(date, from));
modifiers[UI_js_1.SelectionState.range_end] = Boolean(from && to && dateLib.isSameDay(date, to));
modifiers[UI_js_1.SelectionState.range_middle] =
(0, rangeIncludesDate_js_1.rangeIncludesDate)(selectedValue, date, true, dateLib);
}
const style = (0, getStyleForModifiers_js_1.getStyleForModifiers)(modifiers, styles, props.modifiersStyles);
const className = (0, getClassNamesForModifiers_js_1.getClassNamesForModifiers)(modifiers, classNames, props.modifiersClassNames);
const ariaLabel = !isInteractive && !modifiers.hidden
? labelGridcell(date, modifiers, dateLib.options, dateLib)
: undefined;
return (react_1.default.createElement(components.Day, { key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`, day: day, modifiers: modifiers, className: className.join(" "), style: style, role: "gridcell", "aria-selected": modifiers.selected || undefined, "aria-label": ariaLabel, "data-day": dateLib.format(date, "yyyy-MM-dd"), "data-month": day.outside
? dateLib.format(date, "yyyy-MM")
: undefined, "data-selected": modifiers.selected || undefined, "data-disabled": modifiers.disabled || undefined, "data-hidden": modifiers.hidden || undefined, "data-outside": day.outside || undefined, "data-focused": modifiers.focused || undefined, "data-today": modifiers.today || undefined }, !modifiers.hidden && isInteractive ? (react_1.default.createElement(components.DayButton, { className: classNames[UI_js_1.UI.DayButton], style: styles?.[UI_js_1.UI.DayButton], type: "button", day: day, modifiers: modifiers, disabled: modifiers.disabled || undefined, tabIndex: isFocusTarget(day) ? 0 : -1, "aria-label": labelDayButton(date, modifiers, dateLib.options, dateLib), onClick: handleDayClick(day, modifiers), onBlur: handleDayBlur(day, modifiers), onFocus: handleDayFocus(day, modifiers), onKeyDown: handleDayKeyDown(day, modifiers), onMouseEnter: handleDayMouseEnter(day, modifiers), onMouseLeave: handleDayMouseLeave(day, modifiers) }, formatDay(date, dateLib.options, dateLib))) : (!modifiers.hidden &&
formatDay(day.date, dateLib.options, dateLib))));
})));
})))));
})),
props.footer && (react_1.default.createElement(components.Footer, { className: classNames[UI_js_1.UI.Footer], style: styles?.[UI_js_1.UI.Footer], role: "status", "aria-live": "polite" }, props.footer)))));
}
//# sourceMappingURL=DayPicker.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,346 @@
import { CSSProperties } from "react";
/**
* Enum representing the UI elements composing DayPicker. These elements are
* mapped to {@link CustomComponents}, {@link ClassNames}, and {@link Styles}.
*
* Some elements are extended by flags and modifiers.
*/
export declare enum UI {
/** The root component displaying the months and the navigation bar. */
Root = "root",
/** The Chevron SVG element used by navigation buttons and dropdowns. */
Chevron = "chevron",
/**
* The grid cell with the day's date. Extended by {@link DayFlag} and
* {@link SelectionState}.
*/
Day = "day",
/** The button containing the formatted day's date, inside the grid cell. */
DayButton = "day_button",
/** The caption label of the month (when not showing the dropdown navigation). */
CaptionLabel = "caption_label",
/** The container of the dropdown navigation (when enabled). */
Dropdowns = "dropdowns",
/** The dropdown element to select for years and months. */
Dropdown = "dropdown",
/** The container element of the dropdown. */
DropdownRoot = "dropdown_root",
/** The root element of the footer. */
Footer = "footer",
/** The month grid. */
MonthGrid = "month_grid",
/** Contains the dropdown navigation or the caption label. */
MonthCaption = "month_caption",
/** The dropdown with the months. */
MonthsDropdown = "months_dropdown",
/** Wrapper of the month grid. */
Month = "month",
/** The container of the displayed months. */
Months = "months",
/** The navigation bar with the previous and next buttons. */
Nav = "nav",
/**
* The next month button in the navigation. *
*
* @since 9.1.0
*/
NextMonthButton = "button_next",
/**
* The previous month button in the navigation.
*
* @since 9.1.0
*/
PreviousMonthButton = "button_previous",
/** The row containing the week. */
Week = "week",
/** The group of row weeks in a month (`tbody`). */
Weeks = "weeks",
/** The column header with the weekday. */
Weekday = "weekday",
/** The row grouping the weekdays in the column headers. */
Weekdays = "weekdays",
/** The cell containing the week number. */
WeekNumber = "week_number",
/** The cell header of the week numbers column. */
WeekNumberHeader = "week_number_header",
/** The dropdown with the years. */
YearsDropdown = "years_dropdown"
}
/** Enum representing flags for the {@link UI.Day} element. */
export declare enum DayFlag {
/** The day is disabled. */
disabled = "disabled",
/** The day is hidden. */
hidden = "hidden",
/** The day is outside the current month. */
outside = "outside",
/** The day is focused. */
focused = "focused",
/** The day is today. */
today = "today"
}
/**
* Enum representing selection states that can be applied to the {@link UI.Day}
* element in selection mode.
*/
export declare enum SelectionState {
/** The day is at the end of a selected range. */
range_end = "range_end",
/** The day is at the middle of a selected range. */
range_middle = "range_middle",
/** The day is at the start of a selected range. */
range_start = "range_start",
/** The day is selected. */
selected = "selected"
}
/**
* Enum representing different animation states for transitioning between
* months.
*/
export declare enum Animation {
/** The entering weeks when they appear before the exiting month. */
weeks_before_enter = "weeks_before_enter",
/** The exiting weeks when they disappear before the entering month. */
weeks_before_exit = "weeks_before_exit",
/** The entering weeks when they appear after the exiting month. */
weeks_after_enter = "weeks_after_enter",
/** The exiting weeks when they disappear after the entering month. */
weeks_after_exit = "weeks_after_exit",
/** The entering caption when it appears after the exiting month. */
caption_after_enter = "caption_after_enter",
/** The exiting caption when it disappears after the entering month. */
caption_after_exit = "caption_after_exit",
/** The entering caption when it appears before the exiting month. */
caption_before_enter = "caption_before_enter",
/** The exiting caption when it disappears before the entering month. */
caption_before_exit = "caption_before_exit"
}
/**
* Deprecated UI elements and flags from previous versions of DayPicker.
*
* These elements are kept for backward compatibility and to assist in
* transitioning to the new {@link UI} elements.
*
* @deprecated
* @since 9.0.1
* @template T - The type of the deprecated UI element (e.g., CSS class or
* style).
* @see https://daypicker.dev/upgrading
* @see https://daypicker.dev/docs/styling
*/
export type DeprecatedUI<T extends CSSProperties | string> = {
/**
* This element was applied to the style of any button in DayPicker and it is
* replaced by {@link UI.PreviousMonthButton} and {@link UI.NextMonthButton}.
*
* @deprecated
*/
button: T;
/**
* This element was resetting the style of any button in DayPicker and it is
* replaced by {@link UI.PreviousMonthButton} and {@link UI.NextMonthButton}.
*
* @deprecated
*/
button_reset: T;
/**
* This element has been renamed to {@link UI.MonthCaption}.
*
* @deprecated
*/
caption: T;
/**
* This element has been removed. Captions are styled via
* {@link UI.MonthCaption}.
*
* @deprecated
*/
caption_between: T;
/**
* This element has been renamed to {@link UI.Dropdowns}.
*
* @deprecated
*/
caption_dropdowns: T;
/**
* This element has been removed. Captions are styled via
* {@link UI.MonthCaption}.
*
* @deprecated
*/
caption_end: T;
/**
* This element has been removed.
*
* @deprecated
*/
caption_start: T;
/**
* This element has been renamed to {@link UI.Day}.
*
* @deprecated
*/
cell: T;
/**
* This element has been renamed to {@link DayFlag.disabled}.
*
* @deprecated
*/
day_disabled: T;
/**
* This element has been renamed to {@link DayFlag.hidden}.
*
* @deprecated
*/
day_hidden: T;
/**
* This element has been renamed to {@link DayFlag.outside}.
*
* @deprecated
*/
day_outside: T;
/**
* This element has been renamed to {@link SelectionState.range_end}.
*
* @deprecated
*/
day_range_end: T;
/**
* This element has been renamed to {@link SelectionState.range_middle}.
*
* @deprecated
*/
day_range_middle: T;
/**
* This element has been renamed to {@link SelectionState.range_start}.
*
* @deprecated
*/
day_range_start: T;
/**
* This element has been renamed to {@link SelectionState.selected}.
*
* @deprecated
*/
day_selected: T;
/**
* This element has been renamed to {@link DayFlag.today}.
*
* @deprecated
*/
day_today: T;
/**
* This element has been removed. The dropdown icon is now {@link UI.Chevron}
* inside a {@link UI.CaptionLabel}.
*
* @deprecated
*/
dropdown_icon: T;
/**
* This element has been renamed to {@link UI.MonthsDropdown}.
*
* @deprecated
*/
dropdown_month: T;
/**
* This element has been renamed to {@link UI.YearsDropdown}.
*
* @deprecated
*/
dropdown_year: T;
/**
* This element has been removed.
*
* @deprecated
*/
head: T;
/**
* This element has been renamed to {@link UI.Weekday}.
*
* @deprecated
*/
head_cell: T;
/**
* This element has been renamed to {@link UI.Weekdays}.
*
* @deprecated
*/
head_row: T;
/**
* This flag has been removed. Use `data-multiple-months` in your CSS
* selectors.
*
* @deprecated
*/
multiple_months: T;
/**
* This element has been removed. To style the navigation buttons, use
* {@link UI.PreviousMonthButton} and {@link UI.NextMonthButton}.
*
* @deprecated
*/
nav_button: T;
/**
* This element has been renamed to {@link UI.NextMonthButton}.
*
* @deprecated
*/
nav_button_next: T;
/**
* This element has been renamed to {@link UI.PreviousMonthButton}.
*
* @deprecated
*/
nav_button_previous: T;
/**
* This element has been removed. The dropdown icon is now {@link UI.Chevron}
* inside a {@link UI.NextMonthButton} or a {@link UI.PreviousMonthButton}.
*
* @deprecated
*/
nav_icon: T;
/**
* This element has been renamed to {@link UI.Week}.
*
* @deprecated
*/
row: T;
/**
* This element has been renamed to {@link UI.MonthGrid}.
*
* @deprecated
*/
table: T;
/**
* This element has been renamed to {@link UI.Weeks}.
*
* @deprecated
*/
tbody: T;
/**
* This element has been removed. The {@link UI.Footer} is now a single element
* below the months.
*
* @deprecated
*/
tfoot: T;
/**
* This flag has been removed. There are no "visually hidden" elements in
* DayPicker 9.
*
* @deprecated
*/
vhidden: T;
/**
* This element has been renamed. Use {@link UI.WeekNumber} instead.
*
* @deprecated
*/
weeknumber: T;
/**
* This flag has been removed. Use `data-week-numbers` in your CSS.
*
* @deprecated
*/
with_weeknumber: T;
};
@@ -0,0 +1,124 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Animation = exports.SelectionState = exports.DayFlag = exports.UI = void 0;
/**
* Enum representing the UI elements composing DayPicker. These elements are
* mapped to {@link CustomComponents}, {@link ClassNames}, and {@link Styles}.
*
* Some elements are extended by flags and modifiers.
*/
var UI;
(function (UI) {
/** The root component displaying the months and the navigation bar. */
UI["Root"] = "root";
/** The Chevron SVG element used by navigation buttons and dropdowns. */
UI["Chevron"] = "chevron";
/**
* The grid cell with the day's date. Extended by {@link DayFlag} and
* {@link SelectionState}.
*/
UI["Day"] = "day";
/** The button containing the formatted day's date, inside the grid cell. */
UI["DayButton"] = "day_button";
/** The caption label of the month (when not showing the dropdown navigation). */
UI["CaptionLabel"] = "caption_label";
/** The container of the dropdown navigation (when enabled). */
UI["Dropdowns"] = "dropdowns";
/** The dropdown element to select for years and months. */
UI["Dropdown"] = "dropdown";
/** The container element of the dropdown. */
UI["DropdownRoot"] = "dropdown_root";
/** The root element of the footer. */
UI["Footer"] = "footer";
/** The month grid. */
UI["MonthGrid"] = "month_grid";
/** Contains the dropdown navigation or the caption label. */
UI["MonthCaption"] = "month_caption";
/** The dropdown with the months. */
UI["MonthsDropdown"] = "months_dropdown";
/** Wrapper of the month grid. */
UI["Month"] = "month";
/** The container of the displayed months. */
UI["Months"] = "months";
/** The navigation bar with the previous and next buttons. */
UI["Nav"] = "nav";
/**
* The next month button in the navigation. *
*
* @since 9.1.0
*/
UI["NextMonthButton"] = "button_next";
/**
* The previous month button in the navigation.
*
* @since 9.1.0
*/
UI["PreviousMonthButton"] = "button_previous";
/** The row containing the week. */
UI["Week"] = "week";
/** The group of row weeks in a month (`tbody`). */
UI["Weeks"] = "weeks";
/** The column header with the weekday. */
UI["Weekday"] = "weekday";
/** The row grouping the weekdays in the column headers. */
UI["Weekdays"] = "weekdays";
/** The cell containing the week number. */
UI["WeekNumber"] = "week_number";
/** The cell header of the week numbers column. */
UI["WeekNumberHeader"] = "week_number_header";
/** The dropdown with the years. */
UI["YearsDropdown"] = "years_dropdown";
})(UI || (exports.UI = UI = {}));
/** Enum representing flags for the {@link UI.Day} element. */
var DayFlag;
(function (DayFlag) {
/** The day is disabled. */
DayFlag["disabled"] = "disabled";
/** The day is hidden. */
DayFlag["hidden"] = "hidden";
/** The day is outside the current month. */
DayFlag["outside"] = "outside";
/** The day is focused. */
DayFlag["focused"] = "focused";
/** The day is today. */
DayFlag["today"] = "today";
})(DayFlag || (exports.DayFlag = DayFlag = {}));
/**
* Enum representing selection states that can be applied to the {@link UI.Day}
* element in selection mode.
*/
var SelectionState;
(function (SelectionState) {
/** The day is at the end of a selected range. */
SelectionState["range_end"] = "range_end";
/** The day is at the middle of a selected range. */
SelectionState["range_middle"] = "range_middle";
/** The day is at the start of a selected range. */
SelectionState["range_start"] = "range_start";
/** The day is selected. */
SelectionState["selected"] = "selected";
})(SelectionState || (exports.SelectionState = SelectionState = {}));
/**
* Enum representing different animation states for transitioning between
* months.
*/
var Animation;
(function (Animation) {
/** The entering weeks when they appear before the exiting month. */
Animation["weeks_before_enter"] = "weeks_before_enter";
/** The exiting weeks when they disappear before the entering month. */
Animation["weeks_before_exit"] = "weeks_before_exit";
/** The entering weeks when they appear after the exiting month. */
Animation["weeks_after_enter"] = "weeks_after_enter";
/** The exiting weeks when they disappear after the entering month. */
Animation["weeks_after_exit"] = "weeks_after_exit";
/** The entering caption when it appears after the exiting month. */
Animation["caption_after_enter"] = "caption_after_enter";
/** The exiting caption when it disappears after the entering month. */
Animation["caption_after_exit"] = "caption_after_exit";
/** The entering caption when it appears before the exiting month. */
Animation["caption_before_enter"] = "caption_before_enter";
/** The exiting caption when it disappears before the entering month. */
Animation["caption_before_exit"] = "caption_before_exit";
})(Animation || (exports.Animation = Animation = {}));
//# sourceMappingURL=UI.js.map
@@ -0,0 +1 @@
{"version":3,"file":"UI.js","sourceRoot":"","sources":["../../src/UI.ts"],"names":[],"mappings":";;;AAIA;;;;;GAKG;AACH,IAAY,EA4DX;AA5DD,WAAY,EAAE;IACZ,uEAAuE;IACvE,mBAAa,CAAA;IACb,wEAAwE;IACxE,yBAAmB,CAAA;IACnB;;;OAGG;IACH,iBAAW,CAAA;IACX,4EAA4E;IAC5E,8BAAwB,CAAA;IACxB,iFAAiF;IACjF,oCAA8B,CAAA;IAC9B,+DAA+D;IAC/D,6BAAuB,CAAA;IACvB,2DAA2D;IAC3D,2BAAqB,CAAA;IACrB,6CAA6C;IAC7C,oCAA8B,CAAA;IAC9B,sCAAsC;IACtC,uBAAiB,CAAA;IACjB,sBAAsB;IACtB,8BAAwB,CAAA;IACxB,6DAA6D;IAC7D,oCAA8B,CAAA;IAC9B,oCAAoC;IACpC,wCAAkC,CAAA;IAClC,iCAAiC;IACjC,qBAAe,CAAA;IACf,6CAA6C;IAC7C,uBAAiB,CAAA;IACjB,6DAA6D;IAC7D,iBAAW,CAAA;IACX;;;;OAIG;IACH,qCAA+B,CAAA;IAC/B;;;;OAIG;IACH,6CAAuC,CAAA;IACvC,mCAAmC;IACnC,mBAAa,CAAA;IACb,mDAAmD;IACnD,qBAAe,CAAA;IACf,0CAA0C;IAC1C,yBAAmB,CAAA;IACnB,2DAA2D;IAC3D,2BAAqB,CAAA;IACrB,2CAA2C;IAC3C,gCAA0B,CAAA;IAC1B,kDAAkD;IAClD,6CAAuC,CAAA;IACvC,mCAAmC;IACnC,sCAAgC,CAAA;AAClC,CAAC,EA5DW,EAAE,kBAAF,EAAE,QA4Db;AAED,8DAA8D;AAC9D,IAAY,OAWX;AAXD,WAAY,OAAO;IACjB,2BAA2B;IAC3B,gCAAqB,CAAA;IACrB,yBAAyB;IACzB,4BAAiB,CAAA;IACjB,4CAA4C;IAC5C,8BAAmB,CAAA;IACnB,0BAA0B;IAC1B,8BAAmB,CAAA;IACnB,wBAAwB;IACxB,0BAAe,CAAA;AACjB,CAAC,EAXW,OAAO,uBAAP,OAAO,QAWlB;AAED;;;GAGG;AACH,IAAY,cASX;AATD,WAAY,cAAc;IACxB,iDAAiD;IACjD,yCAAuB,CAAA;IACvB,oDAAoD;IACpD,+CAA6B,CAAA;IAC7B,mDAAmD;IACnD,6CAA2B,CAAA;IAC3B,2BAA2B;IAC3B,uCAAqB,CAAA;AACvB,CAAC,EATW,cAAc,8BAAd,cAAc,QASzB;AAED;;;GAGG;AACH,IAAY,SAiBX;AAjBD,WAAY,SAAS;IACnB,oEAAoE;IACpE,sDAAyC,CAAA;IACzC,uEAAuE;IACvE,oDAAuC,CAAA;IACvC,mEAAmE;IACnE,oDAAuC,CAAA;IACvC,sEAAsE;IACtE,kDAAqC,CAAA;IACrC,oEAAoE;IACpE,wDAA2C,CAAA;IAC3C,uEAAuE;IACvE,sDAAyC,CAAA;IACzC,qEAAqE;IACrE,0DAA6C,CAAA;IAC7C,wEAAwE;IACxE,wDAA2C,CAAA;AAC7C,CAAC,EAjBW,SAAS,yBAAT,SAAS,QAiBpB"}
@@ -0,0 +1,42 @@
import { type DateLib } from "./DateLib.js";
/**
* Represents a day displayed in the calendar.
*
* In DayPicker, a `CalendarDay` is a wrapper around a `Date` object that
* provides additional information about the day, such as whether it belongs to
* the displayed month.
*/
export declare class CalendarDay {
constructor(date: Date, displayMonth: Date, dateLib?: DateLib);
/**
* Utility functions for manipulating dates.
*
* @private
*/
readonly dateLib: DateLib;
/**
* Indicates whether the day does not belong to the displayed month.
*
* If `outside` is `true`, use `displayMonth` to determine the month to which
* the day belongs.
*/
readonly outside: boolean;
/**
* The month that is currently displayed in the calendar.
*
* This property is useful for determining if the day belongs to the same
* month as the displayed month, especially when `showOutsideDays` is
* enabled.
*/
readonly displayMonth: Date;
/** The date represented by this day. */
readonly date: Date;
/**
* Checks if this day is equal to another `CalendarDay`, considering both the
* date and the displayed month.
*
* @param day The `CalendarDay` to compare with.
* @returns `true` if the days are equal, otherwise `false`.
*/
isEqualTo(day: CalendarDay): boolean;
}
@@ -0,0 +1,32 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CalendarDay = void 0;
const DateLib_js_1 = require("./DateLib.js");
/**
* Represents a day displayed in the calendar.
*
* In DayPicker, a `CalendarDay` is a wrapper around a `Date` object that
* provides additional information about the day, such as whether it belongs to
* the displayed month.
*/
class CalendarDay {
constructor(date, displayMonth, dateLib = DateLib_js_1.defaultDateLib) {
this.date = date;
this.displayMonth = displayMonth;
this.outside = Boolean(displayMonth && !dateLib.isSameMonth(date, displayMonth));
this.dateLib = dateLib;
}
/**
* Checks if this day is equal to another `CalendarDay`, considering both the
* date and the displayed month.
*
* @param day The `CalendarDay` to compare with.
* @returns `true` if the days are equal, otherwise `false`.
*/
isEqualTo(day) {
return (this.dateLib.isSameDay(day.date, this.date) &&
this.dateLib.isSameMonth(day.displayMonth, this.displayMonth));
}
}
exports.CalendarDay = CalendarDay;
//# sourceMappingURL=CalendarDay.js.map
@@ -0,0 +1 @@
{"version":3,"file":"CalendarDay.js","sourceRoot":"","sources":["../../../src/classes/CalendarDay.ts"],"names":[],"mappings":";;;AAAA,6CAA4D;AAE5D;;;;;;GAMG;AACH,MAAa,WAAW;IACtB,YACE,IAAU,EACV,YAAkB,EAClB,UAAmB,2BAAc;QAEjC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;QACjC,IAAI,CAAC,OAAO,GAAG,OAAO,CACpB,YAAY,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,EAAE,YAAY,CAAC,CACzD,CAAC;QACF,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,CAAC;IA6BD;;;;;;OAMG;IACH,SAAS,CAAC,GAAgB;QACxB,OAAO,CACL,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC;YAC3C,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAC9D,CAAC;IACJ,CAAC;CACF;AAtDD,kCAsDC"}
@@ -0,0 +1,14 @@
import { CalendarWeek } from "./CalendarWeek.js";
/**
* Represents a month in a calendar year.
*
* A `CalendarMonth` contains the weeks within the month and the date of the
* month.
*/
export declare class CalendarMonth {
constructor(month: Date, weeks: CalendarWeek[]);
/** The date representing the first day of the month. */
date: Date;
/** The weeks that belong to this month. */
weeks: CalendarWeek[];
}
@@ -0,0 +1,17 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CalendarMonth = void 0;
/**
* Represents a month in a calendar year.
*
* A `CalendarMonth` contains the weeks within the month and the date of the
* month.
*/
class CalendarMonth {
constructor(month, weeks) {
this.date = month;
this.weeks = weeks;
}
}
exports.CalendarMonth = CalendarMonth;
//# sourceMappingURL=CalendarMonth.js.map
@@ -0,0 +1 @@
{"version":3,"file":"CalendarMonth.js","sourceRoot":"","sources":["../../../src/classes/CalendarMonth.ts"],"names":[],"mappings":";;;AAEA;;;;;GAKG;AACH,MAAa,aAAa;IACxB,YAAY,KAAW,EAAE,KAAqB;QAC5C,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;CAOF;AAXD,sCAWC"}
@@ -0,0 +1,13 @@
import { CalendarDay } from "./CalendarDay.js";
/**
* Represents a week in a calendar month.
*
* A `CalendarWeek` contains the days within the week and the week number.
*/
export declare class CalendarWeek {
constructor(weekNumber: number, days: CalendarDay[]);
/** The number of the week within the year. */
weekNumber: number;
/** The days that belong to this week. */
days: CalendarDay[];
}
@@ -0,0 +1,16 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CalendarWeek = void 0;
/**
* Represents a week in a calendar month.
*
* A `CalendarWeek` contains the days within the week and the week number.
*/
class CalendarWeek {
constructor(weekNumber, days) {
this.days = days;
this.weekNumber = weekNumber;
}
}
exports.CalendarWeek = CalendarWeek;
//# sourceMappingURL=CalendarWeek.js.map
@@ -0,0 +1 @@
{"version":3,"file":"CalendarWeek.js","sourceRoot":"","sources":["../../../src/classes/CalendarWeek.ts"],"names":[],"mappings":";;;AAEA;;;;GAIG;AACH,MAAa,YAAY;IACvB,YAAY,UAAkB,EAAE,IAAmB;QACjD,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;IAC/B,CAAC;CAOF;AAXD,oCAWC"}
@@ -0,0 +1,368 @@
import type { EndOfWeekOptions, StartOfWeekOptions, FormatOptions as DateFnsFormatOptions, Interval, GetMonthOptions, GetYearOptions, GetWeekOptions } from "date-fns";
import type { Locale } from "date-fns/locale";
import { Numerals } from "../types/shared.js";
export type { Locale } from "date-fns/locale";
export type { Month as DateFnsMonth } from "date-fns";
/**
* @ignore
* @deprecated Use {@link DateLibOptions} instead.
*/
export type FormatOptions = DateLibOptions;
/**
* @ignore
* @deprecated Use {@link DateLibOptions} instead.
*/
export type LabelOptions = DateLibOptions;
/**
* The options for the `DateLib` class.
*
* Extends `date-fns` [format](https://date-fns.org/docs/format),
* [startOfWeek](https://date-fns.org/docs/startOfWeek) and
* [endOfWeek](https://date-fns.org/docs/endOfWeek) options.
*
* @since 9.2.0
*/
export interface DateLibOptions extends DateFnsFormatOptions, StartOfWeekOptions, EndOfWeekOptions {
/** A constructor for the `Date` object. */
Date?: typeof Date;
/** A locale to use for formatting dates. */
locale?: Locale;
/**
* A time zone to use for dates.
*
* @since 9.5.0
*/
timeZone?: string;
/**
* The numbering system to use for formatting numbers.
*
* @since 9.5.0
*/
numerals?: Numerals;
}
/**
* A wrapper class around [date-fns](http://date-fns.org) that provides utility
* methods for date manipulation and formatting.
*
* @since 9.2.0
* @example
* const dateLib = new DateLib({ locale: es });
* const newDate = dateLib.addDays(new Date(), 5);
*/
export declare class DateLib {
/** The options for configuring the date library. */
readonly options: DateLibOptions;
/** Overrides for the default date library functions. */
readonly overrides?: Partial<typeof DateLib.prototype>;
/**
* Creates an instance of `DateLib`.
*
* @param options Configuration options for the date library.
* @param overrides Custom overrides for the date library functions.
*/
constructor(options?: DateLibOptions, overrides?: Partial<typeof DateLib.prototype>);
/**
* Generates a mapping of Arabic digits (0-9) to the target numbering system
* digits.
*
* @since 9.5.0
* @returns A record mapping Arabic digits to the target numerals.
*/
private getDigitMap;
/**
* Replaces Arabic digits in a string with the target numbering system digits.
*
* @since 9.5.0
* @param input The string containing Arabic digits.
* @returns The string with digits replaced.
*/
private replaceDigits;
/**
* Formats a number using the configured numbering system.
*
* @since 9.5.0
* @param value The number to format.
* @returns The formatted number as a string.
*/
formatNumber(value: number | string): string;
/**
* Reference to the built-in Date constructor.
*
* @deprecated Use `newDate()` or `today()`.
*/
Date: typeof Date;
/**
* Creates a new `Date` object representing today's date.
*
* @since 9.5.0
* @returns A `Date` object for today's date.
*/
today: () => Date;
/**
* Creates a new `Date` object with the specified year, month, and day.
*
* @since 9.5.0
* @param year The year.
* @param monthIndex The month (0-11).
* @param date The day of the month.
* @returns A new `Date` object.
*/
newDate: (year: number, monthIndex: number, date: number) => Date;
/**
* Adds the specified number of days to the given date.
*
* @param date The date to add days to.
* @param amount The number of days to add.
* @returns The new date with the days added.
*/
addDays: (date: Date, amount: number) => Date;
/**
* Adds the specified number of months to the given date.
*
* @param date The date to add months to.
* @param amount The number of months to add.
* @returns The new date with the months added.
*/
addMonths: (date: Date, amount: number) => Date;
/**
* Adds the specified number of weeks to the given date.
*
* @param date The date to add weeks to.
* @param amount The number of weeks to add.
* @returns The new date with the weeks added.
*/
addWeeks: (date: Date, amount: number) => Date;
/**
* Adds the specified number of years to the given date.
*
* @param date The date to add years to.
* @param amount The number of years to add.
* @returns The new date with the years added.
*/
addYears: (date: Date, amount: number) => Date;
/**
* Returns the number of calendar days between the given dates.
*
* @param dateLeft The later date.
* @param dateRight The earlier date.
* @returns The number of calendar days between the dates.
*/
differenceInCalendarDays: (dateLeft: Date, dateRight: Date) => number;
/**
* Returns the number of calendar months between the given dates.
*
* @param dateLeft The later date.
* @param dateRight The earlier date.
* @returns The number of calendar months between the dates.
*/
differenceInCalendarMonths: (dateLeft: Date, dateRight: Date) => number;
/**
* Returns the months between the given dates.
*
* @param interval The interval to get the months for.
*/
eachMonthOfInterval: (interval: Interval) => Date[];
/**
* Returns the end of the broadcast week for the given date.
*
* @param date The original date.
* @returns The end of the broadcast week.
*/
endOfBroadcastWeek: (date: Date) => Date;
/**
* Returns the end of the ISO week for the given date.
*
* @param date The original date.
* @returns The end of the ISO week.
*/
endOfISOWeek: (date: Date) => Date;
/**
* Returns the end of the month for the given date.
*
* @param date The original date.
* @returns The end of the month.
*/
endOfMonth: (date: Date) => Date;
/**
* Returns the end of the week for the given date.
*
* @param date The original date.
* @returns The end of the week.
*/
endOfWeek: (date: Date, options?: EndOfWeekOptions<Date>) => Date;
/**
* Returns the end of the year for the given date.
*
* @param date The original date.
* @returns The end of the year.
*/
endOfYear: (date: Date) => Date;
/**
* Formats the given date using the specified format string.
*
* @param date The date to format.
* @param formatStr The format string.
* @returns The formatted date string.
*/
format: (date: Date, formatStr: string, options?: DateFnsFormatOptions) => string;
/**
* Returns the ISO week number for the given date.
*
* @param date The date to get the ISO week number for.
* @returns The ISO week number.
*/
getISOWeek: (date: Date) => number;
/**
* Returns the month of the given date.
*
* @param date The date to get the month for.
* @returns The month.
*/
getMonth: (date: Date, options?: GetMonthOptions) => number;
/**
* Returns the year of the given date.
*
* @param date The date to get the year for.
* @returns The year.
*/
getYear: (date: Date, options?: GetYearOptions) => number;
/**
* Returns the local week number for the given date.
*
* @param date The date to get the week number for.
* @returns The week number.
*/
getWeek: (date: Date, options?: GetWeekOptions) => number;
/**
* Checks if the first date is after the second date.
*
* @param date The date to compare.
* @param dateToCompare The date to compare with.
* @returns True if the first date is after the second date.
*/
isAfter: (date: Date, dateToCompare: Date) => boolean;
/**
* Checks if the first date is before the second date.
*
* @param date The date to compare.
* @param dateToCompare The date to compare with.
* @returns True if the first date is before the second date.
*/
isBefore: (date: Date, dateToCompare: Date) => boolean;
/**
* Checks if the given value is a Date object.
*
* @param value The value to check.
* @returns True if the value is a Date object.
*/
isDate: (value: unknown) => value is Date;
/**
* Checks if the given dates are on the same day.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are on the same day.
*/
isSameDay: (dateLeft: Date, dateRight: Date) => boolean;
/**
* Checks if the given dates are in the same month.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are in the same month.
*/
isSameMonth: (dateLeft: Date, dateRight: Date) => boolean;
/**
* Checks if the given dates are in the same year.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are in the same year.
*/
isSameYear: (dateLeft: Date, dateRight: Date) => boolean;
/**
* Returns the latest date in the given array of dates.
*
* @param dates The array of dates to compare.
* @returns The latest date.
*/
max: (dates: Date[]) => Date;
/**
* Returns the earliest date in the given array of dates.
*
* @param dates The array of dates to compare.
* @returns The earliest date.
*/
min: (dates: Date[]) => Date;
/**
* Sets the month of the given date.
*
* @param date The date to set the month on.
* @param month The month to set (0-11).
* @returns The new date with the month set.
*/
setMonth: (date: Date, month: number) => Date;
/**
* Sets the year of the given date.
*
* @param date The date to set the year on.
* @param year The year to set.
* @returns The new date with the year set.
*/
setYear: (date: Date, year: number) => Date;
/**
* Returns the start of the broadcast week for the given date.
*
* @param date The original date.
* @returns The start of the broadcast week.
*/
startOfBroadcastWeek: (date: Date, dateLib: DateLib) => Date;
/**
* Returns the start of the day for the given date.
*
* @param date The original date.
* @returns The start of the day.
*/
startOfDay: (date: Date) => Date;
/**
* Returns the start of the ISO week for the given date.
*
* @param date The original date.
* @returns The start of the ISO week.
*/
startOfISOWeek: (date: Date) => Date;
/**
* Returns the start of the month for the given date.
*
* @param date The original date.
* @returns The start of the month.
*/
startOfMonth: (date: Date) => Date;
/**
* Returns the start of the week for the given date.
*
* @param date The original date.
* @returns The start of the week.
*/
startOfWeek: (date: Date, options?: StartOfWeekOptions) => Date;
/**
* Returns the start of the year for the given date.
*
* @param date The original date.
* @returns The start of the year.
*/
startOfYear: (date: Date) => Date;
}
/** The default locale (English). */
export { enUS as defaultLocale } from "date-fns/locale/en-US";
/**
* The default date library with English locale.
*
* @since 9.2.0
*/
export declare const defaultDateLib: DateLib;
/**
* @ignore
* @deprecated Use `defaultDateLib`.
*/
export declare const dateLib: DateLib;
@@ -0,0 +1,501 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.dateLib = exports.defaultDateLib = exports.defaultLocale = exports.DateLib = void 0;
const tz_1 = require("@date-fns/tz");
const date_fns_1 = require("date-fns");
const en_US_1 = require("date-fns/locale/en-US");
const endOfBroadcastWeek_js_1 = require("../helpers/endOfBroadcastWeek.js");
const startOfBroadcastWeek_js_1 = require("../helpers/startOfBroadcastWeek.js");
/**
* A wrapper class around [date-fns](http://date-fns.org) that provides utility
* methods for date manipulation and formatting.
*
* @since 9.2.0
* @example
* const dateLib = new DateLib({ locale: es });
* const newDate = dateLib.addDays(new Date(), 5);
*/
class DateLib {
/**
* Creates an instance of `DateLib`.
*
* @param options Configuration options for the date library.
* @param overrides Custom overrides for the date library functions.
*/
constructor(options, overrides) {
/**
* Reference to the built-in Date constructor.
*
* @deprecated Use `newDate()` or `today()`.
*/
this.Date = Date;
/**
* Creates a new `Date` object representing today's date.
*
* @since 9.5.0
* @returns A `Date` object for today's date.
*/
this.today = () => {
if (this.overrides?.today) {
return this.overrides.today();
}
if (this.options.timeZone) {
return tz_1.TZDate.tz(this.options.timeZone);
}
return new this.Date();
};
/**
* Creates a new `Date` object with the specified year, month, and day.
*
* @since 9.5.0
* @param year The year.
* @param monthIndex The month (0-11).
* @param date The day of the month.
* @returns A new `Date` object.
*/
this.newDate = (year, monthIndex, date) => {
if (this.overrides?.newDate) {
return this.overrides.newDate(year, monthIndex, date);
}
if (this.options.timeZone) {
return new tz_1.TZDate(year, monthIndex, date, this.options.timeZone);
}
return new Date(year, monthIndex, date);
};
/**
* Adds the specified number of days to the given date.
*
* @param date The date to add days to.
* @param amount The number of days to add.
* @returns The new date with the days added.
*/
this.addDays = (date, amount) => {
return this.overrides?.addDays
? this.overrides.addDays(date, amount)
: (0, date_fns_1.addDays)(date, amount);
};
/**
* Adds the specified number of months to the given date.
*
* @param date The date to add months to.
* @param amount The number of months to add.
* @returns The new date with the months added.
*/
this.addMonths = (date, amount) => {
return this.overrides?.addMonths
? this.overrides.addMonths(date, amount)
: (0, date_fns_1.addMonths)(date, amount);
};
/**
* Adds the specified number of weeks to the given date.
*
* @param date The date to add weeks to.
* @param amount The number of weeks to add.
* @returns The new date with the weeks added.
*/
this.addWeeks = (date, amount) => {
return this.overrides?.addWeeks
? this.overrides.addWeeks(date, amount)
: (0, date_fns_1.addWeeks)(date, amount);
};
/**
* Adds the specified number of years to the given date.
*
* @param date The date to add years to.
* @param amount The number of years to add.
* @returns The new date with the years added.
*/
this.addYears = (date, amount) => {
return this.overrides?.addYears
? this.overrides.addYears(date, amount)
: (0, date_fns_1.addYears)(date, amount);
};
/**
* Returns the number of calendar days between the given dates.
*
* @param dateLeft The later date.
* @param dateRight The earlier date.
* @returns The number of calendar days between the dates.
*/
this.differenceInCalendarDays = (dateLeft, dateRight) => {
return this.overrides?.differenceInCalendarDays
? this.overrides.differenceInCalendarDays(dateLeft, dateRight)
: (0, date_fns_1.differenceInCalendarDays)(dateLeft, dateRight);
};
/**
* Returns the number of calendar months between the given dates.
*
* @param dateLeft The later date.
* @param dateRight The earlier date.
* @returns The number of calendar months between the dates.
*/
this.differenceInCalendarMonths = (dateLeft, dateRight) => {
return this.overrides?.differenceInCalendarMonths
? this.overrides.differenceInCalendarMonths(dateLeft, dateRight)
: (0, date_fns_1.differenceInCalendarMonths)(dateLeft, dateRight);
};
/**
* Returns the months between the given dates.
*
* @param interval The interval to get the months for.
*/
this.eachMonthOfInterval = (interval) => {
return this.overrides?.eachMonthOfInterval
? this.overrides.eachMonthOfInterval(interval)
: (0, date_fns_1.eachMonthOfInterval)(interval);
};
/**
* Returns the end of the broadcast week for the given date.
*
* @param date The original date.
* @returns The end of the broadcast week.
*/
this.endOfBroadcastWeek = (date) => {
return this.overrides?.endOfBroadcastWeek
? this.overrides.endOfBroadcastWeek(date)
: (0, endOfBroadcastWeek_js_1.endOfBroadcastWeek)(date, this);
};
/**
* Returns the end of the ISO week for the given date.
*
* @param date The original date.
* @returns The end of the ISO week.
*/
this.endOfISOWeek = (date) => {
return this.overrides?.endOfISOWeek
? this.overrides.endOfISOWeek(date)
: (0, date_fns_1.endOfISOWeek)(date);
};
/**
* Returns the end of the month for the given date.
*
* @param date The original date.
* @returns The end of the month.
*/
this.endOfMonth = (date) => {
return this.overrides?.endOfMonth
? this.overrides.endOfMonth(date)
: (0, date_fns_1.endOfMonth)(date);
};
/**
* Returns the end of the week for the given date.
*
* @param date The original date.
* @returns The end of the week.
*/
this.endOfWeek = (date, options) => {
return this.overrides?.endOfWeek
? this.overrides.endOfWeek(date, options)
: (0, date_fns_1.endOfWeek)(date, this.options);
};
/**
* Returns the end of the year for the given date.
*
* @param date The original date.
* @returns The end of the year.
*/
this.endOfYear = (date) => {
return this.overrides?.endOfYear
? this.overrides.endOfYear(date)
: (0, date_fns_1.endOfYear)(date);
};
/**
* Formats the given date using the specified format string.
*
* @param date The date to format.
* @param formatStr The format string.
* @returns The formatted date string.
*/
this.format = (date, formatStr, options) => {
const formatted = this.overrides?.format
? this.overrides.format(date, formatStr, this.options)
: (0, date_fns_1.format)(date, formatStr, this.options);
if (this.options.numerals && this.options.numerals !== "latn") {
return this.replaceDigits(formatted);
}
return formatted;
};
/**
* Returns the ISO week number for the given date.
*
* @param date The date to get the ISO week number for.
* @returns The ISO week number.
*/
this.getISOWeek = (date) => {
return this.overrides?.getISOWeek
? this.overrides.getISOWeek(date)
: (0, date_fns_1.getISOWeek)(date);
};
/**
* Returns the month of the given date.
*
* @param date The date to get the month for.
* @returns The month.
*/
this.getMonth = (date, options) => {
return this.overrides?.getMonth
? this.overrides.getMonth(date, this.options)
: (0, date_fns_1.getMonth)(date, this.options);
};
/**
* Returns the year of the given date.
*
* @param date The date to get the year for.
* @returns The year.
*/
this.getYear = (date, options) => {
return this.overrides?.getYear
? this.overrides.getYear(date, this.options)
: (0, date_fns_1.getYear)(date, this.options);
};
/**
* Returns the local week number for the given date.
*
* @param date The date to get the week number for.
* @returns The week number.
*/
this.getWeek = (date, options) => {
return this.overrides?.getWeek
? this.overrides.getWeek(date, this.options)
: (0, date_fns_1.getWeek)(date, this.options);
};
/**
* Checks if the first date is after the second date.
*
* @param date The date to compare.
* @param dateToCompare The date to compare with.
* @returns True if the first date is after the second date.
*/
this.isAfter = (date, dateToCompare) => {
return this.overrides?.isAfter
? this.overrides.isAfter(date, dateToCompare)
: (0, date_fns_1.isAfter)(date, dateToCompare);
};
/**
* Checks if the first date is before the second date.
*
* @param date The date to compare.
* @param dateToCompare The date to compare with.
* @returns True if the first date is before the second date.
*/
this.isBefore = (date, dateToCompare) => {
return this.overrides?.isBefore
? this.overrides.isBefore(date, dateToCompare)
: (0, date_fns_1.isBefore)(date, dateToCompare);
};
/**
* Checks if the given value is a Date object.
*
* @param value The value to check.
* @returns True if the value is a Date object.
*/
this.isDate = (value) => {
return this.overrides?.isDate
? this.overrides.isDate(value)
: (0, date_fns_1.isDate)(value);
};
/**
* Checks if the given dates are on the same day.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are on the same day.
*/
this.isSameDay = (dateLeft, dateRight) => {
return this.overrides?.isSameDay
? this.overrides.isSameDay(dateLeft, dateRight)
: (0, date_fns_1.isSameDay)(dateLeft, dateRight);
};
/**
* Checks if the given dates are in the same month.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are in the same month.
*/
this.isSameMonth = (dateLeft, dateRight) => {
return this.overrides?.isSameMonth
? this.overrides.isSameMonth(dateLeft, dateRight)
: (0, date_fns_1.isSameMonth)(dateLeft, dateRight);
};
/**
* Checks if the given dates are in the same year.
*
* @param dateLeft The first date to compare.
* @param dateRight The second date to compare.
* @returns True if the dates are in the same year.
*/
this.isSameYear = (dateLeft, dateRight) => {
return this.overrides?.isSameYear
? this.overrides.isSameYear(dateLeft, dateRight)
: (0, date_fns_1.isSameYear)(dateLeft, dateRight);
};
/**
* Returns the latest date in the given array of dates.
*
* @param dates The array of dates to compare.
* @returns The latest date.
*/
this.max = (dates) => {
return this.overrides?.max ? this.overrides.max(dates) : (0, date_fns_1.max)(dates);
};
/**
* Returns the earliest date in the given array of dates.
*
* @param dates The array of dates to compare.
* @returns The earliest date.
*/
this.min = (dates) => {
return this.overrides?.min ? this.overrides.min(dates) : (0, date_fns_1.min)(dates);
};
/**
* Sets the month of the given date.
*
* @param date The date to set the month on.
* @param month The month to set (0-11).
* @returns The new date with the month set.
*/
this.setMonth = (date, month) => {
return this.overrides?.setMonth
? this.overrides.setMonth(date, month)
: (0, date_fns_1.setMonth)(date, month);
};
/**
* Sets the year of the given date.
*
* @param date The date to set the year on.
* @param year The year to set.
* @returns The new date with the year set.
*/
this.setYear = (date, year) => {
return this.overrides?.setYear
? this.overrides.setYear(date, year)
: (0, date_fns_1.setYear)(date, year);
};
/**
* Returns the start of the broadcast week for the given date.
*
* @param date The original date.
* @returns The start of the broadcast week.
*/
this.startOfBroadcastWeek = (date, dateLib) => {
return this.overrides?.startOfBroadcastWeek
? this.overrides.startOfBroadcastWeek(date, this)
: (0, startOfBroadcastWeek_js_1.startOfBroadcastWeek)(date, this);
};
/**
* Returns the start of the day for the given date.
*
* @param date The original date.
* @returns The start of the day.
*/
this.startOfDay = (date) => {
return this.overrides?.startOfDay
? this.overrides.startOfDay(date)
: (0, date_fns_1.startOfDay)(date);
};
/**
* Returns the start of the ISO week for the given date.
*
* @param date The original date.
* @returns The start of the ISO week.
*/
this.startOfISOWeek = (date) => {
return this.overrides?.startOfISOWeek
? this.overrides.startOfISOWeek(date)
: (0, date_fns_1.startOfISOWeek)(date);
};
/**
* Returns the start of the month for the given date.
*
* @param date The original date.
* @returns The start of the month.
*/
this.startOfMonth = (date) => {
return this.overrides?.startOfMonth
? this.overrides.startOfMonth(date)
: (0, date_fns_1.startOfMonth)(date);
};
/**
* Returns the start of the week for the given date.
*
* @param date The original date.
* @returns The start of the week.
*/
this.startOfWeek = (date, options) => {
return this.overrides?.startOfWeek
? this.overrides.startOfWeek(date, this.options)
: (0, date_fns_1.startOfWeek)(date, this.options);
};
/**
* Returns the start of the year for the given date.
*
* @param date The original date.
* @returns The start of the year.
*/
this.startOfYear = (date) => {
return this.overrides?.startOfYear
? this.overrides.startOfYear(date)
: (0, date_fns_1.startOfYear)(date);
};
this.options = { locale: en_US_1.enUS, ...options };
this.overrides = overrides;
}
/**
* Generates a mapping of Arabic digits (0-9) to the target numbering system
* digits.
*
* @since 9.5.0
* @returns A record mapping Arabic digits to the target numerals.
*/
getDigitMap() {
const { numerals = "latn" } = this.options;
// Use Intl.NumberFormat to create a formatter with the specified numbering system
const formatter = new Intl.NumberFormat("en-US", {
numberingSystem: numerals
});
// Map Arabic digits (0-9) to the target numerals
const digitMap = {};
for (let i = 0; i < 10; i++) {
digitMap[i.toString()] = formatter.format(i);
}
return digitMap;
}
/**
* Replaces Arabic digits in a string with the target numbering system digits.
*
* @since 9.5.0
* @param input The string containing Arabic digits.
* @returns The string with digits replaced.
*/
replaceDigits(input) {
const digitMap = this.getDigitMap();
return input.replace(/\d/g, (digit) => digitMap[digit] || digit);
}
/**
* Formats a number using the configured numbering system.
*
* @since 9.5.0
* @param value The number to format.
* @returns The formatted number as a string.
*/
formatNumber(value) {
return this.replaceDigits(value.toString());
}
}
exports.DateLib = DateLib;
/** The default locale (English). */
var en_US_2 = require("date-fns/locale/en-US");
Object.defineProperty(exports, "defaultLocale", { enumerable: true, get: function () { return en_US_2.enUS; } });
/**
* The default date library with English locale.
*
* @since 9.2.0
*/
exports.defaultDateLib = new DateLib();
/**
* @ignore
* @deprecated Use `defaultDateLib`.
*/
exports.dateLib = exports.defaultDateLib;
//# sourceMappingURL=DateLib.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,4 @@
export * from "./CalendarDay.js";
export * from "./CalendarMonth.js";
export * from "./CalendarWeek.js";
export * from "./DateLib.js";
@@ -0,0 +1,21 @@
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __exportStar = (this && this.__exportStar) || function(m, exports) {
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
};
Object.defineProperty(exports, "__esModule", { value: true });
__exportStar(require("./CalendarDay.js"), exports);
__exportStar(require("./CalendarMonth.js"), exports);
__exportStar(require("./CalendarWeek.js"), exports);
__exportStar(require("./DateLib.js"), exports);
//# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/classes/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mDAAiC;AACjC,qDAAmC;AACnC,oDAAkC;AAClC,+CAA6B"}
@@ -0,0 +1,9 @@
import React, { type ButtonHTMLAttributes } from "react";
/**
* Render the button elements in the calendar.
*
* @private
* @deprecated Use `PreviousMonthButton` or `@link NextMonthButton` instead.
*/
export declare function Button(props: ButtonHTMLAttributes<HTMLButtonElement>): React.JSX.Element;
export type ButtonProps = Parameters<typeof Button>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Button = Button;
const react_1 = __importDefault(require("react"));
/**
* Render the button elements in the calendar.
*
* @private
* @deprecated Use `PreviousMonthButton` or `@link NextMonthButton` instead.
*/
function Button(props) {
return react_1.default.createElement("button", { ...props });
}
//# sourceMappingURL=Button.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button.tsx"],"names":[],"mappings":";;;;;AAQA,wBAEC;AAVD,kDAAyD;AAEzD;;;;;GAKG;AACH,SAAgB,MAAM,CAAC,KAA8C;IACnE,OAAO,6CAAY,KAAK,GAAI,CAAC;AAC/B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render the label in the month caption.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function CaptionLabel(props: HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
export type CaptionLabelProps = Parameters<typeof CaptionLabel>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.CaptionLabel = CaptionLabel;
const react_1 = __importDefault(require("react"));
/**
* Render the label in the month caption.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function CaptionLabel(props) {
return react_1.default.createElement("span", { ...props });
}
//# sourceMappingURL=CaptionLabel.js.map
@@ -0,0 +1 @@
{"version":3,"file":"CaptionLabel.js","sourceRoot":"","sources":["../../../src/components/CaptionLabel.tsx"],"names":[],"mappings":";;;;;AAQA,oCAEC;AAVD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,YAAY,CAAC,KAAsC;IACjE,OAAO,2CAAU,KAAK,GAAI,CAAC;AAC7B,CAAC"}
@@ -0,0 +1,21 @@
import React from "react";
/**
* Render the chevron icon used in the navigation buttons and dropdowns.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Chevron(props: {
className?: string;
/**
* The size of the chevron.
*
* @defaultValue 24
*/
size?: number;
/** Set to `true` to disable the chevron. */
disabled?: boolean;
/** The orientation of the chevron. */
orientation?: "up" | "down" | "left" | "right";
}): React.JSX.Element;
export type ChevronProps = Parameters<typeof Chevron>[0];
@@ -0,0 +1,22 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Chevron = Chevron;
const react_1 = __importDefault(require("react"));
/**
* Render the chevron icon used in the navigation buttons and dropdowns.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Chevron(props) {
const { size = 24, orientation = "left", className } = props;
return (react_1.default.createElement("svg", { className: className, width: size, height: size, viewBox: "0 0 24 24" },
orientation === "up" && (react_1.default.createElement("polygon", { points: "6.77 17 12.5 11.43 18.24 17 20 15.28 12.5 8 5 15.28" })),
orientation === "down" && (react_1.default.createElement("polygon", { points: "6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72" })),
orientation === "left" && (react_1.default.createElement("polygon", { points: "16 18.112 9.81111111 12 16 5.87733333 14.0888889 4 6 12 14.0888889 20" })),
orientation === "right" && (react_1.default.createElement("polygon", { points: "8 18.112 14.18888889 12 8 5.87733333 9.91111111 4 18 12 9.91111111 20" }))));
}
//# sourceMappingURL=Chevron.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Chevron.js","sourceRoot":"","sources":["../../../src/components/Chevron.tsx"],"names":[],"mappings":";;;;;AAQA,0BA+BC;AAvCD,kDAA0B;AAE1B;;;;;GAKG;AACH,SAAgB,OAAO,CAAC,KAYvB;IACC,MAAM,EAAE,IAAI,GAAG,EAAE,EAAE,WAAW,GAAG,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAE7D,OAAO,CACL,uCAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAC,WAAW;QACtE,WAAW,KAAK,IAAI,IAAI,CACvB,2CAAS,MAAM,EAAC,qDAAqD,GAAG,CACzE;QACA,WAAW,KAAK,MAAM,IAAI,CACzB,2CAAS,MAAM,EAAC,kDAAkD,GAAG,CACtE;QACA,WAAW,KAAK,MAAM,IAAI,CACzB,2CAAS,MAAM,EAAC,uEAAuE,GAAG,CAC3F;QACA,WAAW,KAAK,OAAO,IAAI,CAC1B,2CAAS,MAAM,EAAC,uEAAuE,GAAG,CAC3F,CACG,CACP,CAAC;AACJ,CAAC"}
@@ -0,0 +1,20 @@
import React, { type HTMLAttributes } from "react";
import type { CalendarDay } from "../classes/index.js";
import type { Modifiers } from "../types/index.js";
/**
* Render a grid cell for a specific day in the calendar.
*
* Handles interaction and focus for the day. If you only need to change the
* content of the day cell, consider swapping the `DayButton` component
* instead.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Day(props: {
/** The day to render. */
day: CalendarDay;
/** The modifiers to apply to the day. */
modifiers: Modifiers;
} & HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type DayProps = Parameters<typeof Day>[0];
@@ -0,0 +1,22 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Day = Day;
const react_1 = __importDefault(require("react"));
/**
* Render a grid cell for a specific day in the calendar.
*
* Handles interaction and focus for the day. If you only need to change the
* content of the day cell, consider swapping the `DayButton` component
* instead.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Day(props) {
const { day, modifiers, ...tdProps } = props;
return react_1.default.createElement("td", { ...tdProps });
}
//# sourceMappingURL=Day.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Day.js","sourceRoot":"","sources":["../../../src/components/Day.tsx"],"names":[],"mappings":";;;;;AAeA,kBAUC;AAzBD,kDAAmD;AAKnD;;;;;;;;;GASG;AACH,SAAgB,GAAG,CACjB,KAKkC;IAElC,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,OAAO,EAAE,GAAG,KAAK,CAAC;IAC7C,OAAO,yCAAQ,OAAO,GAAI,CAAC;AAC7B,CAAC"}
@@ -0,0 +1,16 @@
import React, { type ButtonHTMLAttributes } from "react";
import type { CalendarDay } from "../classes/index.js";
import type { Modifiers } from "../types/index.js";
/**
* Render a button for a specific day in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function DayButton(props: {
/** The day to render. */
day: CalendarDay;
/** The modifiers to apply to the day. */
modifiers: Modifiers;
} & ButtonHTMLAttributes<HTMLButtonElement>): React.JSX.Element;
export type DayButtonProps = Parameters<typeof DayButton>[0];
@@ -0,0 +1,23 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.DayButton = DayButton;
const react_1 = __importDefault(require("react"));
/**
* Render a button for a specific day in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function DayButton(props) {
const { day, modifiers, ...buttonProps } = props;
const ref = react_1.default.useRef(null);
react_1.default.useEffect(() => {
if (modifiers.focused)
ref.current?.focus();
}, [modifiers.focused]);
return react_1.default.createElement("button", { ref: ref, ...buttonProps });
}
//# sourceMappingURL=DayButton.js.map
@@ -0,0 +1 @@
{"version":3,"file":"DayButton.js","sourceRoot":"","sources":["../../../src/components/DayButton.tsx"],"names":[],"mappings":";;;;;AAWA,8BAeC;AA1BD,kDAAyD;AAKzD;;;;;GAKG;AACH,SAAgB,SAAS,CACvB,KAK2C;IAE3C,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAEjD,MAAM,GAAG,GAAG,eAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IAClD,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,SAAS,CAAC,OAAO;YAAE,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC9C,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;IACxB,OAAO,0CAAQ,GAAG,EAAE,GAAG,KAAM,WAAW,GAAI,CAAC;AAC/C,CAAC"}
@@ -0,0 +1,32 @@
import React, { type SelectHTMLAttributes } from "react";
import type { ClassNames, CustomComponents } from "../types/index.js";
/** An option to use in the dropdown. Maps to the `<option>` HTML element. */
export type DropdownOption = {
/** The value of the option. */
value: number;
/** The label of the option. */
label: string;
/** Whether the dropdown option is disabled (e.g., out of the calendar range). */
disabled: boolean;
};
/**
* Render a dropdown component for navigation in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Dropdown(props: {
/**
* @deprecated Use {@link useDayPicker} hook to get the list of internal
* components.
*/
components: CustomComponents;
/**
* @deprecated Use {@link useDayPicker} hook to get the list of internal
* class names.
*/
classNames: ClassNames;
/** The options to display in the dropdown. */
options?: DropdownOption[] | undefined;
} & Omit<SelectHTMLAttributes<HTMLSelectElement>, "children">): React.JSX.Element;
export type DropdownProps = Parameters<typeof Dropdown>[0];
@@ -0,0 +1,25 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Dropdown = Dropdown;
const react_1 = __importDefault(require("react"));
const UI_js_1 = require("../UI.js");
/**
* Render a dropdown component for navigation in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Dropdown(props) {
const { options, className, components, classNames, ...selectProps } = props;
const cssClassSelect = [classNames[UI_js_1.UI.Dropdown], className].join(" ");
const selectedOption = options?.find(({ value }) => value === selectProps.value);
return (react_1.default.createElement("span", { "data-disabled": selectProps.disabled, className: classNames[UI_js_1.UI.DropdownRoot] },
react_1.default.createElement(components.Select, { className: cssClassSelect, ...selectProps }, options?.map(({ value, label, disabled }) => (react_1.default.createElement(components.Option, { key: value, value: value, disabled: disabled }, label)))),
react_1.default.createElement("span", { className: classNames[UI_js_1.UI.CaptionLabel], "aria-hidden": true },
selectedOption?.label,
react_1.default.createElement(components.Chevron, { orientation: "down", size: 18, className: classNames[UI_js_1.UI.Chevron] }))));
}
//# sourceMappingURL=Dropdown.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../src/components/Dropdown.tsx"],"names":[],"mappings":";;;;;AAqBA,4BA6CC;AAlED,kDAAyD;AAEzD,oCAA8B;AAa9B;;;;;GAKG;AACH,SAAgB,QAAQ,CACtB,KAa6D;IAE7D,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAE7E,MAAM,cAAc,GAAG,CAAC,UAAU,CAAC,UAAE,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEtE,MAAM,cAAc,GAAG,OAAO,EAAE,IAAI,CAClC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,KAAK,WAAW,CAAC,KAAK,CAC3C,CAAC;IACF,OAAO,CACL,yDACiB,WAAW,CAAC,QAAQ,EACnC,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,YAAY,CAAC;QAEtC,8BAAC,UAAU,CAAC,MAAM,IAAC,SAAS,EAAE,cAAc,KAAM,WAAW,IAC1D,OAAO,EAAE,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAC5C,8BAAC,UAAU,CAAC,MAAM,IAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,IAC5D,KAAK,CACY,CACrB,CAAC,CACgB;QACpB,wCAAM,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,YAAY,CAAC;YACzC,cAAc,EAAE,KAAK;YACtB,8BAAC,UAAU,CAAC,OAAO,IACjB,WAAW,EAAC,MAAM,EAClB,IAAI,EAAE,EAAE,EACR,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,OAAO,CAAC,GACjC,CACG,CACF,CACR,CAAC;AACJ,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render the navigation dropdowns for the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function DropdownNav(props: HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type DropdownNavProps = Parameters<typeof DropdownNav>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.DropdownNav = DropdownNav;
const react_1 = __importDefault(require("react"));
/**
* Render the navigation dropdowns for the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function DropdownNav(props) {
return react_1.default.createElement("div", { ...props });
}
//# sourceMappingURL=DropdownNav.js.map
@@ -0,0 +1 @@
{"version":3,"file":"DropdownNav.js","sourceRoot":"","sources":["../../../src/components/DropdownNav.tsx"],"names":[],"mappings":";;;;;AAQA,kCAEC;AAVD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,WAAW,CAAC,KAAqC;IAC/D,OAAO,0CAAS,KAAK,GAAI,CAAC;AAC5B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render the footer of the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Footer(props: HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type FooterProps = Parameters<typeof Footer>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Footer = Footer;
const react_1 = __importDefault(require("react"));
/**
* Render the footer of the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Footer(props) {
return react_1.default.createElement("div", { ...props });
}
//# sourceMappingURL=Footer.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Footer.js","sourceRoot":"","sources":["../../../src/components/Footer.tsx"],"names":[],"mappings":";;;;;AAQA,wBAEC;AAVD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,MAAM,CAAC,KAAqC;IAC1D,OAAO,0CAAS,KAAK,GAAI,CAAC;AAC5B,CAAC"}
@@ -0,0 +1,16 @@
import React, { type HTMLAttributes } from "react";
import type { CalendarMonth } from "../classes/CalendarMonth.js";
/**
* Render the grid with the weekday header row and the weeks for a specific
* month.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Month(props: {
/** The month to display in the grid. */
calendarMonth: CalendarMonth;
/** The index of the month being displayed. */
displayIndex: number;
} & HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type MonthProps = Parameters<typeof Month>[0];
@@ -0,0 +1,19 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Month = Month;
const react_1 = __importDefault(require("react"));
/**
* Render the grid with the weekday header row and the weeks for a specific
* month.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Month(props) {
const { calendarMonth, displayIndex, ...divProps } = props;
return react_1.default.createElement("div", { ...divProps }, props.children);
}
//# sourceMappingURL=Month.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Month.js","sourceRoot":"","sources":["../../../src/components/Month.tsx"],"names":[],"mappings":";;;;;AAWA,sBAUC;AArBD,kDAAmD;AAInD;;;;;;GAMG;AACH,SAAgB,KAAK,CACnB,KAKkC;IAElC,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3D,OAAO,0CAAS,QAAQ,IAAG,KAAK,CAAC,QAAQ,CAAO,CAAC;AACnD,CAAC"}
@@ -0,0 +1,15 @@
import React, { type HTMLAttributes } from "react";
import type { CalendarMonth } from "../classes/index.js";
/**
* Render the caption for a month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function MonthCaption(props: {
/** The month to display in the caption. */
calendarMonth: CalendarMonth;
/** The index of the month being displayed. */
displayIndex: number;
} & HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type MonthCaptionProps = Parameters<typeof MonthCaption>[0];
@@ -0,0 +1,18 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MonthCaption = MonthCaption;
const react_1 = __importDefault(require("react"));
/**
* Render the caption for a month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function MonthCaption(props) {
const { calendarMonth, displayIndex, ...divProps } = props;
return react_1.default.createElement("div", { ...divProps });
}
//# sourceMappingURL=MonthCaption.js.map
@@ -0,0 +1 @@
{"version":3,"file":"MonthCaption.js","sourceRoot":"","sources":["../../../src/components/MonthCaption.tsx"],"names":[],"mappings":";;;;;AAUA,oCAUC;AApBD,kDAAmD;AAInD;;;;;GAKG;AACH,SAAgB,YAAY,CAC1B,KAKkC;IAElC,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3D,OAAO,0CAAS,QAAQ,GAAI,CAAC;AAC/B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type TableHTMLAttributes } from "react";
/**
* Render the grid of days for a specific month.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function MonthGrid(props: TableHTMLAttributes<HTMLTableElement>): React.JSX.Element;
export type MonthGridProps = Parameters<typeof MonthGrid>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MonthGrid = MonthGrid;
const react_1 = __importDefault(require("react"));
/**
* Render the grid of days for a specific month.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function MonthGrid(props) {
return react_1.default.createElement("table", { ...props });
}
//# sourceMappingURL=MonthGrid.js.map
@@ -0,0 +1 @@
{"version":3,"file":"MonthGrid.js","sourceRoot":"","sources":["../../../src/components/MonthGrid.tsx"],"names":[],"mappings":";;;;;AAQA,8BAEC;AAVD,kDAAwD;AAExD;;;;;GAKG;AACH,SAAgB,SAAS,CAAC,KAA4C;IACpE,OAAO,4CAAW,KAAK,GAAI,CAAC;AAC9B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render a container wrapping the month grids.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Months(props: HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type MonthsProps = Parameters<typeof Months>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Months = Months;
const react_1 = __importDefault(require("react"));
/**
* Render a container wrapping the month grids.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Months(props) {
return react_1.default.createElement("div", { ...props });
}
//# sourceMappingURL=Months.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Months.js","sourceRoot":"","sources":["../../../src/components/Months.tsx"],"names":[],"mappings":";;;;;AAQA,wBAEC;AAVD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,MAAM,CAAC,KAAqC;IAC1D,OAAO,0CAAS,KAAK,GAAI,CAAC;AAC5B,CAAC"}
@@ -0,0 +1,9 @@
import React from "react";
import { DropdownProps } from "./Dropdown.js";
/**
* Render a dropdown to navigate between months in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function MonthsDropdown(props: DropdownProps): React.JSX.Element;
@@ -0,0 +1,19 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MonthsDropdown = MonthsDropdown;
const react_1 = __importDefault(require("react"));
const useDayPicker_js_1 = require("../useDayPicker.js");
/**
* Render a dropdown to navigate between months in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function MonthsDropdown(props) {
const { components } = (0, useDayPicker_js_1.useDayPicker)();
return react_1.default.createElement(components.Dropdown, { ...props });
}
//# sourceMappingURL=MonthsDropdown.js.map
@@ -0,0 +1 @@
{"version":3,"file":"MonthsDropdown.js","sourceRoot":"","sources":["../../../src/components/MonthsDropdown.tsx"],"names":[],"mappings":";;;;;AAYA,wCAGC;AAfD,kDAA0B;AAE1B,wDAAkD;AAIlD;;;;;GAKG;AACH,SAAgB,cAAc,CAAC,KAAoB;IACjD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,8BAAY,GAAE,CAAC;IACtC,OAAO,8BAAC,UAAU,CAAC,QAAQ,OAAK,KAAK,GAAI,CAAC;AAC5C,CAAC"}
@@ -0,0 +1,18 @@
import React, { type MouseEventHandler, type HTMLAttributes } from "react";
/**
* Render the navigation toolbar with buttons to navigate between months.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Nav(props: {
/** Handler for the previous month button click. */
onPreviousClick?: MouseEventHandler<HTMLButtonElement>;
/** Handler for the next month button click. */
onNextClick?: MouseEventHandler<HTMLButtonElement>;
/** The date of the previous month, if available. */
previousMonth?: Date | undefined;
/** The date of the next month, if available. */
nextMonth?: Date | undefined;
} & HTMLAttributes<HTMLElement>): React.JSX.Element;
export type NavProps = Parameters<typeof Nav>[0];
@@ -0,0 +1,65 @@
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.Nav = Nav;
const react_1 = __importStar(require("react"));
const UI_js_1 = require("../UI.js");
const useDayPicker_js_1 = require("../useDayPicker.js");
/**
* Render the navigation toolbar with buttons to navigate between months.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Nav(props) {
const { onPreviousClick, onNextClick, previousMonth, nextMonth, ...navProps } = props;
const { components, classNames, labels: { labelPrevious, labelNext } } = (0, useDayPicker_js_1.useDayPicker)();
const handleNextClick = (0, react_1.useCallback)((e) => {
if (nextMonth) {
onNextClick?.(e);
}
}, [nextMonth, onNextClick]);
const handlePreviousClick = (0, react_1.useCallback)((e) => {
if (previousMonth) {
onPreviousClick?.(e);
}
}, [previousMonth, onPreviousClick]);
return (react_1.default.createElement("nav", { ...navProps },
react_1.default.createElement(components.PreviousMonthButton, { type: "button", className: classNames[UI_js_1.UI.PreviousMonthButton], tabIndex: previousMonth ? undefined : -1, "aria-disabled": previousMonth ? undefined : true, "aria-label": labelPrevious(previousMonth), onClick: handlePreviousClick },
react_1.default.createElement(components.Chevron, { disabled: previousMonth ? undefined : true, className: classNames[UI_js_1.UI.Chevron], orientation: "left" })),
react_1.default.createElement(components.NextMonthButton, { type: "button", className: classNames[UI_js_1.UI.NextMonthButton], tabIndex: nextMonth ? undefined : -1, "aria-disabled": nextMonth ? undefined : true, "aria-label": labelNext(nextMonth), onClick: handleNextClick },
react_1.default.createElement(components.Chevron, { disabled: nextMonth ? undefined : true, orientation: "right", className: classNames[UI_js_1.UI.Chevron] }))));
}
//# sourceMappingURL=Nav.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Nav.js","sourceRoot":"","sources":["../../../src/components/Nav.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,kBA4EC;AA3FD,+CAIe;AAEf,oCAA8B;AAC9B,wDAAkD;AAElD;;;;;GAKG;AACH,SAAgB,GAAG,CACjB,KAS+B;IAE/B,MAAM,EACJ,eAAe,EACf,WAAW,EACX,aAAa,EACb,SAAS,EACT,GAAG,QAAQ,EACZ,GAAG,KAAK,CAAC;IAEV,MAAM,EACJ,UAAU,EACV,UAAU,EACV,MAAM,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,EACrC,GAAG,IAAA,8BAAY,GAAE,CAAC;IAEnB,MAAM,eAAe,GAAG,IAAA,mBAAW,EACjC,CAAC,CAAsC,EAAE,EAAE;QACzC,IAAI,SAAS,EAAE,CAAC;YACd,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EACD,CAAC,SAAS,EAAE,WAAW,CAAC,CACzB,CAAC;IAEF,MAAM,mBAAmB,GAAG,IAAA,mBAAW,EACrC,CAAC,CAAsC,EAAE,EAAE;QACzC,IAAI,aAAa,EAAE,CAAC;YAClB,eAAe,EAAE,CAAC,CAAC,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,EACD,CAAC,aAAa,EAAE,eAAe,CAAC,CACjC,CAAC;IAEF,OAAO,CACL,0CAAS,QAAQ;QACf,8BAAC,UAAU,CAAC,mBAAmB,IAC7B,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,mBAAmB,CAAC,EAC7C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,mBACzB,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,gBACnC,aAAa,CAAC,aAAa,CAAC,EACxC,OAAO,EAAE,mBAAmB;YAE5B,8BAAC,UAAU,CAAC,OAAO,IACjB,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EAC1C,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,OAAO,CAAC,EACjC,WAAW,EAAC,MAAM,GAClB,CAC6B;QACjC,8BAAC,UAAU,CAAC,eAAe,IACzB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,eAAe,CAAC,EACzC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,mBACrB,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,gBAC/B,SAAS,CAAC,SAAS,CAAC,EAChC,OAAO,EAAE,eAAe;YAExB,8BAAC,UAAU,CAAC,OAAO,IACjB,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EACtC,WAAW,EAAC,OAAO,EACnB,SAAS,EAAE,UAAU,CAAC,UAAE,CAAC,OAAO,CAAC,GACjC,CACyB,CACzB,CACP,CAAC;AACJ,CAAC"}
@@ -0,0 +1,9 @@
import React, { type ButtonHTMLAttributes } from "react";
/**
* Render the button to navigate to the next month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function NextMonthButton(props: ButtonHTMLAttributes<HTMLButtonElement>): React.JSX.Element;
export type NextMonthButtonProps = Parameters<typeof NextMonthButton>[0];
@@ -0,0 +1,19 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.NextMonthButton = NextMonthButton;
const react_1 = __importDefault(require("react"));
const useDayPicker_js_1 = require("../useDayPicker.js");
/**
* Render the button to navigate to the next month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function NextMonthButton(props) {
const { components } = (0, useDayPicker_js_1.useDayPicker)();
return react_1.default.createElement(components.Button, { ...props });
}
//# sourceMappingURL=NextMonthButton.js.map
@@ -0,0 +1 @@
{"version":3,"file":"NextMonthButton.js","sourceRoot":"","sources":["../../../src/components/NextMonthButton.tsx"],"names":[],"mappings":";;;;;AAUA,0CAKC;AAfD,kDAAyD;AAEzD,wDAAkD;AAElD;;;;;GAKG;AACH,SAAgB,eAAe,CAC7B,KAA8C;IAE9C,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,8BAAY,GAAE,CAAC;IACtC,OAAO,8BAAC,UAAU,CAAC,MAAM,OAAK,KAAK,GAAI,CAAC;AAC1C,CAAC"}
@@ -0,0 +1,9 @@
import React, { type OptionHTMLAttributes } from "react";
/**
* Render an `option` element.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Option(props: OptionHTMLAttributes<HTMLOptionElement>): React.JSX.Element;
export type OptionProps = Parameters<typeof Option>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Option = Option;
const react_1 = __importDefault(require("react"));
/**
* Render an `option` element.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Option(props) {
return react_1.default.createElement("option", { ...props });
}
//# sourceMappingURL=Option.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Option.js","sourceRoot":"","sources":["../../../src/components/Option.tsx"],"names":[],"mappings":";;;;;AAQA,wBAEC;AAVD,kDAAyD;AAEzD;;;;;GAKG;AACH,SAAgB,MAAM,CAAC,KAA8C;IACnE,OAAO,6CAAY,KAAK,GAAI,CAAC;AAC/B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type ButtonHTMLAttributes } from "react";
/**
* Render the button to navigate to the previous month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function PreviousMonthButton(props: ButtonHTMLAttributes<HTMLButtonElement>): React.JSX.Element;
export type PreviousMonthButtonProps = Parameters<typeof PreviousMonthButton>[0];
@@ -0,0 +1,19 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PreviousMonthButton = PreviousMonthButton;
const react_1 = __importDefault(require("react"));
const useDayPicker_js_1 = require("../useDayPicker.js");
/**
* Render the button to navigate to the previous month in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function PreviousMonthButton(props) {
const { components } = (0, useDayPicker_js_1.useDayPicker)();
return react_1.default.createElement(components.Button, { ...props });
}
//# sourceMappingURL=PreviousMonthButton.js.map
@@ -0,0 +1 @@
{"version":3,"file":"PreviousMonthButton.js","sourceRoot":"","sources":["../../../src/components/PreviousMonthButton.tsx"],"names":[],"mappings":";;;;;AAUA,kDAKC;AAfD,kDAAyD;AAEzD,wDAAkD;AAElD;;;;;GAKG;AACH,SAAgB,mBAAmB,CACjC,KAA8C;IAE9C,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,8BAAY,GAAE,CAAC;IACtC,OAAO,8BAAC,UAAU,CAAC,MAAM,OAAK,KAAK,GAAI,CAAC;AAC1C,CAAC"}
@@ -0,0 +1,12 @@
import React, { type Ref, type HTMLAttributes } from "react";
/**
* Render the root element of the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Root(props: {
/** Ref for the root element, used when `animate` is `true`. */
rootRef?: Ref<HTMLDivElement>;
} & HTMLAttributes<HTMLDivElement>): React.JSX.Element;
export type RootProps = Parameters<typeof Root>[0];
@@ -0,0 +1,18 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Root = Root;
const react_1 = __importDefault(require("react"));
/**
* Render the root element of the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Root(props) {
const { rootRef, ...rest } = props;
return react_1.default.createElement("div", { ...rest, ref: rootRef });
}
//# sourceMappingURL=Root.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Root.js","sourceRoot":"","sources":["../../../src/components/Root.tsx"],"names":[],"mappings":";;;;;AAQA,oBAQC;AAhBD,kDAA6D;AAE7D;;;;;GAKG;AACH,SAAgB,IAAI,CAClB,KAGkC;IAElC,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,0CAAS,IAAI,EAAE,GAAG,EAAE,OAAO,GAAI,CAAC;AACzC,CAAC"}
@@ -0,0 +1,9 @@
import React, { type SelectHTMLAttributes } from "react";
/**
* Render a `select` element.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Select(props: SelectHTMLAttributes<HTMLSelectElement>): React.JSX.Element;
export type SelectProps = Parameters<typeof Select>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Select = Select;
const react_1 = __importDefault(require("react"));
/**
* Render a `select` element.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Select(props) {
return react_1.default.createElement("select", { ...props });
}
//# sourceMappingURL=Select.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Select.tsx"],"names":[],"mappings":";;;;;AAQA,wBAEC;AAVD,kDAAyD;AAEzD;;;;;GAKG;AACH,SAAgB,MAAM,CAAC,KAA8C;IACnE,OAAO,6CAAY,KAAK,GAAI,CAAC;AAC/B,CAAC"}
@@ -0,0 +1,13 @@
import React, { type HTMLAttributes } from "react";
import type { CalendarWeek } from "../classes/index.js";
/**
* Render a table row representing a week in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Week(props: {
/** The week to render. */
week: CalendarWeek;
} & HTMLAttributes<HTMLTableRowElement>): React.JSX.Element;
export type WeekProps = Parameters<typeof Week>[0];
@@ -0,0 +1,18 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Week = Week;
const react_1 = __importDefault(require("react"));
/**
* Render a table row representing a week in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Week(props) {
const { week, ...trProps } = props;
return react_1.default.createElement("tr", { ...trProps });
}
//# sourceMappingURL=Week.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Week.js","sourceRoot":"","sources":["../../../src/components/Week.tsx"],"names":[],"mappings":";;;;;AAUA,oBAQC;AAlBD,kDAAmD;AAInD;;;;;GAKG;AACH,SAAgB,IAAI,CAClB,KAGuC;IAEvC,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,yCAAQ,OAAO,GAAI,CAAC;AAC7B,CAAC"}
@@ -0,0 +1,13 @@
import React, { type ThHTMLAttributes } from "react";
import type { CalendarWeek } from "../classes/index.js";
/**
* Render a table cell displaying the number of the week.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function WeekNumber(props: {
/** The week to display. */
week: CalendarWeek;
} & ThHTMLAttributes<HTMLTableCellElement>): React.JSX.Element;
export type WeekNumberProps = Parameters<typeof WeekNumber>[0];
@@ -0,0 +1,18 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.WeekNumber = WeekNumber;
const react_1 = __importDefault(require("react"));
/**
* Render a table cell displaying the number of the week.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function WeekNumber(props) {
const { week, ...thProps } = props;
return react_1.default.createElement("th", { ...thProps });
}
//# sourceMappingURL=WeekNumber.js.map
@@ -0,0 +1 @@
{"version":3,"file":"WeekNumber.js","sourceRoot":"","sources":["../../../src/components/WeekNumber.tsx"],"names":[],"mappings":";;;;;AAUA,gCAQC;AAlBD,kDAAqD;AAIrD;;;;;GAKG;AACH,SAAgB,UAAU,CACxB,KAG0C;IAE1C,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,yCAAQ,OAAO,GAAI,CAAC;AAC7B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type ThHTMLAttributes } from "react";
/**
* Render the header cell for the week numbers column.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function WeekNumberHeader(props: ThHTMLAttributes<HTMLTableCellElement>): React.JSX.Element;
export type WeekNumberHeaderProps = Parameters<typeof WeekNumberHeader>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.WeekNumberHeader = WeekNumberHeader;
const react_1 = __importDefault(require("react"));
/**
* Render the header cell for the week numbers column.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function WeekNumberHeader(props) {
return react_1.default.createElement("th", { ...props });
}
//# sourceMappingURL=WeekNumberHeader.js.map
@@ -0,0 +1 @@
{"version":3,"file":"WeekNumberHeader.js","sourceRoot":"","sources":["../../../src/components/WeekNumberHeader.tsx"],"names":[],"mappings":";;;;;AAQA,4CAIC;AAZD,kDAAqD;AAErD;;;;;GAKG;AACH,SAAgB,gBAAgB,CAC9B,KAA6C;IAE7C,OAAO,yCAAQ,KAAK,GAAI,CAAC;AAC3B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type ThHTMLAttributes } from "react";
/**
* Render a table header cell with the name of a weekday (e.g., "Mo", "Tu").
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Weekday(props: ThHTMLAttributes<HTMLTableCellElement>): React.JSX.Element;
export type WeekdayProps = Parameters<typeof Weekday>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Weekday = Weekday;
const react_1 = __importDefault(require("react"));
/**
* Render a table header cell with the name of a weekday (e.g., "Mo", "Tu").
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Weekday(props) {
return react_1.default.createElement("th", { ...props });
}
//# sourceMappingURL=Weekday.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Weekday.js","sourceRoot":"","sources":["../../../src/components/Weekday.tsx"],"names":[],"mappings":";;;;;AAQA,0BAEC;AAVD,kDAAqD;AAErD;;;;;GAKG;AACH,SAAgB,OAAO,CAAC,KAA6C;IACnE,OAAO,yCAAQ,KAAK,GAAI,CAAC;AAC3B,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render the table row containing the weekday names.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Weekdays(props: HTMLAttributes<HTMLTableRowElement>): React.JSX.Element;
export type WeekdaysProps = Parameters<typeof Weekdays>[0];
@@ -0,0 +1,18 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Weekdays = Weekdays;
const react_1 = __importDefault(require("react"));
/**
* Render the table row containing the weekday names.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Weekdays(props) {
return (react_1.default.createElement("thead", { "aria-hidden": true },
react_1.default.createElement("tr", { ...props })));
}
//# sourceMappingURL=Weekdays.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Weekdays.js","sourceRoot":"","sources":["../../../src/components/Weekdays.tsx"],"names":[],"mappings":";;;;;AAQA,4BAMC;AAdD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,QAAQ,CAAC,KAA0C;IACjE,OAAO,CACL;QACE,yCAAQ,KAAK,GAAI,CACX,CACT,CAAC;AACJ,CAAC"}
@@ -0,0 +1,9 @@
import React, { type HTMLAttributes } from "react";
/**
* Render the container for the weeks in the month grid.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function Weeks(props: HTMLAttributes<HTMLTableSectionElement>): React.JSX.Element;
export type WeeksProps = Parameters<typeof Weeks>[0];
@@ -0,0 +1,17 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Weeks = Weeks;
const react_1 = __importDefault(require("react"));
/**
* Render the container for the weeks in the month grid.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function Weeks(props) {
return react_1.default.createElement("tbody", { ...props });
}
//# sourceMappingURL=Weeks.js.map
@@ -0,0 +1 @@
{"version":3,"file":"Weeks.js","sourceRoot":"","sources":["../../../src/components/Weeks.tsx"],"names":[],"mappings":";;;;;AAQA,sBAEC;AAVD,kDAAmD;AAEnD;;;;;GAKG;AACH,SAAgB,KAAK,CAAC,KAA8C;IAClE,OAAO,4CAAW,KAAK,GAAI,CAAC;AAC9B,CAAC"}
@@ -0,0 +1,9 @@
import React from "react";
import { DropdownProps } from "./Dropdown.js";
/**
* Render a dropdown to navigate between years in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
export declare function YearsDropdown(props: DropdownProps): React.JSX.Element;
@@ -0,0 +1,19 @@
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.YearsDropdown = YearsDropdown;
const react_1 = __importDefault(require("react"));
const useDayPicker_js_1 = require("../useDayPicker.js");
/**
* Render a dropdown to navigate between years in the calendar.
*
* @group Components
* @see https://daypicker.dev/guides/custom-components
*/
function YearsDropdown(props) {
const { components } = (0, useDayPicker_js_1.useDayPicker)();
return react_1.default.createElement(components.Dropdown, { ...props });
}
//# sourceMappingURL=YearsDropdown.js.map
@@ -0,0 +1 @@
{"version":3,"file":"YearsDropdown.js","sourceRoot":"","sources":["../../../src/components/YearsDropdown.tsx"],"names":[],"mappings":";;;;;AAYA,sCAGC;AAfD,kDAA0B;AAE1B,wDAAkD;AAIlD;;;;;GAKG;AACH,SAAgB,aAAa,CAAC,KAAoB;IAChD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,8BAAY,GAAE,CAAC;IACtC,OAAO,8BAAC,UAAU,CAAC,QAAQ,OAAK,KAAK,GAAI,CAAC;AAC5C,CAAC"}
@@ -0,0 +1,26 @@
export * from "./Button.js";
export * from "./CaptionLabel.js";
export * from "./Chevron.js";
export * from "./Day.js";
export * from "./DayButton.js";
export * from "./Dropdown.js";
export * from "./DropdownNav.js";
export * from "./Footer.js";
export * from "./Month.js";
export * from "./MonthCaption.js";
export * from "./MonthGrid.js";
export * from "./Months.js";
export * from "./MonthsDropdown.js";
export * from "./Nav.js";
export * from "./NextMonthButton.js";
export * from "./Option.js";
export * from "./PreviousMonthButton.js";
export * from "./Root.js";
export * from "./Select.js";
export * from "./Week.js";
export * from "./Weekday.js";
export * from "./Weekdays.js";
export * from "./WeekNumber.js";
export * from "./WeekNumberHeader.js";
export * from "./Weeks.js";
export * from "./YearsDropdown.js";

Some files were not shown because too many files have changed in this diff Show More