Accepted answer

So, to broaden the question some, this is really a question about preserving generic types in higher order functions. The following usage of forwardRef will properly typecheck (in 3.0.1)

const SelectWithRef = forwardRef(<Option extends string>(props: Props<Option>, ref?: Ref<HTMLSelectElement>) =>
  <Select<Option> {...props} forwardedRef={ref} />);

But, the Option generic is immediately resolved to string, rather than remaining as a generic. As such, the following does not typecheck

const onChange: (value: 'one' | 'two') => void = (value) => console.log(value);

<SelectWithRef<'one' | 'two'>
              ^^^^^^^^^^^^^^^ [ts] Expected 0 type arguments, but got 1
  options={['one', 'two']}
           ^^^^^^^^^^ [ts] Type 'string' is not assignable to type '"one" | "two"'

The relevant issue is tracked in this Typescript issue ticket.

Related Query

More Query from same tag