Add TypeScript Compatibility

[Isaius]

I tried to use this lib on a project that I'm doing with TypeScript, but when tried to install @types/react-hover the package manager cannot find it. So I looked around a bit and here I am. I want to use this, and want to learn how to make a type definition file, so... Why not?

What I have done already:

declare module 'react-hover'{
    export interface ReactHoverOptions{
        followCursor: boolean,
        shiftX: number,
        shiftY: number
    }

    export interface ReactHoverProps extends React.Props<ReactHover> {
        options: ReactHoverOptions

    }

    class ReactHover extends React.Component<ReactHoverProps>{ }

    export default ReactHover;
}

And with this the VsCode intellisense worked for the options object of ReactHover

But now I can't find a way to add type definition for ReactHover.Trigger and ReactHover.Hover. Anyone that know more about this can (and want) help? I have alreadt tried a lot of ways (almost all of them are wrong)

[cht8687]

@stevemao any advise on typescript? 😄

[cht8687]

@Isaius I've published version 2.0.0. Directly exported the two components.

https://github.com/cht8687/react-hover/blob/master/src/index.js#L2

Please let me know if this works for you.

Also, could you share with us the final types file you come up with? Thanks.

[Isaius]

Sure!

I was checking the new version and I managed to add the intellisense for them with this change that you made, but Trigger and Hover are working without the type prop:

So, I want to ask: Why the type is needed?

I made this creating a new react app, installing the lib and creating the file index.d.ts on the lib folder inside node_modules, but cloning the repository and doing the same didn't worked to use in the example file. Any idea why?

[cht8687]

Hi @Isaius I am glad it worked for you now.

Good question. Why we need the type?

It related to this issue: https://github.com/cht8687/react-hover/issues/11

meanwhile, I am thinking if you can send a PR to include the index.d.ts file? 😄 thanks.

[Isaius]

I was already planning to do this, just waiting to be sure if that is correct, it's because that I asked if the intellisense should be working on the example files. I'll do the PR, but the file must be in the main folder when is intalled on node_modules. Since I don't know about how npm packages work, where should I put the file for when someone try to install the package the index.d.ts stay on the right place?