You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I've developed a component based on <Select /> where options are loaded dynamically based on string query from the menu search input. Because of that async load, the menu is initially smaller and fits to the viewport with that state. After options are loaded, list gets bigger and goes off the screen (if component is rendered near an edge).
This is not a v0.x issue.
I have searched the issues of this repository and believe that this is not a duplicate.
Expected Behavior 🤔
The menu being repositioned after its content changes. If it is not enough space below, it (or Popover?) should grow up instead of down. I need to stressed that it is repositioned after manually resized screen.
I was thinking about forcing resize or something like that. Maybe I can get any suggestion how to handle this kind of problem the right way?!
Current Behavior 😯
Mentioned above, examples below.
Examples 🌈
It is ok, when there is enough space.
As the component is rendered at the bottom of the page, there is the problem.
The black part is the desktop 😉
The text was updated successfully, but these errors were encountered:
I've developed a component based on
<Select />
where options are loaded dynamically based on string query from the menu search input. Because of that async load, the menu is initially smaller and fits to the viewport with that state. After options are loaded, list gets bigger and goes off the screen (if component is rendered near an edge).Expected Behavior 🤔
The menu being repositioned after its content changes. If it is not enough space below, it (or Popover?) should grow up instead of down. I need to stressed that it is repositioned after manually resized screen.
I was thinking about forcing resize or something like that. Maybe I can get any suggestion how to handle this kind of problem the right way?!
Current Behavior 😯
Mentioned above, examples below.
Examples 🌈
It is ok, when there is enough space.

As the component is rendered at the bottom of the page, there is the problem.

The black part is the desktop 😉
The text was updated successfully, but these errors were encountered: