Expandable item

[smuk3c]

I am working on smaller list where we need an option to expand item (and change height of it). It seems like current api doesn't support that. resetAfterIndex is causing re-rendering, but not refreshing the height of the actual item. Does react-window currently support this option?

[bvaughn]

resetAfterIndex should work for what you're describing. In fact, there are unit tests for this.

Can you please point me at a repro that shows what's not working for you? Here's a Code Sandbox you can fork to get started.

[IOuser]

I've added expandable items to Brian's example and it works: https://codesandbox.io/s/kmzrylpx7o
Hope it helps.

[bvaughn]

I'm going to close this for now. Will re-open if repro steps are provided. 😄

[fonty422]

I know this is closed for now, but what about an animated expanding div. Not just something with 2 hard coded values. I have a need to use the material-ui ExpansionPanel, but implementing this leaves me with a panel that expands but doesn't displace the rest of the list.

[PQALAB]

Thanks for this, it helped me a bunch

[itayganor]

@fonty422 Have you ever found a solution for animated expanding divs?

[fonty422]

@itayganor I ended up using a different package (react-virtuoso) and going through the less painful (but still painful) method of providing a pre-culled list of items. Also, the material-ui page discussed it as a recommendation (along with react-window) for large lists. The demo page will show you if it's any good for your purposes.

[itayganor]

@fonty422 This is amazing. So simple. Thank you!

I actually have a question but I don't want to spam this discussion, so I'm creating it over there.

[theconnectionist]

@itayganor I ended up using a different package (react-virtuoso) and going through the less painful (but still painful) method of providing a pre-culled list of items. Also, the material-ui page discussed it as a recommendation (along with react-window) for large lists. The demo page will show you if it's any good for your purposes.

@fonty422 @itayganor do you have sample code of how you implemented nested lists using react-virtuoso? I'm not able to find examples of how it is done.

[robertfmath]

@itayganor I ended up using a different package (react-virtuoso) and going through the less painful (but still painful) method of providing a pre-culled list of items. Also, the material-ui page discussed it as a recommendation (along with react-window) for large lists. The demo page will show you if it's any good for your purposes.

@fonty422 Thank you for bringing my attention to this package. It worked perfectly for my team's use case. Simple and easy to implement.

[fonty422]

@itayganor I ended up using a different package (react-virtuoso) and going through the less painful (but still painful) method of providing a pre-culled list of items. Also, the material-ui page discussed it as a recommendation (along with react-window) for large lists. The demo page will show you if it's any good for your purposes.

@fonty422 Thank you for bringing my attention to this package. It worked perfectly for my team's use case. Simple and easy to implement.

You're welcome. It's still my preferred package for this work for exactly this reason.