react-svg-inline
react-svg-inline copied to clipboard
MoOx
Add feature to skip applying the className to the wrapping component
This is useful when using inline CSS libraries such as aphrodite that don't support child selectors. For example, you can define your style definition with aphrodite like normal, then use this new component prop 'skipOuterClass' along with the prop classSuffix='' as a way to target just the child svg element.
If you just className="" classSuffix="YourClass" this should do the same without any needs to modify this component, am I right?
Ah, yup! Yeah that will work.
Technically you have to add a space before the class like this classSuffix=" YourClass", but that's not really a big deal.
Maybe we could think of a better (simpler way)? What about classNameWrapper & className (no more suffix)?
classNameWrapper and className is a good idea. Or the inverse could work too className and subClassName which is what I'm using on a similar component.
