[TwigComponent] Ignore "nested" for Alpine & Vue attributes

[smnandre]

Q	A
Bug fix?	yes
New feature?	no
Issues	Fix #1839
License	MIT

Have lost time on Twig & the website 😓

Alternative implementation of #2325

Update: Improved __toString performance following @Kocal comments

---

Now all these attributes are directly rendered

Framework	Prefix	Code Example	Documentation
Alpine.js	x-	<div x-data="{ open: false }" x-show="open"></div>	Documentation Alpine.js
Vue.js	v-	<input v-model="message" v-if="show">	Documentation Vue.js
Stencil	@	<my-component @onClick="handleClick"></my-component>	Documentation Stencil
Lit	@	<button @click="${this.handleClick}">Click me</button>	Documentation Lit

[WebMamba]

I am sorry but I don't like the solution taken here. I like way more the initial solution taken here: #2325. I think we should not add code specific to another framework, and I don't think that we should ignore nested attributes without making them implicit for the user. I think we should focus on a solution like the initial solution where the user choose to ignore it implicitly.

[Kocal]

What about #2325 (comment) then?
People will have to adapt their code to make it works with Twig Components?

I don't find that super friendly, it not obvious at all, and can be a source of frustration to the user even if it's documented (and document that you need to explicitly use a new syntax to disable nested attributes to makes your code works, feels like a loss to me)

[smnandre]

Are we really considering there is real scenario where someone

• has a component
• has a child component in it named "x-on"
• uses nested attributes

?

Regarding specific code, we have some for LiveComponent & Alpine already. On the other hand, opening a new char / syntax in the attributes will be a change with many more problems.

[Kocal]

Thank you @smnandre for taking care of this regression.