Add option for select widget to have icon only

[pierceglennie]

We're building a phone number input which has a dropdown for the country and then an input field for the text. This is all within an <InputGroup> component.

See below for what the field currently looks like:

We'd like to remove the country code (e.g. the "+44" above) from the dropdown and instead just have the flag. This is visually cleaner and makes it clearer to people that they can enter their phone number in the normal local format on the right (e.g. with a leading 0 in the UK, which gets dropped if writing in international format).

However, there are two issues with this which means it renders as below with a wide space to the right of the flag icon:

1. The select widget will not collapse below a certain width due to the native <select> within the Kiwi <Select> having 40px of left/right padding. This ends up setting a min-width on the select. This padding doesn't seem like it's necessary. If we remove it, the select is still rendered fine but it can collapse

2. In order to force no text to be shown, we have to set customValueText to a character. We've set this to a space because an empty string does not work but it would be more optimal to have a field allowing you to hide the value properly

The desired appearance is as below. We've achieved this by wrapping the <Select> component in a styled component that takes the padding off the inner <select> but this is obviously relatively fragile.