Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • Sep 01 14:03
    gpbl ready_for_review #1535
  • Sep 01 14:03
    gpbl opened #1535
  • Sep 01 13:58
    gpbl edited #1534
  • Sep 01 13:58
    gpbl opened #1534
  • Sep 01 13:54

    gpbl on fix-day-outline

    fix: selected day outlines in c… (compare)

  • Sep 01 13:43

    gpbl on master

    chore: add jsdocs to Dropdown (compare)

  • Sep 01 13:43

    gpbl on fix-dropdown-focus-style

    fix: dropdown focus-visible sty… (compare)

  • Sep 01 13:42

    gpbl on custom-head-row

    chore: add jsdocs to Dropdown added: custom HeadRow component (compare)

  • Sep 01 13:28
    gpbl unlabeled #1490
  • Sep 01 13:28
    gpbl assigned #1490
  • Sep 01 12:47

    gpbl on master

    chore: lint files (compare)

  • Sep 01 11:16

    gpbl on master

    changed: add HeadRow component … (compare)

  • Sep 01 11:16
    gpbl closed #1533
  • Sep 01 11:16
    gpbl edited #1533
  • Sep 01 11:14
    gpbl edited #1533
  • Aug 31 21:24
    KonradLinkowski opened #1533
  • Aug 28 17:10

    github-actions[bot] on gh-pages

    deploy: 50b6dbafd60386eca895cce… (compare)

  • Aug 28 17:05
    gpbl commented #1529
  • Aug 28 17:01

    gpbl on v8.1.4


  • Aug 28 17:01

    gpbl on master

    Bump v8.1.4 (compare)

Laurens Bosscher
keep up the good work!
Ahmed Ramadan
hello, i want to know if there is possible to choose 3 dates range (start,end,middle)
Isabeau Bergeron
Hi folks! We started using this lib for our product, we love it! I'd like to give you some of our needs and hopefully others for future features! It would be nice to have a click handler for the weekdays. In our app it is useful to select all weekdays at once. I've done the same for the month and the week, which have handlers. I'll modify the lib myself and see where it goes :)
Ryan Giordano
I ran into this gpbl/react-day-picker#723 when using custom inputs for DayPickerInput. I commented with what solved it locally for me, but wanted to chat about it before I made a PR with the fix.
how do i use 2 <DayPicker> in 1 <div>?
the 2 calendars are working togheter, if i click in one day, it will click in the other. i dont want that
Kaspar Rosin
Really could use an example on the main docs on how to remove single items from range. Let's say somebody picks a range from 1st october to 30th, but wishes to remove only the 15th.
Hi Gitter! I'm the maintainer of react-day-picker :wave: I'm working on the next release that will take some radical changes in the component. I'd love some help for testing the new API etc.
I'm also thinking to close this channel and move to https://spectrum.chat/react-day-picker?tab=posts

Hello friends can somebody help me with this basic question? In the document and examples it shows how to use month/year DropBox for one calendar. Can somebody help how to have this feature for 2 calendars? When I select a month from the second calendar it changes the first calendar. I am new to react - thank you.

When I select a month from the second calendar it changes the first calendar- i want a combination of these 2 examples:

hey @gpbl is this channel still active? or i should use the new chatroom you suggested?
Hello, can someone please accept this issue? gpbl/react-day-picker#990
Hi! Anyone knows how can I change DayPickerInput CSS styles if I added the lib through yarn?
Uyiosa Enabulele
Hi @gpbl I am trying to prevent the date range date picker to field from moving the selected month to the left when you click on a month on the right with hideOnDayClick set to false. is there a prop currently available to do that.
Onopko Dima
Hi guys, How can I style datePicker via css modules?

Hey guys.
What API for date does DayPicker use?
I'm mocking Date in mytest as https://jsfiddle.net/st06zenL/ here and keep getting console warning: Encountered two children with the same key, 197001.
I see that dates in calendar are actually correct, but aria-label="Thu Jan 01 1970"
Seems that my date mock breaks the library.

Any ideas?

Todd Chambery
Hi, I just want to say a big "Thanks!" for the extensive code examples on homepage
Kevin Denny II
Hi @gpbl!!!

I am having an issue, gpbl/react-day-picker#1045, utilizing the DayPicker api for use of the pop-up calendar. I need to close/hide when I click outside the calendar. I want to work like the DayPickerInput component work but with our the textbox input. I ONLY need the popup calendar. Using onBlur only partially works because if I click a week, it does not immediately recognize the focus the calendar container. I am really struggling with this and I am sure there is a simple solution.

Here is code snippet:

<div className={calendarPopOut} onBlur={handleClickOutside}>
     weekdayElement={<ThreeCharacterAbv />}


Robert Butler
So I'm wondering if I can style react-day-picker to work like a material design day picker; but I have some specific UX requirements on top of that to address as well; like I need to completely swap out the navigation for my own (we use two select boxes for picking which month/year you're looking at)
Robert Butler
Ah, okay
That actually works fine
Robert Butler
so is the typescript version stable-ish?
Roman Matias Ianni
Hi! there is an option to pass only available days? so the rest appears as disabled instead of passing explicitly the disabled days? thanks in advence!
Maksym Ozymok
Hi, please help me. I have problems with ReactDayPickerInput, I don't know which styles use with css-modules, maybe someone can sent me example of using css modules, css file, or repository on githab, because I am confused
Andy Fang
Is it possible to programmatically navigate to next month/previous months?
It's not well documented how to do that if you have custom nav arrows
Robert Butler
so finally getting back to the calendar here
after a short hiatus of stabbing my monorepo in the FACE (lmao)
Robert Butler
Andrea C Wagner
Does someone know that I can override only the year on day-picker ('DayPicker-Caption')? I'm using MomentLocaleUtils using the Tamil language. However, I want to display the month in Tamil (ta-LK) and year in English(en).
Venugopal Kathavate
Hi, Is this channel active?
Jodie Doubleday
As above.. it this room active?
looking for some help with a weird issue, when clicking on the react-day-picker, the calendar opens up, but when i go to click on a date it looks like it closes before the date is selected, in fact if I click on white space in the calendar it closes. It looks as though the input loses focus. Wonder if anyone has had this issue and how they solved it.
Hi. I just came here to notify you that some of your example links to codesandbox doesn't work
Do you have an example with hooks?
something like: const [selectedDay, handleDayChange] = useState(new Date());
Yuriy Zaitsev

Hi guys. Sorry, I tried to search over the history by the word "range" but haven't found any relevant info for my issue. I'm trying to use your component to solve such a task:

  • it should be a single DateInput (with dropdown ability, not statically shown picker)
  • it should give an ability to select date range with a period of more than a month
  • it should show range by hover

unfortunately your example of date range is made not with using of dateinput, but with a static picker. also there is an example of a dynamic rendering of ranges but it is also made with static picker.
when I'm trying to solve this task by external state inside kind of HOC, with using of onDayChange and trying to update selectedDays and modifiers dynamically everything becomes broken because it tries to recalculate state by props, but focus is missed and picker becomes closed. I tried to control it by controlling "showOverlay" but it looks like bad idea because I also need a native behavior like closing of datepicker by the clicking outside of input and overlay component.

Maybe you have an example of such a complex "mix" of requirements...? just tried for luck

Hey there, I am having issues trying to customize the calendar itself of the DayPicker component, I need to set custom styles for the days not selected and the calendar container itself
any example I could follow?
Jérôme Oudoul
Hello, how to report typos/errors in the Documentation ?
Example: broken link on "CSS file" on https://react-day-picker-next.netlify.app/basics/styling
Evan do Carmo
Hey! Looking for examples on how to style days using a date input
I can only find examples with the static picker, but not with the input
Ahsan Shah
Hey! i'm having some difficulty in using https://react-day-picker.js.org/examples/input-from-to/
as the DatePickerInput styling is messing with bootstrap.css and the whole calender style isn't being displayed properly.
nate pappenhagen


PR to address DayPickerInput not being exported in a ES Modules compliant way. Would love a review @gpbl

Does anybody know something on how to solve this? gpbl/react-day-picker#1255
Raymond Dazo
hi, does react-day-picker has a month/year picker?
Daypicker link : https://react-day-picker.js.org/
I've used react-day-picker <DayPicker /> and displayed multiple months. I need to give different captions for each month.
Can you guide to implement it.