chore(all): use Babel and TS 3.7 (#234)

bigcommerce · Nov 6, 2019 · 3769123 · 3769123
1 parent 542cb64
commit 3769123
Show file tree

Hide file tree

Showing 66 changed files with 1,115 additions and 1,073 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -6,7 +6,7 @@ jobs:
   build:
     executor:
       name: node/default
-      tag: '10.15'
+      tag: '10.16'
 
     steps:
       - checkout

diff --git a/packages/big-design-icons/package.json b/packages/big-design-icons/package.json
@@ -14,9 +14,11 @@
     "directory": "packages/big-design-icons"
   },
   "scripts": {
-    "build": "rollup -c rollup.config.js",
-    "download": "node scripts/downloader.js",
+    "build": "yarn run build:js && yarn run build:dt",
+    "build:js": "rollup -c rollup.config.js",
+    "build:dt": "tsc --emitDeclarationOnly",
     "build:icons": "node scripts/build.js",
+    "download": "node scripts/downloader.js",
     "ci": "yarn run lint && yarn run build",
     "lint": "yarn run lint:tslint && yarn run lint:tsc && yarn run lint:prettier",
     "lint:prettier": "prettier --check 'src/**/*.{ts,tsx}'",
@@ -48,8 +50,8 @@
     "styled-components": "^4.1.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-proposal-class-properties": "^7.5.5",
+    "@babel/core": "^7.7.0",
+    "@babel/plugin-proposal-class-properties": "^7.7.0",
     "@babel/preset-env": "^7.5.5",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.1.0",
@@ -74,15 +76,12 @@
     "rimraf": "^2.6.3",
     "rollup": "^1.6.0",
     "rollup-plugin-babel": "4.2.0",
-    "rollup-plugin-commonjs": "^10.0.1",
     "rollup-plugin-filesize": "^6.0.1",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.1.0",
-    "rollup-plugin-sourcemaps": "^0.4.2",
-    "rollup-plugin-typescript2": "^0.22.1",
     "styled-components": "^4.1.3",
     "tslint": "^5.14.0",
-    "typescript": "^3.5.3",
+    "typescript": "^3.7.2",
     "typescript-styled-plugin": "^0.14.0"
   }
 }
diff --git a/packages/big-design-theme/package.json b/packages/big-design-theme/package.json
@@ -14,7 +14,9 @@
     "directory": "packages/big-design-theme"
   },
   "scripts": {
-    "build": "rollup -c rollup.config.js",
+    "build": "yarn run build:js && yarn run build:dt",
+    "build:js": "rollup -c rollup.config.js",
+    "build:dt": "tsc --emitDeclarationOnly",
     "ci": "yarn run lint && yarn run test && yarn run build",
     "lint": "yarn run lint:tslint && yarn run lint:tsc && yarn run lint:prettier",
     "lint:prettier": "prettier --check 'src/**/*.{ts,tsx}'",
@@ -23,7 +25,7 @@
     "precommit": "lint-staged",
     "prepublishOnly": "rimraf dist && yarn run ci",
     "test": "jest",
-    "test:watch": "npm test -- --watchAll"
+    "test:watch": "jest --watch"
   },
   "files": [
     "dist"
@@ -47,30 +49,28 @@
     "styled-components": "^4.1.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.5.5",
+    "@babel/core": "^7.7.0",
     "@babel/preset-env": "^7.5.5",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.1.0",
     "@bigcommerce/configs": "^0.7.0",
     "@types/jest": "^24.0.16",
     "@types/styled-components": "^4.1.12",
     "babel-jest": "^24.5.0",
+    "concurrently": "^5.0.0",
     "jest": "^24.5.0",
     "jest-styled-components": "^6.3.1",
     "lint-staged": "^9.2.0",
     "prettier": "^1.16.4",
     "rimraf": "^2.6.3",
     "rollup": "^1.6.0",
     "rollup-plugin-babel": "4.2.0",
-    "rollup-plugin-commonjs": "^10.0.1",
     "rollup-plugin-filesize": "^6.0.1",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.1.0",
-    "rollup-plugin-sourcemaps": "^0.4.2",
-    "rollup-plugin-typescript2": "^0.22.1",
     "styled-components": "^4.1.3",
     "tslint": "^5.14.0",
-    "typescript": "^3.5.3",
+    "typescript": "^3.7.2",
     "typescript-styled-plugin": "^0.14.0"
   }
 }
diff --git a/packages/big-design-theme/src/styled/types.ts b/packages/big-design-theme/src/styled/types.ts
diff --git a/packages/big-design-theme/src/system/border.ts b/packages/big-design-theme/src/system/border.ts
@@ -1,21 +1,11 @@
 import { css } from 'styled-components';
 
 import { remCalc } from '../helpers';
-import { AllStyleInterpolations } from '../styled/types';
 
-export interface Border {
-  box: AllStyleInterpolations;
-  boxError: AllStyleInterpolations;
-  none: AllStyleInterpolations;
-}
+export type Border = ReturnType<typeof createBorder>;
+export type BorderRadius = ReturnType<typeof createBorderRadius>;
 
-export interface BorderRadius {
-  circle: AllStyleInterpolations;
-  none: AllStyleInterpolations;
-  normal: AllStyleInterpolations;
-}
-
-export const createBorder = (): Border => ({
+export const createBorder = () => ({
   box: css`
     ${({ theme }) => `1px solid ${theme.colors.secondary30}`};
   `,
@@ -27,7 +17,7 @@ export const createBorder = (): Border => ({
   none: 'none',
 });
 
-export const createBorderRadius = (): BorderRadius => ({
+export const createBorderRadius = () => ({
   circle: '50%',
   none: 0,
   normal: remCalc(4),

diff --git a/packages/big-design-theme/src/system/shadow.ts b/packages/big-design-theme/src/system/shadow.ts
@@ -1,14 +1,10 @@
 import { css } from 'styled-components';
 
 import { createRGBA } from '../helpers';
-import { AllStyleInterpolations } from '../styled/types';
 
-export interface Shadow {
-  floating: AllStyleInterpolations;
-  raised: AllStyleInterpolations;
-}
+export type Shadow = typeof shadow;
 
-export const shadow: Shadow = {
+export const shadow = {
   floating: css`
     border-radius: ${({ theme }) => theme.borderRadius.normal};
     box-shadow: ${({ theme }) => `0px 2px 12px ${createRGBA(theme.colors.secondary70, 0.2)}`};

diff --git a/packages/big-design/package.json b/packages/big-design/package.json
@@ -17,13 +17,15 @@
     "dist"
   ],
   "scripts": {
-    "build": "rollup -c rollup.config.js",
+    "build": "yarn run build:js && yarn run build:dt",
+    "build:js": "rollup -c rollup.config.js",
+    "build:dt": "tsc --emitDeclarationOnly",
     "ci": "yarn run lint && yarn run test && yarn run build",
-    "start": "NODE_ENV=dev yarn run build --watch",
     "lint": "yarn run lint:tslint && yarn run lint:tsc && yarn run lint:prettier",
     "lint:prettier": "prettier --check 'src/**/*.{ts,tsx}'",
     "lint:tsc": "tsc --noEmit",
     "lint:tslint": "tslint -c tslint.json -p tsconfig.json",
+    "start": "NODE_ENV=dev concurrently \"yarn:build:* --watch\"",
     "test": "jest",
     "test:watch": "yarn run test --watch",
     "precommit": "lint-staged",
@@ -55,11 +57,12 @@
     "styled-components": "^4.1.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-proposal-class-properties": "^7.5.5",
-    "@babel/preset-env": "^7.5.5",
-    "@babel/preset-react": "^7.0.0",
-    "@babel/preset-typescript": "^7.1.0",
+    "@babel/core": "^7.7.0",
+    "@babel/plugin-proposal-class-properties": "^7.7.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.6.2",
+    "@babel/preset-env": "^7.7.1",
+    "@babel/preset-react": "^7.7.0",
+    "@babel/preset-typescript": "^7.7.0",
     "@bigcommerce/configs": "^0.7.0",
     "@testing-library/jest-dom": "^4.0.0",
     "@testing-library/react": "^8.0.7",
@@ -70,6 +73,7 @@
     "@types/styled-components": "^4.1.12",
     "babel-jest": "^24.5.0",
     "babel-plugin-styled-components": "^1.10.6",
+    "concurrently": "^5.0.0",
     "jest": "^24.5.0",
     "jest-styled-components": "^6.3.1",
     "lint-staged": "^9.2.0",
@@ -79,15 +83,12 @@
     "rimraf": "^2.6.3",
     "rollup": "^1.6.0",
     "rollup-plugin-babel": "4.2.0",
-    "rollup-plugin-commonjs": "^10.0.1",
     "rollup-plugin-filesize": "^6.0.1",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.1.0",
-    "rollup-plugin-sourcemaps": "^0.4.2",
-    "rollup-plugin-typescript2": "^0.22.1",
     "styled-components": "^4.1.3",
     "tslint": "^5.14.0",
-    "typescript": "^3.5.3",
+    "typescript": "^3.7.2",
     "typescript-styled-plugin": "^0.14.0"
   }
 }
diff --git a/packages/big-design/src/components/Badge/Badge.tsx b/packages/big-design/src/components/Badge/Badge.tsx
@@ -10,4 +10,6 @@ export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, Margi
   variant?: 'danger' | 'secondary' | 'success' | 'warning';
 }
 
-export const Badge: React.FC<BadgeProps> = memo(({ className, style, ...props }) => <StyledBadge {...props} />);
+export const Badge: React.FC<BadgeProps> = /*#__PURE__*/ memo(({ className, style, ...props }) => (
+  <StyledBadge {...props} />
+));
diff --git a/packages/big-design/src/components/Badge/index.ts b/packages/big-design/src/components/Badge/index.ts
@@ -1 +1,4 @@
-export { Badge, BadgeProps } from './Badge';
+import { BadgeProps as _BadgeProps } from './Badge';
+
+export { Badge } from './Badge';
+export type BadgeProps = _BadgeProps;
diff --git a/packages/big-design/src/components/Box/Box.tsx b/packages/big-design/src/components/Box/Box.tsx
@@ -1,5 +1,5 @@
 import { Border, BorderRadius, Colors, Shadow, ThemeInterface } from '@bigcommerce/big-design-theme';
-import React from 'react';
+import React, { memo } from 'react';
 
 import { MarginProps, PaddingProps } from '../../mixins';
 
@@ -17,4 +17,4 @@ export interface BoxProps extends React.HTMLAttributes<HTMLDivElement>, MarginPr
   theme?: ThemeInterface;
 }
 
-export const Box: React.FC<BoxProps> = props => <StyledBox {...props} />;
+export const Box: React.FC<BoxProps> = /*#__PURE__*/ memo(props => <StyledBox {...props} />);
diff --git a/packages/big-design/src/components/Box/index.ts b/packages/big-design/src/components/Box/index.ts
@@ -1 +1,4 @@
-export { Box, BoxProps } from './Box';
+import { BoxProps as _BoxProps } from './Box';
+
+export { Box } from './Box';
+export type BoxProps = _BoxProps;