Svelte TypeScript declares runes in global scope, giving illusion that it is available outside of svelte files

[KieranP]

Describe the bug

Created from zed-extensions/svelte#34

Runes are being declared in TypeScripts global scope, leading editors to show the runes as usable in non svelte files.

svelte/packages/svelte/src/ambient.d.ts

Lines 23 to 24 in da63318

	declare function $state<T>(initial: T): T;
	declare function $state<T>(): T | undefined;

Can the types be adjusted so that TypeScript knows that $state and other runes are only declared within svelte files?

A quick search indicates something like this should be possible:

declare module '*.svelte' {
  declare global {
    function $state<T>(initial: T): T;
    function $state<T>(): T | undefined;
  }
}

Reproduction

Have a Svelte project, create a non-svelte file (e.g. db.ts) and use $state, e.g. const hello = $state(0)

Logs

System Info

System:
    OS: macOS 15.5
    CPU: (12) arm64 Apple M3 Pro
    Memory: 93.50 MB / 18.00 GB
    Shell: 5.9 - /opt/homebrew/bin/zsh
  Binaries:
    Node: 23.10.0 - ~/.asdf/installs/nodejs/23.10.0/bin/node
    Yarn: 4.9.2 - ~/.asdf/installs/nodejs/23.10.0/bin/yarn
    npm: 10.9.2 - ~/.asdf/plugins/nodejs/shims/npm
    bun: 1.2.16 - /opt/homebrew/bin/bun
  Browsers:
    Safari: 18.5
  npmPackages:
    svelte: ^5.34.1 => 5.34.1

Severity

annoyance

[dummdidumm]

It's impossible to do, there's no such typescript construct to do that (see for example https://stackoverflow.com/questions/54742923/adding-typescript-ambient-declarations-only-to-specific-files-like-spec-ts)

Even if it was possible, due to the possibility of defining other file types as svelte files via config, it wouldn't work in all cases.

An eslint rule could help in this case. Or maybe adjusting the TS plugin to warn (cc @jasonlyu123 )?