diff --git a/packages/tsconfig-reference/copy/en/options/jsx.md b/packages/tsconfig-reference/copy/en/options/jsx.md
index 27ce2e65d95c..af4fde3b8dd2 100644
--- a/packages/tsconfig-reference/copy/en/options/jsx.md
+++ b/packages/tsconfig-reference/copy/en/options/jsx.md
@@ -6,11 +6,11 @@ oneline: "Specify what JSX code is generated."
 Controls how JSX constructs are emitted in JavaScript files.
 This only affects output of JS files that started in `.tsx` files.
 
-- `react`: Emit `.js` files with JSX changed to the equivalent `React.createElement` calls
-- `react-jsx`: Emit `.js` files with the JSX changed to `_jsx` calls
-- `react-jsxdev`: Emit `.js` files with the JSX changed to `_jsx` calls
+- `react-jsx`: Emit `.js` files with the JSX changed to `_jsx` calls optimized for production
+- `react-jsxdev`: Emit `.js` files with the JSX changed to `_jsx` calls for development only
 - `preserve`: Emit `.jsx` files with the JSX unchanged
 - `react-native`: Emit `.js` files with the JSX unchanged
+- `react`: Emit `.js` files with JSX changed to the equivalent `React.createElement` calls
 
 ### For example
 
@@ -20,7 +20,7 @@ This sample code:
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```
 
-Default: `"react"`
+React: `"react-jsx"`<sup>[[1]](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)</sup>
 
 ```tsx twoslash
 declare module JSX {
@@ -31,10 +31,11 @@ declare module JSX {
 }
 // @showEmit
 // @noErrors
+// @jsx: react-jsx
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```
 
-Preserve: `"preserve"`
+React dev transform: `"react-jsxdev"`<sup>[[1]](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)</sup>
 
 ```tsx twoslash
 declare module JSX {
@@ -45,11 +46,11 @@ declare module JSX {
 }
 // @showEmit
 // @noErrors
-// @jsx: preserve
+// @jsx: react-jsxdev
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```
 
-React Native: `"react-native"`
+Preserve: `"preserve"`
 
 ```tsx twoslash
 declare module JSX {
@@ -60,11 +61,11 @@ declare module JSX {
 }
 // @showEmit
 // @noErrors
-// @jsx: react-native
+// @jsx: preserve
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```
 
-React 17 transform: `"react-jsx"`<sup>[[1]](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)</sup>
+React Native: `"react-native"`
 
 ```tsx twoslash
 declare module JSX {
@@ -75,11 +76,12 @@ declare module JSX {
 }
 // @showEmit
 // @noErrors
-// @jsx: react-jsx
+// @jsx: react-native
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```
 
-React 17 dev transform: `"react-jsxdev"`<sup>[[1]](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)</sup>
+
+Legacy React runtime: `"react"`
 
 ```tsx twoslash
 declare module JSX {
@@ -90,6 +92,5 @@ declare module JSX {
 }
 // @showEmit
 // @noErrors
-// @jsx: react-jsxdev
 export const HelloWorld = () => <h1>Hello world</h1>;
 ```