React-dates: Is it possible to customize dimensions of DayPicker?

[alexfedoseev]

AFAIСT width of wrapper div in horizontal orientation is inlined and it's not possible to configure it in userland. Is this correct or there is a way to change root element's dimensions?

[majapw]

Hello! I have been working on adding a daySize prop here - https://github.com/airbnb/react-dates/pull/249

The idea being that most of the calculations come from the size of each day and if we allowed for customizing that from the standard 39px, everything else follows. I haven't had much bandwidth to work on it recently but I can get back to that.

[alexfedoseev]

Hi! Thanks for the response, I'm not familiar w/ internals and most likely in context it makes sense to define day cell width -> calculate container width instead of the opposite (define container width -> calculate day cell width), tho in most of the cases developer will be doing calculations to inject inline picker into layout.

Just wondering: why things can't be calculated via css, i.e. day-cell's width is calculated by the browser, depending on container's width, which is set via css class? It seems more flexible and might be faster in terms of rendering.

[majapw]

@alexfedoseev sorry for never getting back to this! The reason it can't be css-only is largely due to the animations.

Also we will probably be moving to a more css in JS solution in the future so writing this in as a prop makes the most sense.

[majapw]

daySize exists as a prop now so I will be closing this issue. :)

[florentdestremau]

hi, digging up this topic to make sure I understood @majapw clearly: If I want a full-width calendar say on a column in a responsive layout, I can't do it with css ?