Add className to props

[samfirminger]

When working with styled-components, in order to override styles of a third party component, the third party component needs to accept className. See here. Without this, it makes it very hard to use this library, which is a shame because it's lightweight and exactly what I need.

[coreyward]

You could create a simple wrapper component to make this work. Something like this:

const StyledTagInput = ({ className, ...rest }) => (
  <TagsInput
    classNames={{
      tag: className, // or input: className
    }}
    {...rest}
  />
)

[stephenbaek]

@coreyward Your code works like a charm! Thanks! One follow-up question: how would you change the style of the container? For some reason, I'm seeing some ugly border of the "rti--container" and I want to get rid of it. Any help would be appreciated!

[aktas]

@coreyward Your code works like a charm! Thanks! One follow-up question: how would you change the style of the container? For some reason, I'm seeing some ugly border of the "rti--container" and I want to get rid of it. Any help would be appreciated!

In my case the hex codes did not work but the rgb did.

.rti--container {
    --rti-bg: rgb(26, 35, 50);
    --rti-border:  rgb(75, 85, 99)
}