Adds daySize prop to the DRP/SDP/DP that scales everything accordingly #249
Conversation
majapw
added
the
semver-major: breaking change
src/components/DateRangePicker.jsx
Outdated
| onDayMouseEnter={this.onDayMouseEnter} | ||
| onDayMouseLeave={this.onDayMouseLeave} | ||
| onDayMouseDown={this.onDayClick} | ||
| onDayTouchTap={this.onDayClick} |
There was a problem hiding this comment.
Are these props unused?
There was a problem hiding this comment.
yeah. this was a mistake in a refactor.
| @@ -0,0 +1,5 @@ | |||
| const CALENDAR_MONTH_PADDING = 9; | |||
There was a problem hiding this comment.
Can we make this a property as well?
There was a problem hiding this comment.
probs. the DAY_PICKER_PADDING is also separate. This is the padding on each month (and between months as well).
| @@ -36,6 +37,7 @@ const defaultProps = { | |||
| enableOutsideDays: false, | |||
| modifiers: {}, | |||
| orientation: HORIZONTAL_ORIENTATION, | |||
| daySize: 39, | |||
src/components/CalendarMonthGrid.jsx
Outdated
| @@ -55,6 +57,7 @@ const defaultProps = { | |||
| onDayTouchTap() {}, | |||
| onMonthTransitionEnd() {}, | |||
| transform: 'none', | |||
| daySize: 39, | |||
There was a problem hiding this comment.
if 39 is important, could it be a reused constant, instead of being hardcoded in multiple places?
src/components/CalendarMonthGrid.jsx
Outdated
| @@ -32,6 +33,7 @@ const propTypes = { | |||
| onDayTouchTap: PropTypes.func, | |||
| onMonthTransitionEnd: PropTypes.func, | |||
| transformValue: PropTypes.string, | |||
| daySize: PropTypes.number, | |||
There was a problem hiding this comment.
should this perhaps be a finite, positive integer? If so, airbnb-prop-types has nonNegativeInteger for just this use case :-D
majapw
force-pushed
the
maja-add-calendarday-size-prop
branch
from
cb5b42e
to
a954dec
Compare
majapw
force-pushed
the
maja-add-calendarday-size-prop
branch
from
a954dec
to
0a56618
Compare
|
Heeeeey @majapw how's this going? I was considering trying to break it off myself in the next few days as it would be very helpful for my inline picker being mobile friendly! |
|
Closing in favor of #406 |
Basically, this conflates all of the code associated with the width of the
DayPickerinto the JS side of things (which again, will be nice for usingreact-with-styles). The DRP/SDP now take adaySizeprop (specifically a numerical pixel value) and then does all of its calculations based on that.This should be a fix for #203
~~I'm going to add one more commit that modifies the height calculations to use this number as well instead of reaching into the DOM. ~~
Just kidding! The fact that the month title size is still not available to me is a problem. We'll just have to wait til everything is in one place with
react-with-stylesto: @airbnb/webinfra @moonboots @ljharb
fyi: @cemremengu