Lets say I am creating a UI library for general consumption, and I want to use composable components. For example, Lets say I have input and form components like so:
input.hbs:
<input class="lib-input" ...attributes />
form.hbs:
<form class="lib-form" ...attributes>
{{yield (hash input=(component 'input' class="lib-form-input"))}}
</form>
And then I am creating an app that uses them like this:
application.hbs:
<Form class="my-form" as |form|>
<form.input class="my-form-input" />
</Form>
What I would like is to have the following output:
<form class="lib-form my-form">
<input class="lib-input lib-form-input my-form-input />
</form>
But I can’t get it to do that…my input is missing the “lib-form-input” class. Is there a way to make it work like this?
2 posts - 1 participant