Radium: Allow bypassing Radium's custom element check

[exogen]

Radium does not resolve styles on custom elements (non-DOM elements) because it could be unsafe. However, when you have components that you know would work with Radium, like react-routers Link, or a material-ui component, you should be able to override this check.

Asked in #249, #257 so far.

[ianobermiller]

Repost and expansion from #257

We could add some sort of sentinel that tells Radium to process the style even though it is a custom component, like style={Radium.forceResolveStyles([style1, style2])}.

Keep in mind that the custom component will also have to pass along the event handlers (onMouseEnter, etc) for Radium to work correctly. Probably best if the component does {...this.props} inside.

Radium.forceResolveStyles will definitely be an advanced feature with these caveats.

[ianobermiller]

Another possibility is a config value passed to @Radium. I've been toying with the idea of @Radium taking an optional configuration object:

@Radium // <-- works as normal

@Radium() // <-- same as above

@Radium({
  allowCustomElements: true, // <-- better name needed
}) // <-- config!

[ianobermiller]

Do you think this config flag is still useful in light of the simple workaround of wrapping the component in Radium?

let {Link} = require('react-router');
Link = Radium(LInk);

[ianobermiller]

ping @exogen

[ianobermiller]

Closing, since there is a simple workaround.

[MaxSvargal]

radium(Link) is not testable with shallow renderer =(

[dkrieger]

The workaround only works when the component doesn't wrap another custom component. Sorry to necro this issue but can it be reopened?