Browse Source

Fix confilcts from master branch

pull/18817/head
诸岳 5 years ago
parent
commit
495fc3a99a
  1. 2
      .circleci/config.yml
  2. 17
      CHANGELOG.en-US.md
  3. 17
      CHANGELOG.zh-CN.md
  4. 11
      components/anchor/__tests__/Anchor.test.js
  5. 4
      components/button/style/mixin.less
  6. 4
      components/descriptions/demo/size.md
  7. 426
      components/icon/__tests__/__snapshots__/index.test.js.snap
  8. 254
      components/icon/__tests__/index.test.js
  9. 2
      components/icon/index.en-US.md
  10. 8
      components/page-header/__tests__/index.test.js
  11. 20
      components/page-header/index.tsx
  12. 4
      components/result/index.tsx
  13. 2
      components/steps/style/index.less
  14. 4
      components/table/interface.tsx
  15. 2
      components/upload/interface.tsx
  16. 43
      docs/spec/work-with-us.zh-CN.md

2
.circleci/config.yml

@ -3,7 +3,7 @@ version: 2
references:
container_config: &container_config
docker:
- image: circleci/node:8
- image: circleci/node:lts
working_directory: ~/ant-design
attach_workspace: &attach_workspace

17
CHANGELOG.en-US.md

@ -15,6 +15,23 @@ timeline: true
---
## 3.23.2
`2019-09-06`
- 🐞 Fix `round` Button font size too large. [#18701](https://github.com/ant-design/ant-design/pull/18701)
- 🐞 Fix Descriptions warning with same key when bordered is true. [#18637](https://github.com/ant-design/ant-design/pull/18637)
- 🐞 Fix Drawer animation when `placement` is right and `mask` is false. [#18636](https://github.com/ant-design/ant-design/pull/18636)
- 🐞 Fix Icon that `component` and `children` prop should have priority over `type` prop. [#18592](https://github.com/ant-design/ant-design/pull/18592)
- 🐞 Fix Layout.Sider boundary values for max-width. [#18553](https://github.com/ant-design/ant-design/pull/18553) [@Nikitenkova](https://github.com/Nikitenkova)
- 🐞 Fix PageHeader that back icon can't coexist with breadcrumb. [#18691](https://github.com/ant-design/ant-design/pull/18691)
- 🗑Deprecated Select `inputValue` prop and use `searchValue` instead. [#18629](https://github.com/ant-design/ant-design/pull/18629)
- TypeScript
- 🐞 Fix type definition of `status` for Result. [#18445](https://github.com/ant-design/ant-design/pull/18445)
- 🐞 Fix type definition of `target` for Anchor.Link. [#18646](https://github.com/ant-design/ant-design/pull/18646)
- 🐞 Fix type definition of `transformFile` params for Upload. [#18671](https://github.com/ant-design/ant-design/pull/18671)
- 🐞 Fix type definition of `title` and `footer` for Table. [#18697](https://github.com/ant-design/ant-design/pull/18697) [@yoyo837](https://github.com/yoyo837)
## 3.23.1
`2019-09-03`

17
CHANGELOG.zh-CN.md

@ -15,6 +15,23 @@ timeline: true
---
## 3.23.2
`2019-09-06`
- 🐞 修复圆形按钮的字体大一号的问题。[#18701](https://github.com/ant-design/ant-design/pull/18701)
- 🐞 修复 Descriptions 带边框时控制台告警的问题。[#18637](https://github.com/ant-design/ant-design/pull/18637)
- 🐞 修复 Drawer 无遮罩从右边展开时的动画问题。[#18636](https://github.com/ant-design/ant-design/pull/18636)
- 🐞 修复 Icon 中 `component``children` 属性优先级低于 `type` 的问题。[#18592](https://github.com/ant-design/ant-design/pull/18592)
- 🐞 修复 Layout.Sider 的最大宽度的响应式断点值。[#18553](https://github.com/ant-design/ant-design/pull/18553) [@Nikitenkova](https://github.com/Nikitenkova)
- 🐞 修复 PageHeader 中返回图标与面包屑无法共存的问题。[#18691](https://github.com/ant-design/ant-design/pull/18691)
- 🗑 废弃 Select 的 `inputValue` 属性,请使用 `searchValue` 代替。[#18629](https://github.com/ant-design/ant-design/pull/18629)
- TypeScript
- 🐞 修复 Result 中 `status` 的类型定义。[#18445](https://github.com/ant-design/ant-design/pull/18445)
- 🐞 修复 Anchor.Link 中 `target` 的类型定义。[#18646](https://github.com/ant-design/ant-design/pull/18646)
- 🐞 修复 Upload 中 `transformFile` 函数的参数定义。[#18671](https://github.com/ant-design/ant-design/pull/18671)
- 🐞 修复 Table 中 `title``footer` 的类型定义。[#18697](https://github.com/ant-design/ant-design/pull/18697) [@yoyo837](https://github.com/yoyo837)
## 3.23.1
`2019-09-03`

11
components/anchor/__tests__/Anchor.test.js

@ -279,10 +279,13 @@ describe('Anchor Render', () => {
let dateNowMock;
function dataNowMockFn() {
return jest
.spyOn(Date, 'now')
.mockImplementationOnce(() => 0)
.mockImplementationOnce(() => 1000);
let start = 0;
const handler = () => {
return (start += 1000);
};
return jest.spyOn(Date, 'now').mockImplementation(handler);
}
dateNowMock = dataNowMockFn();

4
components/button/style/mixin.less

@ -225,10 +225,10 @@
}
// round button
.btn-round(@btnClassName: btn) {
.button-size(@btn-circle-size; 0 @btn-circle-size / 2; @font-size-base + 2px; @btn-circle-size);
.button-size(@btn-circle-size; 0 @btn-circle-size / 2; @font-size-base; @btn-circle-size);
&.@{btnClassName}-lg {
.button-size(
@btn-circle-size-lg; 0 @btn-circle-size-lg / 2; @btn-font-size-lg + 2px; @btn-circle-size-lg
@btn-circle-size-lg; 0 @btn-circle-size-lg / 2; @btn-font-size-lg; @btn-circle-size-lg
);
}
&.@{btnClassName}-sm {

4
components/descriptions/demo/size.md

@ -38,7 +38,7 @@ class Demo extends React.Component {
</Radio.Group>
<br />
<br />
<Descriptions bordered title="Custom Size" border size={this.state.size}>
<Descriptions bordered title="Custom Size" size={this.state.size}>
<Descriptions.Item label="Product">Cloud Database</Descriptions.Item>
<Descriptions.Item label="Billing">Prepaid</Descriptions.Item>
<Descriptions.Item label="time">18:00:00</Descriptions.Item>
@ -61,7 +61,7 @@ class Demo extends React.Component {
</Descriptions>
<br />
<br />
<Descriptions title="Custom Size" border size={this.state.size}>
<Descriptions title="Custom Size" size={this.state.size}>
<Descriptions.Item label="Product">Cloud Database</Descriptions.Item>
<Descriptions.Item label="Billing">Prepaid</Descriptions.Item>
<Descriptions.Item label="time">18:00:00</Descriptions.Item>

426
components/icon/__tests__/__snapshots__/index.test.js.snap

@ -0,0 +1,426 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Icon \`component\` prop can access to svg defs if has children 1`] = `
<i
class="anticon my-home-icon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
width="1em"
>
<defs>
<linearGradient
id="gradient"
>
<stop
offset="20%"
stop-color="#39F"
/>
<stop
offset="90%"
stop-color="#F3F"
/>
</linearGradient>
</defs>
<title>
Cool Home
</title>
<path
d="'M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'"
fill="scriptUrl(#gradient)"
/>
</svg>
</i>
`;
exports[`Icon should give warning and render <i>{null}</i> 1`] = `
<i
class="anticon"
/>
`;
exports[`Icon should render to a <i class="xxx"><svg>...</svg></i> 1`] = `
<i
aria-label="icon: message"
class="anticon anticon-message my-icon-classname"
>
<svg
aria-hidden="true"
class=""
data-icon="message"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M464 512a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm200 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm-400 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm661.2-173.6c-22.6-53.7-55-101.9-96.3-143.3a444.35 444.35 0 0 0-143.3-96.3C630.6 75.7 572.2 64 512 64h-2c-60.6.3-119.3 12.3-174.5 35.9a445.35 445.35 0 0 0-142 96.5c-40.9 41.3-73 89.3-95.2 142.8-23 55.4-34.6 114.3-34.3 174.9A449.4 449.4 0 0 0 112 714v152a46 46 0 0 0 46 46h152.1A449.4 449.4 0 0 0 510 960h2.1c59.9 0 118-11.6 172.7-34.3a444.48 444.48 0 0 0 142.8-95.2c41.3-40.9 73.8-88.7 96.5-142 23.6-55.2 35.6-113.9 35.9-174.5.3-60.9-11.5-120-34.8-175.6zm-151.1 438C704 845.8 611 884 512 884h-1.7c-60.3-.3-120.2-15.3-173.1-43.5l-8.4-4.5H188V695.2l-4.5-8.4C155.3 633.9 140.3 574 140 513.7c-.4-99.7 37.7-193.3 107.6-263.8 69.8-70.5 163.1-109.5 262.8-109.9h1.7c50 0 98.5 9.7 144.2 28.9 44.6 18.7 84.6 45.6 119 80 34.3 34.3 61.3 74.4 80 119 19.4 46.2 29.1 95.2 28.9 145.8-.6 99.6-39.7 192.9-110.1 262.7z"
/>
</svg>
</i>
`;
exports[`Icon should support basic usage 1`] = `
<div>
<i
aria-label="icon: home"
class="anticon anticon-home"
>
<svg
aria-hidden="true"
class=""
data-icon="home"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M946.5 505L560.1 118.8l-25.9-25.9a31.5 31.5 0 0 0-44.4 0L77.5 505a63.9 63.9 0 0 0-18.8 46c.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8a63.6 63.6 0 0 0 18.7-45.3c0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204zm217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z"
/>
</svg>
</i>
<i
aria-label="icon: setting"
class="anticon anticon-setting"
>
<svg
aria-hidden="true"
class=""
data-icon="setting"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M512.5 390.6c-29.9 0-57.9 11.6-79.1 32.8-21.1 21.2-32.8 49.2-32.8 79.1 0 29.9 11.7 57.9 32.8 79.1 21.2 21.1 49.2 32.8 79.1 32.8 29.9 0 57.9-11.7 79.1-32.8 21.1-21.2 32.8-49.2 32.8-79.1 0-29.9-11.7-57.9-32.8-79.1a110.96 110.96 0 0 0-79.1-32.8zm412.3 235.5l-65.4-55.9c3.1-19 4.7-38.4 4.7-57.7s-1.6-38.8-4.7-57.7l65.4-55.9a32.03 32.03 0 0 0 9.3-35.2l-.9-2.6a442.5 442.5 0 0 0-79.6-137.7l-1.8-2.1a32.12 32.12 0 0 0-35.1-9.5l-81.2 28.9c-30-24.6-63.4-44-99.6-57.5l-15.7-84.9a32.05 32.05 0 0 0-25.8-25.7l-2.7-.5c-52-9.4-106.8-9.4-158.8 0l-2.7.5a32.05 32.05 0 0 0-25.8 25.7l-15.8 85.3a353.44 353.44 0 0 0-98.9 57.3l-81.8-29.1a32 32 0 0 0-35.1 9.5l-1.8 2.1a445.93 445.93 0 0 0-79.6 137.7l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.2 56.5c-3.1 18.8-4.6 38-4.6 57 0 19.2 1.5 38.4 4.6 57l-66 56.5a32.03 32.03 0 0 0-9.3 35.2l.9 2.6c18.1 50.3 44.8 96.8 79.6 137.7l1.8 2.1a32.12 32.12 0 0 0 35.1 9.5l81.8-29.1c29.8 24.5 63 43.9 98.9 57.3l15.8 85.3a32.05 32.05 0 0 0 25.8 25.7l2.7.5a448.27 448.27 0 0 0 158.8 0l2.7-.5a32.05 32.05 0 0 0 25.8-25.7l15.7-84.9c36.2-13.6 69.6-32.9 99.6-57.5l81.2 28.9a32 32 0 0 0 35.1-9.5l1.8-2.1c34.8-41.1 61.5-87.4 79.6-137.7l.9-2.6c4.3-12.4.6-26.3-9.5-35zm-412.3 52.2c-97.1 0-175.8-78.7-175.8-175.8s78.7-175.8 175.8-175.8 175.8 78.7 175.8 175.8-78.7 175.8-175.8 175.8z"
/>
</svg>
</i>
<i
aria-label="icon: smile"
class="anticon anticon-smile"
>
<svg
aria-hidden="true"
class=""
data-icon="smile"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
/>
</svg>
</i>
<i
aria-label="icon: sync"
class="anticon anticon-sync"
>
<svg
aria-hidden="true"
class="anticon-spin"
data-icon="sync"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M168 504.2c1-43.7 10-86.1 26.9-126 17.3-41 42.1-77.7 73.7-109.4S337 212.3 378 195c42.4-17.9 87.4-27 133.9-27s91.5 9.1 133.8 27A341.5 341.5 0 0 1 755 268.8c9.9 9.9 19.2 20.4 27.8 31.4l-60.2 47a8 8 0 0 0 3 14.1l175.7 43c5 1.2 9.9-2.6 9.9-7.7l.8-180.9c0-6.7-7.7-10.5-12.9-6.3l-56.4 44.1C765.8 155.1 646.2 92 511.8 92 282.7 92 96.3 275.6 92 503.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8zm756 7.8h-60c-4.4 0-7.9 3.5-8 7.8-1 43.7-10 86.1-26.9 126-17.3 41-42.1 77.8-73.7 109.4A342.45 342.45 0 0 1 512.1 856a342.24 342.24 0 0 1-243.2-100.8c-9.9-9.9-19.2-20.4-27.8-31.4l60.2-47a8 8 0 0 0-3-14.1l-175.7-43c-5-1.2-9.9 2.6-9.9 7.7l-.7 181c0 6.7 7.7 10.5 12.9 6.3l56.4-44.1C258.2 868.9 377.8 932 512.2 932c229.2 0 415.5-183.7 419.8-411.8a8 8 0 0 0-8-8.2z"
/>
</svg>
</i>
<i
aria-label="icon: loading"
class="anticon anticon-loading"
>
<svg
aria-hidden="true"
class="anticon-spin"
data-icon="loading"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
/>
</svg>
</i>
</div>
`;
exports[`Icon should support config global two-tone primary color 1`] = `
<i
aria-label="icon: check-circle"
class="anticon anticon-check-circle"
>
<svg
aria-hidden="true"
class=""
data-icon="check-circle"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
fill="#1890ff"
/>
<path
d="M512 140c-205.4 0-372 166.6-372 372s166.6 372 372 372 372-166.6 372-372-166.6-372-372-372zm193.4 225.7l-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.3 0 19.9 5 25.9 13.3l71.2 98.8 157.2-218c6-8.4 15.7-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.4 12.7z"
fill="#e6f7ff"
/>
<path
d="M699 353h-46.9c-10.2 0-19.9 4.9-25.9 13.3L469 584.3l-71.2-98.8c-6-8.3-15.6-13.3-25.9-13.3H325c-6.5 0-10.3 7.4-6.5 12.7l124.6 172.8a31.8 31.8 0 0 0 51.7 0l210.6-292c3.9-5.3.1-12.7-6.4-12.7z"
fill="#1890ff"
/>
</svg>
</i>
`;
exports[`Icon should support older usage 1`] = `
<div>
<i
aria-label="icon: home-o"
class="anticon anticon-home-o"
>
<svg
aria-hidden="true"
class=""
data-icon="home"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M946.5 505L560.1 118.8l-25.9-25.9a31.5 31.5 0 0 0-44.4 0L77.5 505a63.9 63.9 0 0 0-18.8 46c.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8a63.6 63.6 0 0 0 18.7-45.3c0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204zm217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z"
/>
</svg>
</i>
<i
aria-label="icon: setting-fill"
class="anticon anticon-setting-fill"
>
<svg
aria-hidden="true"
class=""
data-icon="setting"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 0 0 9.3-35.2l-.9-2.6a443.74 443.74 0 0 0-79.7-137.9l-1.8-2.1a32.12 32.12 0 0 0-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 0 0-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 0 0-25.8 25.7l-15.8 85.4a351.86 351.86 0 0 0-99 57.4l-81.9-29.1a32 32 0 0 0-35.1 9.5l-1.8 2.1a446.02 446.02 0 0 0-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 0 0-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0 0 35.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0 0 25.8 25.7l2.7.5a449.4 449.4 0 0 0 159 0l2.7-.5a32.05 32.05 0 0 0 25.8-25.7l15.7-85a350 350 0 0 0 99.7-57.6l81.3 28.9a32 32 0 0 0 35.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 0 1-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 0 1-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 0 1 512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 0 1 400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 0 1 624 502c0 29.9-11.7 58-32.8 79.2z"
/>
</svg>
</i>
<i
aria-label="icon: smile-o"
class="anticon anticon-smile-o"
>
<svg
aria-hidden="true"
class=""
data-icon="smile"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
/>
</svg>
</i>
<i
aria-label="icon: check-circle-twotone"
class="anticon anticon-check-circle-twotone"
>
<svg
aria-hidden="true"
class=""
data-icon="check-circle"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M699 353h-46.9c-10.2 0-19.9 4.9-25.9 13.3L469 584.3l-71.2-98.8c-6-8.3-15.6-13.3-25.9-13.3H325c-6.5 0-10.3 7.4-6.5 12.7l124.6 172.8a31.8 31.8 0 0 0 51.7 0l210.6-292c3.9-5.3.1-12.7-6.4-12.7z"
/>
<path
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
/>
</svg>
</i>
</div>
`;
exports[`Icon should support pass svg paths as children 1`] = `
<i
class="anticon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 24 24"
width="1em"
>
<title>
Cool Home
</title>
<path
d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
/>
</svg>
</i>
`;
exports[`Icon should support svg react component 1`] = `
<i
class="anticon my-home-icon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 24 24"
width="1em"
>
<title>
Custom Svg
</title>
<path
d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
/>
</svg>
</i>
`;
exports[`Icon should support two-tone icon 1`] = `
<i
aria-label="icon: check-circle"
class="anticon anticon-check-circle"
>
<svg
aria-hidden="true"
class=""
data-icon="check-circle"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
fill="#f5222d"
/>
<path
d="M512 140c-205.4 0-372 166.6-372 372s166.6 372 372 372 372-166.6 372-372-166.6-372-372-372zm193.4 225.7l-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.3 0 19.9 5 25.9 13.3l71.2 98.8 157.2-218c6-8.4 15.7-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.4 12.7z"
fill="#fff1f0"
/>
<path
d="M699 353h-46.9c-10.2 0-19.9 4.9-25.9 13.3L469 584.3l-71.2-98.8c-6-8.3-15.6-13.3-25.9-13.3H325c-6.5 0-10.3 7.4-6.5 12.7l124.6 172.8a31.8 31.8 0 0 0 51.7 0l210.6-292c3.9-5.3.1-12.7-6.4-12.7z"
fill="#f5222d"
/>
</svg>
</i>
`;
exports[`Icon support render svg as component 1`] = `
<i
class="anticon"
>
<svg
fill="currentColor"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
/>
</i>
`;
exports[`Icon.createFromIconfontCN() should support iconfont.cn 1`] = `
<div
class="icons-list"
>
<i
class="anticon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
width="1em"
>
<use
href="#icon-tuichu"
/>
</svg>
</i>
<i
class="anticon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
width="1em"
>
<use
href="#icon-facebook"
/>
</svg>
</i>
<i
class="anticon"
>
<svg
aria-hidden="true"
class=""
fill="currentColor"
focusable="false"
height="1em"
width="1em"
>
<use
href="#icon-twitter"
/>
</svg>
</i>
</div>
`;

254
components/icon/__tests__/index.test.js

@ -0,0 +1,254 @@
import React from 'react';
import { render, mount } from 'enzyme';
import ReactIcon from '@ant-design/icons-react';
import Icon from '..';
import Tooltip from '../../tooltip';
import { getThemeFromTypeName, withThemeSuffix } from '../utils';
import mountTest from '../../../tests/shared/mountTest';
describe('Icon', () => {
mountTest(Icon);
it('should render to a <i class="xxx"><svg>...</svg></i>', () => {
const wrapper = render(<Icon type="message" className="my-icon-classname" />);
expect(wrapper).toMatchSnapshot();
});
it('should support basic usage', () => {
const wrapper = render(
<div>
<Icon type="home" />
<Icon type="setting" theme="filled" />
<Icon type="smile" theme="outlined" />
<Icon type="sync" spin />
<Icon type="loading" />
</div>,
);
expect(wrapper).toMatchSnapshot();
});
it('should support older usage', () => {
const wrapper = render(
<div>
<Icon type="home-o" />
<Icon type="setting-fill" />
<Icon type="smile-o" />
<Icon type="check-circle-twotone" />
</div>,
);
expect(wrapper).toMatchSnapshot();
});
it('should support two-tone icon', () => {
const wrapper = render(<Icon type="check-circle" theme="twoTone" twoToneColor="#f5222d" />);
expect(wrapper).toMatchSnapshot();
});
it('should support config global two-tone primary color', () => {
const colors = ReactIcon.getTwoToneColors();
Icon.setTwoToneColor('#1890ff');
expect(Icon.getTwoToneColor()).toBe('#1890ff');
const wrapper = render(<Icon type="check-circle" theme="twoTone" />);
expect(wrapper).toMatchSnapshot();
ReactIcon.setTwoToneColors(colors);
});
it('should support pass svg paths as children', () => {
const wrapper = render(
<Icon viewBox="0 0 24 24">
<title>Cool Home</title>
<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
</Icon>,
);
expect(wrapper).toMatchSnapshot();
});
it('should give warning and render <i>{null}</i>', () => {
const wrapper = render(<Icon viewBox="0 0 24 24" />);
expect(wrapper).toMatchSnapshot();
});
it('should support wrapped by Tooltip', () => {
const onVisibleChange = jest.fn();
const wrapper = mount(
<Tooltip
title="xxxxx"
mouseEnterDelay={0}
mouseLeaveDelay={0}
onVisibleChange={onVisibleChange}
>
<Icon type="home" />
</Tooltip>,
);
expect(wrapper.find('i')).toHaveLength(1);
const icon = wrapper.find('i').at(0);
icon.simulate('mouseenter');
expect(onVisibleChange).toHaveBeenCalledWith(true);
expect(wrapper.instance().tooltip.props.visible).toBe(true);
icon.simulate('mouseleave');
expect(onVisibleChange).toHaveBeenCalledWith(false);
expect(wrapper.instance().tooltip.props.visible).toBe(false);
});
it('should support custom usage of children', () => {
expect(() => {
render(<Icon type="custom">&E648</Icon>);
}).not.toThrow();
});
it('support render svg as component', () => {
const renderSvg = () => (
<svg viewBox="0 0 1024 1024" width="1em" height="1em" fill="currentColor" />
);
const SvgIcon = props => <Icon component={renderSvg} {...props} />;
expect(mount(<SvgIcon />).render()).toMatchSnapshot();
});
describe('warning on conflicting theme', () => {
let errorSpy;
beforeEach(() => {
errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
});
afterEach(() => {
errorSpy.mockRestore();
});
it('does not warn', () => {
mount(<Icon type="clock-circle-o" theme="outlined" />);
expect(errorSpy).not.toHaveBeenCalled();
});
it('warns', () => {
mount(<Icon type="clock-circle-o" theme="filled" />);
expect(errorSpy).toHaveBeenCalledWith(
"Warning: [antd: Icon] The icon name 'clock-circle-o' already specify a theme 'outlined', the 'theme' prop 'filled' will be ignored.",
);
});
});
describe('`component` prop', () => {
it('can access to svg defs if has children', () => {
const wrapper = render(
<Icon
className="my-home-icon"
component={svgProps => (
<svg {...svgProps}>
<defs>
<linearGradient id="gradient">
<stop offset="20%" stopColor="#39F" />
<stop offset="90%" stopColor="#F3F" />
</linearGradient>
</defs>
{React.Children.map(svgProps.children, child =>
React.cloneElement(
child,
child.type === 'path' ? { fill: 'scriptUrl(#gradient)' } : {},
),
)}
</svg>
)}
>
<title>Cool Home</title>
<path d="'M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'" />
</Icon>,
);
expect(wrapper).toMatchSnapshot();
});
});
it('should support svg react component', () => {
const SvgComponent = props => (
<svg viewBox="0 0 24 24" {...props}>
<title>Custom Svg</title>
<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
</svg>
);
const wrapper = render(
<Icon className="my-home-icon" component={SvgComponent}>
<title>Cool Home</title>
<path d="'M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'" />
</Icon>,
);
expect(wrapper).toMatchSnapshot();
});
});
describe('Icon.createFromIconfontCN()', () => {
const IconFont = Icon.createFromIconfontCN({
scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js',
});
it('should support iconfont.cn', () => {
const wrapper = render(
<div className="icons-list">
<IconFont type="icon-tuichu" />
<IconFont type="icon-facebook" />
<IconFont type="icon-twitter" />
</div>,
);
expect(wrapper).toMatchSnapshot();
});
});
describe('utils', () => {
it('getThemeFromTypeName() should work', () => {
const testCases = [
'check-circle',
'check-circle-o',
'check-circle-fill',
'check-circle-twotone',
];
const result = testCases.map(type => getThemeFromTypeName(type));
expect(result).toEqual([null, 'outlined', 'filled', 'twoTone']);
});
it('withThemeSuffix() should work', () => {
const testCases = [
{ type: 'home', theme: 'filled' },
{ type: 'home', theme: 'outlined' },
{ type: 'home', theme: 'twoTone' },
{ type: 'home', theme: 'This-is-the-secret' },
{ type: 'home-o', theme: 'filled' },
{ type: 'home-fill', theme: 'outlined' },
{ type: 'home-o', theme: 'twoTone' },
{ type: 'home-o', theme: 'This-is-the-secret' },
];
const result = testCases.map(({ type, theme }) => withThemeSuffix(type, theme));
expect(result).toEqual([
'home-fill',
'home-o',
'home-twotone',
'home',
'home-o-fill',
'home-fill-o',
'home-o-twotone',
'home-o',
]);
});
it('should report an error when there are deprecated typos in icon names', () => {
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
render(<Icon type="interation" />);
expect(errorSpy).toHaveBeenLastCalledWith(
"Warning: [antd: Icon] Icon 'interation' was a typo and is now deprecated, please use 'interaction' instead.",
);
render(<Icon type="cross" />);
expect(errorSpy).toHaveBeenLastCalledWith(
"Warning: [antd: Icon] Icon 'cross' was a typo and is now deprecated, please use 'close' instead.",
);
render(<Icon type="canlendar" theme="twoTone" />);
expect(errorSpy).toHaveBeenLastCalledWith(
"Warning: [antd: Icon] Icon 'canlendar' was a typo and is now deprecated, please use 'calendar' instead.",
);
render(<Icon type="colum-height" />);
expect(errorSpy).toHaveBeenLastCalledWith(
"Warning: [antd: Icon] Icon 'colum-height' was a typo and is now deprecated, please use 'column-height' instead.",
);
expect(errorSpy).toHaveBeenCalledTimes(4);
errorSpy.mockRestore();
});
});

2
components/icon/index.en-US.md

@ -145,7 +145,7 @@ ReactDOM.render(<Icon component={MessageSvg} />, mountNode);
The following properties are available for the component:
| Property | Description | Type | Default | Version |
| Property | Description | Type | Readonly | Version |
| --- | --- | --- | --- | --- |
| width | The width of the `svg` element | string \| number | '1em' | 3.10.0 |
| height | The height of the `svg` element | string \| number | '1em' | 3.10.0 |

8
components/page-header/__tests__/index.test.js

@ -67,7 +67,7 @@ describe('PageHeader', () => {
expect(wrapper).toMatchSnapshot();
});
it('breadcrumbs and back icon can only have one', () => {
it('breadcrumbs and back icon can coexist', () => {
const routes = [
{
path: 'index',
@ -82,10 +82,10 @@ describe('PageHeader', () => {
breadcrumbName: 'Third-level Menu',
},
];
const wrapper = mount(<PageHeader title="Title" onBack={() => true} breadcrumb={{ routes }} />);
expect(wrapper.find('.ant-breadcrumb')).toHaveLength(0);
const wrapper = mount(<PageHeader title="Title" breadcrumb={{ routes }} />);
expect(wrapper.find('.ant-breadcrumb')).toHaveLength(1);
wrapper.setProps({ onBack: undefined });
wrapper.setProps({ onBack: () => {} });
expect(wrapper.find('.ant-breadcrumb')).toHaveLength(1);
});
});

20
components/page-header/index.tsx

@ -8,7 +8,6 @@ import Breadcrumb, { BreadcrumbProps } from '../breadcrumb';
import Avatar, { AvatarProps } from '../avatar';
import TransButton from '../_util/transButton';
import LocaleReceiver from '../locale-provider/LocaleReceiver';
import warning from '../_util/warning';
export interface PageHeaderProps {
backIcon?: React.ReactNode;
@ -58,23 +57,6 @@ const renderBreadcrumb = (breadcrumb: BreadcrumbProps) => {
return <Breadcrumb {...breadcrumb} />;
};
const renderHeader = (
breadcrumb: PageHeaderProps['breadcrumb'],
{ backIcon, onBack }: PageHeaderProps,
) => {
// by design,Bread crumbs and back icon can only have one
if (backIcon && onBack) {
if (breadcrumb && breadcrumb.routes) {
warning(false, 'page-header', 'breadcrumbs and back icon can only have one');
}
return null;
}
if (breadcrumb && breadcrumb.routes) {
return renderBreadcrumb(breadcrumb);
}
return null;
};
const renderTitle = (prefixCls: string, props: PageHeaderProps) => {
const { title, avatar, subTitle, tags, extra, backIcon, onBack } = props;
const headingPrefixCls = `${prefixCls}-heading`;
@ -118,7 +100,7 @@ const PageHeader: React.SFC<PageHeaderProps> = props => (
} = props;
const prefixCls = getPrefixCls('page-header', customizePrefixCls);
const breadcrumbDom = renderHeader(breadcrumb, props);
const breadcrumbDom = breadcrumb && breadcrumb.routes ? renderBreadcrumb(breadcrumb) : null;
const className = classnames(prefixCls, customizeClassName, {
'has-breadcrumb': breadcrumbDom,
'has-footer': footer,

4
components/result/index.tsx

@ -31,7 +31,7 @@ export type ResultStatusType = ExceptionStatusType | keyof typeof IconMap;
export interface ResultProps {
icon?: React.ReactNode;
status: ResultStatusType;
status?: ResultStatusType;
title?: React.ReactNode;
subTitle?: React.ReactNode;
extra?: React.ReactNode;
@ -53,7 +53,7 @@ const ExceptionStatus = Object.keys(ExceptionMap);
const renderIcon = (prefixCls: string, { status, icon }: ResultProps) => {
const className = classnames(`${prefixCls}-icon`);
if (ExceptionStatus.includes(status)) {
if (ExceptionStatus.includes(status as ResultStatusType)) {
const SVGComponent = ExceptionMap[status as ExceptionStatusType];
return (
<div className={`${className} ${prefixCls}-image`}>

2
components/steps/style/index.less

@ -148,7 +148,7 @@
}
// ===================== Clickable =====================
.@{steps-prefix-cls}:not(.@{steps-prefix-cls}-navigation) .@{steps-prefix-cls}-item {
.@{steps-prefix-cls} .@{steps-prefix-cls}-item {
&:not(.@{steps-prefix-cls}-item-active) {
& > .@{steps-prefix-cls}-item-container[role='button'] {
cursor: pointer;

4
components/table/interface.tsx

@ -183,8 +183,8 @@ export interface TableProps<T> {
useFixedHeader?: boolean;
bordered?: boolean;
showHeader?: boolean;
footer?: (currentPageData: Object[]) => React.ReactNode;
title?: (currentPageData: Object[]) => React.ReactNode;
footer?: (currentPageData: T[]) => React.ReactNode;
title?: (currentPageData: T[]) => React.ReactNode;
scroll?: { x?: boolean | number | string; y?: boolean | number | string };
childrenColumnName?: string;
bodyStyle?: React.CSSProperties;

2
components/upload/interface.tsx

@ -54,7 +54,7 @@ export type UploadListType = 'text' | 'picture' | 'picture-card';
type PreviewFileHandler = (file: File | Blob) => PromiseLike<string>;
type TransformFileHandler = (
file: UploadFile,
file: RcFile,
) => string | Blob | File | PromiseLike<string | Blob | File>;
export interface UploadProps {

43
docs/spec/work-with-us.zh-CN.md

@ -6,41 +6,28 @@ title: 加入我们
我们(蚂蚁金服体验技术部)是一支兼具设计视角和工程视角的团队,服务蚂蚁金服上百个中后台系统,主打产品 Ant Design 服务全球 100 万设计师和工程师,是西湖区学院路西侧最具影响力的设计语言。欢迎来这里和我们一起打造优雅高效的人机设计/研发体系。
## ADI(Artificial Design Intelligence) 工程师
简历和作品集请投递:lindong.lld#alipay.com
> 注明简历来自 ant.design 官网
- 岗位级别:P7/P8
- 岗位地点:杭州
- 岗位要求:
- 有良好的工程师背景,善于学习和使用各类工具、框架解决研发问题;
- 对人工智能应用在设计行业,有坚定的信心和意愿;
- 已经有相关实践工作,优先考虑。
- 岗位职责:
- 负责 Ant Design 工具体系和智能设计的研发,并配合团队成员进行商业化实践,把设计做成业务;
- 组建和培养有梯度的研发团队。
## UI/UE 设计师
简历和作品集请投递:lindong.lld#alipay.com
> 注明简历来自 ant.design 官网
- 岗位级别:P6/P7
- 岗位级别:P6/P7/P8
- 岗位地点:杭州
- 岗位要求:
- 至少 2-3 年的工作经验,扎实设计功底;
- 至少 3-5 年的工作经验,扎实设计功底;
- 抽象能力强,善于透过表象找本质;
- 沟通能力佳,善于自我管理;
- 有企业级设计实战经验,加分;
- 有数据驱动的增长设计实践,加分;
- 深度理解 SAP、Salesforce、Google 等设计体系,能提出自己独到见解并落实到实践中,加加加分。
- 岗位职责:
- 参与[蚂蚁金融科技](https://tech.antfin.com/)、区块链、人工智能等企业级产品的设计工作;
- 参与[语雀](https://www.yuque.com/)、[云凤蝶](https://www.yunfengdie.com/)、K12/中小学(支付宝搜索:小钱袋)等创新产品的设计工作;
- 参与[蚂蚁金融科技](https://tech.antfin.com/)、[区块链](https://tech.antfin.com/blockchain)、人工智能等企业级产品的设计工作;
- 参与[语雀](https://www.yuque.com/)、[云凤蝶](https://www.yunfengdie.com/)等创新产品的设计工作;
- 参与 Ant Design 的打磨,将其建设成全球卓越的设计体系。
- 参与 AntV 的打磨,将其建设成全球一流的数据可视化体系。
- One More Thing ❤️ :
- 你们总是为世界带去美好,但总是忘却你们也需要美好。我们正在努力打造 [🍳 Kitchen:一款为设计师提效的 Sketch 工具集](https://kitchen.alipay.com/)、[语雀画板](https://yuque.com/) 等专属设计师的产品,让设计真正变成财富。期待志同道合的你,一道给设计行业带来「微小而美好的改变」。
## 前端工程师
@ -60,3 +47,19 @@ title: 加入我们
- 岗位职责:
- 负责 Ant Design 前端基础设施研发。
- 负责中后台设计/前端工具体系建设。
## ADI(Artificial Design Intelligence) 工程师
简历和作品集请投递:lindong.lld#alipay.com
> 注明简历来自 ant.design 官网
- 岗位级别:P7/P8
- 岗位地点:杭州
- 岗位要求:
- 有良好的工程师背景,善于学习和使用各类工具、框架解决研发问题;
- 对人工智能应用在设计行业,有坚定的信心和意愿;
- 已经有相关实践工作,优先考虑。
- 岗位职责:
- 负责 Ant Design 工具体系和智能设计的研发,并配合团队成员进行商业化实践,把设计做成业务;
- 组建和培养有梯度的研发团队。

Loading…
Cancel
Save