search

pstanoev / simple-svelte-autocomplete

Simple Autocomplete / typeahead component for Svelte
http://simple-svelte-autocomplete.surge.sh/
MIT License
464 stars 78 forks source link

[no-issue] Added support to scroll-aware list dropdown positioning #148

Closed atomcat1978 closed 2 years ago

atomcat1978 commented 2 years ago

If the component was placed on the bottom of a page, the dropdown increased the body size, leading to styling issues (look and feel of the page might be altered due to larger body size).

Regarding the scroll position scenarios the component mimics the behaviour of the built-in component: -if there is not enough room for the list to display below the component, it is displayed above the component. -if there is enough room for the list to display below the component, it is displayed below the component.

For correct size calculation and to avoid dependency on properly set max-size CSS property the .autocomplete-list.hidden css class was updated to use visibility: hidden instead of display:none. The former results in correct bounding client rect when the list is hidden.

atomcat1978 commented 2 years ago

@pstanoev Any thoughts around? I think, it could be an issue for many users.

pstanoev commented 2 years ago

I like it. I want to checkout the branch to test it. Will merge it after that. Thanks for the contribution.

atomcat1978 commented 2 years ago

U R welcome.

atomcat1978 commented 2 years ago

Is this going to be merged in the foreseeable future? We would need this change so that we could use the component.

atomcat1978 commented 2 years ago

Any update?

pstanoev commented 2 years ago

Published in version 2.4.1.