API Reference
Enumerations
| Enumeration | Description |
|---|---|
| InternalModifier | The name of the modifiers that are used internally by DayPicker. |
Interfaces
| Interface | Description |
|---|---|
| CaptionLabelProps | The props for the CaptionLabel component. |
| CaptionProps | Represent the props of the Caption component. |
| CustomComponents | Map of the components that can be changed using the components prop. |
| DayContentProps | Represent the props for the DayContent component. |
| DayPickerBase | The base props for the DayPicker component and the |
| DayPickerContextValue | The value of the DayPickerContext extends the props from DayPicker |
| DayPickerDefaultProps | The props for the DayPicker component when using mode="default" or |
| DayPickerMultipleProps | The props for the DayPicker component when using mode="multiple". |
| DayPickerProviderProps | The props for the DayPickerProvider. |
| DayPickerRangeProps | The props for the DayPicker component when using mode="range". |
| DayPickerSingleProps | The props for the DayPicker component when using mode="single". |
| DayProps | Represent the props used by the Day component. |
| DropdownProps | The props for the Dropdown component. |
| FooterProps | - |
| NavigationContextValue | Represents the value of the NavigationContext. |
| RowProps | The props for the Row component. |
| SelectMultipleContextValue | Represents the value of a SelectMultipleContext. |
| SelectRangeContextValue | Represents the value of a SelectRangeContext. |
| SelectRangeProviderProps | - |
| SelectSingleContextValue | Represents the value of a SelectSingleContext. |
| SelectSingleProviderProps | - |
| UseInputOptions | - |
| UseInputValue | Represent the value returned by useInput. |
| WeekNumberProps | The props for the WeekNumber component. |
Type Aliases
| Type alias | Description |
|---|---|
| ActiveModifiers | The modifiers that are matching a day in the calendar. Use the |
| ButtonProps | The props for the Button component. |
| CaptionLayout | The layout of the caption: |
| ClassNames | The class names of each element. |
| CustomModifiers | A map of matchers used as custom modifiers by DayPicker component. This is |
| DateAfter | A matcher to match a day falling after the specified date, with the date not |
| DateBefore | A matcher to match a day falling before the specified date, with the date not |
| DateFormatter | - |
| DateInterval | A matcher to match a day falling before and/or after two dates, where the |
| DateRange | A matcher to match a range of dates. The range can be open. Differently from |
| DayClickEventHandler | - |
| DayFocusEventHandler | - |
| DayKeyboardEventHandler | - |
| DayLabel | - |
| DayModifiers | The custom modifiers passed to the DayPickerBase.modifiers. |
| DayMouseEventHandler | - |
| DayOfWeek | A matcher to match a date being one of the specified days of the week (0-6, |
| DayPickerProps | - |
| DayPointerEventHandler | - |
| DayRender | - |
| DaySelectionMode | Selection modes supported by DayPicker. |
| DayTouchEventHandler | - |
| FocusContextValue | Represents the value of the FocusContext. |
| FocusProviderProps | - |
| Formatters | Represent a map of formatters used to render localized content. |
| InputDayPickerProps | The props to attach to the DayPicker component when using useInput. |
| InputProps | The props to attach to the input field when using useInput. |
| InternalModifiers | Map of matchers used for the internal modifiers. |
| InternalModifiersElement | These elements must not be in the styles or classNames records as they |
| Labels | Map of functions to translate ARIA labels for the relative elements. |
| Matcher | A value or a function that matches a specific day. |
| Modifier | A modifier represents different styles or states of a day displayed in the |
| Modifiers | The modifiers used by DayPicker. |
| ModifiersClassNames | The classnames to assign to each day element matching a modifier. |
| ModifiersStyles | The style to apply to each day element matching a modifier. |
| MonthChangeEventHandler | - |
| MonthsProps | The props for the Months component. |
| NavButtonLabel | - |
| RootContext | The props of RootProvider. |
| SelectMultipleEventHandler | - |
| SelectMultipleModifiers | Represent the modifiers that are changed by the multiple selection. |
| SelectMultipleProviderProps | - |
| SelectRangeEventHandler | - |
| SelectRangeModifiers | Represent the modifiers that are changed by the range selection. |
| SelectSingleEventHandler | - |
| StyledComponent | Props of a component that can be styled via classNames or inline-styles. |
| StyledElement | The style (either via class names or via in-line styles) of an element. |
| Styles | The inline-styles of each styled element, to use with the styles prop. Day |
| WeekNumberClickEventHandler | - |
| WeekNumberFormatter | - |
| WeekNumberLabel | - |
| WeekdayLabel | - |
Variables
| Variable | Description |
|---|---|
| DayPickerContext | The DayPicker context shares the props passed to DayPicker within internal |
| FocusContext | The Focus context shares details about the focused day for the keyboard |
| NavigationContext | The Navigation context shares details and methods to navigate the months in |
| SelectMultipleContext | The SelectMultiple context shares details about the selected days when in |
| SelectRangeContext | The SelectRange context shares details about the selected days when in range |
| SelectSingleContext | The SelectSingle context shares details about the selected days when in |
Functions
| Function | Description |
|---|---|
| Button | Render a button HTML element applying the reset class name. |
| Caption | Render the caption of a month. The caption has a different layout when |
| CaptionDropdowns | Render a caption with the dropdowns to navigate between months and years. |
| CaptionLabel | Render the caption for the displayed month. This component is used when |
| CaptionNavigation | Render a caption with a button-based navigation. |
| Day | The content of a day cell – as a button or span element according to its |
| DayContent | Render the content of the day cell. |
| DayPicker | DayPicker is a React component to create date pickers, calendars, and date |
| DayPickerProvider | The provider for the DayPickerContext, assigning the defaults from the |
| Dropdown | Render a styled select component – displaying a caption and a custom |
| FocusProvider | The provider for the FocusContext. |
| Footer | Render the Footer component (empty as default). |
| Head | Render the table head. |
| HeadRow | Render the HeadRow component - i.e. the table head row with the weekday |
| IconDropdown | Render the icon in the styled drop-down. |
| IconLeft | Render the "previous month" button in the navigation. |
| IconRight | Render the "next month" button in the navigation. |
| Months | Render the wrapper for the month grids. |
| NavigationProvider | Provides the values for the NavigationContext. |
| RootProvider | Provide the value for all the context providers. |
| Row | Render a row in the calendar, with the days and the week number. |
| SelectMultipleProvider | Provides the values for the SelectMultipleContext. |
| SelectMultipleProviderInternal | - |
| SelectRangeProvider | Provides the values for the SelectRangeProvider. |
| SelectRangeProviderInternal | - |
| SelectSingleProvider | Provides the values for the SelectSingleProvider. |
| SelectSingleProviderInternal | - |
| WeekNumber | Render the week number element. If onWeekNumberClick is passed to |
| addToRange | Add a day to an existing range. |
| isDateAfterType | Returns true if value is of type DateAfter. |
| isDateBeforeType | Returns true if value is of type DateBefore. |
| isDateInterval | Returns true if matcher is of type DateInterval. |
| isDateRange | Returns true if value is a DateRange type. |
| isDayOfWeekType | Returns true if value is a DayOfWeek type. |
| isDayPickerDefault | Returns true when the props are of type DayPickerDefaultProps. |
| isDayPickerMultiple | Returns true when the props are of type DayPickerMultipleProps. |
| isDayPickerRange | Returns true when the props are of type DayPickerRangeProps. |
| isDayPickerSingle | Returns true when the props are of type DayPickerSingleProps. |
| isMatch | Returns whether a day matches against at least one of the given Matchers. |
| useActiveModifiers | Return the active modifiers for the specified day. |
| useDayPicker | Hook to access the DayPickerContextValue. |
| useDayRender | Return props and data used to render the Day component. |
| useFocusContext | Hook to access the FocusContextValue. Use this hook to handle the |
| useInput | Return props and setters for binding an input field to DayPicker. |
| useNavigation | Hook to access the NavigationContextValue. Use this hook to navigate |
| useSelectMultiple | Hook to access the SelectMultipleContextValue. |
| useSelectRange | Hook to access the SelectRangeContextValue. |
| useSelectSingle | Hook to access the SelectSingleContextValue. |