search

primefaces / primereact

The Most Complete React UI Component Library
https://primereact.org
MIT License
6.62k stars 1k forks source link

InputTextarea/InputText: Typescript incompatible ref type #3635

Closed mikejav closed 1 year ago

mikejav commented 1 year ago

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 commented 1 year ago

Related issue: https://github.com/primefaces/primereact/issues/3172

melloware commented 1 year ago

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 commented 1 year ago

The following should work:

export declare const InputTextarea: React.ForwardRefExoticComponent<InputTextareaProps & RefAttributes<HTMLTextAreaElement>>;
melloware commented 1 year ago

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

melloware commented 1 year ago

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 commented 1 year ago

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

mikejav commented 1 year ago

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