feat(sort-attributes): support {@Attach}

Author: baseballyama

docs-svelte-kit/package.json

@@ -56,7 +56,7 @@
     "sass": "^1.81.0",
     "source-map-js": "^1.2.1",
     "stylus": "^0.64.0",
-    "svelte": "^5.2.10",
+    "svelte": "^5.30.1",
     "svelte-adapter-ghpages": "0.2.2",
     "twoslash-eslint": "^0.3.0",
     "twoslash-protocol": "^0.3.0",

packages/eslint-plugin-svelte/package.json

@@ -64,7 +64,7 @@
     "postcss-load-config": "^3.1.4",
     "postcss-safe-parser": "^7.0.0",
     "semver": "^7.6.3",
-    "svelte-eslint-parser": "^1.1.1"
+    "svelte-eslint-parser": "^1.2.0"
   },
   "devDependencies": {
     "@babel/core": "^7.26.0",
@@ -95,7 +95,7 @@
     "sass": "^1.81.0",
     "source-map-js": "^1.2.1",
     "stylus": "^0.64.0",
-    "svelte": "^5.2.9",
+    "svelte": "^5.30.1",
     "svelte-i18n": "^4.0.1",
     "tsx": "^4.19.2",
     "type-coverage": "^2.29.7",

packages/eslint-plugin-svelte/src/utils/ast-utils.ts

@@ -462,7 +462,8 @@ export function getAttributeKeyText(
 		| SvAST.SvelteStyleDirective
 		| SvAST.SvelteDirective
 		| SvAST.SvelteSpecialDirective
-		| SvAST.SvelteGenericsDirective,
+		| SvAST.SvelteGenericsDirective
+		| SvAST.SvelteAttachTag,
 	context: RuleContext
 ): string {
 	switch (node.type) {
@@ -480,6 +481,8 @@ export function getAttributeKeyText(
 				node.key.modifiers.length ? `|${node.key.modifiers.join('|')}` : ''
 			}`;
 		}
+		case 'SvelteAttachTag':
+			return '@attach';
 		default:
 			throw new Error(
 				`Unknown node type: ${

packages/eslint-plugin-svelte/tests/fixtures/rules/sort-attributes/invalid/attach-tag-errors.yaml

@@ -0,0 +1,4 @@
+- message: Attribute '@attach' should go before 'foo'.
+  line: 14
+  column: 10
+  suggestions: null

packages/eslint-plugin-svelte/tests/fixtures/rules/sort-attributes/invalid/attach-tag-input.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { Attachment } from 'svelte/attachments';
+
+
+	const myAttachment: Attachment = (element) => {
+		console.log(element.nodeName); // 'DIV'
+
+		return () => {
+			console.log('cleaning up');
+		};
+	};
+</script>
+
+<div foo {@attach myAttachment}>...</div>

packages/eslint-plugin-svelte/tests/fixtures/rules/sort-attributes/invalid/attach-tag-output.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { Attachment } from 'svelte/attachments';
+
+
+	const myAttachment: Attachment = (element) => {
+		console.log(element.nodeName); // 'DIV'
+
+		return () => {
+			console.log('cleaning up');
+		};
+	};
+</script>
+
+<div {@attach myAttachment} foo>...</div>

packages/eslint-plugin-svelte/tests/fixtures/rules/sort-attributes/valid/attach-tag-input.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { Attachment } from 'svelte/attachments';
+
+
+	const myAttachment: Attachment = (element) => {
+		console.log(element.nodeName); // 'DIV'
+
+		return () => {
+			console.log('cleaning up');
+		};
+	};
+</script>
+
+<div {@attach myAttachment}>...</div>