Skip to content

Commit

Permalink
Add documentation for $Diff<A, B>
Browse files Browse the repository at this point in the history
This commit documents the $Diff utility type, explaining how it is used
in React to define the type of the props accepted by a Component.
  • Loading branch information
gabro committed Nov 11, 2016
1 parent 5feaf89 commit 3cd4766
Showing 1 changed file with 20 additions and 2 deletions.
22 changes: 20 additions & 2 deletions website/docs/ref/utility-types.doc.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ next: react.html
*/

/*
## `Keys<T>`
## `$Keys<T>`
In Flow you can [use union types similar to enums](builtins.html#literal-types):
*/

Expand Down Expand Up @@ -70,8 +70,26 @@ In the example above, the type of `Country` is equivalent to `type Country = 'US

/*
## `$Diff<A, B>`
Work in progress
As the name hints, `$Diff<A, B>` is the type representing the set difference of `A` and `B`, i.e. `A \ B`, where `A` and `B` are both [Object Types](objects.html). Here's an example:
*/
type Props = { name: string, age: number };
type DefaultProps = { age: number };
type RequiredProps = $Diff<Props, DefaultProps>;

function setProps(props: RequiredProps) {
// ...
}

setProps({ name: 'foo' });
setProps({ name: 'foo', age: 42, baz: false }); // you can pass extra props too
// $ExpectError
setProps({ age: 42 }); // error, name is required
/*
As you may have noticed, the example is not a random one. `$Diff` is exactly what the React definition file uses to define the type of the props accepted by a React Component.
*/

/*
## `Class<T>`
Work in progress
Expand Down

0 comments on commit 3cd4766

Please sign in to comment.