Comments (6)
Hi @rheinheimer, thanks for the issues.
Height isn't actually set to the dropdown menu, it's set to the VirtualList from react-tiny-virtual-list which creates the height.
I can see the issue.
The only alternative I can see is to swap out react-tiny-virtual-list for react-virtualized specifically for AutoSizer
I'll take a look.
P.S. Thank you for the kind words and thanks for the issues!
from react-picky.
Another option could be to pass on this need to react-tiny-virtual-list, but react-virtualized looks pretty solid.
from react-picky.
Another option would be to remove virtual lists completely. The developer can use a render prop with a virtual list if they needed a performance gain with a particularly large list.
I'll give react-virtualized a look to see if I can get it to play nice. But removing them isn't off the table.
from react-picky.
@rheinheimer After playing around with react-virtualized, it's not possible to dynamically size the virtual list height based on children.
You can however use a container height. AutoResizer from RV can pass a height prop which is taken from the DOM container the component is positioned in. I don't believe it fill pleasantly fix the issue you're describing.
I could however add a prop that the developer can set to false to disable the virtual list:
- virtual - Boolean (default: true) - Disables virtual list.
Which would leave you with an "organic" list with a more flexible height.
from react-picky.
@rheinheimer if you pass virtual={false}
you won't get a virtual list but the plain list will use min-height for dropdown height.
from react-picky.
@Aidurber nice, perfect!
from react-picky.
Related Issues (20)
- Can we do groupBy feature using react-picky? HOT 2
- How to implement lazy load and windowing with react-picky? HOT 1
- Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined HOT 10
- Picky Dropdown retains the filtered list when re-opened. HOT 2
- class `picky_placeholder` is not set
- Creatable picky HOT 1
- Check "Select All" By Default in Picky HOT 2
- Is it possible to style content in the placeholder area HOT 1
- filter search box should trim spaces before and after content HOT 1
- Unable to load picky.css HOT 1
- class `picky_placeholder` is reversed from version 4.x HOT 1
- Picky 6 HOT 2
- RenderList can have it's own isSelected function based on allSelected state HOT 1
- Would like to have a singleSelectedPlaceholder HOT 2
- Picky is focused twice when navigating using tab button. HOT 1
- maxLength on filter input HOT 3
- Is it possible to close the dropdown after selection if using a single select HOT 2
- [Feature Request]: Sort the selected option to top
- IE11 isn't working in latest version of Picky HOT 2
- Problem with counter of chosen items
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-picky.