Fix positioning of the dropdown and show selected

[wkerswell-gresham]

Fix for issue #50

I have added the selected prop to the menu item which scrolls to the correct place in the list.
I have remove the ref on the menu and the programmatic scrollTo.
The selected props isn't used on the native select so I have not put on the items there.

When an item is in the preferred and the main countries list both items are highlighted as selected and the list scrolls to the correct location in the main list.

I have tested all the inputs on the demo.jsx manually and all seem to be work as I would expect.

[wkerswell-gresham]

@alexplumb Any chance of a review?

[anking]

Not sure if my problem is related to this issue but I'm experiencing the issue with positioning as well, for me the country window always does into the browser left top corner:

[wkerswell-gresham]

Yeah that is what I was getting. This should solve that.

[AntwanSherif]

@wkerswell-gresham I have the same issue of positioning. Could you please merge the pull-request ASAP in order to fix this :)

[wkerswell-gresham]

@AntwanSherif I am not a maintainer so I cannot merge it :/

[AntwanSherif]

@wkerswell-gresham Is there anyway that I can use this fix locally?
I've tried downloading the package, update the index.js with your fix and then build locally, but I have webpack issues.

Do you suggest a better idea?

[wkerswell-gresham]

You should be able to point to my branch specifically in your package.json.

{
    ....
    "material-ui-phone-number": "https://github.com/wkerswell-gresham/material-ui-phone-number.git#remote",
    ...
}

Would still be better if this was actually merged as this is not a great options for me as our security won't allow us to build from remote like this.