gpbl / react-day-picker

DayPicker is a customizable date picker component for React. Add date pickers, calendars, and date inputs to your web applications.
https://daypicker.dev
MIT License
5.86k stars 700 forks source link

DayPickerInput with custom input component losing focus when changing its value #2237

Closed rafaelguedes closed 2 days ago

rafaelguedes commented 2 days ago

Hello! I'm still using version 7.4.10 and I'm trying to instantiate a DayPickerInput with a custom input component.

import React from "react";
import DayPickerInput from "react-day-picker/DayPickerInput";

const InputCalendar = (onChange, value) => {
  return (
    <DayPickerInput
      onDayChange={onChange}
      value={value}
      component={(props) => <input {...props} />}
    />
  );
};

Every time I interact with the input, the focus is lost immediately after I type something. This doesn't happen without the custom component, and it is also reproducible with the example available here in the docs.