Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Feb 21 13:31
    ivansky commented #942
  • Feb 21 03:52
    kimyu92 commented #990
  • Feb 18 15:44
    mahnunchik commented #991
  • Feb 18 14:18
    mahnunchik opened #991
  • Feb 18 11:49
    ntlf review_requested #990
  • Feb 18 11:49
    ntlf opened #990
  • Feb 18 09:23
    mahnunchik opened #989
  • Feb 13 14:33
    KyorCode commented #986
  • Feb 13 14:32
    KyorCode commented #986
  • Feb 13 14:32
    KyorCode commented #986
  • Feb 13 14:29
    KyorCode commented #984
  • Feb 13 14:29
    KyorCode commented #984
  • Feb 13 08:14
    drbeat commented #981
  • Feb 13 08:12
    drbeat commented #981
  • Feb 06 21:01
    outerlook opened #988
  • Feb 05 08:41
    dmtrKovalenko commented #980
  • Feb 05 08:40
    bengry commented #980
  • Feb 05 08:07
    dmtrKovalenko commented #980
  • Feb 05 08:04
    dmtrKovalenko commented #980
  • Feb 05 08:02
    bengry commented #980
Ava Guerrero
@iamacatperson
hello, i am having an issue where when using DatePickerInput with the ability to switch between months/years, the month/year dropdown do not seem to work on iOS browsers
i forked a similar issue last time (i saw from github): https://codesandbox.io/s/0y84wrp8mn .. and try opening this on an iOS browser. clicking on the dropdown doesn't show the selection..
Reda
@Reda_bex_twitter
hey everyone any idea on how I can use Hooks inside a renderDay custom component?
Ghost
@ghost~58e977ced73408ce4f57112b

Hello. Can anyone review the PR? @gpbl

gpbl/react-day-picker#890

chenrico
@chenrico
Hello is there a way to assign name attribute to the input tag inside the input container?
Ghost
@ghost~58e977ced73408ce4f57112b
Corey Bruyere
@coreybruyere
Has anyone had success with building their own custom footer filters to filter dates? I'm looking to not use the todayButton provided with the library and create my own custom footer that displays the filter buttons: Go to Today, Past Year, Last 3 Months, This Month, and This Week. Looking for insight on how and if it's possible to tap into the libraries API outside of the context of the component.
Victor Chan
@fivetwelve
Hi, there. I came across a weird date rendering issue that I'm having trouble figuring out. I have an instance on my dev site, built with Gatsby on Netlify where my modifiers logic appears to work (I logged the actual true/false values) but the style is applied to the wrong date. If I subsequently advance or retreat a month, causing a refresh, the styles are applied correctly! Oddly enough, I tried to reproduce it in Codesandbox to no avail. Anyone interested in taking a quick look? My dev site: https://dev--ag-poc.netlify.com/northamerica/en/events and codesandbox barebones with same modifiers logic: https://codesandbox.io/s/km9o3zq2x7
Victor Chan
@fivetwelve
In my dev example a number of dates are circled to show what dates match against a list of event days. They're all affected but the easiest to discern are the April 17th, 24th and May 1st. The first two should be highlighted but aren't until a re-render happens. The third is only highlighted due to an overlapping event. But the corresponding error dates on 18th and 2nd disappear with the re-render. You can see the dates I've replicated in the Codesandbox source. When I run it in Codesandbox, the underlined dates display correctly but I'm not really sure how to diagnose my dev issue when there aren't any errors from the build. Even though Gatsby is a static site generator and the site gets built remotely could either of those two factors cause dates to be improperly calculated. I'm under the impression that all my evaluation is done at client side. I'm using DateUtiles.isDayInRange and the Date() constructor to do all my comparisons.
Shivam Parashar
@para27rsh_twitter

Please someone help me in this,
i imported

import DayPicker from "react-day-picker";
import "react-day-picker/lib/style.css";

but the CSS is not working why ??

does anyone faced the same issue .. please help me in this ?
Shivam Parashar
@para27rsh_twitter
hello is anyone there ?
Shivam Parashar
@para27rsh_twitter
@gpbl r u there bro
Shivam Parashar
@para27rsh_twitter
@lafisrap did u get the solution ?? from webpack loader as i am also facing the same issue
Roger K.
@misterhtmlcss

Hi Everyone I'm newer to react so this question should be both easy and embarrassing. I can't figure out how to get the state from the react-day-picker into a parent component.

This is what I wrote to try, but it's not working. Likely it's a lack of familiarity with the tools.

class datePicker extends Component {
  constructor(props){
    super(props)
    this.handleDayChange = this.handleDayChange.bind(this)
    this.state = {
      selectedDay: '',
    }
  }

  handleDayChange(day, { selected }) {
    this.setState({ selectedDay: day });
  }

  componentDidUpdate(prevProps){
    if(this.prevProps.selectedDay !== this.state.selectedDay){
      this.props.handleDate(this.state);
    }
  }

  render() {
    return (
      <DayPickerInput onDayChange={this.handleDayChange} />
    )
  }

}
What I wanted to do with the componentDidUpdate was use it to see that the this.state.selectedDay changed when compared to the default state I set in the parent component which was also set to selectedDay = '' and so I tried to do a comparison check via that lifecycle component between this.state.selectedDay and this.props.selectedDay
Roger K.
@misterhtmlcss
This is the error I am getting Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
ShrawanBK
@ShrawanBK
Hey everyone, how to handle double click in dates in date picker?
I got no clue ??
I need to handle single click and double click in the dates !!
Huzeyfe Kıran
@Huzo
Hey Guys, I have a question. Is it possible to create multiple instances of DayPicker? When I create two instances, they act the same, clicking on dates changes date in other instances as well.
Max Leiter
@MaxLeiter
@Huzo: sounds like a state management problem
Lioxor64
@lioxor64

Hello, my name is Liora and I am currently hunting open source projects for company NeuraLegion (www.neuralegion.com)
We just launched a free annual subscription for open source projects for our AIAST tool NexPloit.

If you are interested, please, reach us on opensource@neuralegion.com!

Thank you for your time and consideration! If you have any questions, please do not hesitate to contact us!

Best!

Ghost
@ghost~529c6c5ced5ab0b3bf04d8bb
Does anyone know if there's an easy way to prevent the year from changing in <DayPicker /> when a user presses the "down" or "up" arrow key on their keyboard while focused on the calendar? I have some users who use the keyboard to scroll up/down on the page and they're really confused by this feature. Thanks in advance for any help!
shukanshah
@shukanshah
I want to start calendar week from Monday. I tried firstDayOfWeek={1} still starts with sunday. Does anyone know any solution for that?
secondly, I want to select multiple week in https://react-day-picker.js.org/examples/selected-week. is there any way to do that?
TIA
Sibel Baslamisli
@sialbul
Hi, I am using date range and getting this error when i click the date "Warning: Failed prop type: Invalid prop fromMonth of type String supplied to DayPicker, expected instance of Date." Is there any way to fix this? Thank you.
johnjessewood
@johnjesse
@sialbul sounds like you are supplying a string e.g. '24/7/2019' instead of a dat e.g. new Date(2019, 7, 24)
johnjessewood
@johnjesse
@teechap you could try canChangeMonth={false} in the props... I think that will stop the arrow keys for the year change... although it will probably affect the changing of the month too - I've never tried that prop. If you didn't do that you'd have to get in and stop the key events from propagating up to the layer just below the container... You could potentially stop that using the renderMonths renderNav methods but it doesn't sound easy
johnjessewood
@johnjesse
@shukanshah if firstDayOfWeek={1} isn't working that sounds like a bug. For selecting multiple weeks, following the example should work fine except you'd need to set a separate range based on your date. I expect you'd just need to tinker with the getWeekRange method in that example to do what you want
Ramkumar
@iamRamkumar
can anyone help me to config react-day-picker with function component
Volkan Ongun
@volkanongun
Does any one know if we can start the week from Monday for react day picker?
Mika Web Studio
@milkins87_twitter
@volkanongun You can use firstDayOfWeek for that: https://react-day-picker.js.org/examples/localization
Volkan Ongun
@volkanongun
great lib, thanx! @milkins87_twitter
Bharath Kumar Ramasubramanian
@rbkumar88
hi.is there a way to add styles to the input box ?
sorry i am a css newbie
AprinDev
@AprinDev
hi . i want to change react-day-picker's calendar to jalali calendar . how can i do it?
AprinDev
@AprinDev
@volkanongun you can change firstDayOfWeek and set in on 3 to start the day of the week from monday
Jonatas Daniel
@jonatasdaniel
Hey guys, do you have some example how to use moment with react-day-picker? I need to change the dates based on a period (1 year, 1 month, etc), and set them to my date picker component
Laurens Bosscher
@LaurensBosscher
Hey, just wanted to drop by to let you guys know that react-day-picker has been an joy to work with! :)
keep up the good work!
Ahmed Ramadan
@ahmedramadan65
hello, i want to know if there is possible to choose 3 dates range (start,end,middle)
Isabeau Bergeron
@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
@thedaruma
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.
Ph-FMM
@Ph-FMM
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
@KasparRosin
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.
Giampaolo Bellavite
@gpbl
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
shelver2004
@shelver2004

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:
https://react-day-picker.js.org/examples/selected-range
https://react-day-picker.js.org/examples/elements-year-navigation

shelver2004
@shelver2004
hey @gpbl is this channel still active? or i should use the new chatroom you suggested?