highcharts / highcharts-react

The official Highcharts supported wrapper for React

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Error on "ref" Types

negimaru opened this issue · comments

Im getting an error after 3.2.1 Update when I load the component like in the example

This is the current code I have

const chartComponentRef = useRef<HighchartsReact.RefObject>(null)

return <HighchartsReact highcharts={Highcharts} options={chartOptions} ref={chartComponentRef} {...rest} />

And this is the error im getting

TS2322: Type RefObject<RefObject> | LegacyRef<HTMLDivElement> is not assignable to type  Ref<HighchartsReactRefObject> | undefined

Type  string  is not assignable to type  Ref<HighchartsReactRefObject> | undefined 
index.d.ts(153, 9): The expected type comes from property  ref  which is declared here on type
IntrinsicAttributes & Omit<HighchartsReactProps, "ref"> & RefAttributes<HighchartsReactRefObject>

image

I don't know if it's something in my project, something I'm doing wrong, or some change I'm missing. 😅

Hi @negimaru,

Thank you for contacting us!

Could you reproduce the problem in some online code editor? You can use this example: https://stackblitz.com/edit/react-starter-typescript-cnskcz?file=package.json,App.tsx as a base to start.

I've tried to use the HighchartsReact.RefObject type with highcharts-react-official v3.2.1 and it works as expected.

Best regards!

Hi again!

Sorry for the wait

I have not found a way to reproduce it as it does not allow me to use the version of react I am currently using.
It seem to be a issue with React 17 types that does not happens in React 18

image

Hello,

Everything seems to also work with React 17.
Example: https://stackblitz.com/edit/react-edkjmh?file=package.json,src%2FApp.tsx

@ppotaczek
Hello, I m having a similar issue:
image

I just upgraded highcharts and highcharts-react-official, using now:

highcharts: ^11.1.0
highcharts-react-official: ^3.2.1

The error is new since the update. Any idea what happened?

Hi @HRworksKra, Could you reproduce the problem in the live demo that I added in my previous comment?

Its seems to work fine in the snipets but its not the same in my project, maybe its because dependency issue, but i have not found it yet sadly

Closed due to inactivity.