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

[pickers] Custom input component (renderInput) doesn't work with month view #6487

Closed
2 tasks done
simondriesen opened this issue Jul 13, 2021 · 2 comments
Closed
2 tasks done
Labels
bug 🐛 Something doesn't work component: pickers This is the name of the generic UI component, not the React module!

Comments

@simondriesen
Copy link

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

Using a input element for my renderInput together with the 'month' view results in errors.

Errors:
React does not recognize the 'renderInput' prop on a DOM element.
React does not recognize the 'inputFormat' prop on a DOM element.

Expected Behavior 🤔

No errors.

Steps to Reproduce 🕹

Steps:

  1. Use a input element as custom renderInput:
renderInput={({ inputRef, inputProps, InputProps }) => (
  <div className="date-period__start">
    <input ref={inputRef} {...inputProps} />
    {InputProps?.endAdornment}
  </div>
)}
  1. Enable the month view by adding this:
    views={['year', 'month', 'day']}
  2. Run the code and you should get some error messages.

I did some minimal changes to Custom input component sandbox example from next material-ui docs to recreate this issue: https://codesandbox.io/s/custominput-material-demo-forked-8i50g

Context 🔦

I want to use the 'month' view with a custom 'renderInput' without getting errors.

Your Environment 🌎

`npx @material-ui/envinfo`
  System:
    OS: Windows 10 10.0.19042
  Binaries:
    Node: 14.13.0 - C:\Program Files\nodejs\node.EXE       
    Yarn: Not Found
    npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 91.0.4472.124
    Edge: Spartan (44.19041.1023.0), Chromium (91.0.864.67)
  npmPackages:
    @emotion/react: ^11.4.0 => 11.4.0
    @emotion/styled: ^11.3.0 => 11.3.0
    @material-ui/core: ^5.0.0-beta.0 => 5.0.0-beta.0
    @material-ui/icons:  4.11.2
    @material-ui/lab: ^5.0.0-alpha.39 => 5.0.0-alpha.39
    @material-ui/pickers:  3.3.10
    @material-ui/private-theming:  5.0.0-beta.0
    @material-ui/styled-engine:  5.0.0-beta.0
    @material-ui/styles:  4.11.4
    @material-ui/system:  5.0.0-beta.0
    @material-ui/types:  6.0.1
    @material-ui/unstyled:  5.0.0-alpha.39
    @material-ui/utils:  5.0.0-beta.0
    @types/react:  17.0.13
    react: ^16.13.0 => 16.14.0
    react-dom: ^16.13.0 => 16.14.0
@simondriesen simondriesen added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Jul 13, 2021
@simondriesen simondriesen changed the title Custom input component (renderInput) doesn't work with month view Date Picker: Custom input component (renderInput) doesn't work with month view Jul 13, 2021
michal-perlakowski referenced this issue in michal-perlakowski/material-ui Jul 13, 2021
@eps1lon
Copy link
Member

eps1lon commented Jul 13, 2021

Thanks for the report.

Confirmed with latest, frozen dependencies: https://codesandbox.io/s/custominput-material-demo-forked-y5nyb?file=/demo.js

@eps1lon eps1lon added bug 🐛 Something doesn't work and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Jul 13, 2021
@flaviendelangle flaviendelangle transferred this issue from mui/material-ui Oct 13, 2022
@flaviendelangle
Copy link
Member

Has probably been fixed
Here is an update to date reproduction case

@flaviendelangle flaviendelangle added the component: pickers This is the name of the generic UI component, not the React module! label Oct 13, 2022
@flaviendelangle flaviendelangle changed the title Date Picker: Custom input component (renderInput) doesn't work with month view [pickers] Custom input component (renderInput) doesn't work with month view Oct 13, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: pickers This is the name of the generic UI component, not the React module!
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants