search

sanniassin / react-input-mask

Input masking component for React. Made with attention to UX.
MIT License
2.22k stars 258 forks source link

Mui compatibility #327

Open tomekxoxo opened 1 month ago

tomekxoxo commented 1 month ago

I am trying to pass Input mask into Autocomplete imported from MUI. tested on 2. and 3. versions of the react-input-mask library.

` <Autocomplete disablePortal id="combo-box-demo" options={[ { label: 'The Shawshank Redemption', year: 1994 }, { label: 'The Godfather', year: 1972 }, ]} sx={{ width: 300 }} renderInput={({ ...props }) => (

{() => ( )} 
            )}
          />

`

I Get error

react-input-mask: the following props should be passed to the react-input-mask's component and should not be altered in children's function: disabled.

If i alter the code

`<Autocomplete disablePortal id="combo-box-demo" options={[ { label: 'The Shawshank Redemption', year: 1994 }, { label: 'The Godfather', year: 1972 }, ]} sx={{ width: 300 }} renderInput={({ disabled, ...props }) => (

{() => ( )} 
            )}
          />`

I get another error

Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.