Function and class component typing patterns are legacy. For new code, use Component Syntax instead. Adding Flow types to your React components is incredibly powerful. After typing your component, Flow will statically ensure that you are us…
Hook Syntax is first-class syntax and typechecking support for React hooks, bringing hooks into the React language as their own entities that are syntactically and semantically distinct from regular functions, and using Flow to enforce that…
Learn how to migrate to Flow Enums from legacy JavaScript enum patterns like Object.freeze. First, learn how to update the enum definition site, and next learn how to update files that import and use the enum. If you are using Object.freeze…
Mapped types transform object types by iterating over their keys and producing new property types. Mapped types match TypeScript including distributivity, keyof-based source iteration, and the homomorphic {[K in keyof T]: ...} form. Use map…
Interfaces declare the structure a class or object must satisfy without requiring a specific class identity. Because classes in Flow are nominally typed, two classes with identical members are not interchangeable — interfaces provide struct…
Functions can be typed at their parameters (input) and return value (output). Return types can often be omitted thanks to inference, and parameter types can be inferred from context: There are three forms of functions that each have their o…
Some component libraries or design systems may want to restrict how components may be composed. For example, a Menu should only ever render MenuItems as children. Render types are a built-in way to support these constraints while still affo…
Flow uses Local Type Inference as its inference algorithm. The rules in this section reflect the main design features in this inference scheme. Flow tries to avoid requiring type annotation for parts of programs where types can easily be in…
Flow lets you share types between files using import type and export type syntax. You can export type aliases, interfaces, and classes from one file and import them in another. Don't forget to add @flow at the top of your file, otherwise Fl…
The as const modifier tells Flow to infer the narrowest possible type for a literal expression — literal types for primitives and read-only types for containers. Use as const when you need Flow to preserve exact literal values and read-only…
Match patterns both define a condition that must be matched, and new variables that are extracted (like destructuring). Primitive value patterns include string literals (e.g. 'light'), number literals (e.g. 42), BigInt literals (e.g. 10n),
Conditional types choose between two output types based on a type-level check: CheckType extends ExtendsType ? TrueType : FalseType. Conditional types match TypeScript in shape and most behaviors: distributivity over unions, infer on the ri…