react-datepicker icon indicating copy to clipboard operation
react-datepicker copied to clipboard

Since there's a wrapperClassName to set className on the parent wrapper. why not something like innerWrapperClassName to set className on the inner wrapper?

Open owlcode3 opened this issue 2 years ago • 1 comments

<div class="react-datepicker-wrapper outer">
<div class="react-datepicker__input-container react-datepicker__view-calendar-icon inner">
<svg class="react-datepicker__calendar-icon " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
<path d="M96 32V64H48C21.5 64 0 85.5
 0 112v48H448V112c0-26.5-21.5-48-48-48H352V32c0-17.7-14.3-32-32-32s-32
 14.3-32 32V64H160V32c0-17.7-14.3-32-32-32S96 14.3 96 32zM448 192H0V464c0 26.5 21.5 48 48
 48H400c26.5 0 48-21.5 48-48V192z"></path></svg>
<input placeholder="select date" class="rounded-xl text-black focus:outline-none placeholder-[#000000]
 placeholder-opacity-70 bg-[#D9D9D9]  w-full" type="text" value="">
</div>
</div>

I could add extra className to the parent wrapper ( i did added "outer" className ) thanks to the wrapperClassName property. What if i want something similar on the inner wrapper ( the inner div holding svg and input element ) ? A similar property name to wrapperClassName would be cool.

owlcode3 avatar Dec 18 '23 21:12 owlcode3

Currently, there is no functionality to set the Custom class name for react-datepicker__input-container. It seems to me that you should request additional functionality for inputContainerClassName Props or use a descendant selector of the outer class for styling. (e.g. .outer .react-datepicker__input-container)

yuki0410-dev avatar Mar 24 '24 14:03 yuki0410-dev