Build Tools: Update TypeScript to 6.0.2

bin/packages/check-build-type-declaration-files.js

@@ -70,7 +70,7 @@ async function getDecFile( packagePath ) {
 async function typecheckDeclarations( file ) {
 	return new Promise( ( resolve, reject ) => {
 		exec(
-			`npx tsc --target esnext --moduleResolution node --noEmit --skipLibCheck "${ file }"`,
+			`npx tsc --ignoreConfig --target esnext --moduleResolution bundler --noEmit --skipLibCheck "${ file }"`,
 			( error, stdout, stderr ) => {
 				if ( error ) {
 					reject( { file, error, stderr, stdout } );

package.json

@@ -120,7 +120,7 @@
 		"sprintf-js": "1.1.1",
 		"style-loader": "3.2.1",
 		"stylelint-plugin-logical-css": "^1.2.3",
-		"typescript": "5.9.3",
+		"typescript": "6.0.2",
 		"uuid": "9.0.1",
 		"wait-on": "8.0.1"
 	},

packages/boot/tsconfig.json

@@ -2,6 +2,7 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
+		"types": [ "style-imports" ],
 		"checkJs": false
 	},
 	"references": [

packages/components/src/alignment-matrix-control/README.md

@@ -43,7 +43,7 @@ underlying `grid` widget.
 
 ### `onChange`
 
- - Type: `(newValue: AlignmentMatrixControlValue) => void`
+ - Type: `((newValue: AlignmentMatrixControlValue) => void)`
  - Required: No
 
 A function that receives the updated alignment value.

packages/components/src/button/README.md

@@ -77,7 +77,7 @@ If provided, renders `a` instead of `button`.
 
 ### `icon`
 
- - Type: `IconType`
+ - Type: `IconType | null`
  - Required: No
 
 If provided, renders an Icon component inside the button.

packages/components/src/calendar/utils/use-localization-props.ts

@@ -10,10 +10,9 @@ import type { Modifiers, BaseProps } from '../types';
 
 function isLocaleRTL( localeCode: string ) {
 	const localeObj = new Intl.Locale( localeCode );
-	if ( 'getTextInfo' in localeObj ) {
-		// @ts-expect-error - getTextInfo is not typed yet
-		// see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getTextInfo
-		return localeObj.getTextInfo().direction === 'rtl';
+	const direction = localeObj.getTextInfo?.().direction;
+	if ( direction ) {
+		return direction === 'rtl';
 	}
 	return [
 		'ar', // Arabic

packages/components/src/form-file-upload/README.md

@@ -48,7 +48,7 @@ Children are passed as children of `Button`.
 
 ### `icon`
 
- - Type: `IconType`
+ - Type: `IconType | null`
  - Required: No
 
 The icon to render in the default button.
@@ -65,7 +65,7 @@ Whether to allow multiple selection of files or not.
 
 ### `onChange`
 
- - Type: `ChangeEventHandler<HTMLInputElement>`
+ - Type: `ChangeEventHandler<HTMLInputElement> | undefined`
  - Required: Yes
 
 Callback function passed directly to the `input` file element.
@@ -95,7 +95,7 @@ an empty string in the `onClick` function.
 
 ### `render`
 
- - Type: `(arg: { openFileDialog: () => void; }) => ReactNode`
+ - Type: `((arg: { openFileDialog: () => void; }) => ReactNode)`
  - Required: No
 
 Optional callback function used to render the UI.

packages/components/src/gradient-picker/README.md

@@ -141,15 +141,15 @@ Only used when `asButtons` is not true.
 
 ### `onChange`
 
- - Type: `(currentGradient: string) => void`
+ - Type: `(currentGradient: string | undefined) => void`
  - Required: Yes
 
 The function called when a new gradient has been defined. It is passed to
 the `currentGradient` as an argument.
 
 ### `value`
 
- - Type: `string`
+ - Type: `string | null`
  - Required: No
  - Default: `'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'`
 

packages/components/src/icon/README.md

@@ -16,7 +16,7 @@ import { wordpress } from '@wordpress/icons';
 
 ### `icon`
 
- - Type: `IconType`
+ - Type: `IconType | null`
  - Required: No
  - Default: `null`
 

packages/components/src/menu/README.md

@@ -19,7 +19,7 @@ component, and the `Menu.Popover` component.
 
 ### `as`
 
- - Type: `"symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | ... 516 more ... | ("view" & FunctionComponent<...>)`
+ - Type: `"symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | ... 517 more ...`
  - Required: No
 
 The HTML element or React component to render the component as.
@@ -57,7 +57,7 @@ override the `defaultOpen` prop.
 
 ### `onOpenChange`
 
- - Type: `(open: boolean) => void`
+ - Type: `((open: boolean) => void)`
  - Required: No
 
 A callback that gets called when the `open` state changes.

packages/components/src/tabs/README.md

@@ -19,7 +19,7 @@ It is responsible for managing the state of the tabs, and rendering one instance
 
 ### `activeTabId`
 
- - Type: `string`
+ - Type: `string | null`
  - Required: No
 
 The current active tab `id`. The active tab is the tab element within the
@@ -42,7 +42,7 @@ components as there are `Tabs.Tab` components.
 
 ### `defaultTabId`
 
- - Type: `string`
+ - Type: `string | null`
  - Required: No
 
 The id of the tab whose panel is currently visible.
@@ -56,7 +56,7 @@ provided (meaning the component will be used in "controlled" mode).
 
 ### `defaultActiveTabId`
 
- - Type: `string`
+ - Type: `string | null`
  - Required: No
 
 The tab id that should be active by default when the composite widget is
@@ -69,14 +69,14 @@ provided.
 
 ### `onSelect`
 
- - Type: `(selectedId: string) => void`
+ - Type: `((selectedId: string | null) => void)`
  - Required: No
 
 The function called when the `selectedTabId` changes.
 
 ### `onActiveTabIdChange`
 
- - Type: `(activeId: string) => void`
+ - Type: `((activeId: string | null) => void)`
  - Required: No
 
 A callback that gets called when the `activeTabId` state changes.
@@ -107,7 +107,7 @@ for more info.
 
 ### `selectedTabId`
 
- - Type: `string`
+ - Type: `string | null`
  - Required: No
 
 The id of the tab whose panel is currently visible.

packages/components/src/tree-select/README.md

@@ -118,7 +118,7 @@ If this property is added, an option will be added with this label to represent
 
 ### `onChange`
 
- - Type: `(value: string, extra?: { event?: ChangeEvent<HTMLSelectElement>; }) => void`
+ - Type: `((value: string, extra?: { event?: ChangeEvent<HTMLSelectElement>; }) => void) | undefined`
  - Required: No
 
 A function that receives the value of the new option that is being selected as input.

packages/components/tsconfig.json

@@ -5,8 +5,8 @@
 		"types": [
 			"gutenberg-env",
 			"gutenberg-test-env",
-			"css-modules",
-			"jest"
+			"jest",
+			"style-imports"
 		]
 	},
 	"references": [

packages/dataviews/tsconfig.json

@@ -2,7 +2,12 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
-		"types": [ "gutenberg-env", "gutenberg-test-env", "jest" ]
+		"types": [
+			"gutenberg-env",
+			"gutenberg-test-env",
+			"jest",
+			"style-imports"
+		]
 	},
 	"references": [
 		{ "path": "../components" },

packages/editor/tsconfig.json

@@ -2,6 +2,7 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
+		"types": [ "style-imports" ],
 		"checkJs": false
 	},
 	"references": [

packages/image-cropper/tsconfig.json

@@ -2,6 +2,7 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
+		"types": [ "style-imports" ],
 		"checkJs": false
 	},
 	"references": [

packages/lazy-editor/tsconfig.json

@@ -2,6 +2,7 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
+		"types": [ "style-imports" ],
 		"checkJs": false
 	},
 	"references": [

packages/notices/tsconfig.json

@@ -2,7 +2,7 @@
 	"$schema": "https://json.schemastore.org/tsconfig.json",
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
-		"types": [ "gutenberg-env" ],
+		"types": [ "gutenberg-env", "style-imports" ],
 		"checkJs": false
 	},
 	"references": [

packages/theme/tsconfig.src.json

@@ -3,7 +3,7 @@
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
 		"moduleResolution": "bundler",
-		"types": [ "css-modules" ]
+		"types": [ "style-imports" ]
 	},
 	"files": [ "global.d.ts" ],
 	"references": [ { "path": "../element" }, { "path": "../private-apis" } ]

tsconfig.base.json

@@ -26,8 +26,6 @@
 		/* Module Resolution Options */
 		"moduleResolution": "bundler",
 
-		/* This needs to be false so our types are possible to consume without setting this */
-		"esModuleInterop": false,
 		"resolveJsonModule": true,
 
 		"typeRoots": [ "./typings", "./node_modules/@types" ],

typings/css-modules/index.d.ts → typings/style-imports/index.d.ts

@@ -7,3 +7,6 @@ declare module '*.module.scss' {
 	const classes: { [ key: string ]: string };
 	export default classes;
 }
+
+declare module '*.css';
+declare module '*.scss';