Merging spread attributes

[filipweidemann]

Hey there! I don't really want to create an issue because it really isn't one, so here we are!

Recently "spread attributes" support was added to templ: #237
Now it is finally possible to e.g. create a Button Component and then make this button spawn different AJAX calls using HTMX attributes. All of this can be defined on the used Button Component not the component markup itself which is extremely important if you want to keep your components simple & composable but open to alter their behaviour depending on where it is invoked.

Now I wanted to push this a bit further: instead of "adding" new attributes which were nonexistent on the component markup, I tried to sort of "merge" attributes and see what happens.

Something like this:

templ Component(attrs templ.Attributes) {
  <div class="my default tailwind classes" { attrs... }>
    { children... }
  </div>
}

templ MyView() {
  @Component(templ.Attributes{"class": "more tailwind classes"})
}

The motivation behind this is that the component conveniently handles a "default" use case so that it can just be invoked without any stylistic changes for 80% of the time, but if you need to somehow tweak it you can do so by adding your required classes where you use the component without extending the component itself.

However, as we all expect, this does not work. The class key inside the templ.Attributes will just be ignored.

Now here is the actual question / entry point for discussion:
Do we want this? Is it actually useful? And if so, how could this be implemented? Could attributes just be merged? Or should it be more sophisticated? Maybe instead of altering the spread attributes functionality, the actual CSSClasses struct could be used / altered instead?

Let's talk about it! :)