n.spacing is not a function

[Falkovic1993]

Hey Alex,

Getting this error when trying to add the component to my site.

Warning: Material-UI: the `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.

I'm just importing it: import MuiPhoneNumber from 'material-ui-phone-number';

And then using it: <MuiPhoneNumber defaultCountry="us" onChange={this.handleChange} />

Seems like an issue with the Theme and it can't find the spacing? You have any ideas about how to fix this?

[hassanabbas9]

same issue, + 1

[Falkovic1993]

This got fixed by updating to the new version of material-UI v4. The spacing has changed in that version which was the reason it broke.

When clicking the flag tho, it's really slow to open up the list of countries. What could that be?

[alexplumb]

Thanks for the update, @Falkovic1993. Yes, @material-ui/core@4 is required for version 2 of this package - if you are currently on @material-ui/core@3, please downgrade to version 1.

If you're concerned about performance, please either include the specific countries you want in the onlyCountries parameter, or use a native select by using the native flag. I plan on adding react-window support soon in order to resolve the performance issues that some people have.

[vinaydate]

Still having the issue.

"@material-ui/core": "^4.1.3",
"material-ui-phone-number": "^2.0.0",
"@material-ui/styles": "^4.1.2", (it is actually 4.2.0)
I have tried with exact 4.1.2 version of styles as well, with same outcome

[alexplumb]

@vinaydate Can you confirm that you're using the ThemeProvider component in your code? This library does make use of the spacing method of the theme provider, specifically the @material-ui/styles/ThemeProvider component.

[alexplumb]

Actually, you know what, I just released an update (2.0.1) that removes the reliance on the theme provider. Please upgrade and let me know if that fixes it for you.

[vinaydate]

Hello I decided and went ahead with plain TextField instead of your component and validate it for phone number. And I am fine with this. So don't know if your upgrade has fixed that. Thank you very much for quick response. Regards

…

On Thu, Jul 18, 2019 at 12:28 AM Alex Plumb ***@***.***> wrote: Actually, you know what, I just released an update (2.0.1) that removes the reliance on the theme provider. Please upgrade and let me know if that fixes it for you. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#18?email_source=notifications&email_token=ABQSVRGMZOM6WNJWHUDQWJLP75TVHA5CNFSM4H5W3D62YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD2GIEWI#issuecomment-512524889>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABQSVRDXO4TYLLW2OSS5TU3P75TVHANCNFSM4H5W3D6Q> .