Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Invalid prop 'Component' supplied when using a custom component #40

Closed
jsheffers opened this issue Mar 26, 2020 · 2 comments · Fixed by #44
Closed

Invalid prop 'Component' supplied when using a custom component #40

jsheffers opened this issue Mar 26, 2020 · 2 comments · Fixed by #44

Comments

@jsheffers
Copy link

jsheffers commented Mar 26, 2020

I'm trying to implement this with the TextareaAutosize component from Material UI. I'm creating a functional component and including it. It works, however, it throws a warning in the console:

Warning: Failed prop type: Invalid prop `Component` supplied to `t`.

It seems to function properly. Should I be doing this a different way? Codesandbox with this replicated:

const CustomTextarea = forwardRef((props, ref) => (
  // If I don't forward the ref I get an error...
  <TextareaAutosize
    placeholder="Material-ui through custom component..."
    {...props}
    ref={ref}
  />
));

<TextInput
    Component={CustomTextarea}
    options={["One", "Two", "Three", "Four", "Five"]}
    onChange={handleChange}
    value={typingMessage}
/>

Full example: https://codesandbox.io/s/fervent-hamilton-8pt2z

@jsheffers jsheffers changed the title Usage with material-ui TextareaAutosize Invalid prop 'Component' supplied when using a custom component Mar 26, 2020
@yury-dymov
Copy link
Owner

Component: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.func,
  ]),

This is current validation. Maybe something is missing but I don't have time to support this at the moment, so I will gladly review and merge PR.

Given that it is a warning, I would just ignore it for now. I don't plan do any significant changes here, so you should be good

@silverwind
Copy link
Contributor

silverwind commented Apr 17, 2020

I guess PropTypes.elementType might solve it (added in prop-types@15.7.0).

silverwind added a commit to silverwind/react-autocomplete-input that referenced this issue Apr 17, 2020
Components wrapped in `forwardRef`do not identify as a function but as a
object. Use PropTypes.elementType to allow those as well.

Fixes: yury-dymov#40
silverwind added a commit to silverwind/react-autocomplete-input that referenced this issue Apr 17, 2020
Components wrapped in `forwardRef`do not identify as a function but as a
object. Use PropTypes.elementType to allow those as well.

Fixes: yury-dymov#40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants