chore: Upgrade to TypeScript 7

.yarn/patches/react-docgen-typescript-npm-2.4.0-9669bef2f0.patch

@@ -0,0 +1,13 @@
+diff --git a/lib/parser.js b/lib/parser.js
+index 3e83fdc9f6cb975b025aa6875723f7cd5652376e..9cb0f347cd5b2acf9f990bed7997354b55242a63 100644
+--- a/lib/parser.js
++++ b/lib/parser.js
+@@ -19,7 +19,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
+ exports.getDefaultExportForFile = exports.Parser = exports.withCompilerOptions = exports.withCustomConfig = exports.withDefaultConfig = exports.parse = exports.defaultOptions = exports.defaultParserOpts = void 0;
+ var fs = require("fs");
+ var path = require("path");
+-var ts = require("typescript");
++var ts = require("typescript-classic");
+ var buildFilter_1 = require("./buildFilter");
+ var trimFileName_1 = require("./trimFileName");
+ exports.defaultParserOpts = {};

.yarnrc.yml

@@ -9,11 +9,25 @@ packageExtensions:
   '@parcel/node-resolver-core@*':
     peerDependencies:
       '@parcel/core': ^2.12.0
+  # react-docgen-typescript uses the classic TypeScript Compiler API
+  # (ts.createProgram, ts.SyntaxKind, etc.), which TypeScript 7 no longer
+  # exposes from its package entry point. It's patched (see
+  # .yarn/patches/react-docgen-typescript-*.patch) to require
+  # "typescript-classic" instead of "typescript", aliased here to a
+  # typescript@6 install so every copy of react-docgen-typescript
+  # (including the one Storybook uses internally for autodocs) gets a
+  # working compiler instead of resolving up to the workspace's
+  # typescript 7. (A "dependencies" override for the plain "typescript"
+  # name doesn't work here, since it's already declared as a
+  # peerDependency and Yarn drops the redundant override.)
+  'react-docgen-typescript@*':
+    dependencies:
+      typescript-classic: npm:typescript@^6.0.3
 
 plugins:
   - .yarn/plugins/plugin-nightly-prep.js
 
 unsafeHttpWhitelist:
   - localhost
 
-yarnPath: .yarn/releases/yarn-4.13.0.cjs
+yarnPath: .yarn/releases/yarn-4.18.0.cjs

AGENTS.md

@@ -15,7 +15,7 @@ The repo is layered. Changes flow up from the lowest level:
 
 This repo does **not** use the conventional JS toolchain — use these, don't swap in defaults:
 
-- Format with `yarn format` (oxfmt), **not** Prettier. Lint with `yarn lint` (oxlint), **not** ESLint. Type-check with `yarn check-types` (tsgo), **not** tsc. Build with `yarn build` (Parcel), **not** rollup/tsc.
+- Format with `yarn format` (oxfmt), **not** Prettier. Lint with `yarn lint` (oxlint), **not** ESLint. Type-check with `yarn check-types` (tsc, TypeScript 7's native compiler). Build with `yarn build` (Parcel), **not** rollup/tsc.
 - **Don't run `yarn chromatic` / `yarn chromatic:forced-colors`** — maintainers run the VRT suites.
 - All commonly used commands live in the root `package.json` scripts.
 

Makefile

@@ -112,7 +112,7 @@ publish-nightly: build
 
 build:
 	mkdir -p dist
-	yarn tsgo --project tsconfig.build.json --declaration --emitDeclarationOnly --outDir dist/types --rootDir packages
+	yarn tsc --project tsconfig.build.json --declaration --emitDeclarationOnly --outDir dist/types --rootDir packages
 	if [ -n "$$PARCEL_V3" ]; then \
 		node scripts/generateS2IconIndex.js; \
 		parcel3 build $(BUILD_ENTRIES) --no-optimize --config parcel-v3/.parcelrc-build; \
@@ -155,7 +155,7 @@ check-starter-css:
 
 check-examples: check-starter-css
 	node scripts/extractExamplesS2.mjs
-	yarn tsgo --project dist/docs-examples/tsconfig.json
+	yarn tsc --project dist/docs-examples/tsconfig.json
 
 starter:
 	cd starters/docs && yarn --no-immutable && yarn up react-aria-components && yarn tsc

docs/contributing/tooling.md

@@ -4,7 +4,7 @@ This repo does **not** use the conventional JS toolchain — reach for these, an
 
 - **Format** — `oxfmt` (`yarn format`), not Prettier. The style is opinionated (single quotes, no bracket spacing → `{foo}`, no trailing commas). Always run the tool rather than formatting by hand.
 - **Lint** — `oxlint` (`oxlint packages --fix`) plus repo-local rules, not ESLint. `yarn lint` bundles format-check, type-check, `oxlint`, and Yarn `constraints` (`yarn constraints --fix`) (which enforce cross-package dependency versions).
-- **Type-check** — `tsgo` (`yarn check-types`), the native TypeScript compiler — not `tsc`.
+- **Type-check** — `tsc` (`yarn check-types`), TypeScript 7's native compiler.
 - **Build** — Parcel driven by `make` (`yarn build`), not plain `tsc`/rollup.
 - **Yarn 4 workspaces** monorepo; use `yarn workspaces foreach` for cross-package operations.
 

lib/svg.d.ts

@@ -30,3 +30,9 @@ declare module '*.json' {
   const content: any;
   export default content;
 }
+
+declare module '*.mdx' {
+  import {ElementType, FunctionComponent} from 'react';
+  const MDXComponent: FunctionComponent<{components?: Record<string, ElementType>}>;
+  export default MDXComponent;
+}

package.json

@@ -18,9 +18,7 @@
     "packages/@*/*"
   ],
   "scripts": {
-    "tsgo": "tsgo",
-    "check-types": "tsgo --noEmit",
-    "check-types:tsc": "tsc",
+    "check-types": "tsc --noEmit",
     "clean": "make clean",
     "clean:all": "make clean_all",
     "format": "oxfmt",
@@ -144,7 +142,6 @@
     "@testing-library/user-event": "patch:@testing-library/user-event@npm%3A14.6.4#~/.yarn/patches/@testing-library-user-event-npm-14.6.4-1532248d3b.patch",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "@typescript/native-preview": "^7.0.0-dev.20251223.1",
     "@vitejs/plugin-react": "^5.1.4",
     "@vitest/browser-playwright": "^4.0.17",
     "@vitest/browser-preview": "^4.0.17",
@@ -213,7 +210,7 @@
     "tailwindcss": "^4.0.0",
     "tempy": "^0.5.0",
     "tw-animate-css": "^1.4.0",
-    "typescript": "^5.8.2",
+    "typescript": "^7.0.2",
     "unplugin-parcel-macros": "^0.1.1",
     "verdaccio": "^6.0.0",
     "vite": "^7.3.2",
@@ -248,6 +245,7 @@
     "postcss-custom-properties": "13.2.0",
     "postcss-import": "15.1.0",
     "react": "19.2.4",
+    "react-docgen-typescript@npm:^2.2.2": "patch:react-docgen-typescript@npm%3A2.4.0#~/.yarn/patches/react-docgen-typescript-npm-2.4.0-9669bef2f0.patch",
     "react-dom": "19.2.4",
     "react-refresh": "0.9.0",
     "react-server-dom-parcel": "canary",
@@ -258,7 +256,7 @@
     "rsc-html-stream": "0.0.8",
     "svgo": "^3"
   },
-  "packageManager": "yarn@4.13.0",
+  "packageManager": "yarn@4.18.0",
   "@parcel/bundler-default": {
     "manualSharedBundles": [
       {

packages/@internationalized/date/src/queries.ts

@@ -298,7 +298,6 @@ function getWeekStart(locale: string): number {
       // @ts-ignore
       let localeInst = new Intl.Locale(locale);
       if ('getWeekInfo' in localeInst) {
-        // @ts-expect-error
         weekInfo = localeInst.getWeekInfo();
         if (weekInfo) {
           cachedWeekInfo.set(locale, weekInfo);

packages/@internationalized/number/src/NumberFormatter.ts

@@ -49,10 +49,6 @@ export interface NumberFormatOptions extends Intl.NumberFormatOptions {
   numberingSystem?: string;
 }
 
-interface NumberRangeFormatPart extends Intl.NumberFormatPart {
-  source: 'startRange' | 'endRange' | 'shared';
-}
-
 /**
  * A wrapper around Intl.NumberFormat providing additional options, polyfills, and caching for
  * performance.
@@ -111,7 +107,7 @@ export class NumberFormatter implements Intl.NumberFormat {
   }
 
   /** Formats a number range as an array of parts. */
-  formatRangeToParts(start: number, end: number): NumberRangeFormatPart[] {
+  formatRangeToParts(start: number, end: number): Intl.NumberRangeFormatPart[] {
     if (typeof this.numberFormatter.formatRangeToParts === 'function') {
       return this.numberFormatter.formatRangeToParts(start, end);
     }
@@ -123,9 +119,9 @@ export class NumberFormatter implements Intl.NumberFormat {
     let startParts = this.numberFormatter.formatToParts(start);
     let endParts = this.numberFormatter.formatToParts(end);
     return [
-      ...startParts.map(p => ({...p, source: 'startRange'}) as NumberRangeFormatPart),
+      ...startParts.map(p => ({...p, source: 'startRange'}) as Intl.NumberRangeFormatPart),
       {type: 'literal', value: ' – ', source: 'shared'},
-      ...endParts.map(p => ({...p, source: 'endRange'}) as NumberRangeFormatPart)
+      ...endParts.map(p => ({...p, source: 'endRange'}) as Intl.NumberRangeFormatPart)
     ];
   }
 

packages/@react-spectrum/ai/src/speech-recognition.d.ts

@@ -13,20 +13,11 @@
 // Ambient declarations for parts of the Web Speech API missing from TypeScript's
 // lib.dom.d.ts: the recognizer constructor, its vendor-prefixed alias, event
 // types, and the User-Agent Client Hints surface used for the Chromium browser
-// allowlist. SpeechRecognitionAlternative, SpeechRecognitionResult, and
-// SpeechRecognitionResultList ARE provided by lib.dom and are not redeclared.
+// allowlist. SpeechRecognitionAlternative, SpeechRecognitionResult,
+// SpeechRecognitionResultList, and SpeechRecognitionErrorCode ARE provided by
+// lib.dom and are not redeclared.
 // Spec: https://wicg.github.io/speech-api/
 
-type SpeechRecognitionErrorCode =
-  | 'no-speech'
-  | 'aborted'
-  | 'audio-capture'
-  | 'network'
-  | 'not-allowed'
-  | 'service-not-allowed'
-  | 'language-not-supported'
-  | 'phrases-not-supported';
-
 interface SpeechRecognitionEvent extends Event {
   readonly resultIndex: number;
   readonly results: SpeechRecognitionResultList;

packages/@react-spectrum/s2/test/TableView.test.tsx

@@ -39,6 +39,7 @@ describe('TableView', () => {
     offsetHeight = jest
       .spyOn(window.HTMLElement.prototype, 'clientHeight', 'get')
       .mockImplementation(() => 1000);
+    // @ts-ignore
     window.CSSTransition = jest.fn(({children}) => children);
 
     // Mock the getAnimations method

packages/@spectrum-icons/color/tsconfig.types.json

@@ -2,12 +2,14 @@
   "extends": "../../../tsconfig",
   "compilerOptions": {
     "outDir": "./",
+    "rootDir": "./src",
     "declaration": true,
     "declarationMap": true,
     "isolatedModules": false,
     "noEmit": false,
     "allowJs": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["node"]
   },
   "include": ["src", "../../@react-types/shared/src/css.d.ts"],
   "exclude": ["scripts", "node_modules", "stories", "chromatic"]

packages/@spectrum-icons/express/tsconfig.types.json

@@ -2,12 +2,14 @@
   "extends": "../../../tsconfig",
   "compilerOptions": {
     "outDir": "./",
+    "rootDir": "./src",
     "declaration": true,
     "declarationMap": true,
     "isolatedModules": false,
     "noEmit": false,
     "allowJs": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["node"]
   },
   "include": ["src", "../../@react-types/shared/src/css.d.ts"],
   "exclude": ["scripts", "node_modules", "stories", "chromatic"]

packages/@spectrum-icons/illustrations/tsconfig.types.json

@@ -2,12 +2,14 @@
   "extends": "../../../tsconfig",
   "compilerOptions": {
     "outDir": "./",
+    "rootDir": "./src",
     "declaration": true,
     "declarationMap": true,
     "isolatedModules": false,
     "noEmit": false,
     "allowJs": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["node"]
   },
   "include": ["src", "../../@react-types/shared/src/css.d.ts"],
   "exclude": ["scripts", "node_modules", "stories", "chromatic"]

packages/@spectrum-icons/ui/tsconfig.types.json

@@ -2,12 +2,14 @@
   "extends": "../../../tsconfig",
   "compilerOptions": {
     "outDir": "./",
+    "rootDir": "./src",
     "declaration": true,
     "declarationMap": true,
     "isolatedModules": false,
     "noEmit": false,
     "allowJs": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["node"]
   },
   "include": ["src", "../../@react-types/shared/src/css.d.ts"],
   "exclude": ["scripts", "node_modules", "stories", "chromatic"]

packages/@spectrum-icons/workflow/tsconfig.types.json

@@ -2,12 +2,14 @@
   "extends": "../../../tsconfig",
   "compilerOptions": {
     "outDir": "./",
+    "rootDir": "./src",
     "declaration": true,
     "declarationMap": true,
     "isolatedModules": false,
     "noEmit": false,
     "allowJs": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["node"]
   },
   "include": ["src", "../../@react-types/shared/src/css.d.ts"],
   "exclude": ["scripts", "node_modules", "stories", "chromatic"]

packages/dev/codemods/package.json

@@ -40,7 +40,7 @@
     "@types/jscodeshift": "^0.11.11",
     "react": "^18.0.0 || ^19.0.0-rc.1",
     "react-dom": "^18.0.0 || ^19.0.0-rc.1",
-    "typescript": "^5.8.2"
+    "typescript": "^7.0.2"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0-rc.1",

packages/dev/codemods/src/s1-to-s2/__tests__/cli.e2e.test.ts

@@ -196,7 +196,11 @@ beforeAll(() => {
 
   let buildResult = spawnSync(
     process.execPath,
-    [require.resolve('typescript/bin/tsc'), '-p', CODEMODS_TSCONFIG],
+    [
+      path.resolve(require.resolve('typescript/package.json'), '../bin/tsc'),
+      '-p',
+      CODEMODS_TSCONFIG
+    ],
     {
       cwd: REPO_ROOT,
       env: {

packages/dev/codemods/tsconfig.json

@@ -1,11 +1,13 @@
 {
   "compilerOptions": {
     "target": "ES2020",
-    "module": "CommonJS",
+    "module": "node16",
     "outDir": "dist",
+    "rootDir": "./src",
     "strict": true,
     "esModuleInterop": true,
-    "moduleResolution": "node"
+    "moduleResolution": "node16",
+    "types": ["node"]
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "**/*.test.ts", "**/__mocks__", "**/__testfixtures__"]

packages/dev/mcp/react-aria/package.json

@@ -33,7 +33,7 @@
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "typescript": "^5.8.2"
+    "typescript": "^7.0.2"
   },
   "engines": {
     "node": ">=18"

packages/dev/mcp/s2/package.json

@@ -36,7 +36,7 @@
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "typescript": "^5.8.2"
+    "typescript": "^6.0.3"
   },
   "engines": {
     "node": ">=18"

packages/dev/mcp/shared/package.json

@@ -24,6 +24,6 @@
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "typescript": "^5.8.2"
+    "typescript": "^7.0.2"
   }
 }

packages/dev/parcel-transformer-storybook/package.json

@@ -16,9 +16,9 @@
     "@babel/types": "^7.23.0",
     "@parcel/plugin": "^2.16.3",
     "@parcel/source-map": "^2.1.1",
-    "react-docgen-typescript": "^2.2.2",
+    "react-docgen-typescript": "patch:react-docgen-typescript@npm%3A2.4.0#~/.yarn/patches/react-docgen-typescript-npm-2.4.0-9669bef2f0.patch",
     "storybook": "^10.0.0",
-    "typescript": "^5.5.0"
+    "typescript": "^6.0.3"
   },
   "engines": {
     "parcel": "^2.8.0"

packages/dev/storybook-react-parcel/package.json

@@ -20,7 +20,7 @@
     "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
     "storybook": "^10.0.0",
-    "typescript": "^5.8.2"
+    "typescript": "^7.0.2"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",

packages/dev/test-utils/src/mockIntersectionObserver.ts

@@ -28,6 +28,7 @@ export function setupIntersectionObserverMock({
   class MockIntersectionObserver implements IntersectionObserver {
     root;
     rootMargin;
+    scrollMargin;
     thresholds;
     disconnect;
     observe;
@@ -44,6 +45,7 @@ export function setupIntersectionObserverMock({
       MockIntersectionObserver.instance = this;
       this.root = opts.root;
       this.rootMargin = opts.rootMargin;
+      this.scrollMargin = opts.scrollMargin;
       this.thresholds = opts.threshold;
       this.disconnect = disconnect;
       this.observe = observe;

scripts/extractExamplesS2.mjs

@@ -156,6 +156,7 @@ async function extractExamples() {
       "jsx": "preserve",
       "noUnusedLocals": true,
       "skipLibCheck": true,
+      "types": ["node", "jest"],
       "paths": {
         "vanilla-starter/*": ["../../starters/docs/src/*"],
         "tailwind-starter/*": ["../../starters/tailwind/src/*"],