Allow to fill slots through props

[lianulloa]

What problem does this feature solve?

I'm making a modal component, which has as default body a simple card. This card has header, body and footer. Each one of these has a slot within. The structure would be something like this:

Modal
  Card
    Header
      slot
    Body
      slot
    Footer
      slot

So, it works fine declaratively. But I want to be able to use this modal like a global component and to open and set its content, from any other component through a function call (using a event bus for example). For this I want to be able to set the content in those slots through props to the modal

What does the proposed API look like?

Maybe it could be something like this:

<modal $slots="{headerSlot: <some-component || just-text />, bodySlot: ... } " />

[posva]

See #7765