react-day-picker is a flexible date picker component for React
Read the react-day-picker documentation and check out the examples to learn how to implement it.
Questions tagged [react-day-picker]
129 questions
2
votes
2 answers
How do I remove the blue border on focus?
When I click on the day picker component container or an individual cell within the calendar, a blue border gets added.
I couldn't find the related CSS in style.css, nor do I see any classes being added in DevTools that could be adding the blue…
neuDev33
- 1,573
- 7
- 41
- 54
2
votes
2 answers
How do I combine disabled days using react-day-picker-input
I am using the NPM package react-day-picker and there seems to be minimal documentation on the react-day-picker-input element. It mentions a prop called dayPickerProps which takes an object called disabledDays. I can't figure out how to disable…
Jake
- 712
- 7
- 20
2
votes
1 answer
react-day-picker DayPickerInput not firing onDayChange event
We are upgrading from version 5.5.3 of react-day-picker to the latest version (7.1.10). I have looked at the documentation for breaking changes and modified our code accordingly. I have even changed our code to look like the code in the…
Tim
- 21
- 3
2
votes
0 answers
React-day-picker warning
I have MultiDayPicker component which looks like this:
export default class MultiDayPicker extends Component {
state = {
selectedDays: []
};
handleDayClick = (day, {selected}) => {
const { selectedDays } = this.state;
if…
JustJSFan
- 143
- 1
- 1
- 6
2
votes
0 answers
How to set highlighted-day in react-day-picker
I am using react-day-picker. By default, it shows system date as the highlighted date. I want to use the date received from the server and make it highlighted date.
Here's my code :-
Shivam Kumar
- 121
- 2
- 8
2
votes
2 answers
Is it possible to set input field of react-day-picker as required?
I have two DayPickerInput fields in a form and would like to mark them as required field but don't know how. Can anybody please help?
LOUDKING
- 301
- 1
- 13
2
votes
3 answers
Unable to use DayPickerInput from React-Day-Picker with TypeScript
Whenever I try to import DayPickerInput like below:
import DayPickerInput from 'react-day-picker/DayPickerInput';
I get the ts warning: "Could not find a declaration file for module 'react-day-picker/DayPickerInput."
Looking at the module folder,…
AnimaSola
- 7,146
- 14
- 43
- 62
1
vote
1 answer
Disable all days before and after given dates
I am trying to limit the user to be able to choose from a very small range of dates using react day picker. All other dates before and after should be disabled to prevent them from being selected.
Below is my DateRange component with props which…
Alex Morrison
- 186
- 5
- 18
1
vote
2 answers
How to customise React-Day-Picker input?
Here is my code
setNewDate(day)}
className="day"
/>
.day {
text-align: center;
text-size-adjust: 100;
border-radius: 30px;
background: var(--bg-accent);
color:…
kid
- 771
- 1
- 4
- 12
1
vote
2 answers
react-day-picker disabledDays clicks still trigger onDayClick
So I would expect that the relative elements onClick handler would be disabled when providing some dates as disabledDays prop. It seems to me that the react-day-picker only changes the css of the elements. That seems obscure to me, so I suspect…
Jonas Grønbek
- 1,709
- 2
- 22
- 49
1
vote
1 answer
Value is reset but input is not?
I am using react-day-picker and am resetting the selected days properly but am unsure about how to clear the DayPickerInput placeholder.
Example: I select a date range and click reset. The results change but the old dates still appear in the input.…
brooksrelyt
- 3,925
- 5
- 31
- 54
1
vote
0 answers
React Day-Picker on react stand alone React App --- error TypeError: f.default.instanceOf is not a function
React Day-Picker Errorof TypeError: f.default.instanceOf is not a function
kandre
- 15
- 1
- 5
1
vote
1 answer
react-day-picker DayPickerInput and setting selected date in another component
Using DayPicker in one component, I want to import the selected day into the TodoForm component, and use that value to set the state so that the selected day is saved and rendered in each todo.
class DayPickerComponent extends Component {
…
Davia DeNisco
- 176
- 15
1
vote
1 answer
Clojurescript date timepicker with cljsjs/react-day-picker
I am new to clojure and clojurescript. I just to know how I can implement this library in clojurescript.
This is the link to the library: https://react-day-picker.js.org/examples/basic
I have required the library in my name space like so :
(ns woot…
user4148098
1
vote
1 answer
How to make React-Day-Picker months side by side horizontally instead of vertically aligned
I am using the react-day-picker component and I have been able to make 2 months show up but they are presented on the screen one month on top of the other. How can I change this to be aligned horizontally?I have tried changing the CSS and using…
lc426
- 13
- 3