DHI-GRAS / react-components

React components we use in our frontends
MIT License
1 stars 0 forks source link

Feature/typescript #16

Closed bertearazvan closed 4 years ago

bertearazvan commented 4 years ago

In this PR I am migrating all of the components to use TypeScript.

At the same time, it also closes the issue in the gras-storybook repo where the ArgsTable was not displaying the Props of the components.

This was happening because Storybook uses a plugin react-docgen-typescript-loader which bundles the props in the form of docs for every component. Therefore, this plugin had to be also added when we are creating the bundle for our library.

bertearazvan commented 4 years ago

In order to use and external theme we are using the useTheme hook together with the ThemeProvider inside every component. Fixed the color of the links as well in the previous commit @JeroenDerks.

Now we have a stable TypeScript based library where we can add any components which can be styled from an external materialUI Theme.

import { ThemeProvider } from '@material-ui/core'; // make sure the component is imported from /core and not from /core/styles
import { useTheme, Theme } from '@material-ui/core/styles';
const YourComponent = () => {
const theme: Theme = useTheme();
return (
<ThemeProvider theme={theme}>
     <YourMaterialUIComponents />
</ThemeProvider>
 )
}
export default YourComponent ;
bertearazvan commented 4 years ago

:tada: This PR is included in version 1.3.0 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: