Sync with ember-template-lint

Author: NullVoxPopuli

docs/rules/template-no-splattributes-with-class.md

@@ -2,52 +2,59 @@
 
 <!-- end auto-generated rule header -->
 
-Disallow using `...attributes` with `class` attribute.
-
-When using `...attributes` (splattributes), any classes passed from the parent component will be automatically merged with the component's own classes. Adding a `class` attribute alongside `...attributes` can lead to confusion about which classes take precedence.
+This rule enforces that when using `...attributes` (spread attributes), you should not also use a `class` attribute. The `...attributes` syntax is used to forward HTML attributes from a parent component to a child component, and it already handles class merging automatically.
 
 ## Examples
 
 This rule **forbids** the following:
 
-```gjs
-<template>
-  <div ...attributes class='foo'>
-    content
-  </div>
-</template>
+```hbs
+<div ...attributes class='foo'>
+  content
+</div>
 ```
 
-```gjs
-<template>
-  <div class='foo' ...attributes>
-    content
-  </div>
-</template>
+```hbs
+<div class='foo' ...attributes>
+  content
+</div>
 ```
 
 This rule **allows** the following:
 
-```gjs
-<template>
-  <div ...attributes>
-    content
-  </div>
-</template>
+```hbs
+<div ...attributes>
+  content
+</div>
 ```
 
-```gjs
-<template>
-  <div class='foo'>
-    content
-  </div>
-</template>
+```hbs
+<div class='foo'>
+  content
+</div>
 ```
 
 ## Why?
 
-When using `...attributes`, classes are automatically merged from parent components. Using a `class` attribute alongside it creates confusion about which classes take precedence and can lead to unexpected styling behavior.
+When using `...attributes`, any classes passed from the parent component will be automatically merged with the component's own classes. Adding a `class` attribute alongside `...attributes` can lead to confusion about which classes take precedence and may result in unexpected styling behavior.
+
+For example:
+
+```hbs
+{{! Parent component }}
+<MyComponent class='parent-class' />
+
+{{! MyComponent template }}
+<div ...attributes class='child-class'>
+  {{! This is confusing: which class takes precedence? }}
+</div>
+```
+
+Instead, you should either:
+
+1. Use `...attributes` alone to allow class merging from the parent
+2. Use `class` alone if you want to enforce specific classes
 
 ## References
 
-- [Ember.js Guides - Splattributes](https://guides.emberjs.com/release/components/component-arguments-and-html-attributes/#toc_html-attributes)
+- [Splattributes](https://guides.emberjs.com/release/components/component-arguments-and-html-attributes/#toc_html-attributes) in the Ember.js guides