How to type React children correctly in TypeScript
Blog post from LogRocket
Chinwike Maduabuchi's update in December 2025 addresses recent changes in the TypeScript typing ecosystem concerning React's children prop, providing modern solutions for typing both simple and complex components. The article explains the intricacies of the children prop in JSX and the various valid types it can assume, such as strings, JSX elements, JavaScript expressions, and functions. It recommends using the ReactNode superset type for comprehensive coverage of renderable types, offering clarity and reducing decision fatigue. Additionally, it introduces the PropsWithChildren type for extending existing props with children, and the React.ComponentProps utility for maintaining type safety in reusable components. The guide emphasizes a shift away from using React.FC, advocating for explicit typing of children props in React 18 and 19, while also discussing the challenges and solutions for typing components that accept children and forward refs. The document highlights the benefits of wrapper components in improving type safety, especially in complex structures, and underscores the importance of understanding trade-offs to make typing a deliberate design choice.