Skip to content

Commit 7b1f1f2

Browse files
authored
Update README.md
1 parent 14699e9 commit 7b1f1f2

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

README.md

+27
Original file line numberDiff line numberDiff line change
@@ -821,6 +821,33 @@ partialStateUpdate({foo: 2}) // this works
821821
Note that there are some TS users who don't agree with using `Partial` as it behaves today. See [subtle pitfalls of the above example here](https://twitter.com/ferdaber/status/1084798596027957248), and check out this long discussion on [why @types/react uses Pick instead of Partial](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18365).
822822
</details>
823823

824+
## The Types I need weren't exported!
825+
826+
This can be annoying but here are ways to grab the types!
827+
828+
- Grabbing the Prop types of a component: Use `typeof`, and optionally `Omit` any overlapping types
829+
830+
```tsx
831+
import { Button } from 'library' // but doesn't export ButtonProps
832+
type ButtonProps = React.ComponentProps<typeof Button> // grab your own
833+
type AlertButtonProps = Omit<ButtonProps, 'onClick'> // modify
834+
const AlertButton: React.FC<AlertButtonProps> = props => (
835+
<Button onClick={() => alert('hello')} {...props} />
836+
)
837+
```
838+
839+
- Grabbing the return type of a function: use `ReturnType`:
840+
841+
```tsx
842+
// inside some library - return type { baz: number } is inferred but not exported
843+
function foo(bar: string) {
844+
return { baz: 1 }
845+
}
846+
847+
// inside your app, if you need { baz: number }
848+
type FooReturn = ReturnType<typeof foo> // { baz: number }
849+
```
850+
824851
# Troubleshooting Handbook: TSLint
825852

826853
Sometimes TSLint is just getting in the way. Judicious turning off of things can be helpful. Here are useful tslint disables you may use:

0 commit comments

Comments
 (0)