diff --git a/crates/pack-core/src/client/context.rs b/crates/pack-core/src/client/context.rs
index 102d4cc2fd..ca9a91c7e5 100644
--- a/crates/pack-core/src/client/context.rs
+++ b/crates/pack-core/src/client/context.rs
@@ -278,7 +278,7 @@ pub async fn get_client_module_options_context(
     } else {
         false
     };
-    let jsx_runtime_options = get_jsx_transform_options(
+    let jsx_transform_options = get_jsx_transform_options(
         project_path.clone(),
         mode,
         false,
@@ -300,7 +300,6 @@ pub async fn get_client_module_options_context(
 
     let foreign_enable_webpack_loaders =
         *webpack_loader_options(project_path.clone(), config, foreign_conditions).await?;
-
     // Now creates a webpack rules that applies to all codes.
     let enable_webpack_loaders =
         *webpack_loader_options(project_path.clone(), config, loader_conditions).await?;
@@ -378,10 +377,6 @@ pub async fn get_client_module_options_context(
             enable_typeof_window_inlining: Some(TypeofWindow::Object),
             source_maps,
             import_externals: *config.import_externals().await?,
-            enable_typescript_transform: Some(
-                TypescriptTransformOptions::default().resolved_cell(),
-            ),
-            enable_jsx: Some(JsxTransformOptions::default().resolved_cell()),
             ignore_dynamic_requests: true,
             ..Default::default()
         },
@@ -406,6 +401,8 @@ pub async fn get_client_module_options_context(
     let foreign_codes_options_context = ModuleOptionsContext {
         ecmascript: EcmascriptOptionsContext {
             enable_typeof_window_inlining: None,
+            enable_jsx: Some(jsx_transform_options),
+            enable_typescript_transform: Some(tsconfig),
             ..module_options_context.ecmascript
         },
         enable_webpack_loaders: foreign_enable_webpack_loaders,
@@ -417,6 +414,10 @@ pub async fn get_client_module_options_context(
 
     let internal_context = ModuleOptionsContext {
         ecmascript: EcmascriptOptionsContext {
+            enable_typescript_transform: Some(
+                TypescriptTransformOptions::default().resolved_cell(),
+            ),
+            enable_jsx: Some(JsxTransformOptions::default().resolved_cell()),
             ..module_options_context.ecmascript.clone()
         },
         enable_postcss_transform: None,
@@ -428,7 +429,7 @@ pub async fn get_client_module_options_context(
         // we try resolve it once at the root and pass down a context to all
         // the modules.
         ecmascript: EcmascriptOptionsContext {
-            enable_jsx: Some(jsx_runtime_options),
+            enable_jsx: Some(jsx_transform_options),
             enable_typescript_transform: Some(tsconfig),
             enable_decorators: Some(decorators_options.to_resolved().await?),
             ..module_options_context.ecmascript.clone()
diff --git a/crates/pack-core/src/transform_options.rs b/crates/pack-core/src/transform_options.rs
index 3c3f81f12d..38f5eb4b55 100644
--- a/crates/pack-core/src/transform_options.rs
+++ b/crates/pack-core/src/transform_options.rs
@@ -124,10 +124,6 @@ pub async fn get_jsx_transform_options(
 
     let is_emotion_enabled = config.styles().await?.emotion.is_some();
 
-    // [NOTE]: ref: WEB-901
-    // next.js does not allow to overriding react runtime config via tsconfig /
-    // jsconfig, it forces overrides into automatic runtime instead.
-    // [TODO]: we need to emit / validate config message like next.js devserver does
     let react_transform_options = JsxTransformOptions {
         development: mode.await?.is_react_development(),
         // https://github.com/vercel/next.js/blob/3dc2c1c7f8441cdee31da9f7e0986d654c7fd2e7/packages/next/src/build/swc/options.ts#L112
@@ -147,12 +143,23 @@ pub async fn get_jsx_transform_options(
                 .as_str()
                 .map(|s| s.into());
 
+            // Map TypeScript jsx compiler option to JSX runtime
+            // TypeScript jsx values: "react" -> classic, "react-jsx" | "react-jsxdev" -> automatic
+            let jsx_runtime = json["compilerOptions"]["jsx"]
+                .as_str()
+                .and_then(|jsx| match jsx {
+                    "react" => Some("classic".into()),
+                    "react-jsx" | "react-jsxdev" => Some("automatic".into()),
+                    _ => None,
+                });
+
             Some(JsxTransformOptions {
                 import_source: if jsx_import_source.is_some() {
                     jsx_import_source
                 } else {
                     react_transform_options.import_source.clone()
                 },
+                runtime: jsx_runtime.or_else(|| react_transform_options.runtime.clone()),
                 ..react_transform_options.clone()
             })
         })
diff --git a/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/issues/Ecmascript-file-had-an-error-df4108.txt b/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/issues/Ecmascript-file-had-an-error-df4108.txt
deleted file mode 100644
index 91234d3ca6..0000000000
--- a/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/issues/Ecmascript-file-had-an-error-df4108.txt
+++ /dev/null
@@ -1,13 +0,0 @@
-error - [analysis] /basic/foreign_jsx_transform/node_modules/foreign-jsx-transform/index.js:1:0  Ecmascript file had an error
-         + v-------------v
-       1 + /** @jsx jsx */
-         + ^-------------^
-       2 | var a = 1;
-       3 | export default a;
-  
-  pragma cannot be set when runtime is automatic
-  
-  Import trace:
-    Browser:
-      ./basic/foreign_jsx_transform/node_modules/foreign-jsx-transform/index.js
-      ./basic/foreign_jsx_transform/input/index.js
\ No newline at end of file
diff --git a/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/tsconfig.json b/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/tsconfig.json
new file mode 100644
index 0000000000..1f7dd98f98
--- /dev/null
+++ b/crates/pack-tests/tests/snapshot/basic/foreign_jsx_transform/tsconfig.json
@@ -0,0 +1,5 @@
+{
+    "compilerOptions": {
+        "jsx": "react",
+    }
+}
\ No newline at end of file