Convert to typescript

[crashnick16]

I am looking to convert this template to typescript but I did not manage to get it working yet.

I started off with ChartCard.jsx file but I keep getting errors like:

Type '{ card: { display: string; position: string; width: string; margin: string; boxShadow: string; bo...' provides no match for the signature '(theme: Theme): Record<"card" | "cardHeader" | "cardTitle" | "cardContent" | "cardCategory" | "cardStats" | "cardActions" | "cardStatsLink" | "cardStatsIcon" | "orangeCardHeader" | "greenCardHeader" | "redCardHeader" | "blueCardHeader" | "purpleCardHeader" | "warningCardStatsIcon" | "primaryCardStatsIcon" | "dangerCardStatsIcon" | "successCardStatsIcon" | "infoCardStatsIcon" | "roseCardStatsIcon" | "grayCardStatsIcon", CSSProperties>'.

Any ideas?

Thanks,
Nick

[einazare]

Hello @crashnick16 .

Thank you for your interest in our product. We haven't yet used Typescript in our React products and we can't really help you with this issue.
You can take a look at this: https://github.com/Microsoft/TypeScript-React-Starter .

Best,
Manu

[Slessi]

@crashnick16 @einazare I have ported version 1.2.0 of this project to TypeScript at https://github.com/Slessi/material-dashboard-react-ts if either of you are interested

It is worth noting that there are some slight changes to dependencies, mostly notably using @material-ui/core#^1.0.0 instead of the beta version used in 1.2.0. Other lib versions were prefixed with ^.

Only issue I noticed was the card header clipping mentioned in #26 but I fixed it with overflow: visible in JSS.

[einazare]

Hello @Slessi ,

Thank you for this.
I am going to make an update to @material-ui/core at the end of this week and i am going to take a look at your code to see if i can somehow integrate it in our product.

Once again thank you,
Manu

[Slessi]

Cool, drop a message if you have any questions :)

[kmturley]

This dashboard project is also written in typescript:
https://github.com/goemen/react-material-ui-typescript

The latest Material UI Dashboard is a bit different:
https://material-ui.com/page-layout-examples/dashboard/

I've converted it to Typescript here:
https://github.com/kmturley/react-typescript-scss/tree/feature/material
https://kmturley.github.io/react-typescript-scss/

[iamandrewluca]

There is no need to rewrite all project in TypeScript, better to add definition types near components, or other files that are used, or create the definitions separately in https://github.com/DefinitelyTyped/DefinitelyTyped