InputTextarea/InputText: Typescript incompatible ref type

[mikejav]

Describe the bug

When you are using InputTextarea component and want to access the DOM Element using the reference - it indicates the wrong type.

Expected behavior

The HTMLTextAreaElement type should be used for ref.

Reproducer

https://stackblitz.com/edit/vitejs-vite-6zkqc4?file=package.json,src%2FApp.tsx

PrimeReact version

8.7.2

React version

18.x

Language

TypeScript

Build / Runtime

Vite

Browser(s)

Chrome 106

[mikejav]

Related issue: #3172

[melloware]

I am not a typescript expert but here is how its currently being extended.

export interface InputTextareaProps 
    extends Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, 'ref'>

[mikejav]

The following should work:

export declare const InputTextarea: React.ForwardRefExoticComponent<InputTextareaProps & RefAttributes<HTMLTextAreaElement>>;

[melloware]

This is fantastic! Trying it now it seems to work so fixing InputText as well.

[melloware]

OK this is now causing other issue it hthe TypeScript checking...

Error: components/lib/inputmask/inputmask.d.ts(42,26): error TS274[9](https://github.com/primefaces/primereact/actions/runs/3462195764/jobs/5780762361#step:7:10): 'InputText' refers to a value, but is being used as a type here. Did you mean 'typeof InputText'?
Error: components/lib/inputnumber/inputnumber.d.ts(76,24): error TS2749: 'InputText' refers to a value, but is being used as a type here. Did you mean 'typeof InputText'?
Error: components/lib/mention/mention.d.ts(62,24): error TS2749: 'InputTextarea' refers to a value, but is being used as a type here. Did you mean 'typeof InputTextarea'?
Error: components/lib/password/password.d.ts(56,24): error TS2749: 'InputText' refers to a value, but is being used as a type here. Did you mean 'typeof InputText'?

[melloware]

@mikejav thanks for the assist on this! this has been driving me nuts for a while now...

[mikejav]

@melloware no problem :)
I'm glad we make it