Cannot pass down properties when nesting components

[bzp99]

Context

I would like to have an ‘outer’ WebC component that takes a property foo and inside its markup it refers to another, ‘inner’ WebC component, which has a slot. I want to pass on the value received for the property foo in the outer component to the inner component’s slot.

MWE

I attempted this the following way.

content/index.webc:

<h1>Test page</h1>
<outer-comp @foo='lorem ipsum'></outer-comp>

_components/outer-comp.webc:

<h2>Outer Component</h2>
<inner-comp @text=foo></inner-comp>

<style webc:scoped>
  h2 {
    text-decoration: underline;
  }
</style>

_components/inner-comp.webc:

<h3>Inner Component</h3>
<p>Slot content below</p>
<slot>[DEFAULT]</slot>

<style webc:scoped>
  :host {
    display: block;
    max-width: 600px;
    border: 1px solid red;
  }
</style>

Expected Output

I would expect the text lorem ipsum to be displayed in the red box of inner-comp, since outer-comp passes the value of foo to the special @text property that should set the content between the inner-comp tags.

Something like:

Test page

Outer Component

+----------------------+
| Inner Component      |
|                      |
|  Slot content below  |
|                      |
|  lorem ipsum         |
+----------------------+

Actual Output

The slot remains empty. Interestingly, it seems to be set empty explicitly, as the default slot content ([DEFAULT]) is not displayed.

Test page

Outer Component

+----------------------+
| Inner Component      |
|                      |
|  Slot content below  |
|                      |
+----------------------+

---

Am I misunderstanding or doing something wrong? If this is a bug, what workaround could I seek? Thanks in advance.

[bzp99]

I also tried using the dynamic property syntax in outer-comp like :@text=foo.

In this case, it is as if I did not set anything at all and inner-comp displays [DEFAULT].