Implicit element types (#5098)

* Separate arbitrary intrinsic element definition * Create changeset
withastro · Oct 18, 2022 · f684e9d · f684e9d
1 parent 66e8ae3
commit f684e9d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/.changeset/little-dodos-beam.md b/.changeset/little-dodos-beam.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Separate type definitions for built-in HTML elements and custom elements. Helpful when implementing an "as" prop similar to [styled-components](https://styled-components.com/docs/api#as-polymorphic-prop).
diff --git a/packages/astro/astro-jsx.d.ts b/packages/astro/astro-jsx.d.ts
@@ -1288,7 +1288,7 @@ declare namespace astroHTML.JSX {
 		zoomAndPan?: string | undefined | null;
 	}
 
-	interface IntrinsicElements {
+	interface DefinedIntrinsicElements {
 		// HTML
 		a: AnchorHTMLAttributes;
 		abbr: HTMLAttributes;
@@ -1461,8 +1461,10 @@ declare namespace astroHTML.JSX {
 		tspan: SVGAttributes;
 		use: SVGAttributes;
 		view: SVGAttributes;
+	}
 
-		// Allow for arbitrary elements
-		[name: string]: { [name: string]: any };
+	interface IntrinsicElements extends DefinedIntrinsicElements {
+	  // Allow for arbitrary elements
+	  [name: string]: { [name: string]: any };
 	}
 }