chore: bump deps

jest.config.js

@@ -13,7 +13,7 @@ module.exports = {
       '<rootDir>/test/__mocks__/fileMock.js',
     '\\.(css|less)$': '<rootDir>/__mocks__/styleMock.js',
   },
-  setupTestFrameworkScriptFile: require.resolve('./test/jest.setup.ts'),
+  setupFilesAfterEnv: [require.resolve('./test/jest.setup.ts')],
   resetModules: true,
   resetMocks: true,
 };

package.json

@@ -54,16 +54,16 @@
     "polished": "^2.3.3",
     "prop-types": "^15.6.2",
     "ramda": "^0.26.1",
-    "rc-calendar": "9.7.11",
+    "rc-calendar": "^9.10.8",
     "rc-editor-mention": "1.1.7",
-    "rc-time-picker": "3.4.0",
+    "rc-time-picker": "^3.6.2",
     "react-dropzone": "7.0.1",
     "react-html-attributes": "^1.4.3",
     "react-intl-tel-input": "^6.1.0",
     "react-select": "^2.3.0",
     "react-spring": "^7.2.10",
     "react-textarea-autosize": "^7.1.0",
-    "styled-normalize": "^8.0.4",
+    "styled-normalize": "^8.0.6",
     "styled-system": "^3.2.1"
   },
   "peerDependencies": {
@@ -81,45 +81,45 @@
     "@babel/preset-env": "^7.3.1",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.1.0",
-    "@types/jest": "^23.3.13",
+    "@types/jest": "^24.0.0",
     "@types/ramda": "^0.25.47",
-    "@types/react": "16.7.20",
+    "@types/react": "16.7.22",
     "@types/react-dom": "^16.0.11",
     "@types/react-select": "^2.0.11",
-    "@types/styled-components": "4.1.6",
-    "@types/styled-system": "^3.1.3",
+    "@types/styled-components": "4.1.8",
+    "@types/styled-system": "^3.2.0",
     "babel-core": "^7.0.0-0",
     "babel-eslint": "^10.0.1",
-    "babel-jest": "^23.6.0",
+    "babel-jest": "^24.1.0",
     "babel-plugin-module-resolver": "^3.1.3",
     "babel-plugin-ramda": "^2.0.0",
     "babel-plugin-styled-components": "^1.10.0",
-    "babel-plugin-typescript-to-proptypes": "^0.16.0",
+    "babel-plugin-typescript-to-proptypes": "^0.17.0",
     "commitizen": "^3.0.5",
     "conventional-changelog-cli": "^2.0.11",
     "cross-env": "^5.2.0",
     "cz-conventional-changelog": "^2.1.0",
     "docz": "^0.13.7",
     "docz-theme-default": "^0.13.7",
-    "eslint": "^5.12.1",
-    "eslint-config-yoctol": "^0.20.0",
-    "eslint-import-resolver-babel-module": "^5.0.0",
+    "eslint": "^5.13.0",
+    "eslint-config-yoctol": "^0.21.0",
+    "eslint-import-resolver-babel-module": "^5.0.1",
     "eslint-import-resolver-jest": "^2.1.1",
-    "eslint-plugin-import": "^2.15.0",
-    "eslint-plugin-jsx-a11y": "^6.1.2",
+    "eslint-plugin-import": "^2.16.0",
+    "eslint-plugin-jsx-a11y": "^6.2.1",
     "eslint-plugin-prettier": "^3.0.1",
     "eslint-plugin-react": "^7.12.4",
     "eslint-plugin-react-hooks": "^0.0.0",
     "eslint-plugin-sort-imports-es6-autofix": "^0.3.0",
     "eslint-plugin-typescript": "^0.14.0",
     "husky": "^1.3.1",
-    "jest": "^23.6.0",
-    "jest-dom": "^3.0.0",
+    "jest": "^24.1.0",
+    "jest-dom": "^3.0.1",
     "jest-styled-components": "^6.3.1",
-    "lint-staged": "^8.1.0",
-    "prettier": "^1.16.1",
+    "lint-staged": "^8.1.3",
+    "prettier": "^1.16.4",
     "prettier-package-json": "^2.0.1",
-    "react": "^16.8.0-alpha.0",
+    "react": "16.8.0-alpha.0",
     "react-dom": "16.8.0-alpha.0",
     "react-icons": "^3.3.0",
     "react-testing-library": "^5.4.4",
@@ -133,9 +133,9 @@
     "stylelint-processor-styled-components": "^1.5.2",
     "ts-jest": "^23.10.5",
     "tslint": "^5.12.1",
-    "tslint-config-prettier": "^1.17.0",
+    "tslint-config-prettier": "^1.18.0",
     "tslint-plugin-prettier": "^2.0.1",
-    "typescript": "3.2.4",
+    "typescript": "3.3.1",
     "typescript-eslint-parser": "22.0.0"
   },
   "husky": {

src/Alert/ClosableAlert.tsx

@@ -48,4 +48,5 @@ const ClosableAlert: FunctionComponent<IAlertProps> = ({
     </Spring>
   );
 };
+
 export default ClosableAlert;

src/Dropdown/Item.tsx

@@ -1,4 +1,9 @@
-import React, { MouseEvent, MouseEventHandler, forwardRef } from 'react';
+import React, {
+  MouseEvent,
+  MouseEventHandler,
+  ReactNode,
+  forwardRef,
+} from 'react';
 import styled, { css } from 'styled-components';
 import { SpaceProps, space } from 'styled-system';
 
@@ -50,10 +55,14 @@ export interface IItemProps {
    * Keep the dropdown after click item
    */
   keep?: boolean;
+  children?: ReactNode;
 }
 
-const Item = forwardRef<any, IItemProps>(
-  ({ onClick, disabled, keep, ...props }, ref: any) => (
+const Item = forwardRef<any, IItemProps>(function Item(
+  { onClick, disabled, keep, ...props },
+  ref: any
+) {
+  return (
     <Consumer>
       {({ handleClose }) => (
         <StyledListItem
@@ -74,7 +83,7 @@ const Item = forwardRef<any, IItemProps>(
         />
       )}
     </Consumer>
-  )
-);
+  );
+});
 
 export default Item;

src/Dropdown/SubList.tsx

@@ -26,7 +26,7 @@ const SubListWrapper = styled(tag.div)`
   }
 `;
 
-const StyledSubItem = styled(Item)`
+const StyledSubItem = styled(Item)<any>`
   position: relative;
   flex-direction: row;
   align-items: center;

src/NewMenu/Menu.tsx

@@ -8,7 +8,7 @@ import MenuContext from './MenuContext';
 import MenuDivider from './MenuDivider';
 import MenuItem from './MenuItem';
 import SubMenu from './SubMenu';
-import { AnimatedSubMenuWrapper } from './styles';
+import { SubMenuWrapper } from './styles';
 
 const spring = { ...config.stiff, precision: 0.1 };
 
@@ -80,7 +80,7 @@ const Menu: FunctionComponent<IMenuProps> & {
           position="relative"
         >
           {children}
-          <AnimatedSubMenuWrapper style={subMenuSpringProps} />
+          <SubMenuWrapper style={subMenuSpringProps} />
           <Backdrop
             visible={subMenuVisible}
             style={{ backgroundColor: 'rgba(0, 0, 0, 0)' }}

src/NewMenu/SubMenuContent.tsx

@@ -8,7 +8,7 @@ import React, {
 
 import Box from '../Grid/Box';
 
-import { AnimatedSubMenuContentWrapper } from './styles';
+import { SubMenuContentWrapper } from './styles';
 
 interface ISubMenuContentProps {
   active: boolean;
@@ -43,7 +43,7 @@ const SubMenuContent: FunctionComponent<ISubMenuContentProps> = ({
     placement === 'bottom' ? { bottom: 0 } : { top: -headerTop };
 
   return (
-    <AnimatedSubMenuContentWrapper
+    <SubMenuContentWrapper
       style={{ ...subMenuContentSpringProps, ...placementStyle }}
     >
       <Box ref={headerRef} pb="1">
@@ -59,7 +59,7 @@ const SubMenuContent: FunctionComponent<ISubMenuContentProps> = ({
       >
         {children}
       </Box>
-    </AnimatedSubMenuContentWrapper>
+    </SubMenuContentWrapper>
   );
 };
 

src/NewMenu/styles.ts

@@ -5,7 +5,7 @@ import tag from 'utils/CleanTag';
 
 import Box from '../Grid/Box';
 
-const SubMenuWrapper = styled(tag.div)`
+export const SubMenuWrapper = styled(animated.div)`
   position: absolute;
   left: 48px;
   flex-direction: column;
@@ -14,18 +14,14 @@ const SubMenuWrapper = styled(tag.div)`
   box-shadow: 4px 0 6px 0 rgba(94, 94, 94, 0.5);
 `;
 
-export const AnimatedSubMenuWrapper = animated(SubMenuWrapper);
-
-const SubMenuContentWrapper = styled(tag.div)`
+export const SubMenuContentWrapper = styled(animated.div)`
   position: absolute;
   z-index: 1;
   left: 45px;
   flex-direction: column;
   width: 180px;
 `;
 
-export const AnimatedSubMenuContentWrapper = animated(SubMenuContentWrapper);
-
 interface IStyledSubMenuProps {
   active?: boolean;
 }

src/Steps/Steps.tsx

@@ -1,8 +1,8 @@
 import React, {
   Children,
   FunctionComponent,
-  ReactChild,
   ReactElement,
+  ReactNode,
   createContext,
   isValidElement,
 } from 'react';
@@ -188,7 +188,7 @@ const getTailColor = ({
 }: {
   count: number;
   status: Status;
-  steps: ReactChild[];
+  steps: ReactNode[];
 }) => {
   const nextStep = steps[count + 1];
   if (

src/utils/Portal.tsx

@@ -1,4 +1,4 @@
-import { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import { createPortal } from 'react-dom';
 
 const elements: {
@@ -54,10 +54,11 @@ class Portal extends PureComponent<{
   };
 
   render() {
-    return (
-      this.canUseDOM() &&
-      createPortal(this.props.children, this.getPortalElement())
-    );
+    if (!this.canUseDOM()) {
+      return <></>;
+    }
+
+    return createPortal(this.props.children, this.getPortalElement());
   }
 }
 

test/test-utils.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
+import { ThemeProvider } from 'styled-components';
 import { render } from 'react-testing-library';
 
 import defaultTheme from '../src/theme';
-import { ThemeProvider } from '../src/utils/styled-components';
 
 const customRender = (node: any, ...options: any[]) =>
   render(

tslint.json

@@ -12,6 +12,7 @@
     "object-literal-sort-keys": false,
     "member-access": false,
     "variable-name": false,
+    "no-shadowed-variable": false,
     "no-empty": false,
     "no-console": false
   }