Xzya / django-web-components

A simple way to create reusable template components in Django.
MIT License
159 stars 4 forks source link

Passing attributes to child components #16

Open GRardB opened 4 months ago

GRardB commented 4 months ago

Hi, there! This library is really useful. Thank you so much.

I'm wondering if it's possible to pass attributes to child components, sort of like {...props} in React. Let's say I have an input component:

{# input.html #}
<div class="...">
  <input {% merge_attrs attributes type="text" class="..." %} />
</div>

And then I wanted an input-password component, which is just an input with some extra markup/logic:

{# input-password.html #}
<div class="..." x-data="{showPassword: false }">
  {% #input type="password" x-bind:type="showPassword ? 'text' : 'password'" (...attributes) %}

  <button @click="showPassword = !showPassword">Toggle password</button>
</div>

Is there a way to accomplish this? Basically, I want input-password to have the same API as input, so if I pass in class, autofocus, etc. into input-component, they are automatically passed into the underlying input component.

Thanks!