Components with secondary classnames

Hi, I’m wondering if there is a solution to using styled-components with existing libraries. Lots of libraries adopt customization to css via multiple className props. For example, react-select uses className and optionClassName in a component. Would it be useful to support something like:

const MySelect = styled(ReactSelect)`
  border: red;
  [optionClassName]
  color: blue;
`

[kitten]

Just pass in className to the generated styled component and it’ll be appended on the prop 😉

[mxstbr]

We’ve decided against introducing a method that let’s you manually get a CSS class name from a CSS string to avoid people overusing it and thusly defeating the whole point of the library. (it’s strictness)

I’m going to close this issue because this is now possible with v2 and the .attrs selector:

const optionClassName = 'option';

const MySelect = styled(ReactSelect).attrs({
  optionClassName,
})`
  .${optionClassName} {
    // style an option here!
  }
`