From 6f6c6b3a94d66ab7acd94ebae3c5569a91f67663 Mon Sep 17 00:00:00 2001 From: afc163 Date: Tue, 16 Apr 2019 12:06:04 +0800 Subject: [PATCH 01/39] :up: use @ant-design/create-react-context of MIT --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9be217e057..4a622b2c31 100644 --- a/package.json +++ b/package.json @@ -50,7 +50,7 @@ "classnames": "~2.2.6", "copy-to-clipboard": "^3.0.8", "create-react-class": "^15.6.3", - "create-react-context": "0.2.2", + "@ant-design/create-react-context": "^0.2.4", "css-animation": "^1.5.0", "dom-closest": "^0.2.0", "enquire.js": "^2.1.6", From 0a8f33385d55e8de7a36b319da97d7ddabceef8d Mon Sep 17 00:00:00 2001 From: afc163 Date: Tue, 16 Apr 2019 12:06:04 +0800 Subject: [PATCH 02/39] :up: use @ant-design/create-react-context of MIT --- components/config-provider/index.tsx | 2 +- components/drawer/index.tsx | 2 +- components/form/context.ts | 2 +- components/grid/RowContext.tsx | 2 +- components/layout/Sider.tsx | 2 +- components/layout/layout.tsx | 2 +- components/menu/index.tsx | 2 +- package.json | 2 +- tests/__mocks__/create-react-context.js | 2 +- tests/__mocks__/react.js | 2 +- 10 files changed, 10 insertions(+), 10 deletions(-) diff --git a/components/config-provider/index.tsx b/components/config-provider/index.tsx index 401879984e..9ca54423f9 100644 --- a/components/config-provider/index.tsx +++ b/components/config-provider/index.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import createReactContext, { Context } from 'create-react-context'; +import createReactContext, { Context } from '@ant-design/create-react-context'; import defaultRenderEmpty, { RenderEmptyHandler } from './renderEmpty'; diff --git a/components/drawer/index.tsx b/components/drawer/index.tsx index 40b271b95c..65bdeae29c 100644 --- a/components/drawer/index.tsx +++ b/components/drawer/index.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import * as PropTypes from 'prop-types'; import RcDrawer from 'rc-drawer'; -import createReactContext, { Context } from 'create-react-context'; +import createReactContext, { Context } from '@ant-design/create-react-context'; import warning from '../_util/warning'; import classNames from 'classnames'; import Icon from '../icon'; diff --git a/components/form/context.ts b/components/form/context.ts index cb58a6698a..9caf0828fc 100644 --- a/components/form/context.ts +++ b/components/form/context.ts @@ -1,4 +1,4 @@ -import createReactContext, { Context } from 'create-react-context'; +import createReactContext, { Context } from '@ant-design/create-react-context'; import { ColProps } from '../grid/col'; import { FormLabelAlign } from './FormItem'; diff --git a/components/grid/RowContext.tsx b/components/grid/RowContext.tsx index 67d347ceb5..c16af4888b 100644 --- a/components/grid/RowContext.tsx +++ b/components/grid/RowContext.tsx @@ -1,4 +1,4 @@ -import createContext, { Context } from 'create-react-context'; +import createContext, { Context } from '@ant-design/create-react-context'; export interface RowContextState { gutter?: number; diff --git a/components/layout/Sider.tsx b/components/layout/Sider.tsx index 5ee8b6f8c1..a9fc6e7d63 100644 --- a/components/layout/Sider.tsx +++ b/components/layout/Sider.tsx @@ -1,4 +1,4 @@ -import createContext, { Context } from 'create-react-context'; +import createContext, { Context } from '@ant-design/create-react-context'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; import { LayoutContext, LayoutContextProps } from './layout'; diff --git a/components/layout/layout.tsx b/components/layout/layout.tsx index 354e1faf72..8a03fdb73d 100644 --- a/components/layout/layout.tsx +++ b/components/layout/layout.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import classNames from 'classnames'; -import createContext, { Context } from 'create-react-context'; +import createContext, { Context } from '@ant-design/create-react-context'; import { SiderProps } from './Sider'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; diff --git a/components/menu/index.tsx b/components/menu/index.tsx index 80694a4417..5cd00864c7 100644 --- a/components/menu/index.tsx +++ b/components/menu/index.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import RcMenu, { Divider, ItemGroup } from 'rc-menu'; -import createContext, { Context } from 'create-react-context'; +import createContext, { Context } from '@ant-design/create-react-context'; import classNames from 'classnames'; import omit from 'omit.js'; import SubMenu from './SubMenu'; diff --git a/package.json b/package.json index 9be217e057..4a622b2c31 100644 --- a/package.json +++ b/package.json @@ -50,7 +50,7 @@ "classnames": "~2.2.6", "copy-to-clipboard": "^3.0.8", "create-react-class": "^15.6.3", - "create-react-context": "0.2.2", + "@ant-design/create-react-context": "^0.2.4", "css-animation": "^1.5.0", "dom-closest": "^0.2.0", "enquire.js": "^2.1.6", diff --git a/tests/__mocks__/create-react-context.js b/tests/__mocks__/create-react-context.js index 1e974dbd53..be08fbd11f 100644 --- a/tests/__mocks__/create-react-context.js +++ b/tests/__mocks__/create-react-context.js @@ -1,3 +1,3 @@ -import createReactContext from 'create-react-context/lib/implementation'; +import createReactContext from '@ant-design/create-react-context/lib/implementation'; export default createReactContext; diff --git a/tests/__mocks__/react.js b/tests/__mocks__/react.js index f3eb475a12..e68a1a7413 100644 --- a/tests/__mocks__/react.js +++ b/tests/__mocks__/react.js @@ -1,4 +1,4 @@ -import createReactContext from 'create-react-context/lib/implementation'; +import createReactContext from '@ant-design/create-react-context/lib/implementation'; const React = require.requireActual('react'); From b4bdb199526987d627d1c5d1bf34caf1138f1df2 Mon Sep 17 00:00:00 2001 From: afc163 Date: Tue, 16 Apr 2019 14:22:22 +0800 Subject: [PATCH 03/39] :white_check_mark: Fix snapshot --- .../__snapshots__/index.test.js.snap | 3874 ++++++++--------- .../__snapshots__/router.test.js.snap | 176 +- .../__snapshots__/index.test.js.snap | 56 +- .../__snapshots__/index.test.js.snap | 856 ++-- .../__snapshots__/index.test.js.snap | 168 +- .../__snapshots__/search.test.js.snap | 40 +- 6 files changed, 2546 insertions(+), 2624 deletions(-) diff --git a/components/badge/__tests__/__snapshots__/index.test.js.snap b/components/badge/__tests__/__snapshots__/index.test.js.snap index b5fd4401e4..f1997291bb 100644 --- a/components/badge/__tests__/__snapshots__/index.test.js.snap +++ b/components/badge/__tests__/__snapshots__/index.test.js.snap @@ -21,55 +21,51 @@ exports[`Badge badge should support float number 2`] = ` overflowCount={99} showZero={false} > - - + - - - - - - 3.5 - - - - - - - + 3.5 + + + + + `; @@ -904,247 +900,243 @@ exports[`Badge should render when count is changed 1`] = ` overflowCount={99} showZero={false} > - - + - - - - - +

- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -
- - - - - + 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+ + + + + + `; @@ -1155,440 +1147,436 @@ exports[`Badge should render when count is changed 2`] = ` overflowCount={99} showZero={false} > - - + - - - - - +

- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -
- - - - - + 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+ + +

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+
+ + + + + `; @@ -1599,440 +1587,436 @@ exports[`Badge should render when count is changed 3`] = ` overflowCount={99} showZero={false} > - - + - - - - - +

- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -
- - - - - + 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+ + +

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+
+ + + + + `; @@ -2043,440 +2027,436 @@ exports[`Badge should render when count is changed 4`] = ` overflowCount={99} showZero={false} > - - + - - - - - +

- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -
- - - - - + 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+ + +

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+
+ + + + + `; @@ -2487,440 +2467,436 @@ exports[`Badge should render when count is changed 5`] = ` overflowCount={99} showZero={false} > - - + - - - - - +

- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-

- 0 -

-

- 1 -

-

- 2 -

-

- 3 -

-

- 4 -

-

- 5 -

-

- 6 -

-

- 7 -

-

- 8 -

-

- 9 -

-
- -
- - - - - + 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+ + +

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+

+ 0 +

+

+ 1 +

+

+ 2 +

+

+ 3 +

+

+ 4 +

+

+ 5 +

+

+ 6 +

+

+ 7 +

+

+ 8 +

+

+ 9 +

+
+ + + + + `; diff --git a/components/breadcrumb/__tests__/__snapshots__/router.test.js.snap b/components/breadcrumb/__tests__/__snapshots__/router.test.js.snap index 3cdcb013d4..7c8a37e198 100644 --- a/components/breadcrumb/__tests__/__snapshots__/router.test.js.snap +++ b/components/breadcrumb/__tests__/__snapshots__/router.test.js.snap @@ -75,101 +75,91 @@ exports[`react router react router 3 1`] = ` } separator="/" > - -
+ - - + + + + Home + + + + / + + + + + + + + Application List + + + + / + + + + + + + + Application1 + + + + / + + + + + + - - - Home - - - - / - + Detail - - - - - - - - Application List - - - - / - - - - - - - - - - Application1 - - - - / - - - - - - - - - - Detail - - - - / - - - - -
-
+ + + / + + + + `; diff --git a/components/cascader/__tests__/__snapshots__/index.test.js.snap b/components/cascader/__tests__/__snapshots__/index.test.js.snap index 140e217e9a..6ead40cb7c 100644 --- a/components/cascader/__tests__/__snapshots__/index.test.js.snap +++ b/components/cascader/__tests__/__snapshots__/index.test.js.snap @@ -1154,9 +1154,9 @@ exports[`Cascader should render not found content 1`] = ` Array [ Object { "disabled": true, - "label": + "label": [Function] - , + , "value": "ANT_CASCADER_NOT_FOUND", }, ] @@ -1193,36 +1193,32 @@ exports[`Cascader should render not found content 1`] = ` onDoubleClick={[Function]} title="" > - - + - - +
-
-
- No Data -
-

- No Data -

-
- - - - + No Data +
+

+ No Data +

+ +
+
diff --git a/components/input/__tests__/__snapshots__/index.test.js.snap b/components/input/__tests__/__snapshots__/index.test.js.snap index e8f61a4814..01449c85b5 100644 --- a/components/input/__tests__/__snapshots__/index.test.js.snap +++ b/components/input/__tests__/__snapshots__/index.test.js.snap @@ -6,66 +6,64 @@ exports[`Input allowClear should change type when click 1`] = ` disabled={false} type="text" > - + + - - - - - - - - - - + + + + + + - + `; @@ -75,24 +73,22 @@ exports[`Input allowClear should change type when click 2`] = ` disabled={false} type="text" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -103,24 +99,22 @@ exports[`Input allowClear should not show icon if defaultValue is undefined, nul disabled={false} type="text" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -130,24 +124,22 @@ exports[`Input allowClear should not show icon if defaultValue is undefined, nul disabled={false} type="text" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -158,24 +150,22 @@ exports[`Input allowClear should not show icon if defaultValue is undefined, nul disabled={false} type="text" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -186,24 +176,22 @@ exports[`Input allowClear should not show icon if value is undefined, null or em type="text" value={null} > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -213,24 +201,22 @@ exports[`Input allowClear should not show icon if value is undefined, null or em disabled={false} type="text" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -241,24 +227,22 @@ exports[`Input allowClear should not show icon if value is undefined, null or em type="text" value="" > - + + - - - - + className="ant-input-suffix" + /> + `; @@ -268,17 +252,15 @@ exports[`Input should support maxLength 1`] = ` maxLength={3} type="text" > - - - + `; @@ -304,71 +286,69 @@ exports[`Input.Password should change type when click 1`] = ` } type="password" > - + + - - - - - - - - - - + + + + + + + - + `; @@ -395,67 +375,65 @@ exports[`Input.Password should change type when click 2`] = ` } type="text" > - + + - - - - - - - - - - + + + + + + - + `; @@ -482,71 +460,69 @@ exports[`Input.Password should change type when click 3`] = ` } type="password" > - + + - - - - - - - - - - + + + + + + + - + `; @@ -556,85 +532,81 @@ exports[`Input.Search should support suffix 1`] = ` enterButton={false} suffix="suffix" > - - , - ] - } - type="text" + , + ] + } + type="text" + > + - - + + suffix + - - - suffix - - - - - - - - - - + + + + + + + + + `; @@ -642,20 +614,18 @@ exports[`TextArea should support disabled 1`] = ` `; @@ -663,19 +633,17 @@ exports[`TextArea should support maxLength 1`] = ` `; diff --git a/components/progress/__tests__/__snapshots__/index.test.js.snap b/components/progress/__tests__/__snapshots__/index.test.js.snap index 34cff74744..b17c86a2cf 100644 --- a/components/progress/__tests__/__snapshots__/index.test.js.snap +++ b/components/progress/__tests__/__snapshots__/index.test.js.snap @@ -264,56 +264,54 @@ exports[`Progress render strokeColor 2`] = ` trailColor="#f3f3f3" type="line" > - -
- + -
+ } + strokeLinecap="round" + trailColor="#f3f3f3" + type="line" + > +
+
-
-
+ } + />
- - 50% -
- -
- + + 50% + +
+ +
`; @@ -333,55 +331,53 @@ exports[`Progress render strokeColor 3`] = ` trailColor="#f3f3f3" type="line" > - -
- + -
+ } + strokeLinecap="round" + trailColor="#f3f3f3" + type="line" + > +
+
-
-
+ } + />
- - 50% -
- -
- + + 50% + +
+ +
`; diff --git a/components/transfer/__tests__/__snapshots__/search.test.js.snap b/components/transfer/__tests__/__snapshots__/search.test.js.snap index 908fb4e4fb..c93df60300 100644 --- a/components/transfer/__tests__/__snapshots__/search.test.js.snap +++ b/components/transfer/__tests__/__snapshots__/search.test.js.snap @@ -13,17 +13,15 @@ exports[`Search should show cross icon when input value exists 1`] = ` type="text" value="" > - - - + - - - + Date: Tue, 16 Apr 2019 17:40:55 +0800 Subject: [PATCH 04/39] Update colors.en-US.md --- docs/spec/colors.en-US.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/spec/colors.en-US.md b/docs/spec/colors.en-US.md index 7fa8e60a7f..1a3aab8195 100644 --- a/docs/spec/colors.en-US.md +++ b/docs/spec/colors.en-US.md @@ -70,7 +70,7 @@ Functional color represents a clear message as well as status, such as success, ### Neutral Color - + Neutral color is mainly used in a large part of the text interface, in addition to the background, borders, dividing lines, and other scenes are also very common. Neutral color definition needs to consider the difference between dark background and light background, while incorporating the WCAG 2.0 standard. The neutral color of Ant Design is based on transparency, as shown on the right: From 8f2c74c39f52cfe6365035a3ebce55cf5f78157a Mon Sep 17 00:00:00 2001 From: zombieJ Date: Tue, 16 Apr 2019 23:11:12 +0800 Subject: [PATCH 05/39] update demo (#16127) --- .../auto-complete/demo/uncertain-category.md | 37 +++++++++++++------ 1 file changed, 25 insertions(+), 12 deletions(-) diff --git a/components/auto-complete/demo/uncertain-category.md b/components/auto-complete/demo/uncertain-category.md index ad3ef8d49e..3f9e198cd2 100644 --- a/components/auto-complete/demo/uncertain-category.md +++ b/components/auto-complete/demo/uncertain-category.md @@ -41,16 +41,20 @@ function searchResult(query) { function renderOption(item) { return ( - {item.category} - - 区块中 - 约 {item.count} 个结果 +
+ + {item.query} 在 + + {item.category} + + 区块中 + + 约 {item.count} 个结果 +
); } @@ -122,8 +126,17 @@ ReactDOM.render(, mountNode); border-bottom-left-radius: 0; } +.global-search-item { + display: flex; +} + +.global-search-item-desc { + flex: auto; + text-overflow: ellipsis; + overflow: hidden; +} + .global-search-item-count { - position: absolute; - right: 16px; + flex: none; } ```` From df141914e9dd0d68bd54fa1cc0820477b24b420d Mon Sep 17 00:00:00 2001 From: zombieJ Date: Wed, 17 Apr 2019 10:19:57 +0800 Subject: [PATCH 06/39] docs: Add FAQ of Affix window scroll (#16125) * update doc * Update index.en-US.md * update desc --- components/affix/index.en-US.md | 8 ++++++++ components/affix/index.zh-CN.md | 8 ++++++++ 2 files changed, 16 insertions(+) diff --git a/components/affix/index.en-US.md b/components/affix/index.en-US.md index 413a21afd4..66f0cee426 100644 --- a/components/affix/index.en-US.md +++ b/components/affix/index.en-US.md @@ -28,3 +28,11 @@ Please note that Affix should not cover other content on the page, especially wh ... ``` + +## FAQ + +### Affix bind container with `target`, sometime move out of container. + +We don't listen window scroll for performance consideration. You can add listener if you still want: + +Related issue:[#3938](https://github.com/ant-design/ant-design/issues/3938) [#5642](https://github.com/ant-design/ant-design/issues/5642) [#16120](https://github.com/ant-design/ant-design/issues/16120) diff --git a/components/affix/index.zh-CN.md b/components/affix/index.zh-CN.md index b9e0455327..bad9aea131 100644 --- a/components/affix/index.zh-CN.md +++ b/components/affix/index.zh-CN.md @@ -29,3 +29,11 @@ title: Affix ... ``` + +## FAQ + +### Affix 使用 `target` 绑定容器时,元素会跑到容器外。 + +从性能角度考虑,我们只监听容器滚动事件。如果希望任意滚动,你可以在窗体添加滚动监听: + +相关 issue:[#3938](https://github.com/ant-design/ant-design/issues/3938) [#5642](https://github.com/ant-design/ant-design/issues/5642) [#16120](https://github.com/ant-design/ant-design/issues/16120) From fdcfabfa7863a335167ba4b6e7dd7454eb34e5dd Mon Sep 17 00:00:00 2001 From: zombieJ Date: Wed, 17 Apr 2019 13:51:52 +0800 Subject: [PATCH 07/39] fix: form typescript definition (#16126) * use redux-react ts define * update doc * follow origin rule --- components/form/Form.tsx | 13 ++++--------- components/form/__tests__/type.tsx | 2 +- components/form/interface.ts | 18 ++++++++++++++++++ package.json | 1 + 4 files changed, 24 insertions(+), 10 deletions(-) create mode 100644 components/form/interface.ts diff --git a/components/form/Form.tsx b/components/form/Form.tsx index fceae02d07..42008573b2 100755 --- a/components/form/Form.tsx +++ b/components/form/Form.tsx @@ -6,11 +6,12 @@ import createFormField from 'rc-form/lib/createFormField'; import omit from 'omit.js'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; import { ColProps } from '../grid/col'; -import { Omit, tuple } from '../_util/type'; +import { tuple } from '../_util/type'; import warning from '../_util/warning'; import FormItem, { FormLabelAlign } from './FormItem'; import { FIELD_META_PROP, FIELD_DATA_PROP } from './constants'; import { FormContext } from './context'; +import { FormWrappedProps } from './interface'; type FormCreateOptionMessagesCallback = (...args: any[]) => string; @@ -193,12 +194,6 @@ export interface RcBaseFormProps { wrappedComponentRef?: any; } -export interface ComponentDecorator { -

( - component: React.ComponentClass

| React.SFC

, - ): React.ComponentClass>; -} - export default class Form extends React.Component { static defaultProps = { colon: true, @@ -222,9 +217,9 @@ export default class Form extends React.Component { static createFormField = createFormField; - static create = function( + static create = function( options: FormCreateOption = {}, - ): ComponentDecorator { + ): FormWrappedProps { return createDOMForm({ fieldNameProp: 'id', ...options, diff --git a/components/form/__tests__/type.tsx b/components/form/__tests__/type.tsx index 728f53ea1c..5a8d04cad0 100644 --- a/components/form/__tests__/type.tsx +++ b/components/form/__tests__/type.tsx @@ -31,7 +31,7 @@ class WithOwnProps extends React.Component { } } -const WithOwnPropsForm = Form.create()(WithOwnProps); +const WithOwnPropsForm = Form.create()(WithOwnProps); ; diff --git a/components/form/interface.ts b/components/form/interface.ts new file mode 100644 index 0000000000..fa2fa03628 --- /dev/null +++ b/components/form/interface.ts @@ -0,0 +1,18 @@ +import * as React from 'react'; +import hoistNonReactStatics from 'hoist-non-react-statics'; +import { Omit } from '../_util/type'; +import { FormComponentProps } from './Form'; + +// Copy from @types/react-redux https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-redux/index.d.ts +export type ConnectedComponentClass< + C extends React.ComponentType, + P +> = React.ComponentClass> & hoistNonReactStatics.NonReactStatics & { + WrappedComponent: C; +}; + +export type FormWrappedProps = + < + C extends React.ComponentType + >(component: C) + => ConnectedComponentClass>; diff --git a/package.json b/package.json index 9be217e057..c215b521a9 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ "dependencies": { "@ant-design/icons": "~1.2.0", "@ant-design/icons-react": "~1.1.5", + "@types/hoist-non-react-statics": "^3.3.1", "@types/react-slick": "^0.23.3", "array-tree-filter": "^2.1.0", "babel-runtime": "6.x", From 21c0ba5bbd45635c20b2f650714e6789cd2b1b73 Mon Sep 17 00:00:00 2001 From: zombieJ Date: Wed, 17 Apr 2019 17:31:39 +0800 Subject: [PATCH 08/39] udpate warning (#16138) --- components/table/Table.tsx | 14 +++++++++----- components/table/__tests__/Table.test.js | 6 +++--- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/components/table/Table.tsx b/components/table/Table.tsx index 083698f848..8b8ba77c97 100755 --- a/components/table/Table.tsx +++ b/components/table/Table.tsx @@ -110,6 +110,8 @@ export default class Table extends React.Component, TableState< constructor(props: TableProps) { super(props); + const { expandedRowRender, columns = [] } = props; + warning( !('columnsPageRange' in props || 'columnsPageSize' in props), 'Table', @@ -117,11 +119,13 @@ export default class Table extends React.Component, TableState< 'fixed columns instead, see: https://u.ant.design/fixed-columns.', ); - warning( - !('expandedRowRender' in props) || !('scroll' in props), - 'Table', - '`expandedRowRender` and `scroll` are not compatible. Please use one of them at one time.', - ); + if (expandedRowRender && columns.some(({ fixed }) => !!fixed)) { + warning( + false, + 'Table', + '`expandedRowRender` and `Column.fixed` are not compatible. Please use one of them at one time.', + ); + } this.columns = props.columns || normalizeColumns(props.children as React.ReactChildren); diff --git a/components/table/__tests__/Table.test.js b/components/table/__tests__/Table.test.js index 27daa50b78..dd5bb39e72 100644 --- a/components/table/__tests__/Table.test.js +++ b/components/table/__tests__/Table.test.js @@ -87,10 +87,10 @@ describe('Table', () => { expect(wrapper.find('tbody').props().id).toBe('wrapper2'); }); - it('warning if both `expandedRowRender` & `scroll` are used', () => { - mount( null} scroll={{}} />); + it('warning if both `expandedRowRender` & `Column.fixed` are used', () => { + mount(
null} columns={[{ fixed: true }]} />); expect(warnSpy).toHaveBeenCalledWith( - 'Warning: [antd: Table] `expandedRowRender` and `scroll` are not compatible. Please use one of them at one time.', + 'Warning: [antd: Table] `expandedRowRender` and `Column.fixed` are not compatible. Please use one of them at one time.', ); }); }); From 3a114020424d44a573fe595c11dd709c3757e3bb Mon Sep 17 00:00:00 2001 From: zombieJ Date: Wed, 17 Apr 2019 18:07:34 +0800 Subject: [PATCH 09/39] chore: add pre-publish commit check (#16134) * add prepublish check * update check logic * add version check --- package.json | 7 ++++-- scripts/check-commit.js | 47 +++++++++++++++++++++++++++++++++++++++++ 2 files changed, 52 insertions(+), 2 deletions(-) create mode 100755 scripts/check-commit.js diff --git a/package.json b/package.json index c215b521a9..3ee1fae2ce 100644 --- a/package.json +++ b/package.json @@ -116,7 +116,7 @@ "bisheng-plugin-description": "^0.1.4", "bisheng-plugin-react": "^1.0.0", "bisheng-plugin-toc": "^0.4.4", - "chalk": "^2.4.1", + "chalk": "^2.4.2", "commander": "^2.18.0", "cross-env": "^5.2.0", "css-split-webpack-plugin": "^0.2.6", @@ -149,6 +149,7 @@ "lz-string": "^1.4.4", "majo": "^0.7.1", "mockdate": "^2.0.2", + "node-fetch": "^2.3.0", "pre-commit": "^1.2.2", "preact": "^8.3.1", "preact-compat": "^3.18.4", @@ -183,6 +184,7 @@ "reqwest": "^2.0.5", "rimraf": "^2.6.2", "scrollama": "^2.0.0", + "simple-git": "^1.110.0", "stylelint": "^10.0.0", "stylelint-config-prettier": "^5.0.0", "stylelint-config-rational-order": "^0.1.0", @@ -198,6 +200,7 @@ "test": "jest --config .jest.js --no-cache", "test-node": "jest --config .jest.node.js --no-cache", "test-all": "./scripts/test-all.sh", + "check-commit": "node ./scripts/check-commit.js", "lint": "npm run lint:ts && npm run lint:es && npm run lint:demo && npm run lint:style && npm run lint:deps", "lint:deps": "antd-tools run deps-lint", "lint:ts": "npm run tsc && antd-tools run ts-lint", @@ -222,7 +225,7 @@ "deploy:china-mirror": "git checkout gh-pages && git pull origin gh-pages && git push git@gitee.com:ant-design/ant-design.git gh-pages", "pub": "antd-tools run pub", "prepublish": "antd-tools run guard", - "pre-publish": "npm run test-all", + "pre-publish": "npm run check-commit && npm run test-all", "authors": "git log --format='%aN <%aE>' | sort -u | grep -v 'users.noreply.github.com' | grep -v 'gitter.im' | grep -v '.local>' | grep -v 'alibaba-inc.com' | grep -v 'alipay.com' | grep -v 'taobao.com' > AUTHORS.txt", "lint-staged": "lint-staged", "lint-staged:ts": "tsc && node node_modules/tslint/bin/tslint", diff --git a/scripts/check-commit.js b/scripts/check-commit.js new file mode 100755 index 0000000000..710096b07f --- /dev/null +++ b/scripts/check-commit.js @@ -0,0 +1,47 @@ +/* eslint-disable import/no-dynamic-require */ +const chalk = require('chalk'); +const path = require('path'); +const fetch = require('node-fetch'); +const simpleGit = require('simple-git/promise'); + +const cwd = process.cwd(); +const git = simpleGit(cwd); + +const { version } = require(path.resolve(cwd, 'package.json')); + +function exitProcess(code = 1) { + console.log(''); // Keep an empty line here to make looks good~ + process.exit(code); +} + +async function checkCommit() { + const { current, files } = await git.status(); + + const { versions } = await fetch('http://registry.npmjs.org/antd').then(res => res.json()); + if (version in versions) { + console.log(chalk.yellow('😈 Current version already exists. Forget update package.json?')); + console.log(chalk.cyan(' => Current:'), version); + exitProcess(); + } + + if (current !== 'master') { + console.log(chalk.yellow('🤔 You are not in the master branch!')); + exitProcess(); + } + + if (files.length) { + console.log(chalk.yellow('🙄 You forgot something to commit.')); + files.forEach(({ path: filePath, working_dir: mark }) => { + console.log(' -', chalk.red(mark), filePath); + }); + exitProcess(); + } + + const { remote } = await git.fetch('origin', 'master'); + if (remote.indexOf('ant-design/ant-design') === -1 || true) { + console.log(chalk.yellow('😓 Your remote origin is not ant-design. Do you fork it?')); + exitProcess(); + } +} + +checkCommit(); From 9dbca667d68a2e01649113cbc37b02d9e128de90 Mon Sep 17 00:00:00 2001 From: zombieJ Date: Thu, 18 Apr 2019 01:33:05 +0800 Subject: [PATCH 10/39] fix: Affix dynamic change target should work (#16146) * fix target not refreshed * add comment --- components/affix/__tests__/Affix.test.js | 40 +++++++++++++++++++----- components/affix/index.tsx | 17 ++++++++-- components/affix/utils.ts | 5 +++ 3 files changed, 51 insertions(+), 11 deletions(-) diff --git a/components/affix/__tests__/Affix.test.js b/components/affix/__tests__/Affix.test.js index d565494d71..1ce47ecd65 100644 --- a/components/affix/__tests__/Affix.test.js +++ b/components/affix/__tests__/Affix.test.js @@ -1,6 +1,7 @@ import React from 'react'; import { mount } from 'enzyme'; import Affix from '..'; +import { getObserverEntities } from '../utils'; import Button from '../../button'; const events = {}; @@ -128,14 +129,37 @@ describe('Affix Render', () => { expect(wrapper.instance().affix.state.affixStyle.top).toBe(10); }); - it('updatePosition when target changed', () => { - const container = '
'; - const getTarget = () => container; - wrapper = mount(); - wrapper.setProps({ target: null }); - expect(wrapper.instance().state.status).toBe(0); - expect(wrapper.instance().state.affixStyle).toBe(undefined); - expect(wrapper.instance().state.placeholderStyle).toBe(undefined); + describe('updatePosition when target changed', () => { + it('function change', () => { + document.body.innerHTML = '
'; + const container = document.querySelector('#id'); + const getTarget = () => container; + wrapper = mount(); + wrapper.setProps({ target: null }); + expect(wrapper.instance().state.status).toBe(0); + expect(wrapper.instance().state.affixStyle).toBe(undefined); + expect(wrapper.instance().state.placeholderStyle).toBe(undefined); + }); + + it('instance change', () => { + const getObserverLength = () => Object.keys(getObserverEntities()).length; + + const container = document.createElement('div'); + document.body.appendChild(container); + let target = container; + + const originLength = getObserverLength(); + const getTarget = () => target; + wrapper = mount(); + jest.runAllTimers(); + + expect(getObserverLength()).toBe(originLength + 1); + target = null; + wrapper.setProps({}); + wrapper.update(); + jest.runAllTimers(); + expect(getObserverLength()).toBe(originLength); + }); }); it('updatePosition when size changed', () => { diff --git a/components/affix/index.tsx b/components/affix/index.tsx index bdac32f5c7..94cebea05b 100644 --- a/components/affix/index.tsx +++ b/components/affix/index.tsx @@ -41,6 +41,8 @@ export interface AffixState { placeholderStyle?: React.CSSProperties; status: AffixStatus; lastAffix: boolean; + + prevTarget: Window | HTMLElement | null; } class Affix extends React.Component { @@ -51,6 +53,7 @@ class Affix extends React.Component { state: AffixState = { status: AffixStatus.None, lastAffix: false, + prevTarget: null, }; placeholderNode: HTMLDivElement; @@ -72,14 +75,22 @@ class Affix extends React.Component { } componentDidUpdate(prevProps: AffixProps) { + const { prevTarget } = this.state; const { target } = this.props; - if (prevProps.target !== target) { + let newTarget = null; + if (target) { + newTarget = target() || null; + } + + if (prevTarget !== newTarget) { removeObserveTarget(this); - if (target) { - addObserveTarget(target(), this); + if (newTarget) { + addObserveTarget(newTarget, this); // Mock Event object. this.updatePosition({} as Event); } + + this.setState({ prevTarget: newTarget }); } if ( diff --git a/components/affix/utils.ts b/components/affix/utils.ts index 60bad06ad1..5a33e4b753 100644 --- a/components/affix/utils.ts +++ b/components/affix/utils.ts @@ -20,6 +20,11 @@ interface ObserverEntity { let observerEntities: ObserverEntity[] = []; +export function getObserverEntities() { + // Only used in test env. Can be removed if refactor. + return observerEntities; +} + export function addObserveTarget(target: HTMLElement | Window | null, affix: Affix): void { if (!target) return; From a8b23ea9446e8542025f8e8f4d1c98602f16945d Mon Sep 17 00:00:00 2001 From: JuFeng Zhang Date: Thu, 18 Apr 2019 09:04:26 +0800 Subject: [PATCH 11/39] docs: Fix selector in demo 'Playground'. (#16145) Fix #16141 --- components/grid/demo/playground.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/grid/demo/playground.md b/components/grid/demo/playground.md index 6714d75165..d3c347588d 100644 --- a/components/grid/demo/playground.md +++ b/components/grid/demo/playground.md @@ -89,11 +89,11 @@ ReactDOM.render(, mountNode); ```` ````css -#components-grid-demo-playground [class^="ant-col-"] { +#components-grid-demo-playground [class~="ant-col"] { background: transparent; border: 0; } -#components-grid-demo-playground [class^="ant-col-"] > div { +#components-grid-demo-playground [class~="ant-col"] > div { background: #00A0E9; height: 120px; line-height: 120px; From 25599bc7ce0e8a6b8a28a4124d9d768628cc6a4f Mon Sep 17 00:00:00 2001 From: moonrailgun Date: Thu, 18 Apr 2019 12:31:04 +0800 Subject: [PATCH 12/39] add text selection so we can overwrite it independent --- components/style/core/base.less | 2 +- components/style/themes/default.less | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/components/style/core/base.less b/components/style/core/base.less index 305f26ae37..e1041a3c03 100644 --- a/components/style/core/base.less +++ b/components/style/core/base.less @@ -501,7 +501,7 @@ mark { ::selection { color: @text-color-inverse; - background: @primary-color; + background: @text-selection-bg; } // Utility classes diff --git a/components/style/themes/default.less b/components/style/themes/default.less index cb70ea8c8c..535ec60b74 100644 --- a/components/style/themes/default.less +++ b/components/style/themes/default.less @@ -56,6 +56,7 @@ @heading-color-dark: fade(@white, 100%); @text-color-dark: fade(@white, 85%); @text-color-secondary-dark: fade(@white, 65%); +@text-selection-bg: @primary-color; @font-variant-base: tabular-nums; @font-feature-settings-base: 'tnum'; @font-size-base: 14px; From ab683841d5b2ccf013d4068a590d328f8beb13fa Mon Sep 17 00:00:00 2001 From: ztplz Date: Thu, 18 Apr 2019 23:20:13 +0800 Subject: [PATCH 13/39] fix: Modal's open animation (#16144) * Fix Modal's open animation * Fix incorrect event type * test * Update * Update * Update * Update --- components/modal/Modal.tsx | 36 +++++++++++++++++------------------- 1 file changed, 17 insertions(+), 19 deletions(-) diff --git a/components/modal/Modal.tsx b/components/modal/Modal.tsx index b546e2c8ac..cb4be684cf 100644 --- a/components/modal/Modal.tsx +++ b/components/modal/Modal.tsx @@ -11,9 +11,25 @@ import LocaleReceiver from '../locale-provider/LocaleReceiver'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; let mousePosition: { x: number; y: number } | null; -let mousePositionEventBinded: boolean; export const destroyFns: Array<() => void> = []; +// ref: https://github.com/ant-design/ant-design/issues/15795 +const getClickPosition = (e: MouseEvent) => { + mousePosition = { + x: e.pageX, + y: e.pageY, + }; + // 100ms 内发生过点击事件,则从点击位置动画展示 + // 否则直接 zoom 展示 + // 这样可以兼容非点击方式展开 + setTimeout(() => (mousePosition = null), 100); +}; + +// 只有点击事件支持从鼠标位置动画展开 +if (typeof window !== 'undefined' && window.document && window.document.documentElement) { + addEventListener(document.documentElement, 'click', getClickPosition); +} + export interface ModalProps { /** 对话框是否可见*/ visible?: boolean; @@ -158,24 +174,6 @@ export default class Modal extends React.Component { } }; - componentDidMount() { - if (mousePositionEventBinded) { - return; - } - // 只有点击事件支持从鼠标位置动画展开 - addEventListener(document.documentElement, 'click', (e: MouseEvent) => { - mousePosition = { - x: e.pageX, - y: e.pageY, - }; - // 100ms 内发生过点击事件,则从点击位置动画展示 - // 否则直接 zoom 展示 - // 这样可以兼容非点击方式展开 - setTimeout(() => (mousePosition = null), 100); - }); - mousePositionEventBinded = true; - } - renderFooter = (locale: ModalLocale) => { const { okText, okType, cancelText, confirmLoading } = this.props; return ( From dbd3fbfb95dd06368e67ca9153a54661d1b5fa75 Mon Sep 17 00:00:00 2001 From: LeezQ Date: Fri, 19 Apr 2019 13:49:43 +0800 Subject: [PATCH 14/39] add react spring (#16156) * add react spring * Update recommendation.en-US.md add react-spring --- docs/react/recommendation.en-US.md | 2 +- docs/react/recommendation.zh-CN.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/react/recommendation.en-US.md b/docs/react/recommendation.en-US.md index 9ec2b2433c..4da303d82a 100644 --- a/docs/react/recommendation.en-US.md +++ b/docs/react/recommendation.en-US.md @@ -34,7 +34,7 @@ Image Crop | [react-image-crop](https://github.com/DominicTobias/react-image-cro Trend Lines | [react-sparklines](https://github.com/borisyankov/react-sparklines) Formatted Input | [text-mask](https://github.com/text-mask/text-mask) Keywords highlight | [react-highlight-words](https://github.com/bvaughn/react-highlight-words) -Animation | [react-move](https://github.com/react-tools/react-move) [Ant Motion](https://motion.ant.design/components/tween-one) +Animation | [react-move](https://github.com/react-tools/react-move) [Ant Motion](https://motion.ant.design/components/tween-one) [react-spring](https://www.react-spring.io)