jpsca
Slots
I have just discovered JinjaX. I really like the super clean syntax, and the ease of passing attributes to components. Awesome work!
A feature analogous to the Web Components' <slot> element could be an interesting addition.
Perhaps django-components's implementation can serve as inspiration. It supports conditional slots and nested slots.
It's definitely on the roadmap! I was thinking of maybe reusing Jinja's {% block %} feature to do it, but I haven't had the time to investigate or do it yet
I have just discovered JinjaX. I really like the super clean syntax, and the ease of passing attributes to components. Awesome work!
Thank you 😊
Another idea to go around this would be to have the ability to pass rendered components as parameters to child components. For example:
<Main hero={<Hero>Buy our product, the <strong>{{ product_name }}</strong>!</Hero>}>
We have the best product on the market yadda yadda
</Main>
Another idea to go around this would be to have the ability to pass rendered components as parameters to child components. For example:
<Main hero={<Hero>Buy our product, the <strong>{{ product_name }}</strong>!</Hero>}> We have the best product on the market yadda yadda </Main>
I'm not the biggest fan of parameter based slots. Some libraries I've seen have been moving to component based slots.
<Card>
<Card.Header>
My Card Title
</Card.Header>
<Card.Body>
<div> Some Content </div>
</Card.Body>
</Card>
We could achieve this in JinjaX by using call in preprocessing:
{% call(slot) catalog.irender("Card", **{}) -%}
{% if slot == 'Header' %}
{% call(slot) catalog.irender("Card.Header", **{}) -%}
My Card Title
{%- endcall %}
{% endif %}
{% if slot == 'Body' %}
{% call(slot) catalog.irender("Card.Body", **{}) -%}
<div> Some Content </div>
{%- endcall %}
{% endif %}
{%- endcall %}
Although this would require a change in syntax when defining components. Can't just use "content" variable directly now.
content(slot)?
content.slot?
Has to internally call caller(slot). Can't pre-render content like we do now unless you have some way of scanning which slots are implemented in component. Which could be achievable if some syntax was added for defining them inside the def statement maybe.
An advantage of this syntax is that it works better with the Jinja syntax highlighting extensions I've seen.
