Target specific CSS classes with Styled Components

Since styled-components is just CSS™ you'd do it like with any other style sheet, by using the class names react-datepicker provided.

The only difference is that you'll have to wrap the datepicker in one wrapper styled component which applies all of these classes:

const Wrapper = styled.div`
  &.react-datepicker {
    color: blue;
  }
`

<Wrapper>
  <Datepicker />
</Wrapper>

Searching for hours, I found that the best solution is to add a stylized parent component (it can be a div) overlying the component that needs a className and add the definition of the className directly into the stylized parent component.

VERY IMPORTANT:
A space is needed between the ampersand & and the class for this to take effect!

const StyledParent = styled.div`
   & .your-class-name {
     border-color: red;
   }
`;

<StyledParent>
   <Datepicker yourClassName="your-class-name" />
</StyledParent>