From 35911dbfecd010a60854d34843f30c21b0a5e0b6 Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 20 Jan 2021 09:47:07 -0800 Subject: [PATCH 1/6] =?UTF-8?q?Heading.js=20=E2=86=92=20Heading.tsx?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/{Heading.js => Heading.tsx} | 7 ++++--- src/__tests__/{Heading.js => Heading.tsx} | 0 2 files changed, 4 insertions(+), 3 deletions(-) rename src/{Heading.js => Heading.tsx} (60%) rename src/__tests__/{Heading.js => Heading.tsx} (100%) diff --git a/src/Heading.js b/src/Heading.tsx similarity index 60% rename from src/Heading.js rename to src/Heading.tsx index 01a93cb7f0e..30cc12f5da9 100644 --- a/src/Heading.js +++ b/src/Heading.tsx @@ -1,10 +1,10 @@ import styled from 'styled-components' -import sx from './sx' +import sx, {SxProp} from './sx' import PropTypes from 'prop-types' -import {TYPOGRAPHY, COMMON, get} from './constants' +import {TYPOGRAPHY, COMMON, get, SystemTypographyProps, SystemCommonProps} from './constants' import theme from './theme' -const Heading = styled.h2` +const Heading = styled.h2` font-weight: ${get('fontWeights.bold')}; font-size: ${get('fontSizes.5')}; margin: 0; @@ -24,4 +24,5 @@ Heading.propTypes = { ...TYPOGRAPHY.propTypes } +export type HeadingProps = React.ComponentProps export default Heading diff --git a/src/__tests__/Heading.js b/src/__tests__/Heading.tsx similarity index 100% rename from src/__tests__/Heading.js rename to src/__tests__/Heading.tsx From 565018e30dd2ad3563681238d8779faeaaf6ed4f Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 20 Jan 2021 10:02:44 -0800 Subject: [PATCH 2/6] Update styled-system types --- package.json | 2 +- yarn.lock | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 5e961b53736..51c44ed3009 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,7 @@ "@styled-system/props": "5.1.4", "@styled-system/theme-get": "5.1.2", "@types/styled-components": "^4.4.0", - "@types/styled-system": "5.1.2", + "@types/styled-system": "5.1.10", "@types/styled-system__css": "5.0.14", "@types/styled-system__theme-get": "5.0.1", "classnames": "^2.2.5", diff --git a/yarn.lock b/yarn.lock index dfc6ed04ae9..479e1a27960 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1773,12 +1773,12 @@ "@types/react-native" "*" csstype "^2.2.0" -"@types/styled-system@5.1.2": - version "5.1.2" - resolved "https://registry.yarnpkg.com/@types/styled-system/-/styled-system-5.1.2.tgz#d75c40bc4a3bb0d0022eb3dcae58854129e9dd32" - integrity sha512-Byh33qthYnI6+qS0TRr4vqd+N/ax6ic1NFE6ZA16xuVr/EvYvSB8+diEP1lTSE7sP/MTdQpl+KaONREnyalDUA== +"@types/styled-system@5.1.10": + version "5.1.10" + resolved "https://registry.yarnpkg.com/@types/styled-system/-/styled-system-5.1.10.tgz#dcf5690dd837ca49b8de1f23cb99d510c7f4ecb3" + integrity sha512-OmVjC9OzyUckAgdavJBc+t5oCJrNXTlzWl9vo2x47leqpX1REq2qJC49SEtzbu1OnWSzcD68Uq3Aj8TeX+Kvtg== dependencies: - csstype "^2.6.4" + csstype "^3.0.2" "@types/styled-system__css@5.0.14": version "5.0.14" @@ -3705,7 +3705,7 @@ cssstyle@^2.0.0: dependencies: cssom "~0.3.6" -csstype@^2.2.0, csstype@^2.5.5, csstype@^2.6.4: +csstype@^2.2.0, csstype@^2.5.5: version "2.6.14" resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.14.tgz#004822a4050345b55ad4dcc00be1d9cf2f4296de" integrity sha512-2mSc+VEpGPblzAxyeR+vZhJKgYg0Og0nnRi7pmRXFYYxSfnOnW8A5wwQb4n4cE2nIOzqKOAzLCaEX6aBmNEv8A== From 788ae61594cd0e3b88f3510809e99cbfedde3178 Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 20 Jan 2021 10:10:14 -0800 Subject: [PATCH 3/6] Remove skipped tests --- src/__tests__/Heading.tsx | 25 ------------------------- 1 file changed, 25 deletions(-) diff --git a/src/__tests__/Heading.tsx b/src/__tests__/Heading.tsx index 57f3ffe3fe3..2837621e1a6 100644 --- a/src/__tests__/Heading.tsx +++ b/src/__tests__/Heading.tsx @@ -80,10 +80,6 @@ describe('Heading', () => { expect(render()).toHaveStyleRule('font-family', theme.fonts.mono) }) - it.skip('respects nowrap', () => { - expect(render()).toEqual(render()) - }) - it('renders fontSize', () => { for (const fontSize of theme.fontSizes) { expect(render()).toHaveStyleRule('font-size', `${fontSize}`) @@ -93,25 +89,4 @@ describe('Heading', () => { it('respects the "fontStyle" prop', () => { expect(render()).toHaveStyleRule('font-style', 'italic') }) - - it.skip('renders fontSize with f* classes using inverse scale', () => { - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - expect(render()).toEqual(render()) - }) - - it.skip('does not pass on arbitrary attributes', () => { - const defaultOutput = render() - expect(render()).toEqual(defaultOutput) - expect(render(