From 36a50b1f4ada91f9fe50e9b5d895cf651d13f172 Mon Sep 17 00:00:00 2001 From: Spencer Elliott Date: Tue, 29 Jan 2019 11:38:50 -0500 Subject: [PATCH 1/2] Fix @smooth-ui/core-em TypeScript definitions Adjust the build step so core-em and core-sc have their own independent type definitions, and copy the shared definitions to a 'shared/index.d.ts' module. --- config/rollup.js | 20 ++++++++++++++------ packages/core-em/src/index.d.ts | 27 +++++++++++++++++++++++++++ packages/core-sc/src/index.d.ts | 26 ++++++++++++++++++++++++++ packages/shared/core/index.d.ts | 31 ++++--------------------------- 4 files changed, 71 insertions(+), 33 deletions(-) create mode 100644 packages/core-em/src/index.d.ts create mode 100644 packages/core-sc/src/index.d.ts diff --git a/config/rollup.js b/config/rollup.js index c903a5add..bda536248 100644 --- a/config/rollup.js +++ b/config/rollup.js @@ -24,12 +24,20 @@ export const getRollupConfig = ({ exclude: 'node_modules/**', configFile: path.join(pwd, '../../babel.config.js'), }), - copyTypeScriptDefs - ? copy({ - files: `${CORE_DIR}/*.d.ts`, - dest: DIST_DIR, - }) - : null, + ...( + copyTypeScriptDefs + ? [ + copy({ + files: `${CORE_DIR}/*.d.ts`, + dest: `${DIST_DIR}/shared`, + }), + copy({ + files: `${SOURCE_DIR}/*.d.ts`, + dest: DIST_DIR + }) + ] + : [] + ), ], } diff --git a/packages/core-em/src/index.d.ts b/packages/core-em/src/index.d.ts new file mode 100644 index 000000000..e32e90bcb --- /dev/null +++ b/packages/core-em/src/index.d.ts @@ -0,0 +1,27 @@ +import * as emotionCore from '@emotion/core' +import { withTheme } from 'emotion-theming' +import { ThemeType } from './shared' + +export * from './shared' + +export const Normalize: ReturnType + +export type ResponsiveUtilityStyles = + | string + | emotionCore.ArrayInterpolation + +export const up: ( + name: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any + +export const down: ( + name: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any + +export const between: ( + lower: string | number, + upper: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any diff --git a/packages/core-sc/src/index.d.ts b/packages/core-sc/src/index.d.ts new file mode 100644 index 000000000..3f31e730c --- /dev/null +++ b/packages/core-sc/src/index.d.ts @@ -0,0 +1,26 @@ +import * as styledComponents from 'styled-components' +import { ThemeType } from './shared' + +export * from './shared' + +export const Normalize: styledComponents.GlobalStyleComponent<{__scTheme?: ThemeType},ThemeType> + +export type ResponsiveUtilityStyles = + | string + | styledComponents.FlattenSimpleInterpolation + +export const up: ( + name: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any + +export const down: ( + name: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any + +export const between: ( + lower: string | number, + upper: string | number, + code: ResponsiveUtilityStyles, +) => (props: Object) => any diff --git a/packages/shared/core/index.d.ts b/packages/shared/core/index.d.ts index c66ea4cad..2b4086b71 100644 --- a/packages/shared/core/index.d.ts +++ b/packages/shared/core/index.d.ts @@ -1,7 +1,6 @@ /// import * as React from 'react' -import * as styledComponents from 'styled-components' export type DefaultColors = 'primary' | 'secondary' @@ -16,9 +15,9 @@ export type Sizes = "sm" | "md" | "lg" interface InputType { checked?: boolean - onChange?: (e) => void - onFocus?: (e) => void - onBlur?: (e) => void + onChange?: React.ChangeEventHandler + onFocus?: React.FocusEventHandler + onBlur?: React.FocusEventHandler style?: React.CSSProperties } @@ -595,7 +594,7 @@ export const lazyTh: (name: string) => (props: Object) => string export const th: ( name: string, - transform?: (res) => string, + transform?: (res: any) => string, ) => (props: Object) => string export const mixin: ( @@ -630,8 +629,6 @@ export const composeStyles: ( ...funcs: Array<(props: Object) => string> ) => ((props: Object) => Object) -export const Normalize: styledComponents.GlobalStyleComponent<{__scTheme?: ThemeType},ThemeType> - export interface ModalProps extends BoxProps { children?: React.ReactNode onClose?: () => void @@ -721,23 +718,3 @@ export const mediaBetweenWidth: ( min: string | number, max: string | number, ) => string - -export type ResponsiveUtilityStyles = - | string - | styledComponents.FlattenSimpleInterpolation - -export const up: ( - name: string | number, - code: ResponsiveUtilityStyles, -) => (props: Object) => any - -export const down: ( - name: string | number, - code: ResponsiveUtilityStyles, -) => (props: Object) => any - -export const between: ( - lower: string | number, - upper: string | number, - code: ResponsiveUtilityStyles, -) => (props: Object) => any From c9d805d96cacccd9ca5af8b3b3b7284727da834f Mon Sep 17 00:00:00 2001 From: Spencer Elliott Date: Fri, 1 Feb 2019 14:35:59 -0500 Subject: [PATCH 2/2] Add a "tsc:check" ci script to ensure typedef correctness --- package.json | 8 ++++++-- yarn.lock | 32 ++++++++++++++++++++++++++++++++ 2 files changed, 38 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 2ddcb92d1..2338e8d8c 100644 --- a/package.json +++ b/package.json @@ -7,12 +7,13 @@ "build": "lerna run build", "build:docs": "yarn build && docz build && cp _redirects .docz/dist", "build:watch": "WATCH_MODE=true lerna run --parallel build -- --watch", - "ci": "yarn lint && yarn test && yarn build && bundlesize", + "ci": "yarn lint && yarn test && yarn build && yarn tsc:check && bundlesize", "dev": "docz dev", "format": "prettier --write \"**/*.{js,json,md,mdx}\"", "lint": "eslint .", "release": "lerna publish --conventional-commits --force-publish=* && conventional-github-releaser --preset angular", - "test": "jest" + "test": "jest", + "tsc:check": "tsc --noEmit --strict ./packages/core-em/dist/index.d.ts ./packages/core-sc/dist/index.d.ts" }, "bundlesize": [ { @@ -36,6 +37,8 @@ "@emotion/core": "^10.0.6", "@emotion/styled": "^10.0.6", "@material-ui/system": "^3.0.0-alpha.1", + "@types/react": "^16.7.22", + "@types/styled-components": "^4.1.6", "babel-core": "^7.0.0-0", "babel-eslint": "^10.0.1", "babel-jest": "^23.6.0", @@ -79,6 +82,7 @@ "standard-version": "^4.4.0", "styled-components": "^4.1.3", "styled-system": "^3.2.1", + "typescript": "^3.3.1", "uglifyjs-webpack-plugin": "^2.1.1", "webpack": "^4.28.4" }, diff --git a/yarn.lock b/yarn.lock index 1fac1f18a..9ebb81c36 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1738,6 +1738,28 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-10.11.7.tgz#0e75ca9357d646ca754016ca1d68a127ad7e7300" integrity sha512-yOxFfkN9xUFLyvWaeYj90mlqTJ41CsQzWKS3gXdOMOyPVacUsymejKxJ4/pMW7exouubuEeZLJawGgcNGYlTeg== +"@types/prop-types@*": + version "15.5.8" + resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.8.tgz#8ae4e0ea205fe95c3901a5a1df7f66495e3a56ce" + integrity sha512-3AQoUxQcQtLHsK25wtTWIoIpgYjH3vSDroZOUr7PpCHw/jLY1RB9z9E8dBT/OSmwStVgkRNvdh+ZHNiomRieaw== + +"@types/react@*", "@types/react@^16.7.22": + version "16.7.22" + resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.22.tgz#5bc6d166d5ac34b835756f0b736c7b1af0043e81" + integrity sha512-j/3tVoY09kHcTfbia4l67ofQn9xvktUvlC/4QN0KuBHAXlbU/wuGKMb8WfEb/vIcWxsOxHv559uYprkFDFfP8Q== + dependencies: + "@types/prop-types" "*" + csstype "^2.2.0" + +"@types/styled-components@^4.1.6": + version "4.1.6" + resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-4.1.6.tgz#9aa1d47dbc6bae540083869bcc6c639c6e9af0fe" + integrity sha512-w/ra/Tk9oPMvWpWId7esZNY1MOa6E9BYUPLl4scVJdYnrYuy5ITLbku8dGDCVH/vjjuegrHBCRYvFLQOYJ+uHg== + dependencies: + "@types/node" "*" + "@types/react" "*" + csstype "^2.2.0" + "@types/unist@*", "@types/unist@^2.0.0": version "2.0.2" resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.2.tgz#5dc0a7f76809b7518c0df58689cd16a19bd751c6" @@ -4510,6 +4532,11 @@ cssstyle@^1.0.0: dependencies: cssom "0.3.x" +csstype@^2.2.0: + version "2.6.2" + resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.2.tgz#3043d5e065454579afc7478a18de41909c8a2f01" + integrity sha512-Rl7PvTae0pflc1YtxtKbiSqq20Ts6vpIYOD5WBafl4y123DyHUeLrRdQP66sQW8/6gmX8jrYJLXwNeMqYVJcow== + csstype@^2.5.7: version "2.6.0" resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.0.tgz#6cf7b2fa7fc32aab3d746802c244d4eda71371a2" @@ -13626,6 +13653,11 @@ typedarray@^0.0.6: resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= +typescript@^3.3.1: + version "3.3.1" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.3.1.tgz#6de14e1db4b8a006ac535e482c8ba018c55f750b" + integrity sha512-cTmIDFW7O0IHbn1DPYjkiebHxwtCMU+eTy30ZtJNBPF9j2O1ITu5XH2YnBeVRKWHqF+3JQwWJv0Q0aUgX8W7IA== + ua-parser-js@^0.7.18: version "0.7.18" resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.18.tgz#a7bfd92f56edfb117083b69e31d2aa8882d4b1ed"