Warning: Unknown props on <div> tag.

I have this error with disableTriggerFocus, disableTriggerHover props. these two props are shared between logic and style part of a tooltip component. How can I handle shared props for style purpose and logic component purpose?

Version

2.1.1

Reproduction

https://www.webpackbin.com/bins/-KxN8G3pDI0nHJTNmExw

Steps to reproduce

Open the webpackbin reproduction and open the chrome devTools console. there you can see the React Warning message.

Expected Behavior

Props used for Styled-component will be filtered by the wrapper function styled

Actual Behavior

passing these two variable return this unwanted warning.

[oyeanuj]

@mxstbr I have a similar issue with Styled(Link) where I am using a prop for styling the link and it gets passed to React-Router’s Link which further passes it to the DOM leading to the warnings. Is there a recommended way to prevent that styling prop from being passed?

[tgroutars]

@mxstbr Can we re-open this? It would be great to have the possibility to pass props that are only meant for styling. What about a prop with a specific name that would not be passed down, like styledProps or something? Would let us pass an object with values used only for styling Not saying it’s the best idea, but there should be a solution around this