Cannot style wrapper when invalid input is typed

User can type invalid date into the input field. I’d like to control the styling of the wrapper (.react-date-picker__wrapper) whenever such situation occurs. Currently this does not seem to be possible as there’s only native :invalid pseudo-class on the hidden input, which is insufficient as one cannot style parent depending on the state of the child.

Since there’s already .react-date-picker--open class added for the opened state, could there be .react-date-picker--invalid for the invalid state?

Alternatively, adding support for onValid and onInvalid hooks would also provide the ability to implement custom styling.

[pjg]

Thanks for the update! Unfortunately lack of browser support for :has() limits its usefulness. I also thought about iterating over all inputs, but that seems a little bit overkill. Ideally react-date-picker should bubble up the invalid class name to the main container element 😉

[wojtekmaj]

Fixed that in make-event-props@1.3.0. This didn’t seem to be a burning issue so we won’t create a patch release just to force-bump make-event-props, but if fresh installs or manually installing said dependency should pick the update up.