diff --git a/docs/src/@rocketseat/gatsby-theme-docs/components/Sidebar.js b/docs/src/@rocketseat/gatsby-theme-docs/components/Sidebar.js index 92d95db2..5b75cd33 100644 --- a/docs/src/@rocketseat/gatsby-theme-docs/components/Sidebar.js +++ b/docs/src/@rocketseat/gatsby-theme-docs/components/Sidebar.js @@ -32,7 +32,6 @@ export default function Sidebar({ isMenuOpen }) { site: { siteMetadata: { footer, basePath }, }, - allMdx, components, examples, } = useStaticQuery(graphql` diff --git a/docs/src/docs/components/Input.mdx b/docs/src/docs/components/Input.mdx index 77fdeb05..ef3432c5 100644 --- a/docs/src/docs/components/Input.mdx +++ b/docs/src/docs/components/Input.mdx @@ -6,7 +6,7 @@ import { Input } from 'minerva-ui'; Extends native `` component -```js +```jsx import { Input } from 'minerva-ui'; ``` diff --git a/package.json b/package.json index 581714a2..1f73a092 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "@types/jest-axe": "^3.2.1", "@types/react": "^16.9.23", "@types/react-dom": "^16.9.5", + "@types/styled-system__css": "^5.0.6", "babel-loader": "^8.0.6", "cz-conventional-changelog": "3.1.0", "cz-customizable": "^6.2.0", diff --git a/src/Heading/index.tsx b/src/Heading/index.tsx index 5cde4a08..f0d9d7ad 100644 --- a/src/Heading/index.tsx +++ b/src/Heading/index.tsx @@ -2,7 +2,9 @@ import React, { forwardRef } from 'react'; import styled from 'styled-components'; import { MinervaProps, systemProps } from '../layout'; -const sizes = { +type SizeNames = 'xl' | 'lg' | 'md' | 'sm' | 'xs'; + +const sizes: { [key in SizeNames]: string } = { xl: '40px', lg: '32px', md: '24px', @@ -11,7 +13,7 @@ const sizes = { }; const StyledHeading = styled('h1')( - props => ({ + (props: { theme: any; size: SizeNames; lineHeight?: string }) => ({ ...props.theme.Heading, fontSize: sizes[props.size], lineHeight: props.lineHeight, diff --git a/src/InputField/index.tsx b/src/InputField/index.tsx index 87e07fd7..e35cfa41 100644 --- a/src/InputField/index.tsx +++ b/src/InputField/index.tsx @@ -33,7 +33,7 @@ export const StyledRequiredMarker = styled(Text)(() => { }; }); -export const RequiredMarker = ({ color }) => { +export const RequiredMarker = ({ color }: { color?: string }) => { return (