search

vtaits / react-select-async-paginate

Wrapper above react-select that supports pagination on menu scroll
MIT License
303 stars 75 forks source link

Set Width of Container as Max Width Plus loading icon width #143

Closed dennisteambrandit closed 1 year ago

dennisteambrandit commented 1 year ago

Are you submitting a bug report or a feature request or a question?

feature request + question

What is the current behavior?

Would like if the container would match the max content of the options plus the width of the loading icon when fetching data. currently if there is a long option selected and you load more options, the container will flicker because the loading icon comes in and out.

What is the expected behavior?

Would like the width of the container to be set as max content + width of loading icon.

vtaits commented 1 year ago

Hello. It's a behavior of react-select. Loading indicator is not rendered when isLoading is false.

https://github.com/JedWatson/react-select/blob/c350a124f8de853a79e0158578d438a35e67e63e/packages/react-select/src/Select.tsx#L1796

But you can fix width of component IndicatorsContainer.

https://github.com/JedWatson/react-select/blob/c350a124f8de853a79e0158578d438a35e67e63e/packages/react-select/src/Select.tsx#L2121

You can redefine this component or set styles for indicatorsContainer.

https://react-select.com/styles