How to customize the props of component.Item

[ChiaJune]

I want to use react-virtuoso in @material-ui/Autocomplete

[petyosi]

If I understand you correctly, In v1, you can pass an array to data property - the items will be passed to the itemContent callback - check this example.

Let me know if this makes sense.

[mbrevda]

Any demo of this working? Here is a codesandbox mostly working, but there are still some quirks. For example, the list wont open (I have it hardcoded to be open). Also, the list won't scroll when using up/down arrow keys to move through the list. Would be great to get this fully working!

https://codesandbox.io/s/material-demo-forked-r6i2y?file=/demo.tsx

[Mario-Eis]

Is there any resolution yet? Passing props to the items content is not enough. props must be passed to the items root directly

[petyosi]

This is now addressed with the context prop.

[Mario-Eis]

Is this documented? Passing anything to the context prop does not change the context parameter in the Components interface.

  <Virtuoso
            style={{height: "400px"}}
            data={itemData}
            context={itemData.map(data => data.props)}
            components={MUIComponents}
            itemContent={(index, {props, option}) => option.text}
        />

const MUIComponents: Components<any> = {
    List: List,
    Item: (props, context) => {
        console.log(context)
    }
}

context is {}. But the prop was an array.

Update: The context seems to be included in the props. Is this what is intended? that makes handling very difficult. I cant find anything on that in the docs...

[mbrevda]

This is now addressed with the context prop.

There seems to be some confusion around this. Is there an example or docs of how to use context?

[petyosi]

Several of the examples in the docs are using it. What's the confusion?