From fa558eb838aafd15072f903cd22fc4c71d342934 Mon Sep 17 00:00:00 2001
From: Arvin Xu <arvinx@foxmail.com>
Date: Sun, 28 Nov 2021 15:53:22 +0800
Subject: [PATCH] :truck: chore: rename package

---
 config/menu.ts                                |   2 +-
 jest.config.base.js                           |   2 +-
 .../.fatherrc.js                              |   0
 packages/layout-kit/README.md                 |  14 ++
 .../jest.config.js                            |   4 +-
 .../package.json                              |  11 +-
 packages/layout-kit/src/index.tsx             |  46 ++++++
 .../src/layout-toolkit.md                     |   8 +-
 packages/layout-kit/src/type.ts               |  20 +++
 packages/layout-kit/src/utils.ts              |  18 +++
 .../tests/__snapshots__/index.test.tsx.snap   |  16 ++
 packages/layout-kit/tests/index.test.tsx      |  16 ++
 .../tsconfig.json                             |   0
 .../webpack.config.js                         |   2 +-
 packages/layout-toolkit/README.md             |  14 --
 packages/layout-toolkit/src/index.tsx         |  10 --
 .../tests/__snapshots__/index.test.tsx.snap   |   9 --
 packages/layout-toolkit/tests/index.test.tsx  |  11 --
 tsconfig.json                                 |   4 +-
 yarn.lock                                     | 147 ++++++++++++------
 20 files changed, 249 insertions(+), 105 deletions(-)
 rename packages/{layout-toolkit => layout-kit}/.fatherrc.js (100%)
 create mode 100644 packages/layout-kit/README.md
 rename packages/{layout-toolkit => layout-kit}/jest.config.js (71%)
 rename packages/{layout-toolkit => layout-kit}/package.json (72%)
 create mode 100644 packages/layout-kit/src/index.tsx
 rename packages/{layout-toolkit => layout-kit}/src/layout-toolkit.md (57%)
 create mode 100644 packages/layout-kit/src/type.ts
 create mode 100644 packages/layout-kit/src/utils.ts
 create mode 100644 packages/layout-kit/tests/__snapshots__/index.test.tsx.snap
 create mode 100644 packages/layout-kit/tests/index.test.tsx
 rename packages/{layout-toolkit => layout-kit}/tsconfig.json (100%)
 rename packages/{layout-toolkit => layout-kit}/webpack.config.js (86%)
 delete mode 100644 packages/layout-toolkit/README.md
 delete mode 100644 packages/layout-toolkit/src/index.tsx
 delete mode 100644 packages/layout-toolkit/tests/__snapshots__/index.test.tsx.snap
 delete mode 100644 packages/layout-toolkit/tests/index.test.tsx

diff --git a/config/menu.ts b/config/menu.ts
index d0a151a2..50acaa0d 100644
--- a/config/menu.ts
+++ b/config/menu.ts
@@ -25,7 +25,7 @@ export const menus = {
     },
     {
       title: 'LayoutToolkit 布局工具库',
-      children: ['layout-toolkit'],
+      children: ['layout-kit'],
     },
   ],
   '/guide': [
diff --git a/jest.config.base.js b/jest.config.base.js
index 3787c529..9a7de8fd 100644
--- a/jest.config.base.js
+++ b/jest.config.base.js
@@ -19,7 +19,7 @@ module.exports = {
     '@arvinxu/heatmap-calendar': '<rootDir>/packages/heatmap-calendar/src',
     '@arvinxu/utils': '<rootDir>/packages/utils/src',
     '@arvinxu/i18n': '<rootDir>/packages/i18n/src',
-    '@arvinxu/layout-toolkit': '<rootDir>/packages/layout-toolkit/src',
+    '@arvinxu/layout-kit': '<rootDir>/packages/layout-kit/src',
     '@arvinxu/float-label-input': '<rootDir>/packages/float-label-input/src',
     '@arvinxu/page-loading': '<rootDir>/packages/page-loading/src',
     '@arvinxu/mindflow': '<rootDir>/packages/mindflow/src',
diff --git a/packages/layout-toolkit/.fatherrc.js b/packages/layout-kit/.fatherrc.js
similarity index 100%
rename from packages/layout-toolkit/.fatherrc.js
rename to packages/layout-kit/.fatherrc.js
diff --git a/packages/layout-kit/README.md b/packages/layout-kit/README.md
new file mode 100644
index 00000000..9b30d0a7
--- /dev/null
+++ b/packages/layout-kit/README.md
@@ -0,0 +1,14 @@
+# @arvinxu/layout-kit
+
+[![NPM version][version-image]][version-url] [![NPM downloads][download-image]][download-url]
+
+## License
+
+[MIT](../../LICENSE) ® Arvin Xu
+
+<!-- npm url -->
+
+[version-image]: http://img.shields.io/npm/v/@arvinxu/layout-kit.svg?color=deepgreen&label=latest
+[version-url]: http://npmjs.org/package/@arvinxu/layout-kit
+[download-image]: https://img.shields.io/npm/dm/@arvinxu/layout-kit.svg
+[download-url]: https://npmjs.org/package/@arvinxu/layout-kit
diff --git a/packages/layout-toolkit/jest.config.js b/packages/layout-kit/jest.config.js
similarity index 71%
rename from packages/layout-toolkit/jest.config.js
rename to packages/layout-kit/jest.config.js
index 52efc49a..42a1ecd3 100644
--- a/packages/layout-toolkit/jest.config.js
+++ b/packages/layout-kit/jest.config.js
@@ -1,8 +1,8 @@
 const base = require('../../jest.config.base');
 
-const packageName = '@arvinxu/layout-toolkit';
+const packageName = '@arvinxu/layout-kit';
 
-const root = '<rootDir>/packages/layout-toolkit';
+const root = '<rootDir>/packages/layout-kit';
 
 module.exports = {
   ...base,
diff --git a/packages/layout-toolkit/package.json b/packages/layout-kit/package.json
similarity index 72%
rename from packages/layout-toolkit/package.json
rename to packages/layout-kit/package.json
index 12e63ac9..70dee074 100644
--- a/packages/layout-toolkit/package.json
+++ b/packages/layout-kit/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "@arvinxu/layout-toolkit",
+  "name": "@arvinxu/layout-kit",
   "version": "1.0.0",
   "files": [
     "lib",
@@ -7,12 +7,19 @@
   ],
   "main": "lib/index.js",
   "module": "es/index.js",
-  "homepage": "https://github.com/arvinxx/components/tree/master/packages/layout-toolkit#readme",
+  "homepage": "https://github.com/arvinxx/components/tree/master/packages/layout-kit#readme",
   "repository": "git+https://github.com/arvinxx/components.git",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"
   },
+  "peerDependencies": {
+    "styled-components": ">5"
+  },
+  "devDependencies": {
+    "styled-components": "^5.3.3",
+    "@types/styled-components": "^5.1.15"
+  },
   "scripts": {
     "build": "father-build && yarn webpack",
     "webpack": "webpack",
diff --git a/packages/layout-kit/src/index.tsx b/packages/layout-kit/src/index.tsx
new file mode 100644
index 00000000..745c38fc
--- /dev/null
+++ b/packages/layout-kit/src/index.tsx
@@ -0,0 +1,46 @@
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
+import styled from 'styled-components';
+
+import { calcValue, getFlexDirection } from './utils';
+import type {
+  ContentDistribution,
+  ContentPosition,
+  FlexDirection,
+} from './type';
+
+type CommonSpaceNumber = 2 | 4 | 8 | 12 | 16 | 24;
+
+interface IFlexbox {
+  direction?: FlexDirection;
+  distribution?: ContentDistribution;
+  align?: ContentPosition;
+  gap?: CommonSpaceNumber | number;
+  width?: number | string;
+  height?: number | string;
+  padding?: string | number | CommonSpaceNumber;
+}
+export type FlexboxProps = IFlexbox &
+  DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+
+export const Flexbox: FC<FlexboxProps> = styled.div.attrs(() => ({
+  className: 'layoutkit-flexbox',
+}))<IFlexbox>`
+  display: flex;
+  flex-direction: ${(props) => {
+    return getFlexDirection(props.direction);
+  }};
+  justify-content: ${(props) => props.distribution};
+  align-items: ${(props) => props.align};
+
+  width: ${(props) => calcValue(props.width)};
+  height: ${(props) => calcValue(props.height)};
+
+  padding: ${(props) => calcValue(props.padding)};
+
+  > *:not(:last-child) {
+    margin-right: ${(props) =>
+      getFlexDirection(props.direction) === 'row' && calcValue(props.gap)};
+    margin-bottom: ${(props) =>
+      getFlexDirection(props.direction) === 'column' && calcValue(props.gap)};
+  }
+`;
diff --git a/packages/layout-toolkit/src/layout-toolkit.md b/packages/layout-kit/src/layout-toolkit.md
similarity index 57%
rename from packages/layout-toolkit/src/layout-toolkit.md
rename to packages/layout-kit/src/layout-toolkit.md
index 73a6cfb6..91f65aba 100644
--- a/packages/layout-toolkit/src/layout-toolkit.md
+++ b/packages/layout-kit/src/layout-toolkit.md
@@ -12,9 +12,9 @@ nav:
 
 <!-- npm url -->
 
-[version-image]: http://img.shields.io/npm/v/@arvinxu/layout-toolkit.svg?color=deepgreen&label=latest
-[version-url]: http://npmjs.org/package/@arvinxu/layout-toolkit
-[download-image]: https://img.shields.io/npm/dm/@arvinxu/layout-toolkit.svg
-[download-url]: https://npmjs.org/package/@arvinxu/layout-toolkit
+[version-image]: http://img.shields.io/npm/v/@arvinxu/layout-kit.svg?color=deepgreen&label=latest
+[version-url]: http://npmjs.org/package/@arvinxu/layout-kit
+[download-image]: https://img.shields.io/npm/dm/@arvinxu/layout-kit.svg
+[download-url]: https://npmjs.org/package/@arvinxu/layout-kit
 
 <API src='./index.tsx'></API>
diff --git a/packages/layout-kit/src/type.ts b/packages/layout-kit/src/type.ts
new file mode 100644
index 00000000..2634fca7
--- /dev/null
+++ b/packages/layout-kit/src/type.ts
@@ -0,0 +1,20 @@
+export type ContentPosition =
+  | 'center'
+  | 'end'
+  | 'flex-end'
+  | 'flex-start'
+  | 'start'
+  | 'stretch';
+
+export type ContentDistribution =
+  | 'center'
+  | 'space-around'
+  | 'space-between'
+  | 'space-evenly'
+  | 'stretch';
+
+export type FlexDirection =
+  | 'vertical'
+  | 'vertical-reverse'
+  | 'horizontal'
+  | 'horizontal-reverse';
diff --git a/packages/layout-kit/src/utils.ts b/packages/layout-kit/src/utils.ts
new file mode 100644
index 00000000..1419b1cd
--- /dev/null
+++ b/packages/layout-kit/src/utils.ts
@@ -0,0 +1,18 @@
+import type { FlexDirection } from './type';
+
+export const getFlexDirection = (direction: FlexDirection) => {
+  switch (direction) {
+    case 'horizontal':
+      return 'row';
+    case 'horizontal-reverse':
+      return 'row-reverse';
+    case 'vertical':
+    default:
+      return 'column';
+    case 'vertical-reverse':
+      return 'column-reverse';
+  }
+};
+
+export const calcValue = (value: string | number) =>
+  typeof value === 'number' ? `${value}px` : value;
diff --git a/packages/layout-kit/tests/__snapshots__/index.test.tsx.snap b/packages/layout-kit/tests/__snapshots__/index.test.tsx.snap
new file mode 100644
index 00000000..f5fc588b
--- /dev/null
+++ b/packages/layout-kit/tests/__snapshots__/index.test.tsx.snap
@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Flexbox gap 1`] = `
+<div>
+  <div
+    class="sc-bdvvtL ezjxOX"
+  >
+    <div>
+      1
+    </div>
+    <div>
+      2
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/layout-kit/tests/index.test.tsx b/packages/layout-kit/tests/index.test.tsx
new file mode 100644
index 00000000..5b90209d
--- /dev/null
+++ b/packages/layout-kit/tests/index.test.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+
+import { Flexbox } from '@arvinxu/layout-kit';
+
+describe('Flexbox', () => {
+  it('gap', () => {
+    const { container } = render(
+      <Flexbox gap={2}>
+        <div>1</div>
+        <div>2</div>
+      </Flexbox>,
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/layout-toolkit/tsconfig.json b/packages/layout-kit/tsconfig.json
similarity index 100%
rename from packages/layout-toolkit/tsconfig.json
rename to packages/layout-kit/tsconfig.json
diff --git a/packages/layout-toolkit/webpack.config.js b/packages/layout-kit/webpack.config.js
similarity index 86%
rename from packages/layout-toolkit/webpack.config.js
rename to packages/layout-kit/webpack.config.js
index 4e072df2..22feb6c8 100644
--- a/packages/layout-toolkit/webpack.config.js
+++ b/packages/layout-kit/webpack.config.js
@@ -5,7 +5,7 @@ module.exports = {
   ...config,
   output: {
     ...config.output,
-    library: 'LayoutToolkit',
+    library: 'LayoutKit',
     path: path.resolve(__dirname, 'dist'),
   },
 };
diff --git a/packages/layout-toolkit/README.md b/packages/layout-toolkit/README.md
deleted file mode 100644
index dbe35ac8..00000000
--- a/packages/layout-toolkit/README.md
+++ /dev/null
@@ -1,14 +0,0 @@
-# @arvinxu/layout-toolkit
-
-[![NPM version][version-image]][version-url] [![NPM downloads][download-image]][download-url]
-
-## License
-
-[MIT](../../LICENSE) ® Arvin Xu
-
-<!-- npm url -->
-
-[version-image]: http://img.shields.io/npm/v/@arvinxu/layout-toolkit.svg?color=deepgreen&label=latest
-[version-url]: http://npmjs.org/package/@arvinxu/layout-toolkit
-[download-image]: https://img.shields.io/npm/dm/@arvinxu/layout-toolkit.svg
-[download-url]: https://npmjs.org/package/@arvinxu/layout-toolkit
diff --git a/packages/layout-toolkit/src/index.tsx b/packages/layout-toolkit/src/index.tsx
deleted file mode 100644
index 5906ea7f..00000000
--- a/packages/layout-toolkit/src/index.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from 'react';
-import type { FC } from 'react';
-
-export interface LayoutToolkitProps {}
-
-const LayoutToolkit: FC<LayoutToolkitProps> = () => {
-  return <div>LayoutToolkit</div>;
-};
-
-export default LayoutToolkit;
diff --git a/packages/layout-toolkit/tests/__snapshots__/index.test.tsx.snap b/packages/layout-toolkit/tests/__snapshots__/index.test.tsx.snap
deleted file mode 100644
index 9c9f08ec..00000000
--- a/packages/layout-toolkit/tests/__snapshots__/index.test.tsx.snap
+++ /dev/null
@@ -1,9 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`LayoutToolkit 默认状态 1`] = `
-<div>
-  <div>
-    LayoutToolkit
-  </div>
-</div>
-`;
diff --git a/packages/layout-toolkit/tests/index.test.tsx b/packages/layout-toolkit/tests/index.test.tsx
deleted file mode 100644
index 6a7ef880..00000000
--- a/packages/layout-toolkit/tests/index.test.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-
-import LayoutToolkit from '@arvinxu/layout-toolkit';
-
-describe('LayoutToolkit', () => {
-  it('默认状态', () => {
-    const { container } = render(<LayoutToolkit />);
-    expect(container).toMatchSnapshot();
-  });
-});
diff --git a/tsconfig.json b/tsconfig.json
index 13d397c4..a490f711 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -36,8 +36,8 @@
       "@arvinxu/utils/*": ["./packages/utils/src/*"],
       "@arvinxu/i18n": ["./packages/i18n/src"],
       "@arvinxu/i18n/*": ["./packages/i18n/src/*"],
-      "@arvinxu/layout-toolkit": ["./packages/layout-toolkit/src"],
-      "@arvinxu/layout-toolkit/*": ["./packages/layout-toolkit/src/*"],
+      "@arvinxu/layout-kit": ["./packages/layout-kit/src"],
+      "@arvinxu/layout-kit/*": ["./packages/layout-kit/src/*"],
       "@arvinxu/float-label-input": ["./packages/float-label-input/src"],
       "@arvinxu/page-loading": ["./packages/page-loading/src"],
       "@arvinxu/mindflow": ["./packages/mindflow/src"],
diff --git a/yarn.lock b/yarn.lock
index 0aa74e08..3c8de421 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -39,7 +39,7 @@
   resolved "https://registry.yarnpkg.com/@ant-design/icons-svg/-/icons-svg-4.2.1.tgz#8630da8eb4471a4aabdaed7d1ff6a97dcb2cf05a"
   integrity sha512-EB0iwlKDGpG93hW8f85CTJTs4SvMX7tt5ceupvhALp1IF44SeUFOMhKUOYqpsoYWQKAOuTRDMqn75rEaKDp0Xw==
 
-"@ant-design/icons@^4.1.0", "@ant-design/icons@^4.2.1", "@ant-design/icons@^4.3.0", "@ant-design/icons@^4.5.0", "@ant-design/icons@^4.6.2", "@ant-design/icons@^4.6.3":
+"@ant-design/icons@^4.1.0", "@ant-design/icons@^4.2.1", "@ant-design/icons@^4.3.0", "@ant-design/icons@^4.5.0", "@ant-design/icons@^4.6.2", "@ant-design/icons@^4.6.3", "@ant-design/icons@^4.x":
   version "4.7.0"
   resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-4.7.0.tgz#8c3cbe0a556ba92af5dc7d1e70c0b25b5179af0f"
   integrity sha512-aoB4Z7JA431rt6d4u+8xcNPPCrdufSRMUOpxa1ab6mz1JCQZOEVolj2WVs/tDFmN62zzK30mNelEsprLYsSF3g==
@@ -50,43 +50,42 @@
     classnames "^2.2.6"
     rc-util "^5.9.4"
 
-"@ant-design/pro-field@1.18.8":
-  version "1.18.8"
-  resolved "https://registry.yarnpkg.com/@ant-design/pro-field/-/pro-field-1.18.8.tgz#830c625218973842091589d4f29ff654a75db28b"
-  integrity sha512-b4orl1jhI73+oJ4/2OHCL8f4DxpYrtXu6yfT+uWxT4BD6aocrEE2XFpTMQPIpAypnIfG2zs8yXmYr0O+JuQK5g==
+"@ant-design/pro-field@1.27.1":
+  version "1.27.1"
+  resolved "https://registry.yarnpkg.com/@ant-design/pro-field/-/pro-field-1.27.1.tgz#8eb3605dc84fb6242239086ec3334dd9b3c19bab"
+  integrity sha512-imSqc7yBjLKCPoXqsABR9T6+31OiUww5FyFzRqOJZ1IP4AYGm6AVdgN3u0UwLpedcKAIKAYb1kTduGYy+P2LFA==
   dependencies:
     "@ant-design/icons" "^4.2.1"
-    "@ant-design/pro-provider" "1.4.14"
-    "@ant-design/pro-utils" "1.19.3"
+    "@ant-design/pro-provider" "1.4.20"
+    "@ant-design/pro-utils" "1.28.4"
     classnames "^2.2.6"
     lodash.tonumber "^4.0.3"
     moment "^2.27.0"
     omit.js "^2.0.2"
     rc-util "^5.4.0"
     react-color "2.19.3"
-    swr "^0.5.6"
+    swr "1.1.0-beta.6"
 
-"@ant-design/pro-form@^1.21.5":
-  version "1.31.0"
-  resolved "https://registry.yarnpkg.com/@ant-design/pro-form/-/pro-form-1.31.0.tgz#25b4662d0838b7eece8004459c7776ac7b41559a"
-  integrity sha512-Lk9w05ey7goLJ0Zw0qVhXhkh4M/ONDFZxu+P45CACAqXVkjK5rfSYkdeME/Ro8wBMDxfVybr3cQL6+zUPcfHgg==
+"@ant-design/pro-form@^1.x":
+  version "1.49.3"
+  resolved "https://registry.yarnpkg.com/@ant-design/pro-form/-/pro-form-1.49.3.tgz#65a1a50a83af6e919a4ebf14a51de7e19fdecb52"
+  integrity sha512-k1Bs++dGFSz67mo/usss9hapbA26WYdowVA12ADC5gBQytDj5d4PYKv69+tBvyMCXVGcgFs/GU4xaAdPde+zWg==
   dependencies:
     "@ant-design/icons" "^4.2.1"
-    "@ant-design/pro-field" "1.18.8"
-    "@ant-design/pro-provider" "1.4.14"
-    "@ant-design/pro-utils" "1.19.3"
-    "@umijs/use-params" "^1.0.2"
+    "@ant-design/pro-field" "1.27.1"
+    "@ant-design/pro-provider" "1.4.20"
+    "@ant-design/pro-utils" "1.28.4"
+    "@umijs/use-params" "^1.0.9"
     classnames "^2.2.6"
-    lodash.merge "^4.6.2"
     omit.js "^2.0.2"
     rc-resize-observer "^0.2.3"
     rc-util "^5.0.6"
     use-media-antd-query "^1.0.6"
 
-"@ant-design/pro-provider@1.4.14":
-  version "1.4.14"
-  resolved "https://registry.yarnpkg.com/@ant-design/pro-provider/-/pro-provider-1.4.14.tgz#468b522eb818e16c97fb53200fc1413525a47d8c"
-  integrity sha512-yhtNVLgLICnUgtJpYSwG/FF997IPs0Rnpl/4yEwljW8NJHld4ZgZDez2CSW0adb//jRm0/hD0F89a3BYb7RYhw==
+"@ant-design/pro-provider@1.4.20":
+  version "1.4.20"
+  resolved "https://registry.yarnpkg.com/@ant-design/pro-provider/-/pro-provider-1.4.20.tgz#acba4b8657cd85e3bffdceb90675445a6eb8ed60"
+  integrity sha512-V0X7uE/rS8eHCsSz7xrYeOgNefyZhCnqr/66cFN/6uBtip+Eron9ZY5PbxITuH47tDgvT/I8oQJBnoVL9cfLSw==
   dependencies:
     rc-util "^5.0.1"
 
@@ -97,19 +96,18 @@
   dependencies:
     use-media-antd-query "^1.0.6"
 
-"@ant-design/pro-utils@1.19.3":
-  version "1.19.3"
-  resolved "https://registry.yarnpkg.com/@ant-design/pro-utils/-/pro-utils-1.19.3.tgz#80a0d48f4e0dee24df2cb741386d53e68874e484"
-  integrity sha512-rEmDN/llsZ3JyQcqQ1ym8pSra61JR2C2nWzzVTw5lRzVRsjd62XBJNSxaQgGTAMLxbYo0Qbkp9LtS8+WLzJgoQ==
+"@ant-design/pro-utils@1.28.4":
+  version "1.28.4"
+  resolved "https://registry.yarnpkg.com/@ant-design/pro-utils/-/pro-utils-1.28.4.tgz#23747349603d73fe72bbef2d4590b4060f16350c"
+  integrity sha512-SRFKZvvNd71t9zesk5PC8V24YolbA2aaYwctDLBs1nyvV5ifBrboon3tBHoAnJ2d0lj5PTX4yE6LzBwoTPA+VA==
   dependencies:
     "@ant-design/icons" "^4.3.0"
-    "@ant-design/pro-provider" "1.4.14"
+    "@ant-design/pro-provider" "1.4.20"
     classnames "^2.2.6"
-    fast-deep-equal "^3.1.3"
-    lodash.merge "^4.6.2"
     moment "^2.27.0"
     rc-util "^5.0.6"
-    swr "^0.5.6"
+    react-sortable-hoc "^2.0.0"
+    swr "1.1.0-beta.6"
 
 "@ant-design/react-slick@~0.28.1":
   version "0.28.1"
@@ -1985,6 +1983,13 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@^7.2.0", "@babel/runtime@^7.7.6":
+  version "7.16.3"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.16.3.tgz#b86f0db02a04187a3c17caa77de69840165d42d5"
+  integrity sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==
+  dependencies:
+    regenerator-runtime "^0.13.4"
+
 "@babel/template@^7.10.4", "@babel/template@^7.12.13", "@babel/template@^7.12.7", "@babel/template@^7.14.5", "@babel/template@^7.15.4", "@babel/template@^7.3.3", "@babel/template@^7.4.0":
   version "7.15.4"
   resolved "https://registry.nlark.com/@babel/template/download/@babel/template-7.15.4.tgz?cache=0&sync_timestamp=1630618905148&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40babel%2Ftemplate%2Fdownload%2F%40babel%2Ftemplate-7.15.4.tgz#51898d35dcf3faa670c4ee6afcfd517ee139f194"
@@ -4419,7 +4424,7 @@
   resolved "https://registry.npm.taobao.org/@types/history/download/@types/history-4.7.8.tgz#49348387983075705fe8f4e02fb67f7daaec4934"
   integrity sha1-STSDh5gwdXBf6PTgL7Z/farsSTQ=
 
-"@types/hoist-non-react-statics@^3.3.0", "@types/hoist-non-react-statics@^3.3.1":
+"@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@^3.3.0", "@types/hoist-non-react-statics@^3.3.1":
   version "3.3.1"
   resolved "https://registry.npm.taobao.org/@types/hoist-non-react-statics/download/@types/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
   integrity sha1-ESSq/lEYy1kZd66xzqrtEHDrA58=
@@ -4713,6 +4718,15 @@
   resolved "https://registry.npm.taobao.org/@types/stack-utils/download/@types/stack-utils-2.0.0.tgz?cache=0&sync_timestamp=1613384417720&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fstack-utils%2Fdownload%2F%40types%2Fstack-utils-2.0.0.tgz#7036640b4e21cc2f259ae826ce843d277dad8cff"
   integrity sha1-cDZkC04hzC8lmugmzoQ9J32tjP8=
 
+"@types/styled-components@^5.1.15":
+  version "5.1.15"
+  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.15.tgz#30855b40aa80b3b4e4c0e43a4af366e7c246d148"
+  integrity sha512-4evch8BRI3AKgb0GAZ/sn+mSeB+Dq7meYtMi7J/0Mg98Dt1+r8fySOek7Sjw1W+Wskyjc93565o5xWAT/FdY0Q==
+  dependencies:
+    "@types/hoist-non-react-statics" "*"
+    "@types/react" "*"
+    csstype "^3.0.2"
+
 "@types/testing-library__jest-dom@^5.9.1":
   version "5.9.5"
   resolved "https://registry.npm.taobao.org/@types/testing-library__jest-dom/download/@types/testing-library__jest-dom-5.9.5.tgz#5bf25c91ad2d7b38f264b12275e5c92a66d849b0"
@@ -5360,10 +5374,10 @@
     "@umijs/utils" "3.4.25"
     webpack-chain "6.5.1"
 
-"@umijs/use-params@^1.0.2":
-  version "1.0.3"
-  resolved "https://registry.npm.taobao.org/@umijs/use-params/download/@umijs/use-params-1.0.3.tgz#d91d6be6846dc8765dfd81c53cee3953b33f1eb2"
-  integrity sha1-2R1r5oRtyHZd/YHFPO45U7M/HrI=
+"@umijs/use-params@^1.0.9":
+  version "1.0.9"
+  resolved "https://registry.yarnpkg.com/@umijs/use-params/-/use-params-1.0.9.tgz#0ae4a87f4922d8e8e3fb4495b0f8f4de9ca38c52"
+  integrity sha512-QlN0RJSBVQBwLRNxbxjQ5qzqYIGn+K7USppMoIOVlf7fxXHsnQZ2bEsa6Pm74bt6DVQxpUE8HqvdStn6Y9FV1w==
 
 "@umijs/utils@3.4.25", "@umijs/utils@^3.2.28":
   version "3.4.25"
@@ -5903,7 +5917,7 @@ antd-mobile@^2.3.1:
     rmc-tabs "~1.2.0"
     rmc-tooltip "~1.0.0"
 
-antd@^4.1.2, antd@^4.1.3, antd@^4.12.3, antd@^4.13.0, antd@^4.14.0, antd@^4.15.3:
+antd@^4.1.2, antd@^4.1.3, antd@^4.12.3, antd@^4.13.0, antd@^4.14.0:
   version "4.16.13"
   resolved "https://registry.yarnpkg.com/antd/-/antd-4.16.13.tgz#e9b9b4a590db28747aae1cab98981649a35880af"
   integrity sha512-EMPD3fzKe7oayx9keD/GA1oKatcx7j5CGlkJj5eLS0/eEDDEkxVj3DFmKOPuHYt4BK7ltTzMFS+quSTmqUXPiw==
@@ -7249,7 +7263,7 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
-classnames@*, classnames@2.x, classnames@^2.2.0, classnames@^2.2.1, classnames@^2.2.3, classnames@^2.2.4, classnames@^2.2.5, classnames@^2.2.6:
+classnames@*, classnames@2.x, classnames@^2.2.0, classnames@^2.2.1, classnames@^2.2.3, classnames@^2.2.4, classnames@^2.2.5, classnames@^2.2.6, classnames@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
   integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
@@ -8617,6 +8631,11 @@ dateformat@^3.0.0:
   resolved "https://registry.npm.taobao.org/dateformat/download/dateformat-3.0.3.tgz?cache=0&sync_timestamp=1612048492392&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdateformat%2Fdownload%2Fdateformat-3.0.3.tgz#a6e37499a4d9a9cf85ef5872044d62901c9889ae"
   integrity sha1-puN0maTZqc+F71hyBE1ikByYia4=
 
+dayjs@^1.10.5:
+  version "1.10.7"
+  resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.10.7.tgz#2cf5f91add28116748440866a0a1d26f3a6ce468"
+  integrity sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig==
+
 dayjs@^1.9.1:
   version "1.10.4"
   resolved "https://registry.npm.taobao.org/dayjs/download/dayjs-1.10.4.tgz?cache=0&sync_timestamp=1611309982734&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdayjs%2Fdownload%2Fdayjs-1.10.4.tgz#8e544a9b8683f61783f570980a8a80eaf54ab1e2"
@@ -8797,11 +8816,6 @@ deprecation@^2.0.0, deprecation@^2.3.1:
   resolved "https://registry.npm.taobao.org/deprecation/download/deprecation-2.3.1.tgz#6368cbdb40abf3373b525ac87e4a260c3a700919"
   integrity sha1-Y2jL20Cr8zc7UlrIfkomDDpwCRk=
 
-dequal@2.0.2:
-  version "2.0.2"
-  resolved "https://registry.npm.taobao.org/dequal/download/dequal-2.0.2.tgz#85ca22025e3a87e65ef75a7a437b35284a7e319d"
-  integrity sha1-hcoiAl46h+Ze91p6Q3s1KEp+MZ0=
-
 des.js@^1.0.0:
   version "1.0.1"
   resolved "https://registry.npm.taobao.org/des.js/download/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843"
@@ -11179,6 +11193,13 @@ history@^4.7.2, history@^4.9.0:
     tiny-warning "^1.0.0"
     value-equal "^1.0.1"
 
+history@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/history/-/history-5.1.0.tgz#2e93c09c064194d38d52ed62afd0afc9d9b01ece"
+  integrity sha512-zPuQgPacm2vH2xdORvGGz1wQMuHSIB56yNAy5FnLuwOwgSYyPKptJtcMm6Ev+hRGeS+GzhbmRacHzvlESbFwDg==
+  dependencies:
+    "@babel/runtime" "^7.7.6"
+
 hmac-drbg@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npm.taobao.org/hmac-drbg/download/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
@@ -17817,7 +17838,7 @@ promzard@^0.3.0:
   dependencies:
     read "1"
 
-prop-types@15.x, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@15.x, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.npm.taobao.org/prop-types/download/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha1-UsQedbjIfnK52TYOAga5ncv/psU=
@@ -18666,6 +18687,13 @@ react-router-dom@5.2.0, react-router-dom@^5.1.2:
     tiny-invariant "^1.0.2"
     tiny-warning "^1.0.0"
 
+react-router@*:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.0.2.tgz#bd2b0fa84fd1d152671e9f654d9c0b1f5a7c86da"
+  integrity sha512-8/Wm3Ed8t7TuedXjAvV39+c8j0vwrI5qVsYqjFr5WkJjsJpEvNSoLRUbtqSEYzqaTUj1IV+sbPJxvO+accvU0Q==
+  dependencies:
+    history "^5.1.0"
+
 react-router@5.2.0:
   version "5.2.0"
   resolved "https://registry.npm.taobao.org/react-router/download/react-router-5.2.0.tgz#424e75641ca8747fbf76e5ecca69781aa37ea293"
@@ -18687,6 +18715,15 @@ react-side-effect@^2.1.0:
   resolved "https://registry.npm.taobao.org/react-side-effect/download/react-side-effect-2.1.1.tgz#66c5701c3e7560ab4822a4ee2742dee215d72eb3"
   integrity sha1-ZsVwHD51YKtIIqTuJ0Le4hXXLrM=
 
+react-sortable-hoc@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/react-sortable-hoc/-/react-sortable-hoc-2.0.0.tgz#f6780d8aa4b922a21f3e754af542f032677078b7"
+  integrity sha512-JZUw7hBsAHXK7PTyErJyI7SopSBFRcFHDjWW5SWjcugY0i6iH7f+eJkY8cJmGMlZ1C9xz1J3Vjz0plFpavVeRg==
+  dependencies:
+    "@babel/runtime" "^7.2.0"
+    invariant "^2.2.4"
+    prop-types "^15.5.7"
+
 react-tween-state@^0.1.5:
   version "0.1.5"
   resolved "https://registry.npm.taobao.org/react-tween-state/download/react-tween-state-0.1.5.tgz#e98b066551efb93cb92dd1be14995c2e3deae339"
@@ -20913,6 +20950,22 @@ styled-components@^5.3.0:
     shallowequal "^1.1.0"
     supports-color "^5.5.0"
 
+styled-components@^5.3.3:
+  version "5.3.3"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.3.tgz#312a3d9a549f4708f0fb0edc829eb34bde032743"
+  integrity sha512-++4iHwBM7ZN+x6DtPPWkCI4vdtwumQ+inA/DdAsqYd4SVgUKJie5vXyzotA00ttcFdQkCng7zc6grwlfIfw+lw==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/traverse" "^7.4.5"
+    "@emotion/is-prop-valid" "^0.8.8"
+    "@emotion/stylis" "^0.8.4"
+    "@emotion/unitless" "^0.7.4"
+    babel-plugin-styled-components ">= 1.12.0"
+    css-to-react-native "^3.0.0"
+    hoist-non-react-statics "^3.0.0"
+    shallowequal "^1.1.0"
+    supports-color "^5.5.0"
+
 stylehacks@^4.0.0:
   version "4.0.3"
   resolved "https://registry.npm.taobao.org/stylehacks/download/stylehacks-4.0.3.tgz#6718fcaf4d1e07d8a1318690881e8d96726a71d5"
@@ -21110,12 +21163,10 @@ svgo@^2.3.0:
     csso "^4.2.0"
     stable "^0.1.8"
 
-swr@^0.5.6:
-  version "0.5.6"
-  resolved "https://registry.yarnpkg.com/swr/-/swr-0.5.6.tgz#70bfe9bc9d7ac49a064be4a0f4acf57982e55a31"
-  integrity sha512-Bmx3L4geMZjYT5S2Z6EE6/5Cx6v1Ka0LhqZKq8d6WL2eu9y6gHWz3dUzfIK/ymZVHVfwT/EweFXiYGgfifei3w==
-  dependencies:
-    dequal "2.0.2"
+swr@1.1.0-beta.6:
+  version "1.1.0-beta.6"
+  resolved "https://registry.yarnpkg.com/swr/-/swr-1.1.0-beta.6.tgz#7766c4cf32972b1ad7408ac691926a7595a18fbc"
+  integrity sha512-O2eYDHfnS/bnbq69d/TudXCv4ikAJPp8alL0X5cIEgGI9KQy6Wp5YlexT2qhYAViGB29MxkoyMNkhg2tgflnYA==
 
 symbol-tree@^3.2.2, symbol-tree@^3.2.4:
   version "3.2.4"