eslint-plugin-svelte 3.18.0 → 3.20.0

package/README.md

@@ -334,6 +334,7 @@ These rules relate to better ways of doing things to help you avoid problems:
 | [svelte/block-lang](https://sveltejs.github.io/eslint-plugin-svelte/rules/block-lang/) | disallows the use of languages other than those specified in the configuration for the lang attribute of `<script>` and `<style>` blocks. | :bulb: |
 | [svelte/button-has-type](https://sveltejs.github.io/eslint-plugin-svelte/rules/button-has-type/) | disallow usage of button without an explicit type attribute |  |
 | [svelte/no-add-event-listener](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-add-event-listener/) | Warns against the use of `addEventListener` | :bulb: |
+| [svelte/no-at-const-tags](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-const-tags/) | disallow the use of `{@const}` in favor of `{const ...}` declaration tags | :wrench: |
 | [svelte/no-at-debug-tags](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-debug-tags/) | disallow the use of `{@debug}` | :star::bulb: |
 | [svelte/no-ignored-unsubscribe](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-ignored-unsubscribe/) | disallow ignoring the unsubscribe method returned by the `subscribe()` on Svelte stores. |  |
 | [svelte/no-immutable-reactive-statements](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-immutable-reactive-statements/) | disallow reactive statements that don't reference reactive values. | :star: |
@@ -403,7 +404,7 @@ These rules relate to SvelteKit and its best Practices.
 |:--------|:------------|:---|
 | [svelte/no-export-load-in-svelte-module-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-export-load-in-svelte-module-in-kit-pages/) | disallow exporting load functions in `*.svelte` module in SvelteKit page components. | :star: |
 | [svelte/no-navigation-without-resolve](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-navigation-without-resolve/) | disallow internal navigation (links, `goto()`, `pushState()`, `replaceState()`) without a `resolve()` | :star: |
-| [svelte/valid-prop-names-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-prop-names-in-kit-pages/) | disallow props other than data or errors in SvelteKit page components. | :star: |
+| [svelte/valid-prop-names-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-prop-names-in-kit-pages/) | disallow invalid props in SvelteKit route components. | :star: |
 
 ## Experimental
 

package/lib/main.d.ts

@@ -14,7 +14,7 @@ export declare const configs: {
 export declare const rules: Record<string, Rule.RuleModule>;
 export declare const meta: {
     name: "eslint-plugin-svelte";
-    version: "3.18.0";
+    version: "3.20.0";
 };
 export declare const processors: {
     '.svelte': typeof processor;

package/lib/meta.d.ts

@@ -1,2 +1,2 @@
 export declare const name: "eslint-plugin-svelte";
-export declare const version: "3.18.0";
+export declare const version: "3.20.0";

package/lib/meta.js

@@ -2,4 +2,4 @@
 // This file has been automatically generated,
 // in order to update its content execute "pnpm run update"
 export const name = 'eslint-plugin-svelte';
-export const version = '3.18.0';
+export const version = '3.20.0';

package/lib/rule-types.d.ts

@@ -100,6 +100,11 @@ export interface RuleOptions {
      * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-add-event-listener/
      */
     'svelte/no-add-event-listener'?: Linter.RuleEntry<[]>;
+    /**
+     * disallow the use of `{@const}` in favor of `{const ...}` declaration tags
+     * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-const-tags/
+     */
+    'svelte/no-at-const-tags'?: Linter.RuleEntry<[]>;
     /**
      * disallow the use of `{@debug}`
      * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-debug-tags/
@@ -409,7 +414,7 @@ export interface RuleOptions {
      */
     'svelte/valid-each-key'?: Linter.RuleEntry<[]>;
     /**
-     * disallow props other than data or errors in SvelteKit page components.
+     * disallow invalid props in SvelteKit route components.
      * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-prop-names-in-kit-pages/
      */
     'svelte/valid-prop-names-in-kit-pages'?: Linter.RuleEntry<[]>;

package/lib/rules/indent-helpers/svelte.js

@@ -172,6 +172,13 @@ export function defineVisitor(context) {
             offsets.setOffsetToken(declarationToken, 1, openToken);
             offsets.setOffsetToken(closeToken, 0, openToken);
         },
+        SvelteDeclarationTag(node) {
+            const openToken = sourceCode.getFirstToken(node);
+            const declarationToken = sourceCode.getFirstToken(node.declaration);
+            const closeToken = sourceCode.getLastToken(node);
+            offsets.setOffsetToken(declarationToken, 1, openToken);
+            offsets.setOffsetToken(closeToken, 0, openToken);
+        },
         SvelteRenderTag(node) {
             const openToken = sourceCode.getFirstToken(node);
             const renderToken = sourceCode.getTokenAfter(openToken);

package/lib/rules/mustache-spacing.js

@@ -151,6 +151,10 @@ export default createRule('mustache-spacing', {
                 const mustacheTokens = getMustacheTokens(node, sourceCode);
                 verifyBraces(mustacheTokens.openToken, mustacheTokens.closeToken, options.tags.openingBrace, options.tags.closingBrace, true);
             },
+            SvelteDeclarationTag(node) {
+                const mustacheTokens = getMustacheTokens(node, sourceCode);
+                verifyBraces(mustacheTokens.openToken, mustacheTokens.closeToken, options.tags.openingBrace, options.tags.closingBrace, true);
+            },
             SvelteRenderTag(node) {
                 const mustacheTokens = getMustacheTokens(node, sourceCode);
                 verifyBraces(mustacheTokens.openToken, mustacheTokens.closeToken, options.tags.openingBrace, options.tags.closingBrace, true);

package/lib/rules/no-at-const-tags.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("../types.js").RuleModule;
+export default _default;

package/lib/rules/no-at-const-tags.js

@@ -0,0 +1,67 @@
+import { createRule } from '../utils/index.js';
+import { getSvelteContext } from '../utils/svelte-context.js';
+import { VERSION as SVELTE_VERSION } from 'svelte/compiler';
+import semver from 'semver';
+const shouldRun = semver.satisfies(SVELTE_VERSION, '>=5.56.0');
+export default createRule('no-at-const-tags', {
+    meta: {
+        docs: {
+            description: 'disallow the use of `{@const}` in favor of `{const ...}` declaration tags',
+            category: 'Best Practices',
+            recommended: false
+        },
+        fixable: 'code',
+        schema: [],
+        messages: {
+            unexpected: 'Use `{const ...}` declaration tag instead of legacy `{@const ...}`.'
+        },
+        type: 'suggestion',
+        conditions: [
+            {
+                svelteVersions: ['5']
+            }
+        ]
+    },
+    create(context) {
+        if (!shouldRun) {
+            return {};
+        }
+        const sourceCode = context.sourceCode;
+        const runes = getSvelteContext(context)?.runes;
+        // Only report and fix in runes mode, since preserving reactivity requires
+        // `$derived(...)`, which is unavailable outside runes mode.
+        if (runes !== true) {
+            return {};
+        }
+        return {
+            SvelteConstTag(node) {
+                context.report({
+                    node,
+                    messageId: 'unexpected',
+                    *fix(fixer) {
+                        const text = sourceCode.getText(node);
+                        const match = /^\{(\s*)@const\b/u.exec(text);
+                        if (!match) {
+                            return;
+                        }
+                        const atOffset = node.range[0] + 1 + match[1].length;
+                        yield fixer.removeRange([atOffset, atOffset + 1]);
+                        const init = node.declarations[0].init;
+                        if (init == null) {
+                            return;
+                        }
+                        // Preserve the reactivity of legacy `{@const}` by wrapping the
+                        // initializer in `$derived(...)`. Skip when already wrapped.
+                        if (init.type === 'CallExpression' &&
+                            init.callee.type === 'Identifier' &&
+                            init.callee.name === '$derived') {
+                            return;
+                        }
+                        yield fixer.insertTextBefore(init, '$derived(');
+                        yield fixer.insertTextAfter(init, ')');
+                    }
+                });
+            }
+        };
+    }
+});

package/lib/rules/valid-prop-names-in-kit-pages.js

@@ -1,7 +1,9 @@
 import { createRule } from '../utils/index.js';
-import { getSvelteVersion } from '../utils/svelte-context.js';
-const EXPECTED_PROP_NAMES = ['data', 'errors', 'form', 'params', 'snapshot'];
-const EXPECTED_PROP_NAMES_SVELTE5 = [...EXPECTED_PROP_NAMES, 'children'];
+import { getSvelteContext, getSvelteVersion } from '../utils/svelte-context.js';
+const PAGE_PROP_NAMES = ['data', 'form', 'params', 'snapshot'];
+const LEGACY_PAGE_PROP_NAMES = [...PAGE_PROP_NAMES, 'errors'];
+const LAYOUT_PROP_NAMES = [...PAGE_PROP_NAMES, 'children'];
+const ERROR_PROP_NAMES = ['error'];
 function checkProp(node, context, expectedPropNames) {
     if (node.id.type !== 'ObjectPattern')
         return;
@@ -32,25 +34,35 @@ function isModuleScript(node) {
 export default createRule('valid-prop-names-in-kit-pages', {
     meta: {
         docs: {
-            description: 'disallow props other than data or errors in SvelteKit page components.',
+            description: 'disallow invalid props in SvelteKit route components.',
             category: 'SvelteKit',
             recommended: true
         },
         schema: [],
         messages: {
-            unexpected: 'disallow props other than data or errors in SvelteKit page components.'
+            unexpected: 'disallow invalid props in SvelteKit route components.'
         },
         type: 'problem',
         conditions: [
             {
-                svelteKitFileTypes: ['+page.svelte', '+error.svelte', '+layout.svelte']
+                svelteKitFileTypes: ['+page.svelte', '+layout.svelte', '+error.svelte']
             }
         ]
     },
     create(context) {
         let isScript = false;
         const isSvelte5 = getSvelteVersion() === '5';
-        const expectedPropNames = isSvelte5 ? EXPECTED_PROP_NAMES_SVELTE5 : EXPECTED_PROP_NAMES;
+        const svelteContext = getSvelteContext(context);
+        const fileType = svelteContext?.svelteKitFileType;
+        let expectedPropNames = PAGE_PROP_NAMES;
+        if (isSvelte5) {
+            if (fileType === '+layout.svelte') {
+                expectedPropNames = LAYOUT_PROP_NAMES;
+            }
+            else if (fileType === '+error.svelte') {
+                expectedPropNames = ERROR_PROP_NAMES;
+            }
+        }
         return {
             // <script>
             'Program > SvelteScriptElement > SvelteStartTag': (node) => {
@@ -67,7 +79,7 @@ export default createRule('valid-prop-names-in-kit-pages', {
                     return;
                 // export let foo
                 if (node.id.type === 'Identifier') {
-                    if (!expectedPropNames.includes(node.id.name)) {
+                    if (!LEGACY_PAGE_PROP_NAMES.includes(node.id.name)) {
                         context.report({
                             node,
                             loc: node.loc,
@@ -77,7 +89,7 @@ export default createRule('valid-prop-names-in-kit-pages', {
                     return;
                 }
                 // export let { xxx, yyy } = zzz
-                checkProp(node, context, expectedPropNames);
+                checkProp(node, context, LEGACY_PAGE_PROP_NAMES);
             },
             // Svelte5
             // let { foo, bar } = $props();

package/lib/types-for-node.d.ts

@@ -369,6 +369,8 @@ export type ASTNodeListener = {
     'SvelteDebugTag:exit'?: (node: AST.SvelteDebugTag & ASTNodeWithParent) => void;
     SvelteConstTag?: (node: AST.SvelteConstTag & ASTNodeWithParent) => void;
     'SvelteConstTag:exit'?: (node: AST.SvelteConstTag & ASTNodeWithParent) => void;
+    SvelteDeclarationTag?: (node: AST.SvelteDeclarationTag & ASTNodeWithParent) => void;
+    'SvelteDeclarationTag:exit'?: (node: AST.SvelteDeclarationTag & ASTNodeWithParent) => void;
     SvelteRenderTag?: (node: AST.SvelteRenderTag & ASTNodeWithParent) => void;
     'SvelteRenderTag:exit'?: (node: AST.SvelteRenderTag & ASTNodeWithParent) => void;
     SvelteIfBlock?: (node: AST.SvelteIfBlock & ASTNodeWithParent) => void;
@@ -757,6 +759,8 @@ export type SvelteNodeListener = {
     'SvelteDebugTag:exit'?: (node: AST.SvelteDebugTag & ASTNodeWithParent) => void;
     SvelteConstTag?: (node: AST.SvelteConstTag & ASTNodeWithParent) => void;
     'SvelteConstTag:exit'?: (node: AST.SvelteConstTag & ASTNodeWithParent) => void;
+    SvelteDeclarationTag?: (node: AST.SvelteDeclarationTag & ASTNodeWithParent) => void;
+    'SvelteDeclarationTag:exit'?: (node: AST.SvelteDeclarationTag & ASTNodeWithParent) => void;
     SvelteRenderTag?: (node: AST.SvelteRenderTag & ASTNodeWithParent) => void;
     'SvelteRenderTag:exit'?: (node: AST.SvelteRenderTag & ASTNodeWithParent) => void;
     SvelteIfBlock?: (node: AST.SvelteIfBlock & ASTNodeWithParent) => void;

package/lib/utils/ast-utils.d.ts

@@ -91,11 +91,11 @@ export type QuoteAndRange = {
 };
 /** Get the quote and range from given attribute values */
 export declare function getAttributeValueQuoteAndRange(attr: SvAST.SvelteAttribute | SvAST.SvelteDirective | SvAST.SvelteStyleDirective | SvAST.SvelteSpecialDirective, sourceCode: SourceCode): QuoteAndRange | null;
-export declare function getMustacheTokens(node: SvAST.SvelteMustacheTag | SvAST.SvelteShorthandAttribute | SvAST.SvelteSpreadAttribute | SvAST.SvelteDebugTag | SvAST.SvelteRenderTag, sourceCode: SourceCode): {
+export declare function getMustacheTokens(node: SvAST.SvelteMustacheTag | SvAST.SvelteShorthandAttribute | SvAST.SvelteSpreadAttribute | SvAST.SvelteDebugTag | SvAST.SvelteDeclarationTag | SvAST.SvelteRenderTag, sourceCode: SourceCode): {
     openToken: SvAST.Token;
     closeToken: SvAST.Token;
 };
-export declare function getMustacheTokens(node: SvAST.SvelteDirective | SvAST.SvelteSpecialDirective | SvAST.SvelteMustacheTag | SvAST.SvelteShorthandAttribute | SvAST.SvelteSpreadAttribute | SvAST.SvelteDebugTag | SvAST.SvelteRenderTag, sourceCode: SourceCode): {
+export declare function getMustacheTokens(node: SvAST.SvelteDirective | SvAST.SvelteSpecialDirective | SvAST.SvelteMustacheTag | SvAST.SvelteShorthandAttribute | SvAST.SvelteSpreadAttribute | SvAST.SvelteDebugTag | SvAST.SvelteDeclarationTag | SvAST.SvelteRenderTag, sourceCode: SourceCode): {
     openToken: SvAST.Token;
     closeToken: SvAST.Token;
 } | null;

package/lib/utils/ast-utils.js

@@ -333,6 +333,7 @@ function isWrappedInBraces(node) {
         node.type === 'SvelteShorthandAttribute' ||
         node.type === 'SvelteSpreadAttribute' ||
         node.type === 'SvelteDebugTag' ||
+        node.type === 'SvelteDeclarationTag' ||
         node.type === 'SvelteRenderTag');
 }
 /** Get attribute key text */

package/lib/utils/rules.js

@@ -17,6 +17,7 @@ import maxAttributesPerLine from '../rules/max-attributes-per-line.js';
 import maxLinesPerBlock from '../rules/max-lines-per-block.js';
 import mustacheSpacing from '../rules/mustache-spacing.js';
 import noAddEventListener from '../rules/no-add-event-listener.js';
+import noAtConstTags from '../rules/no-at-const-tags.js';
 import noAtDebugTags from '../rules/no-at-debug-tags.js';
 import noAtHtmlTags from '../rules/no-at-html-tags.js';
 import noDomManipulating from '../rules/no-dom-manipulating.js';
@@ -100,6 +101,7 @@ export const rules = [
     maxLinesPerBlock,
     mustacheSpacing,
     noAddEventListener,
+    noAtConstTags,
     noAtDebugTags,
     noAtHtmlTags,
     noDomManipulating,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-svelte",
-  "version": "3.18.0",
+  "version": "3.20.0",
   "description": "ESLint plugin for Svelte using AST",
   "repository": {
     "type": "git",
@@ -45,7 +45,7 @@
     "postcss-load-config": "^3.1.4",
     "postcss-safe-parser": "^7.0.0",
     "semver": "^7.6.3",
-    "svelte-eslint-parser": "^1.4.0"
+    "svelte-eslint-parser": "^1.7.0"
   },
   "devDependencies": {
     "@babel/core": "^7.28.3",
@@ -79,7 +79,7 @@
     "sass": "^1.92.0",
     "source-map-js": "^1.2.1",
     "stylus": "^0.64.0",
-    "svelte": "^5.41.0",
+    "svelte": "^5.56.0",
     "svelte-i18n": "^4.0.1",
     "tsx": "^4.20.5",
     "type-coverage": "^2.29.7",