search

inokawa / virtua

A zero-config, fast and small (~3kB) virtual list (and grid) component for React, Vue, Solid and Svelte.
https://inokawa.github.io/virtua/
MIT License
1.32k stars 45 forks source link

Consider removing wrapper div of items #310

Open inokawa opened 10 months ago

inokawa commented 10 months ago

However, in current architecture, we can't assign ResizeObserver and position to items without it.

inokawa commented 10 months ago

As a workaround, you can override item prop of Virtualizer and use React.cloneElement in it. https://github.com/inokawa/virtua/blob/main/stories/react/advanced/With%20cmdk.stories.tsx

It may be better to add a shorthand like <Virtualizer item={false}>. As an important point, without wrapper div, ResizeObserver doesn't detect border by default, and margin at all. We have to change configuration for it.

wanecek commented 7 months ago

Hi! Been struggling to find any list-virtualization plugin that allows this, so it'd be fantastic if virtua did. You mention that you can overwrite the itemprop on Virtualizer in React - is there a similar workaround for ListItem in the Vue implementation?

inokawa commented 7 months ago

Hello @wanecek , Vue Virtualizer doesn't have item prop yet but it would be possible to implement the feature. Currently I don't have time to do it, but contribution is welcome if anyone want to help.

inokawa commented 6 months ago

React 19 will have ref cleanup function. I'll try it after release.