Need a way to call AutosizeInput's copyInputStyles when styles are changed at runtime

[JemarJones]

Are you making a feature request?

I'm running into an issue where input styles are changing at runtime, and the width is being calculated incorrectly as a result. I've dug into it and identified the issue as one of the react-input-autosize gotchas. The note there recommends calling copyInputStyles when styles change to fix this issue. But there doesn't seem to be a way to do this because it's hidden within react-select. If this is the official solution suggested by react-input-autosize, then it should be possible to make use of this in some way.

• What's your use case?
  • I've got a select on a page where the font-size decreases on mobile based on a media query. When starting off on one size (ie desktop) and resizing to another (ie mobile), typing into the component results in an off center input. This is because the width is being calculated incorrectly.
  • I'm using v2
• What interface do you have in mind? Probably expose a method on ReactSelect itself that calls this method, so that it can be called when one has a ref to ReactSelect.

[ebonow]

Greetings @JemarJones,

I confirmed that this issue still exists. It could be possible to pass in another key as suggested in the pain points, but this could potentially interfere with the focus of the input.

Here is an attached demo to demonstrate the behavior in action which updates the fontSize every 3 seconds: codesandbox

[ebonow]

@JemarJones ,

Greetings and thought to follow up with you.

Given this and another issue in the backlog due to the AutosizeInput, I decided to try my hand at recreating the auto-sizing functionality with more of a css-based approach. I am working on this as a possible replacement and still need to resolve possible ie11 compatibility issues.

https://codesandbox.io/s/react-select-autosizinginput-dgyy1?file=/src/App.js