Typing a rest property in object destructuring as a function argument
- Dominant language
- Rust
- Stars
- 22.3k
- Forks
- 1.9k
- PR merge metrics
- No merged PRs in 30d
Description
Hey,
I have a React component which takes a render prop and some other props which are variable. The render prop is called with all the other props.
The problem is that Flow can't infer the type of the other props correctly but I can't statically type them because they have to be variable.
My component looks like the following:
```js
import * as React from 'react'
type TContainerProps = {
render: TOtherProps => React.Node,
}
function Container({
render,
...otherProps
}: TOtherProps & TContainerProps): React.Node {
return render(otherProps)
}
const component = (
{
// The type of props should be
// {
// hello: string,
// foo: number,
// }
//
// and not
// {
// foo: number,
// hello: string,
// render: (
// _: any
// ) => ?(
// | number
// | string
// | boolean
// | React$Element
// | Iterable),
// }
;(props: {| hello: string, foo: number |})
console.log(props)
return
}}
/>
)
```
[Link to Playground](https://flow.org/try/#0FASwtgDg9gTgLgAgFQIIYGcECUCmqDGiAZjFGAgOQx6EXDBwCeEOCAKgMJQB2cqI3HDAAKpCOgA8bAPJwAFkNFRxAPgQBeBAG9gASGrcAJkIBc7WQpFjM6tbgJwAdADkoxgDTAAvvSIBXbkIQHgQuXn5BGCkLRWszLS8VAAodfRwjIU9dRxyoeVjldG8zGXyrQoQAMnYwvgEC8WiypVUASjN7Qhc3VlTqOD8YbgQDYxgkvMsW9FbvenwedEQFyB50xE0kvQlaiKE9XQUAGyOodQAiAHdYI8Nzg6IoM60ARgAmAGYfXTSMmHUtBBrBo1KkfgB6cHsBQIJgsBBQIgIIEVdByKB+W4IABGOAOukh2nxhMOOBOUDMSxgAgA5lkIVDdI8KQhuH4wLiYPSCVDvgziVDUEZWXkBUSfjyEEynmY2RzMmLSeTKXBqdw6YrRqYEFsJSTdAB9MxCxiK1oghAAfl1DKlugAPqz2ZzFQ6EFTaa7Hdinkc8NwvdgaHAACQAUT9YHWEhNKkDAEk4EJUNi-THuIwVK1uYS+boANxJFHieKO46nFVqukIZmy51CBD2ryzfELbjoKB+xynGlF6yzCX9QbDCSGEAANxUgOsjnLUC8EnBY8nBy833BcdmQA)
Is there a way to type this component correctly with Flow?
Contributor guide
Assessment
This issue has not been assessed yet.