Material-ui: [API] Support React.forwardRef component type

[jgoux]

Hello,

• [x] This is a v1.x issue (v0.x is no longer maintained).
• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

The ButtonBase component shouldn't trigger a warning when passing a value to its component prop.

Current Behavior

A warning is triggered : Warning: Failed prop type: Invalid prop component supplied to ButtonBase.

Steps to Reproduce (for bugs)

https://codesandbox.io/s/w6ln223vz5

Context

Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | v1.2.1 |
| React | v16.3.2 |

[oliviertassinari]

@jgoux It's just a warning. I think that it comes from this line:

let Link = forwardRef(({ innerRef, ...props }, ref) => (

https://github.com/reach/router/blob/653f8e89e62190a6ae599f119105c3b5e608c690/src/index.js#L371
https://codesandbox.io/s/r5qm6469yq

[jgoux]

Indeed! I'm ok with this solution, thanks a lot Olivier. 😉

[oliviertassinari]

Here we are, it's an object!

const FancyButton = React.forwardRef((props, ref) => (
  <button ref={ref} className="FancyButton">
    {props.children}
  </button>
));

console.log(typeof FancyButton); // object

So I believe we have to update all the prop-types:
https://github.com/mui-org/material-ui/blob/238d6c35743322fc75a8bacd0387ed92ad83083e/packages/material-ui/src/ButtonBase/ButtonBase.js#L349

-component: PropTypes.oneOfType([PropTypes.string, PropTypes.func]), 
+component: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.object]), 

[jedwards1211]

I kinda wish React exported a componentPropType now...

[NMinhNguyen]

@jedwards1211 a bit late to the party, but this might be helpful :) https://github.com/facebook/react/tree/v16.4.1/packages/react-is#determining-if-a-component-is-valid

[oliviertassinari]

@NMinhNguyen Thanks for the link. Yes, it's an opportunity to improve the component property type checking. Right now, it's almost like we have an any. However, some work needs to be done to convert the package into a proptype that will be pruned in production. Are you interested in this task? :)

[NMinhNguyen]

@oliviertassinari

Are you interested in this task?

I am indeed :) Will try to prepare a PR in the next few days!