Accessing individual Slot Items

[jsjexpert]

The new Slots API is a great addition and a much cleaner way to handle nested components. Great work!

One issue I'm facing is in handling the individual items in the Slot array. Currently the rendered Slot is returned wrapped in a div, which in most cases is fine, but when paired with 3rd party libraries, can cause problems.

My test case is with react-slick, which accepts children. Each child renders a slide for the carousel. Because Slot returns

wrapped element, each entry in the slot is shown together on a single slide, rather than each item as it's own slide.

Creating an array of slot items doesn't feel like the right solution and introduces its own weirdness.

Is there already a solution for this that i haven't found?

Ideally, I would see the slot item as having a render function and a map function that can be explictly called, or a flag like wrapper: false on the field config which alters the render output to be an array of components instead of a single wrapped component.

[FedericoBonel]

Hey @jsjexpert! Sorry for the long delay on responding. We actually have a feature request tracking that here: #965. That change would allow you to switch the wrapper element to whatever you need.