From c4cb2d504c1fcaba31c4c33d6e8d765db0c9c28c Mon Sep 17 00:00:00 2001 From: Giampaolo Bellavite Date: Sun, 21 Jul 2024 11:26:46 -0500 Subject: [PATCH 1/3] Fix prop types not being correctly interpreted --- src/DayPicker.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/DayPicker.tsx b/src/DayPicker.tsx index 6263e978e..29195bf5e 100644 --- a/src/DayPicker.tsx +++ b/src/DayPicker.tsx @@ -42,7 +42,7 @@ import { isDateRange } from "./utils/typeguards.js"; * @group DayPicker * @see https://daypicker.dev */ -export function DayPicker(props: T) { +export function DayPicker(props: DayPickerProps) { const { components, formatters, labels, dateLib, classNames } = useMemo( () => ({ dateLib: getDateLib(props.dateLib), @@ -116,9 +116,9 @@ export function DayPicker(props: T) { isSelected, select, selected: selectedValue - } = useSelection(props, dateLib) ?? {}; + } = useSelection(props, dateLib) ?? {}; - const { blur, focused, isFocusTarget, moveFocus, setFocused } = useFocus( + const { blur, focused, isFocusTarget, moveFocus, setFocused } = useFocus( props, calendar, getModifiers, @@ -221,9 +221,9 @@ export function DayPicker(props: T) { const dataAttributes = getDataAttributes(props); - const contextValue: DayPickerContext = { - selected: selectedValue as SelectedValue, - select: select as SelectHandler, + const contextValue: DayPickerContext = { + selected: selectedValue as SelectedValue, + select: select as SelectHandler, isSelected, months, nextMonth, From d39b25d9783a90a81ee02890fbfc1ffe88df35ad Mon Sep 17 00:00:00 2001 From: Giampaolo Bellavite Date: Sun, 21 Jul 2024 11:26:58 -0500 Subject: [PATCH 2/3] Add docs to selection props --- src/types/props.ts | 21 ++++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/src/types/props.ts b/src/types/props.ts index 7659a95d8..65cf0f12d 100644 --- a/src/types/props.ts +++ b/src/types/props.ts @@ -464,7 +464,9 @@ export interface PropsBase { export interface PropsSingleRequired { mode: "single"; required: true; + /** The selected date. */ selected: Date; + /** Event handler when a day is selected. */ onSelect?: ( selected: Date, triggerDate: Date, @@ -480,7 +482,9 @@ export interface PropsSingleRequired { export interface PropsSingle { mode: "single"; required?: false | undefined; + /** The selected date. */ selected?: Date | undefined; + /** Event handler when a day is selected. */ onSelect?: ( selected: Date | undefined, triggerDate: Date, @@ -496,14 +500,18 @@ export interface PropsSingle { export interface PropsMultiRequired { mode: "multiple"; required: true; + /** The selected dates. */ selected: Date[]; + /** Event handler when days are selected. */ onSelect?: ( selected: Date[], triggerDate: Date, modifiers: Modifiers, e: React.MouseEvent | React.KeyboardEvent ) => void; + /** The minimum number of selectable days. */ min?: number; + /** The maximum number of selectable days. */ max?: number; } /** @@ -514,14 +522,18 @@ export interface PropsMultiRequired { export interface PropsMulti { mode: "multiple"; required?: false | undefined; + /** The selected dates. */ selected?: Date[] | undefined; + /** Event handler when days are selected. */ onSelect?: ( selected: Date[] | undefined, triggerDate: Date, modifiers: Modifiers, e: React.MouseEvent | React.KeyboardEvent ) => void; + /** The minimum number of selectable days. */ min?: number; + /** The maximum number of selectable days. */ max?: number; } /** @@ -532,14 +544,18 @@ export interface PropsMulti { export interface PropsRangeRequired { mode: "range"; required: true; + /** The selected range. */ selected: DateRange; + /** Event handler when a range is selected. */ onSelect?: ( selected: DateRange, triggerDate: Date, modifiers: Modifiers, e: React.MouseEvent | React.KeyboardEvent ) => void; + /** The minimum number of days to include in the range. */ min?: number; + /** The maximum number of days to include in the range. */ max?: number; } /** @@ -550,14 +566,17 @@ export interface PropsRangeRequired { export interface PropsRange { mode: "range"; required?: false | undefined; + /** The selected range. */ selected?: DateRange | undefined; - disabled?: Matcher | Matcher[] | undefined; + /** Event handler when the selection changes. */ onSelect?: ( selected: DateRange | undefined, triggerDate: Date, modifiers: Modifiers, e: React.MouseEvent | React.KeyboardEvent ) => void | undefined; + /** The minimum number of days to include in the range. */ min?: number; + /** The maximum number of days to include in the range. */ max?: number; } From 780c7ea3fb6efc773ea0aea78850aec9d4fd96b0 Mon Sep 17 00:00:00 2001 From: Giampaolo Bellavite Date: Sun, 21 Jul 2024 14:41:25 -0500 Subject: [PATCH 3/3] Add missing disabled matcher --- src/types/props.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/types/props.ts b/src/types/props.ts index 65cf0f12d..38f415643 100644 --- a/src/types/props.ts +++ b/src/types/props.ts @@ -544,6 +544,7 @@ export interface PropsMulti { export interface PropsRangeRequired { mode: "range"; required: true; + disabled?: Matcher | Matcher[] | undefined; /** The selected range. */ selected: DateRange; /** Event handler when a range is selected. */ @@ -566,6 +567,7 @@ export interface PropsRangeRequired { export interface PropsRange { mode: "range"; required?: false | undefined; + disabled?: Matcher | Matcher[] | undefined; /** The selected range. */ selected?: DateRange | undefined; /** Event handler when the selection changes. */