fix(types): add IntrinsicElements to jsximportSource runtime definitions (#6532)

johnjenkins · John Jenkins · web-flow · commit 0fa0bc8e56bc · 2026-01-06T16:51:08.000Z
* fix(runtime): fix jsxImportSource Fragment handling

* chore:

* fix(types): add IntrinsicElements to jsximportSource runtime definitions

---------

Co-authored-by: John Jenkins &lt;john.jenkins@nanoporetech.com&gt;
diff --git a/src/internal/stencil-core/jsx-dev-runtime.d.ts b/src/internal/stencil-core/jsx-dev-runtime.d.ts
@@ -6,7 +6,8 @@
  * TypeScript will automatically import from this module in development mode.
  */
 
-import type { VNode } from '../stencil-public-runtime';
+import type { VNode, JSXBase } from '../stencil-public-runtime';
+import type { JSX as LocalJSX } from '../stencil-public-runtime';
 
 export { Fragment } from '../stencil-public-runtime';
 
@@ -21,3 +22,20 @@ export function jsxDEV(
   source?: any,
   self?: any,
 ): VNode;
+
+/**
+ * JSX namespace for TypeScript's automatic JSX runtime.
+ * This is required for TypeScript to resolve JSX element types when using
+ * "jsx": "react-jsxdev" with "jsxImportSource": "@stencil/core".
+ */
+export namespace JSX {
+  type BaseElements = LocalJSX.IntrinsicElements & JSXBase.IntrinsicElements;
+
+  export type IntrinsicElements = {
+    [K in keyof BaseElements]: BaseElements[K] & { children?: any };
+  } & {
+    [tagName: string]: any;
+  };
+
+  export type Element = VNode | VNode[] | null;
+}
diff --git a/src/internal/stencil-core/jsx-runtime.d.ts b/src/internal/stencil-core/jsx-runtime.d.ts
@@ -7,7 +7,8 @@
  * these modules instead of requiring manual `h` imports.
  */
 
-import type { VNode } from '../stencil-public-runtime';
+import type { VNode, JSXBase } from '../stencil-public-runtime';
+import type { JSX as LocalJSX } from '../stencil-public-runtime';
 
 export { Fragment } from '../stencil-public-runtime';
 
@@ -20,3 +21,20 @@ export function jsx(type: any, props: any, key?: string): VNode;
  * JSX runtime function for creating elements with static children.
  */
 export function jsxs(type: any, props: any, key?: string): VNode;
+
+/**
++ * JSX namespace for TypeScript's automatic JSX runtime.
++ * This is required for TypeScript to resolve JSX element types when using
++ * "jsx": "react-jsx" with "jsxImportSource": "@stencil/core".
++ */
+export namespace JSX {
+  type BaseElements = LocalJSX.IntrinsicElements & JSXBase.IntrinsicElements;
+
+  export type IntrinsicElements = {
+    [K in keyof BaseElements]: BaseElements[K] & { children?: any };
+  } & {
+    [tagName: string]: any;
+  };
+
+  export type Element = VNode | VNode[] | null;
+}
