fix(ts-plugin): narrow Go to Definition results to tokens declared in the current module (#364)

When `namedExports: false`, Go to Definition for tokens imported via
`@value val from './other.module.css'` additionally returned the
re-export location (the `@value ... from ...` line) alongside the
original definition. Re-export locations aren't declarations and
shouldn't show up as definitions.

For definitions pointing into a CSS module, keep only those that match
a token in `cssModule.localTokens` — the set of tokens actually
declared in that module. Zero-length spans (module-level references
such as `import styles from '...'`) are preserved as an exception.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: mizdra

.changeset/exclude-reexport-goto-def.md

@@ -0,0 +1,5 @@
+---
+'@css-modules-kit/ts-plugin': patch
+---
+
+fix(ts-plugin): exclude re-exported `@value ... from '...'` tokens from Go to Definition results

packages/ts-plugin/e2e-test/feature/go-to-definition.test.ts

@@ -226,96 +226,60 @@ describe.each([
           file: iff.paths['index.ts'],
           line: 7,
           offset: 8,
-          // NOTE: Ideally, only the definition from c.module.css should be returned.
-          // However, for simplicity of implementation, when `namedExports: false`, the definition from a.module.css is also returned.
           expected: [
-            !namedExports && {
-              file: formatPath(iff.paths['a.module.css']),
-              start: { line: 2, offset: 8 },
-              end: { line: 2, offset: 11 },
-              contextStart: { line: 2, offset: 8 },
-              contextEnd: { line: 2, offset: 11 },
-            },
             {
               file: formatPath(iff.paths['c.module.css']),
               start: { line: 1, offset: 8 },
               end: { line: 1, offset: 11 },
               contextStart: { line: 1, offset: 1 },
               contextEnd: { line: 1, offset: 16 },
             },
-          ].filter((c) => c !== false),
+          ],
         },
         {
           name: 'c_1 in a.module.ts',
           file: iff.paths['a.module.css'],
           line: 2,
           offset: 8,
-          // NOTE: Ideally, only the definition from c.module.css should be returned.
-          // However, for simplicity of implementation, when `namedExports: false`, the definition from a.module.css is also returned.
           expected: [
-            !namedExports && {
-              file: formatPath(iff.paths['a.module.css']),
-              start: { line: 2, offset: 8 },
-              end: { line: 2, offset: 11 },
-              contextStart: { line: 2, offset: 8 },
-              contextEnd: { line: 2, offset: 11 },
-            },
             {
               file: formatPath(iff.paths['c.module.css']),
               start: { line: 1, offset: 8 },
               end: { line: 1, offset: 11 },
               contextStart: { line: 1, offset: 1 },
               contextEnd: { line: 1, offset: 16 },
             },
-          ].filter((c) => c !== false),
+          ],
         },
         {
           name: 'c_alias in index.ts',
           file: iff.paths['index.ts'],
           line: 8,
           offset: 8,
-          // NOTE: Ideally, only the definition from c.module.css should be returned.
-          // However, for simplicity of implementation, when `namedExports: false`, the definition from a.module.css is also returned.
           expected: [
-            !namedExports && {
-              file: formatPath(iff.paths['a.module.css']),
-              start: { line: 2, offset: 20 },
-              end: { line: 2, offset: 27 },
-              contextStart: { line: 2, offset: 20 },
-              contextEnd: { line: 2, offset: 27 },
-            },
             {
               file: formatPath(iff.paths['c.module.css']),
               start: { line: 2, offset: 8 },
               end: { line: 2, offset: 11 },
               contextStart: { line: 2, offset: 1 },
               contextEnd: { line: 2, offset: 16 },
             },
-          ].filter((c) => c !== false),
+          ],
         },
         {
           name: 'c_alias in a.module.css',
           file: iff.paths['a.module.css'],
           line: 2,
           offset: 20,
-          // NOTE: Ideally, only the definition from c.module.css should be returned.
-          // However, for simplicity of implementation, when `namedExports: false`, the definition from a.module.css is also returned.
           expected: [
-            !namedExports && {
-              file: formatPath(iff.paths['a.module.css']),
-              start: { line: 2, offset: 20 },
-              end: { line: 2, offset: 27 },
-              contextStart: { line: 2, offset: 20 },
-              contextEnd: { line: 2, offset: 27 },
-            },
             {
               file: formatPath(iff.paths['c.module.css']),
               start: { line: 2, offset: 8 },
               end: { line: 2, offset: 11 },
               contextStart: { line: 2, offset: 1 },
               contextEnd: { line: 2, offset: 16 },
             },
-          ].filter((c) => c !== false),
+          ],
         },
         {
           name: 'c_2 in a.module.css',

packages/ts-plugin/src/language-service/feature/definition-and-bound-span.ts

@@ -10,39 +10,43 @@ export function getDefinitionAndBoundSpan(
     const result = languageService.getDefinitionAndBoundSpan(...args);
     if (!result) return;
     if (!result.definitions) return result;
+
+    const newDefinitions: ts.DefinitionInfo[] = [];
     for (const def of result.definitions) {
+      // Clicks on a module-level reference (e.g. `styles` in `import styles from '...'`
+      // or the module specifier itself) surface as a zero-length span at file start.
+      // Keep them as-is; they aren't tokens to be matched against `localTokens`.
+      if (def.textSpan.start === 0 && def.textSpan.length === 0) {
+        newDefinitions.push(def);
+        continue;
+      }
       const script = language.scripts.get(def.fileName);
-      if (!isCSSModuleScript(script)) continue;
-
+      if (!isCSSModuleScript(script)) {
+        newDefinitions.push(def);
+        continue;
+      }
       const cssModule = script.generated.root[CMK_DATA_KEY];
-
-      // Search tokens and set `contextSpan`. `contextSpan` is used for Definition Preview in editors.
       const defName = unquote(def.name);
+
+      // Keep only definitions that map to a token declared in this module's `localTokens`.
+      // Re-exports from `@value ... from '...'` aren't declarations here, so they're excluded —
+      // their real declaration lives in the target file.
       const localToken = cssModule.localTokens.find(
         (t) => t.name === defName && t.loc.start.offset === def.textSpan.start,
       );
-      if (localToken?.declarationLoc) {
+      if (!localToken) continue;
+
+      // Set `contextSpan` for local tokens. `contextSpan` is used for Definition Preview in editors.
+      if (localToken.declarationLoc) {
         def.contextSpan = {
           start: localToken.declarationLoc.start.offset,
           length: localToken.declarationLoc.end.offset - localToken.declarationLoc.start.offset,
         };
-        continue;
-      }
-      const importedValue = cssModule.tokenImporters
-        .flatMap((i) => (i.type === 'value' ? i.values : []))
-        .find((v) => {
-          const localName = v.localName ?? v.name;
-          const localLoc = v.localLoc ?? v.loc;
-          return localName === defName && localLoc.start.offset === def.textSpan.start;
-        });
-      if (importedValue) {
-        const loc = importedValue.localLoc ?? importedValue.loc;
-        def.contextSpan = {
-          start: loc.start.offset,
-          length: loc.end.offset - loc.start.offset,
-        };
       }
+
+      newDefinitions.push(def);
     }
+    result.definitions = newDefinitions;
     return result;
   };
 }