Skip to Content
Programming TypeScript
book

Programming TypeScript

by Boris Cherny
May 2019
Intermediate to advanced content levelIntermediate to advanced
322 pages
7h 6m
English
O'Reilly Media, Inc.
Book available
Content preview from Programming TypeScript

Appendix G. TSX

Under the hood, TypeScript exposes a few hooks for typing TSX in a pluggable way. These are special types on the global.JSX namespace that TypeScript looks at as the source of truth for TSX types throughout your program.

Note

If you’re just using React, you don’t need to know about these low-level hooks, but if you’re writing a TypeScript library that uses TSX without React, this appendix provides a helpful reference for the hooks you can use.

TSX supports two kinds of elements: built-in ones (intrinsic elements) and user-defined ones (value-based elements). Intrinsic elements always have lowercased names, and refer to built-in elements like <li>, <h1>, and <div>. Value-based elements have PascalCased names, and refer to those elements that you create with React (or whatever frontend framework you’re using TSX with); they can be defined either as functions or as classes. See Figure G-1.

prts ag01
Figure G-1. The kinds of TSX elements

Using React’s type declarations as an example, we’ll walk through the hooks TypeScript uses to safely type TSX. Here’s how React hooks into TSX to type JSX safely:

declare global {
  namespace JSX {
    interface Element extends React.ReactElement<any> {} 1
    interface ElementClass extends React.Component<any> { 
      render(): React.ReactNode
    }
    interface ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Learn React with TypeScript - Second Edition

Learn React with TypeScript - Second Edition

Carl Rippon
Understanding TypeScript

Understanding TypeScript

Maximilian Schwarzmüller
Learning TypeScript

Learning TypeScript

Josh Goldberg

Publisher Resources

ISBN: 9781492037644Errata PageSupplemental Content