---
title: "Typed Polymorphic React Component"
url: https://daily.dev/posts/typed-polymorphic-react-component-qwqrzo59w
source_url: https://kittygiraudel.com/2026/06/19/typed-polymorphic-react-component
type: article
source: "Kitty says hi."
author: "Kitty Giraudel"
published: 2026-06-19T13:39:40.484Z
updated: 2026-06-20T10:00:10.592Z
tags: ["react", "typescript", "design-systems"]
reading_time: 4
upvotes: 67
comments: 1
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Typed Polymorphic React Component

**[Kitty says hi.](https://daily.dev/sources/kittygiraudel)** · [@kittygiraudel](https://daily.dev/kittygiraudel) · 4 min read · 67 upvotes · 1 comments

## Summary

A practical walkthrough of building a typed polymorphic React component using TypeScript generics. The author explores why a naive intersection type approach fails to narrow props correctly, discovers that wrapping ComponentProps in a mapped type (or using Omit with any key) forces TypeScript to materialize the generic after inference, and arrives at a working implementation where the allowed props are strictly determined by the value of the `as` prop.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://kittygiraudel.com/2026/06/19/typed-polymorphic-react-component>

---

Tags: [#react](https://daily.dev/tags/react), [#typescript](https://daily.dev/tags/typescript), [#design-systems](https://daily.dev/tags/design-systems)

[View this post on daily.dev](https://daily.dev/posts/typed-polymorphic-react-component-qwqrzo59w)
