fix: prop types not being correctly interpreted by TS (#2283)

* Fix prop types not being correctly interpreted

* Add docs to selection props

* Add missing disabled matcher

src/DayPicker.tsx

@@ -42,7 +42,7 @@ import { isDateRange } from "./utils/typeguards.js";
  * @group DayPicker
  * @see https://daypicker.dev
  */
-export function DayPicker<T extends DayPickerProps>(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<T extends DayPickerProps>(props: T) {
     isSelected,
     select,
     selected: selectedValue
-  } = useSelection<T>(props, dateLib) ?? {};
+  } = useSelection(props, dateLib) ?? {};
 
-  const { blur, focused, isFocusTarget, moveFocus, setFocused } = useFocus<T>(
+  const { blur, focused, isFocusTarget, moveFocus, setFocused } = useFocus(
     props,
     calendar,
     getModifiers,
@@ -221,9 +221,9 @@ export function DayPicker<T extends DayPickerProps>(props: T) {
 
   const dataAttributes = getDataAttributes(props);
 
-  const contextValue: DayPickerContext<T> = {
-    selected: selectedValue as SelectedValue<T>,
-    select: select as SelectHandler<T>,
+  const contextValue: DayPickerContext<DayPickerProps> = {
+    selected: selectedValue as SelectedValue<DayPickerProps>,
+    select: select as SelectHandler<DayPickerProps>,
     isSelected,
     months,
     nextMonth,

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,19 @@ 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. */
   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 +567,18 @@ export interface PropsRangeRequired {
 export interface PropsRange {
   mode: "range";
   required?: false | undefined;
-  selected?: DateRange | undefined;
   disabled?: Matcher | Matcher[] | undefined;
+  /** The selected range. */
+  selected?: DateRange | 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;
 }