Typescript Typings

[nzayatz14]

Hey there,

I was looking into your platform and it appears to be very well put together so far, nice work!

Is there any plan fo you all to add Typescript definitions to this library? Many of my companies projects are in Typescript and require type definitions to be built properly.

Thanks!

[supersnager]

Hey @nzayatz14, I'm glad you appreciate my work, mate! I know Typescript is a must-have for this project. Version 2.0 will definitely be rewritten to Typescript. I am not sure yet, but it is possible that as a temporary solution I will add typing in the first version... BTW my second library for managing chat state is already written in Typescript. I hope it will be released tomorrow...

[nzayatz14]

@supersnager no worries, I found a workaround for now but obviously not as nice as actual type definitions.

If you wanted to quickly add types without rewriting the entire project. You could just create a file chat-ui-kit-react.d.ts and have your declared export types in there. It looks like you already have a reasonable grasp on what types you want each prop to be based on your documentation.

I created a pretty bare-bones version of this where I just declared all of the components I was using as extensions of React.ComponentClass<any>. It allows for my local Typescript transpile without any issues, but I don't get any nice autocomplete or anything like that.

declare module "@chatscope/chat-ui-kit-react" {
    import * as React from 'react';

    interface Avatar extends React.ComponentClass<any> {

    }
    export const Avatar: Avatar;

    interface ChatContainer extends React.ComponentClass<any> {

    }
    export const ChatContainer: ChatContainer;

    interface ConversationHeader extends React.ComponentClass<any> {
                Back: any
        Content: any
                Actions: any
    }
    export const ConversationHeader: ConversationHeader;

        ...remaining components...
}

You can read more about this here: https://www.typescriptlang.org/docs/handbook/declaration-files/templates/module-d-ts.html

[supersnager]

@nzayatz14 Thanks for the advice, it will definitely come in handy.

[valerii15298]

Hello guys. Thank you for developing Such a Great project!!! I also very much want Typescript to be used with this library so I can use it freely in my project. Also, I think a lot of other people will be interested in at least typescript definitions for this library(I personally cannot imagine how to work without autocomplete but this library will be exception:) ). So if you will have any updates, will be glad to hear that. Thank you.

[supersnager]

Update: Work on the Typescript typings is in progress. It will be available soon :)

[zhan2016]

Hello guys. Thanks for your excellent work! Does typescript typings have a smooth work? when is it going to be available? @supersnager

[supersnager]

Hey @zhan2016 I'm glad you asked. It will be available this week.

[zhan2016]

Thank you very much. Such a good news.

[Jak2k]

Is it availble now?

[supersnager]

Finally, there it is!

https://github.com/chatscope/chat-ui-kit-react/releases/tag/v1.9.1

(Please do not use version v1.9.0. It is buggy - it lacks type definition files :))

Sorry for the delay to everyone who waited so long for this. I know the lack of types is annoying (for me too :) ).

Thank you for being so patient, my friends!

[valerii15298]

@supersnager Thank you! If you guys have(or will have In future) some problems with typescript I would like to contribute and help too.