Compare commits

...

59 Commits
3.2.0 ... 3.2.2

Author SHA1 Message Date
valleykid
07a0a1f336 Changelog of 3.2.2 (#9409) 2018-02-25 08:38:10 +08:00
valleykid
eab4fdfe95 Update snapshot 2018-02-25 07:57:23 +08:00
Ivan Kravets
86ab00fbbd Use default background for button states (#9411) 2018-02-24 22:25:50 +08:00
Wei Zhu
c28d6f1624 Remove table overflow:hidden, fix #7799 2018-02-24 11:46:46 +08:00
Mathew
947cee4475 fix issue #9359 (#9364)
* fix issue #9359

* fix trailing whitespaces
2018-02-24 11:40:44 +08:00
MinJeong Kim
feaf238dfa fix: set -has-trigger class in sider when -trigger div exists (#9399)
* fix: set `-has-trigger` class in sider when `-trigger` div exists

* fix: fix template expr lint error
2018-02-24 10:35:04 +08:00
Wei Zhu
f1fd85780e Revert "fix type of column dataIndex (#9298)"
This reverts commit f8e996ee8e.

Close #9393
2018-02-22 15:56:37 +08:00
Wei Zhu
dc439bd7c3 Remove generic type from ComponentDecorator, fix #9331 2018-02-22 15:52:35 +08:00
Wei Zhu
2c95ea0e5e docs: document Tabs[onChange] argument
Close #9386
2018-02-22 10:44:53 +08:00
Wei Zhu
aeeebab9d9 Upgrade @babel/types 2018-02-21 18:42:13 +08:00
Wei Zhu
a6ffd332fa docs: fix parameter 2018-02-16 15:20:25 +08:00
Christopher Deutsch
97b09b393b onKeyPress and onKeyDown got the wrong type in #9316 (#9365) 2018-02-15 13:10:35 -06:00
Wei Zhu
a438b9b33f Add spin dot className to custom indicator 2018-02-14 12:56:22 +08:00
Wei Zhu
7d5db31e67 Fix table custom spin indicator
Fix #9355
2018-02-14 12:56:22 +08:00
George Gray
053396810b add @badge-font-weight var (#9352) 2018-02-14 12:35:52 +08:00
George Gray
676635abde var to theme pagination font (#9351) 2018-02-13 21:38:34 +08:00
Dimitri Mitropoulos
c92cf5b778 adds missing argument in Select onChange prop (#9332)
* adds missing argument in Select onChange prop

from the docs: 
`function(value, option:Option/Array<Option>)`

also, (from reality) the callback really does send an option or options array.

* updates type to use ReactElement instead of Object
2018-02-13 07:33:25 -06:00
Arvin Xu
2a1612b0c2 📖 Fix misspelling and blank (#9348)
修改个错别字,补充两处盘古之白
2018-02-13 00:11:25 -06:00
MuYu
1d1ea1ac59 fix switch doc error (#9338) 2018-02-12 12:10:07 +08:00
afc163
b574e8ee14 3.2.1 2018-02-12 10:17:29 +08:00
偏右
0e9743e78a Add changelog of 3.2.1 (#9335)
* Add changelog of 3.2.1

* fix version

* Add English changelog
2018-02-12 10:09:11 +08:00
Wei Zhu
4107a4bd8e docs: Remove next version link
Close #9336
2018-02-11 20:11:40 +08:00
afc163
ba236419be Fix badge API doc 2018-02-11 19:21:12 +08:00
afc163
5294a69296 site: fix home page style 2018-02-11 18:10:02 +08:00
afc163
ec399ba27f site: update link description 2018-02-11 17:59:41 +08:00
afc163
d31612f2de site: renew footer links 2018-02-11 17:54:55 +08:00
afc163
c04377e541 Add more icons, #9092 2018-02-11 17:10:18 +08:00
afc163
626ebf2063 Fix upload list update logic when beforeUpload return false
close #8020 #8779 #9248 #9191

ref #8036
2018-02-11 16:11:13 +08:00
afc163
e3f115dd3d update snapshot 2018-02-11 11:48:59 +08:00
afc163
1ae7da3878 Fix hasFeedback icon position in vertical form layout
close #9153 and #9309
2018-02-11 11:44:49 +08:00
偏右
d72a6dd7b9 Update README.md
close #9254
2018-02-11 11:07:42 +08:00
afc163
f27bc6bd9d fix snapshot 2018-02-09 17:07:33 +08:00
afc163
fff5680743 fix typo 2018-02-09 16:30:14 +08:00
afc163
5accd6367a Fix submenu z-index, close #9218 2018-02-09 15:56:34 +08:00
afc163
2909e5f651 Fix sorter icon click area overflow in Table
close #8979
2018-02-09 15:50:08 +08:00
Wei Zhu
b5f88c0005 Fix table padding close #9319 2018-02-09 14:58:03 +08:00
诸岳
240289ed73 Remove TimePicker wrong line-height style, close #9292 (#9317) 2018-02-09 11:36:43 +08:00
Yury Kozyrev
1e92ff8efd onKeyPress and onKeyDown typings (#9316)
* Update Checkbox.tsx

* Update button.tsx
2018-02-08 20:35:54 -06:00
John Johnson III
3ffe718476 fix typo in less good (#9315)
Fix `background` property value by changing it from `transprent` to `transparent`
2018-02-09 10:05:56 +08:00
Benjy Cui
44063967a1 fix: make Mention autosize height by default, close: #9068 (#9307) 2018-02-08 23:50:42 +08:00
Benjy Cui
2411bdb7b7 fix: placeholder of Mention should not be interactable, close: #9215 (#9306) 2018-02-08 22:39:43 +08:00
Marcus Bransbury
3b6cd56820 Update broken links in docs (#9310)
* update link english

* update link chinese
2018-02-08 06:58:36 -06:00
Wei Zhu
7d3ff69e12 Fix small bordered table style
Fix #8980
2018-02-08 16:14:45 +08:00
jim
7b4abe7568 doc add select component showArrow props document 2018-02-08 16:13:09 +08:00
afc163
dc7d9de4cd revert demo code 2018-02-08 15:52:24 +08:00
afc163
70f3afeda0 Fix ButtonGroup style bug when have disabled button, close #9296 2018-02-08 15:51:53 +08:00
afc163
6577616be2 fix demo 2018-02-08 14:26:33 +08:00
afc163
875024cd1e update onRow usage 2018-02-08 14:25:49 +08:00
afc163
3ed3a078e1 Document for Table onRow, ref #355 2018-02-08 14:14:46 +08:00
Leo
f8e996ee8e fix type of column dataIndex (#9298) 2018-02-07 20:26:03 -06:00
David Tsai
a8f1c35dcb Update introduce.en-US.md (#9299)
Providing clarifying language in the following areas:

* Front-end Implementation
* Who's using Ant Design
* How to Contribute

Additionally, I'd like to follow up with a short visual guide for designers to learn how to contribute to the documentation here.
2018-02-08 10:21:22 +08:00
afc163
a5f29f06a5 Fix select arrow style in IE11 2018-02-07 20:29:40 +08:00
Wei Zhu
e992682aa8 Ignore invalid end date
Fix #9267
2018-02-07 14:23:17 +08:00
afc163
33e2ef0f8d revert 1502d36 to fix #9276
ref #7934
2018-02-07 11:43:21 +08:00
Andreas Cederström
f1bd8d0d11 proper class on avatar when image doesnt exist (#9278) 2018-02-07 10:43:27 +08:00
Ubaldo Quintana
7c062bb118 Update CHANGELOG.en-US.md (#9277)
Fix typos
2018-02-06 20:37:55 -06:00
afc163
59b18b4c26 Fix card loading with empty children, close #9258 2018-02-06 11:45:22 +08:00
Wei Zhu
ca6a8d13bd site: Update Table drag demo
Close #9255
2018-02-05 11:08:16 +08:00
Wei Zhu
c725cbe791 docs: fix release title 2018-02-05 00:02:17 +08:00
79 changed files with 2412 additions and 1725 deletions

View File

@@ -15,14 +15,50 @@ timeline: true
---
# 3.2.0
## 3.2.2
`2018-02-24`
- 🌟 Add font-family variable for `Pagination`. [#9351](https://github.com/ant-design/ant-design/issues/9351)
- 🌟 Add font-weight variable for `Badge`. [#9352](https://github.com/ant-design/ant-design/issues/9352)
- 🐞 Fix table custom spin indicator. [#9355](https://github.com/ant-design/ant-design/issues/9355)
- 🐞 Fix `Form.create`. [#9331](https://github.com/ant-design/ant-design/issues/9331)
- 🐞 Revert typescript definition of `column.dataIndex`. [#9393](https://github.com/ant-design/ant-design/issues/9393)
- 🐞 Fix last menu item in Sider could be blocked by collapse trigger. [#9398](https://github.com/ant-design/ant-design/issues/9398) [@MJ111](https://github.com/MJ111)
- 🐞 Fix badge works wrong in dot mode. [#9359](https://github.com/ant-design/ant-design/issues/9359) [@khayalan-mathew](https://github.com/khayalan-mathew)
## 3.2.1
`2018-02-11`
- 🌟 Add icons of some famous products. [c04377e5](https://github.com/ant-design/ant-design/commit/c04377e5413d344b37c34ceac6fee456933fa516)
- Mention
- 🌟 `multiLines` mode will support autosize.
- 🐞 Fix paste not working when `placeholder` is specified. [#9215](https://github.com/ant-design/ant-design/issues/9215)
- Table
- 🐞 Fix padding of middle size table. [#9319](https://github.com/ant-design/ant-design/issues/9319)
- 🐞 Fix border bug of small size table. [#8980](https://github.com/ant-design/ant-design/issues/8980)
- 🐞 Fix overflow issue of sort icon interactive area. [#8979](https://github.com/ant-design/ant-design/issues/8979)
- 🌟 Improve typescript definition of `column.dataIndex`. [#9298](https://github.com/ant-design/ant-design/pull/9298) [@clinyong](https://github.com/clinyong)
- Select
- 🐞 Fix wrong scroll position when navigating active item with keyboard. [#9276](https://github.com/ant-design/ant-design/issues/9276)
- 🐞 Fix arrow position in IE11.
- 🐞 Fix issue that file item showing `uploading` when Upload `beforeUpload` return false. [#8020](https://github.com/ant-design/ant-design/issues/8020)
- 🐞 Fix misplace of feedback icon of `vertical` layout Form. [#9153](https://github.com/ant-design/ant-design/issues/9153)
- 🐞 Fix loading style missing of empty childen Card. [#9258](https://github.com/ant-design/ant-design/issues/9258)
- 🐞 Fix background color of Avatar when image source is not existe. [#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
- 🐞 Fix RangePicker `Cannot read property 'locale' of undefined` error when select end date. [#9267](https://github.com/ant-design/ant-design/issues/9267)
- 🐞 Fix style problem when using disabled button with Tooltip inside ButtonGroup. [#9296](https://github.com/ant-design/ant-design/issues/9296) [#9296](https://github.com/ant-design/ant-design/issues/9296)
- 🐞 Fix z-index of Dropdown's submenu. [#9218](https://github.com/ant-design/ant-design/issues/9218)
## 3.2.0
`2018-02-04`
- 🌟 Add new `tabBarGutter` prop to Tab to allow setting gutter between tabs. [#8644](https://github.com/ant-design/ant-design/pull/8644) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
- 🌟 Add new `hasSider` prop to Layout to avoid render error when server rendering. [#8937](https://github.com/ant-design/ant-design/issues/8937)
- 🌟 Add new `successPercent` to Progess to alow showing two phases. [Demo](https://ant.design/components/progress/#components-progress-demo-segment)
- 🌟 Add new `iconType` prop to Alert to allow settting type of icon. [#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
- 🌟 Add new `successPercent` to Progress to allow showing two phases. [Demo](https://ant.design/components/progress/#components-progress-demo-segment)
- 🌟 Add new `iconType` prop to Alert to allow settting icon type. [#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
- 🌟 Add `id` prop to DatePicker. [#8598](https://github.com/ant-design/ant-design/pull/8598) [@mgrdevport](https://github.com/mgrdevport)
- 🌟 Add new `forceRender` prop to Collapse to allow rendering hide panel. [#9192](https://github.com/ant-design/ant-design/pull/9192) [#Pyroboomka](https://github.com/ant-design/ant-design/pull/9192) [@paulcmason](https://github.com/react-component/collapse/pull/82)
- RangePicker

View File

@@ -15,6 +15,42 @@ timeline: true
---
## 3.2.2
`2018-02-24`
- 🌟 添加 `Pagination` 字体变量。 [#9351](https://github.com/ant-design/ant-design/issues/9351)
- 🌟 添加 `Badge` 字重变量。 [#9352](https://github.com/ant-design/ant-design/issues/9352)
- 🐞 修复 `Table` 当自定义 `loading.indicator`不显示emptyText。 [#9355](https://github.com/ant-design/ant-design/issues/9355)
- 🐞 修复 `Form.create` 。 [#9331](https://github.com/ant-design/ant-design/issues/9331)
- 🐞 回滚 `Table``column.dataIndex` 的 TypeScript 定义。 [#9393](https://github.com/ant-design/ant-design/issues/9393)
- 🐞 修复 `Layout` 中 sider 高度不足时,最后一个菜单无法显示。 [#9398](https://github.com/ant-design/ant-design/issues/9398) [@MJ111](https://github.com/MJ111)
- 🐞 修复 `Badge` dot 模式问题。 [#9359](https://github.com/ant-design/ant-design/issues/9359) [@khayalan-mathew](https://github.com/khayalan-mathew)
## 3.2.1
`2018-02-11`
- 🌟 新增了部分著名产品的图标。[c04377e5](https://github.com/ant-design/ant-design/commit/c04377e5413d344b37c34ceac6fee456933fa516)
- Mention
- 🌟 现在 `multiLines` 模式的高度将默认自适应内容。
- 🐞 修复指定了 `placeholder` 时无法粘贴内容的问题。[#9215](https://github.com/ant-design/ant-design/issues/9215)
- Table
- 🐞 修复中号表格的 padding。[#9319](https://github.com/ant-design/ant-design/issues/9319)
- 🐞 修复小号表格的边框错位问题。[#8980](https://github.com/ant-design/ant-design/issues/8980)
- 🐞 修复排序图标点击区域溢出表头的问题。[#8979](https://github.com/ant-design/ant-design/issues/8979)
- 🌟 优化了 `column.dataIndex` 的 TypeScript 定义。[#9298](https://github.com/ant-design/ant-design/pull/9298) [@clinyong](https://github.com/clinyong)
- Select
- 🐞 修复使用键盘导航时,滚动条不会自动定位的问题。[#9276](https://github.com/ant-design/ant-design/issues/9276)
- 🐞 修复在 IE11 下的箭头位置。
- 🐞 修复 Upload `beforeUpload` 返回 `false` 时,上传文件仍然显示 `uploading` 以及文件列表被替换的问题。[#8020](https://github.com/ant-design/ant-design/issues/8020)
- 🐞 修复 `vertical` 布局的 Form 下反馈图标错位的问题。[#9153](https://github.com/ant-design/ant-design/issues/9153)
- 🐞 修复 Card 没有子节点时 `loading` 样式不生效的问题。[#9258](https://github.com/ant-design/ant-design/issues/9258)
- 🐞 修复 Avatar 的图片不存在时的背景色。[#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
- 🐞 修复 RangePicker 选择结束时间时报 `Cannot read property 'locale' of undefined` 的问题。[#9267](https://github.com/ant-design/ant-design/issues/9267)
- 🐞 修复 ButtonGroup 内使用了失效按钮和 Tooltip 时样式错位的问题。[#9296](https://github.com/ant-design/ant-design/issues/9296) [#9296](https://github.com/ant-design/ant-design/issues/9296)
- 🐞 修复 Dropdown 的子菜单被遮挡的问题。[#9218](https://github.com/ant-design/ant-design/issues/9218)
## 3.2.0
`2018-02-04`
@@ -355,7 +391,7 @@ timeline: true
```
- Select
- 🌟 默认和多选模式下 Option 的值允许使用 number。
- 🌟 新增 `maxTagCount 和 `maxTagPlaceholder`,用设置最多可显示的选中项。
- 🌟 新增 `maxTagCount 和 `maxTagPlaceholder`,用设置最多可显示的选中项。
- 🌟 新增 `showAction`,用于设置出发下拉框打开的事件。
- 🌟 新增 `onMouseEnter``onMouseLeave` 事件回调。
- LocaleProvider

View File

@@ -92,6 +92,7 @@ See [i18n](http://ant.design/docs/react/i18n).
```bash
$ git clone git@github.com:ant-design/ant-design.git
$ cd ant-design
$ npm install
$ npm start
```

View File

@@ -83,7 +83,7 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
const classString = classNames(prefixCls, className, sizeCls, {
[`${prefixCls}-${shape}`]: shape,
[`${prefixCls}-image`]: src,
[`${prefixCls}-image`]: src && this.state.isImgExist,
[`${prefixCls}-icon`]: icon,
});

View File

@@ -423,6 +423,13 @@ exports[`renders ./components/badge/demo/dot.md correctly 1`] = `
data-show="true"
/>
</span>
<span
class="ant-badge"
>
<i
class="anticon anticon-notification"
/>
</span>
<span
class="ant-badge"
>

View File

@@ -0,0 +1,14 @@
import React from 'react';
import { mount } from 'enzyme';
import Badge from '../index';
describe('Badge', () => {
test('badge dot not scaling count > 9', () => {
const badge = mount(<Badge count={10} dot />);
expect(badge.find('.ant-card-multiple-words').length).toBe(0);
});
test('badge dot not showing count == 0', () => {
const badge = mount(<Badge count={0} dot />);
expect(badge.find('.ant-badge-dot').length).toBe(0);
});
});

View File

@@ -12,6 +12,7 @@ title:
## en-US
This will simply display a red badge, without a specific count.
If count equals 0, it won't display the dot.
````jsx
import { Badge, Icon } from 'antd';
@@ -21,6 +22,9 @@ ReactDOM.render(
<Badge dot>
<Icon type="notification" />
</Badge>
<Badge count={0} dot>
<Icon type="notification" />
</Badge>
<Badge dot>
<a href="#">Link something</a>
</Badge>

View File

@@ -26,7 +26,7 @@ Badge normally appears in proximity to notifications or user avatars with eye-ca
| -------- | ----------- | ---- | ------- |
| count | Number to show in badge | number\|ReactNode | |
| dot | Whether to display a red dot instead of `count` | boolean | `false` |
| offset | set offset of the badge dot, like [x, y] | [number, number] | - |
| offset | set offset of the badge dot, like`[x, y]` | `[number, number]` | - |
| overflowCount | Max count to show | number | 99 |
| showZero | Whether to show badge when `count` is zero | boolean | `false` |
| status | Set Badge as a status dot | `success` \| `processing` \| `default` \| `error` \| `warning` | `''` |

View File

@@ -59,14 +59,13 @@ export default class Badge extends React.Component<BadgeProps, any> {
offset,
...restProps,
} = this.props;
const isDot = dot || status;
let displayCount = (count as number) > (overflowCount as number) ? `${overflowCount}+` : count;
const isZero = displayCount === '0' || displayCount === 0;
const isDot = (dot && !isZero) || status;
// dot mode don't need count
if (isDot) {
displayCount = '';
}
const isZero = displayCount === '0' || displayCount === 0;
const isEmpty = displayCount === null || displayCount === undefined || displayCount === '';
const hidden = (isEmpty || (isZero && !showZero)) && !isDot;
const statusCls = classNames({
@@ -76,7 +75,7 @@ export default class Badge extends React.Component<BadgeProps, any> {
const scrollNumberCls = classNames({
[`${prefixCls}-dot`]: isDot,
[`${prefixCls}-count`]: !isDot,
[`${prefixCls}-multiple-words`]: count && count.toString && count.toString().length > 1,
[`${prefixCls}-multiple-words`]: !isDot && count && count.toString && count.toString().length > 1,
[`${prefixCls}-status-${status}`]: !!status,
});
const badgeCls = classNames(className, prefixCls, {

View File

@@ -27,7 +27,7 @@ title: Badge
| --- | --- | --- | --- |
| count | 展示的数字,大于 overflowCount 时显示为 `${overflowCount}+`,为 0 时隐藏 | number\|ReactNode | |
| dot | 不展示数字,只有一个小红点 | boolean | false |
| offset | 设置状态点的位置偏移,格式为 [x, y] | [number, number] | - |
| offset | 设置状态点的位置偏移,格式为 `[x, y]` | `[number, number]` | - |
| overflowCount | 展示封顶的数字值 | number | 99 |
| showZero | 当数值为 0 时,是否展示 Badge | boolean | false |
| status | 设置 Badge 为状态点 | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |

View File

@@ -24,6 +24,7 @@
text-align: center;
padding: 0 6px;
font-size: @badge-font-size;
font-weight: @badge-font-weight;
white-space: nowrap;
transform-origin: -10% center;
box-shadow: 0 0 0 1px #fff;

View File

@@ -47,6 +47,8 @@ export interface ButtonProps {
onClick?: React.FormEventHandler<any>;
onMouseUp?: React.FormEventHandler<any>;
onMouseDown?: React.FormEventHandler<any>;
onKeyPress?: React.KeyboardEventHandler<any>;
onKeyDown?: React.KeyboardEventHandler<any>;
tabIndex?: number;
loading?: boolean | { delay?: number };
disabled?: boolean;

View File

@@ -36,7 +36,8 @@ To get a customized button, just set `type`/`shape`/`size`/`loading`/`disabled`.
margin-right: 8px;
margin-bottom: 12px;
}
[id^=components-button-demo-] .ant-btn-group > .ant-btn {
[id^=components-button-demo-] .ant-btn-group > .ant-btn,
[id^=components-button-demo-] .ant-btn-group > span > .ant-btn {
margin-right: 0;
}
</style>

View File

@@ -198,7 +198,7 @@
&:focus,
&:active,
&.active {
background: #fff;
background: @btn-default-bg;
}
}
@@ -241,6 +241,8 @@
.@{btnClassName} + .@{btnClassName},
.@{btnClassName} + &,
span + .@{btnClassName},
.@{btnClassName} + span,
& + .@{btnClassName},
& + & {
margin-left: -1px;
@@ -250,15 +252,19 @@
border-radius: 0;
}
> .@{btnClassName}:first-child {
> .@{btnClassName}:first-child,
> span:first-child > .@{btnClassName} {
margin-left: 0;
&:not(:last-child) {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
}
> .@{btnClassName}:last-child:not(:first-child) {
> .@{btnClassName}:first-child:not(:last-child),
> span:first-child:not(:last-child) > .@{btnClassName} {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
> .@{btnClassName}:last-child:not(:first-child),
> span:last-child:not(:first-child) > .@{btnClassName} {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}

View File

@@ -192,7 +192,7 @@ export default class Card extends React.Component<CardProps, {}> {
<div {...divProps} className={classString} ref={this.saveRef}>
{head}
{coverDom}
{children ? body : null}
{body}
{actionDom}
</div>
);

View File

@@ -15,6 +15,8 @@ export interface AbstractCheckboxProps {
onChange?: React.ChangeEventHandler<HTMLInputElement>;
onMouseEnter?: React.MouseEventHandler<any>;
onMouseLeave?: React.MouseEventHandler<any>;
onKeyPress?: React.KeyboardEventHandler<any>;
onKeyDown?: React.KeyboardEventHandler<any>;
value?: any;
tabIndex?: number;
name?: string;

View File

@@ -157,6 +157,9 @@ export default class RangePicker extends React.Component<any, RangePickerState>
}
handleCalendarInputSelect = (value: RangePickerValue) => {
if (!value[0]) {
return;
}
this.setState(({ showDate }) => ({
value,
showDate: getShowDateFromValue(value) || showDate,

View File

@@ -3,6 +3,7 @@ import { mount, render } from 'enzyme';
import moment from 'moment';
import DatePicker from '../';
import { setMockDate, resetMockDate } from '../../../tests/utils';
import { selectDate } from './utils';
import focusTest from '../../../tests/shared/focusTest';
const { RangePicker } = DatePicker;
@@ -202,4 +203,16 @@ describe('RangePicker', () => {
wrapper.find('.ant-calendar-range-quick-selector a').simulate('click');
expect(handleOk).toBeCalledWith(range);
});
// https://github.com/ant-design/ant-design/issues/9267
it('invali end date not throw error', () => {
const wrapper = mount(<RangePicker />);
wrapper.find('.ant-calendar-picker-input').simulate('click');
selectDate(wrapper, moment('2017-09-18'), 0);
selectDate(wrapper, moment('2017-10-18'), 1);
wrapper.find('.ant-calendar-picker-input').simulate('click');
expect(() =>
wrapper.find('.ant-calendar-input').at(1).simulate('change', { target: { value: '2016-01-01' } })
).not.toThrow();
});
});

View File

@@ -1,8 +1,8 @@
/* eslint-disable import/prefer-default-export */
export function selectDate(wrapper, date, index) {
let calendar = wrapper;
if (index) {
calendar = wrapper.find('.ant-calendar-range-part')[index];
if (index !== undefined) {
calendar = wrapper.find('.ant-calendar-range-part').at(index);
}
calendar.find({ title: date.format('LL'), role: 'gridcell' }).simulate('click');
}

View File

@@ -126,7 +126,6 @@
.@{calendar-prefix-cls}-footer {
position: relative;
height: auto;
line-height: auto;
&-btn {
text-align: right;

View File

@@ -54,6 +54,7 @@
&-submenu-popup {
position: absolute;
z-index: @zindex-dropdown;
}
&-item,

View File

@@ -117,10 +117,10 @@ export type Diff<T extends string, U extends string> =
({ [P in T]: P } & { [P in U]: never } & { [x: string]: never })[T];
export type Omit<T, K extends keyof T> = Pick<T, Diff<keyof T, K>>;
export interface ComponentDecorator<TOwnProps> {
export interface ComponentDecorator {
<P extends FormComponentProps>(
component: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<Omit<P, keyof FormComponentProps> & TOwnProps>;
): React.ComponentClass<Omit<P, keyof FormComponentProps>>;
}
export default class Form extends React.Component<FormProps, any> {
@@ -149,7 +149,7 @@ export default class Form extends React.Component<FormProps, any> {
static createFormField = createFormField;
static create = function<TOwnProps>(options: FormCreateOption<TOwnProps> = {}): ComponentDecorator<TOwnProps> {
static create = function<TOwnProps>(options: FormCreateOption<TOwnProps> = {}): ComponentDecorator {
return createDOMForm({
fieldNameProp: 'id',
...options,

View File

@@ -186,7 +186,8 @@ export default class FormItem extends React.Component<FormItemProps, any> {
}
return (
<div className={classes}>
{c1}{c2}{c3}
<span className={`${this.props.prefixCls}-item-children`}>{c1}</span>
{c2}{c3}
</div>
);
}

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
/* tslint:disable */
import * as React from 'react';
import Form, { FormComponentProps } from '../Form';
import Form, { FormComponentProps, FormCreateOption } from '../Form';
// test Form.create on component without own props
class WithoutOwnProps extends React.Component<any, any> {
@@ -34,3 +34,28 @@ class WithOwnProps extends React.Component<WithOwnPropsProps, any> {
const WithOwnPropsForm = Form.create()(WithOwnProps);
<WithOwnPropsForm name="foo" />;
// test Form.create with options
interface WithCreateOptionsProps extends FormComponentProps {
username: string;
}
class WithCreateOptions extends React.Component<WithCreateOptionsProps, {}> {
render() {
return <div>foo</div>;
}
}
const mapPropsToFields = (props: WithCreateOptionsProps) => {
const { username } = props;
return {
username: Form.createFormField({ value: username })
};
};
const formOptions: FormCreateOption<WithCreateOptionsProps> = { mapPropsToFields };
const WithCreateOptionsForm = Form.create(formOptions)(WithCreateOptions);
<WithCreateOptionsForm username="foo" />

View File

@@ -87,6 +87,10 @@ input[type="checkbox"] {
.clearfix;
}
&-children {
position: relative;
}
&-with-help {
margin-bottom: @form-item-margin-bottom - @font-size-base * @line-height-base - @form-help-margin-top;
transition: none;
@@ -233,8 +237,8 @@ form {
margin-left: 0;
}
.@{ant-prefix}-input-number {
margin-right: 8px;
.@{ant-prefix}-input-number + .@{form-prefix-cls}-text {
margin-left: 8px;
}
.@{ant-prefix}-select,
@@ -396,15 +400,16 @@ form {
.has-warning,
.has-error,
.is-validating {
&.has-feedback:after {
&.has-feedback .@{form-prefix-cls}-item-children:after {
position: absolute;
top: 0;
top: 50%;
right: 0;
visibility: visible;
pointer-events: none;
width: @form-component-height;
height: @form-component-max-height;
line-height: @form-component-max-height;
height: 20px;
line-height: 20px;
margin-top: -10px;
text-align: center;
font-size: @form-feedback-icon-size;
animation: zoomIn .3s @ease-out-back;
@@ -414,7 +419,7 @@ form {
}
.has-success {
&.has-feedback:after {
&.has-feedback .@{form-prefix-cls}-item-children:after {
animation-name: diffZoomIn1 !important;
content: '\e630';
color: @success-color;
@@ -424,7 +429,7 @@ form {
.has-warning {
.form-control-validation(@warning-color; @warning-color;);
&.has-feedback:after {
&.has-feedback .@{form-prefix-cls}-item-children:after {
content: '\e62c';
color: @warning-color;
animation-name: diffZoomIn3 !important;
@@ -471,7 +476,7 @@ form {
.has-error {
.form-control-validation(@error-color; @error-color;);
&.has-feedback:after {
&.has-feedback .@{form-prefix-cls}-item-children:after {
content: '\e62e';
color: @error-color;
animation-name: diffZoomIn2 !important;
@@ -541,7 +546,7 @@ form {
}
.is-validating {
&.has-feedback:after {
&.has-feedback .@{form-prefix-cls}-item-children:after {
display: inline-block;
animation: loadingCircle 1s infinite linear;
content: "\e64d";

View File

@@ -212,7 +212,7 @@ export default class Sider extends React.Component<SiderProps, SliderState> {
};
const siderCls = classNames(className, prefixCls, {
[`${prefixCls}-collapsed`]: !!this.state.collapsed,
[`${prefixCls}-has-trigger`]: !!trigger,
[`${prefixCls}-has-trigger`]: collapsible && trigger !== null && !zeroWidthTrigger,
[`${prefixCls}-below`]: !!this.state.below,
[`${prefixCls}-zero-width`]: siderWidth === 0 || siderWidth === '0' || siderWidth === '0px',
});

View File

@@ -688,7 +688,7 @@ exports[`renders ./components/layout/demo/side.md correctly 1`] = `
style="min-height:100vh"
>
<div
class="ant-layout-sider"
class="ant-layout-sider ant-layout-sider-has-trigger"
style="flex:0 0 200px;max-width:200px;min-width:200px;width:200px"
>
<div

View File

@@ -24,4 +24,14 @@ describe('Layout', () => {
);
expect(wrapper.find('.ant-layout').hasClass('ant-layout-has-sider')).toBe(true);
});
it('detect ant-layout-sider-has-trigger class in sider when ant-layout-sider-trigger div tag exists', async () => {
const wrapper = mount(
<Layout>
<div><Sider collapsible>Sider</Sider></div>
<Content>Content</Content>
</Layout>
);
expect(wrapper.find('.ant-layout-sider').hasClass('ant-layout-sider-has-trigger')).toBe(true);
});
});

View File

@@ -364,7 +364,7 @@ exports[`renders ./components/list/demo/infinite-virtualized-load.md correctly 1
class="ant-spin"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -389,7 +389,7 @@ exports[`renders ./components/list/demo/loadmore.md correctly 1`] = `
class="ant-spin ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />

View File

@@ -1506,7 +1506,7 @@ exports[`renders ./components/locale-provider/demo/all.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name

View File

@@ -6869,7 +6869,7 @@ exports[`Locale Provider should display the text as ar 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -11465,7 +11465,7 @@ exports[`Locale Provider should display the text as bg 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -16061,7 +16061,7 @@ exports[`Locale Provider should display the text as ca 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -20657,7 +20657,7 @@ exports[`Locale Provider should display the text as cs 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -25253,7 +25253,7 @@ exports[`Locale Provider should display the text as de 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -29849,7 +29849,7 @@ exports[`Locale Provider should display the text as el 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -34445,7 +34445,7 @@ exports[`Locale Provider should display the text as en 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -39041,7 +39041,7 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -43637,7 +43637,7 @@ exports[`Locale Provider should display the text as es 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -48233,7 +48233,7 @@ exports[`Locale Provider should display the text as et 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -52829,7 +52829,7 @@ exports[`Locale Provider should display the text as fa 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -57425,7 +57425,7 @@ exports[`Locale Provider should display the text as fi 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -62021,7 +62021,7 @@ exports[`Locale Provider should display the text as fr 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -66617,7 +66617,7 @@ exports[`Locale Provider should display the text as fr 2`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -71213,7 +71213,7 @@ exports[`Locale Provider should display the text as is 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -75809,7 +75809,7 @@ exports[`Locale Provider should display the text as it 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -80405,7 +80405,7 @@ exports[`Locale Provider should display the text as ja 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -85001,7 +85001,7 @@ exports[`Locale Provider should display the text as ko 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -89597,7 +89597,7 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -94193,7 +94193,7 @@ exports[`Locale Provider should display the text as nb 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -98789,7 +98789,7 @@ exports[`Locale Provider should display the text as nl 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -103385,7 +103385,7 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -107981,7 +107981,7 @@ exports[`Locale Provider should display the text as pl 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -112577,7 +112577,7 @@ exports[`Locale Provider should display the text as pt 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -117173,7 +117173,7 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -121769,7 +121769,7 @@ exports[`Locale Provider should display the text as ru 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -126365,7 +126365,7 @@ exports[`Locale Provider should display the text as sk 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -130961,7 +130961,7 @@ exports[`Locale Provider should display the text as sr 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -135557,7 +135557,7 @@ exports[`Locale Provider should display the text as sv 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -140153,7 +140153,7 @@ exports[`Locale Provider should display the text as th 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -144749,7 +144749,7 @@ exports[`Locale Provider should display the text as tr 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -149345,7 +149345,7 @@ exports[`Locale Provider should display the text as uk 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -153941,7 +153941,7 @@ exports[`Locale Provider should display the text as vi 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -158537,7 +158537,7 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -163133,7 +163133,7 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name

View File

@@ -13,6 +13,8 @@
.@{mention-prefix-cls}-editor {
.input;
min-height: @input-height-base;
height: auto; // To override height in .input mixin
line-height: @line-height-base;
padding: 0;
display: block;
@@ -29,6 +31,7 @@
}
.public-DraftEditorPlaceholder-root {
position: absolute;
pointer-events: none;
.public-DraftEditorPlaceholder-inner {
color: @input-placeholder-color;
opacity: 1;

View File

@@ -45,7 +45,7 @@
border: @border-width-base @border-style-base @border-color-base;
background-color: @component-background;
margin-right: 8px;
font-family: Arial;
font-family: @pagination-font-family;
outline: 0;
a {
@@ -134,7 +134,7 @@
&-next,
&-jump-prev,
&-jump-next {
font-family: Arial;
font-family: @pagination-font-family;
cursor: pointer;
color: @text-color;
border-radius: @border-radius-base;

View File

@@ -43,6 +43,7 @@ Select component to select value from options.
| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |
| placeholder | Placeholder of select | string\|ReactNode | - |
| showSearch | Whether show search input in single mode. | boolean | false |
| showArrow | Whether to show the drop-down arrow | boolean | true |
| size | Size of Select input. `default` `large` `small` | string | default |
| tokenSeparators | Separator used to tokenize on tag/multiple mode | string\[] | |
| value | Current selected option. | string\|number\|string\[]\|number\[] | - |

View File

@@ -38,8 +38,8 @@ export interface SelectProps extends AbstractSelectProps {
defaultValue?: SelectValue;
mode?: 'default' | 'multiple' | 'tags' | 'combobox';
optionLabelProp?: string;
onChange?: (value: SelectValue) => void;
onSelect?: (value: SelectValue, option: Object) => any;
onChange?: (value: SelectValue, option: React.ReactElement<any> | React.ReactElement<any>[]) => void;
onSelect?: (value: SelectValue, option: React.ReactElement<any>) => any;
onDeselect?: (value: SelectValue) => any;
onBlur?: () => any;
onFocus?: () => any;

View File

@@ -46,6 +46,7 @@ title: Select
| optionLabelProp | 回填到选择框的 Option 的属性值,默认是 Option 的子元素。比如在子元素需要高亮效果时,此值可以设为 `value`。 | string | `children` combobox 模式下为 `value` |
| placeholder | 选择框默认文字 | string | - |
| showSearch | 使单选模式可搜索 | boolean | false |
| showArrow | 是否显示下拉小箭头 | boolean | true |
| size | 选择框大小,可选 `large` `small` | string | default |
| tags | 可以把随意输入的条目作为 tag输入项不需要与下拉选项匹配2.9 之后废弃,请使用 `mode` | boolean | false |
| tokenSeparators | 在 tags 和 multiple 模式下自动分词的分隔符 | string\[] | |

View File

@@ -58,10 +58,10 @@
top: 50%;
right: @control-padding-horizontal - 1px;
line-height: 1;
transform: translateY(-50%);
margin-top: -@font-size-sm / 2;
transform-origin: 50% 50%;
color: @disabled-color;
font-size: 12px;
font-size: @font-size-sm;
* {
display: none;
@@ -69,7 +69,7 @@
&:before {
content: '\e61d';
transition: transform 0.2s ease;
transition: transform .3s;
}
}
@@ -376,11 +376,8 @@
}
&-open {
.@{select-prefix-cls}-arrow {
-ms-transform: rotate(180deg);
&:before {
transform: rotate(180deg);
}
.@{select-prefix-cls}-arrow:before {
transform: rotate(180deg);
}
.@{select-prefix-cls}-selection {
.active();
@@ -456,6 +453,7 @@
padding-left: 0; // Override default ul/ol
list-style: none;
max-height: 250px;
overflow: auto;
&-item-group-list {
margin: 0;

View File

@@ -5,7 +5,7 @@ exports[`renders ./components/spin/demo/basic.md correctly 1`] = `
class="ant-spin ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -20,7 +20,7 @@ exports[`renders ./components/spin/demo/custom-indicator.md correctly 1`] = `
class="ant-spin ant-spin-spinning"
>
<i
class="anticon anticon-spin anticon-loading"
class="anticon anticon-spin anticon-loading ant-spin-dot"
style="font-size:24px"
/>
</div>
@@ -75,7 +75,7 @@ exports[`renders ./components/spin/demo/inside.md correctly 1`] = `
class="ant-spin ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -133,7 +133,7 @@ exports[`renders ./components/spin/demo/size.md correctly 1`] = `
class="ant-spin ant-spin-sm ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -145,7 +145,7 @@ exports[`renders ./components/spin/demo/size.md correctly 1`] = `
class="ant-spin ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -157,7 +157,7 @@ exports[`renders ./components/spin/demo/size.md correctly 1`] = `
class="ant-spin ant-spin-lg ant-spin-spinning"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />
@@ -177,7 +177,7 @@ exports[`renders ./components/spin/demo/tip.md correctly 1`] = `
class="ant-spin ant-spin-spinning ant-spin-show-text"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />

View File

@@ -0,0 +1,11 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Spin should render custom indicator when it's set 1`] = `
<div
class="ant-spin ant-spin-spinning"
>
<div
class="custom-indicator ant-spin-dot"
/>
</div>
`;

View File

@@ -1,5 +1,5 @@
import React from 'react';
import { shallow } from 'enzyme';
import { shallow, render } from 'enzyme';
import Spin from '..';
describe('Spin', () => {
@@ -15,9 +15,9 @@ describe('Spin', () => {
it('should render custom indicator when it\'s set', () => {
const customIndicator = <div className="custom-indicator" />;
const wrapper = shallow(
const wrapper = render(
<Spin indicator={customIndicator} />
);
expect(wrapper.contains(customIndicator)).toEqual(true);
expect(wrapper).toMatchSnapshot();
});
});

View File

@@ -15,7 +15,7 @@ When part of the page is waiting for asynchronous data or during a rendering pro
| Property | Description | Type | Default Value |
| -------- | ----------- | ---- | ------------- |
| delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | - |
| indicator | React node of the spinning indicator | ReactNode | - |
| indicator | React node of the spinning indicator | ReactElement | - |
| size | size of Spin, options: `small`, `default` and `large` | string | `default` |
| spinning | whether Spin is spinning | boolean | true |
| tip | customize description content when Spin has children | string | - |

View File

@@ -5,6 +5,8 @@ import Animate from 'rc-animate';
import isCssAnimationSupported from '../_util/isCssAnimationSupported';
import omit from 'omit.js';
export type SpinIndicator = React.ReactElement<any>;
export interface SpinProps {
prefixCls?: string;
className?: string;
@@ -14,7 +16,7 @@ export interface SpinProps {
tip?: string;
delay?: number;
wrapperClassName?: string;
indicator?: React.ReactNode;
indicator?: SpinIndicator;
}
export interface SpinState {
@@ -96,8 +98,27 @@ export default class Spin extends React.Component<SpinProps, SpinState> {
}
}
}
renderIndicator() {
const { prefixCls, indicator } = this.props;
const dotClassName = `${prefixCls}-dot`;
if (React.isValidElement(indicator)) {
return React.cloneElement((indicator as SpinIndicator), {
className: classNames((indicator as SpinIndicator).props.className, dotClassName),
});
}
return (
<span className={classNames(dotClassName, `${prefixCls}-dot-spin`)}>
<i />
<i />
<i />
<i />
</span>
);
}
render() {
const { className, size, prefixCls, tip, wrapperClassName, indicator, ...restProps } = this.props;
const { className, size, prefixCls, tip, wrapperClassName, ...restProps } = this.props;
const { spinning, notCssAnimationSupported } = this.state;
const spinClassName = classNames(prefixCls, {
@@ -111,20 +132,12 @@ export default class Spin extends React.Component<SpinProps, SpinState> {
const divProps = omit(restProps, [
'spinning',
'delay',
'indicator',
]);
const spinIndicator = indicator ? indicator : (
<span className={`${prefixCls}-dot`}>
<i />
<i />
<i />
<i />
</span>
);
const spinElement = (
<div {...divProps} className={spinClassName} >
{spinIndicator}
{this.renderIndicator()}
{tip ? <div className={`${prefixCls}-text`}>{tip}</div> : null}
</div>
);

View File

@@ -16,7 +16,7 @@ subtitle: 加载中
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
| indicator | 加载指示符 | ReactNode | - |
| indicator | 加载指示符 | ReactElement | - |
| size | 组件大小,可选值为 `small` `default` `large` | string | 'default' |
| spinning | 是否旋转 | boolean | true |
| tip | 当作为包裹元素时,可以自定义描述文案 | string | - |

View File

@@ -115,8 +115,7 @@
position: relative;
display: inline-block;
.square(@spin-dot-size);
transform: rotate(45deg);
animation: antRotate 1.2s infinite linear;
i {
width: 9px;
height: 9px;
@@ -148,6 +147,11 @@
animation-delay: 1.2s;
}
}
&-spin {
transform: rotate(45deg);
animation: antRotate 1.2s infinite linear;
}
}
// Sizes

View File

@@ -328,3 +328,13 @@
.@{iconfont-css-prefix}-alipay:before { content: "\e9b3"; }
.@{iconfont-css-prefix}-ant-design:before { content: "\e9b2"; }
.@{iconfont-css-prefix}-aliyun:before { content: "\e9f4"; }
.@{iconfont-css-prefix}-zhihu:before { content: "\e703"; }
.@{iconfont-css-prefix}-file-markdown:before { content: "\e704"; }
.@{iconfont-css-prefix}-slack:before { content: "\e705"; }
.@{iconfont-css-prefix}-slack-square:before { content: "\e706"; }
.@{iconfont-css-prefix}-behance:before { content: "\e707"; }
.@{iconfont-css-prefix}-behance-square:before { content: "\e708"; }
.@{iconfont-css-prefix}-dribbble:before { content: "\e709"; }
.@{iconfont-css-prefix}-dribbble-square:before { content: "\e70a"; }
.@{iconfont-css-prefix}-instagram:before { content: "\e70b"; }
.@{iconfont-css-prefix}-yuque:before { content: "\e70c"; }

View File

@@ -67,7 +67,7 @@
// ICONFONT
@iconfont-css-prefix : anticon;
@icon-url : "https://at.alicdn.com/t/font_148784_dky7e838xq4obt9";
@icon-url : "https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i";
// LINK
@link-color : @primary-color;
@@ -362,6 +362,7 @@
@badge-height: 20px;
@badge-dot-size: 6px;
@badge-font-size: @font-size-sm;
@badge-font-weight: normal;
@badge-status-size: 6px;
// Rate
@@ -426,6 +427,7 @@
// ---
@pagination-item-size: 32px;
@pagination-item-size-sm: 24px;
@pagination-font-family: Arial;
// Breadcrumb
// ---

View File

@@ -16,10 +16,11 @@ title: Switch
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| allowClear | 支持清除, 单选模式有效 | boolean | false |
| autoFocus | 组件自动获取焦点 | boolean | false |
| checked | 指定当前是否选中 | boolean | false |
| checkedChildren | 选中时的内容 | string\|ReactNode | |
| defaultChecked | 初始是否选中 | boolean | false |
| disabled | 是否禁用 | boolean | false |
| loading | 加载中的开关 | boolean | false |
| size | 开关大小,可选值:`default` `small` | string | default |
| unCheckedChildren | 非选中时的内容 | string\|ReactNode | |

View File

@@ -56,7 +56,7 @@
font-family: anticon;
animation: loadingCircle 1s infinite linear;
text-align: center;
background: transprent;
background: transparent;
z-index: 1;
display: none;
font-size: 12px;

View File

@@ -17,6 +17,7 @@ import Column from './Column';
import ColumnGroup from './ColumnGroup';
import createBodyRow from './createBodyRow';
import { flatArray, treeMap, flatFilter, normalizeColumns } from './util';
import { SpinProps } from '../spin';
import {
TableProps,
TableState,
@@ -749,6 +750,11 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
{filterDropdown}
</span>
);
if (sortButton || filterDropdown) {
column.className = classNames(`${prefixCls}-column-has-filters`, column.className);
}
return column;
});
}
@@ -910,9 +916,9 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
}
}
renderTable = (contextLocale: TableLocale) => {
renderTable = (contextLocale: TableLocale, loading: SpinProps) => {
const locale = { ...contextLocale, ...this.props.locale };
const { style, loading, className, prefixCls, showHeader, ...restProps } = this.props;
const { style, className, prefixCls, showHeader, ...restProps } = this.props;
const data = this.getCurrentPageData();
const expandIconAsCell = this.props.expandedRowRender && this.props.expandIconAsCell !== false;
@@ -948,7 +954,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
className={classString}
expandIconColumnIndex={expandIconColumnIndex}
expandIconAsCell={expandIconAsCell}
emptyText={!loading && locale.emptyText}
emptyText={!loading.spinning && locale.emptyText}
/>
);
}
@@ -957,12 +963,19 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
const { style, className, prefixCls } = this.props;
const data = this.getCurrentPageData();
let loading = this.props.loading as SpinProps;
if (typeof loading === 'boolean') {
loading = {
spinning: loading,
};
}
const table = (
<LocaleReceiver
componentName="Table"
defaultLocale={defaultLocale.Table}
>
{this.renderTable}
{(locale) => this.renderTable(locale, loading)}
</LocaleReceiver>
);
@@ -971,13 +984,6 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
const paginationPatchClass = (this.hasPagination() && data && data.length !== 0)
? `${prefixCls}-with-pagination` : `${prefixCls}-without-pagination`;
let loading = this.props.loading;
if (typeof loading === 'boolean') {
loading = {
spinning: loading,
};
}
return (
<div
className={classNames(`${prefixCls}-wrapper`, className)}
@@ -985,7 +991,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
>
<Spin
{...loading}
className={loading ? `${paginationPatchClass} ${prefixCls}-spin-holder` : ''}
className={loading.spinning ? `${paginationPatchClass} ${prefixCls}-spin-holder` : ''}
>
{table}
{this.renderPagination()}

View File

@@ -67,6 +67,7 @@ describe('Table', () => {
};
const wrapper = mount(<Table loading={loading} />);
expect(wrapper.find('.ant-spin')).toHaveLength(0);
expect(wrapper.find('.ant-table-placeholder').text()).not.toEqual('');
loading.spinning = true;
wrapper.setProps({ loading });

View File

@@ -46,7 +46,7 @@ exports[`Table.filter renders filter correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -65,7 +65,7 @@ exports[`Table.filter renders filter correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -78,7 +78,7 @@ exports[`Table.filter renders filter correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -91,7 +91,7 @@ exports[`Table.filter renders filter correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -104,7 +104,7 @@ exports[`Table.filter renders filter correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"

View File

@@ -6,7 +6,7 @@ exports[`Table.sorter renders sorter icon correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name

View File

@@ -36,7 +36,7 @@ exports[`renders ./components/table/demo/ajax.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -63,7 +63,7 @@ exports[`renders ./components/table/demo/ajax.md correctly 1`] = `
</span>
</th>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Gender
@@ -879,7 +879,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -898,7 +898,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
</span>
</th>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Address
@@ -917,7 +917,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -931,7 +931,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
New York No. 1 Lake Park
</td>
@@ -940,7 +940,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -954,7 +954,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
42
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 1 Lake Park
</td>
@@ -963,7 +963,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -977,7 +977,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
Sidney No. 1 Lake Park
</td>
@@ -986,7 +986,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -1000,7 +1000,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 2 Lake Park
</td>
@@ -1253,12 +1253,16 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
class="ant-switch"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
class="ant-switch"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1283,12 +1287,16 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
class="ant-switch"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
class="ant-switch"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1313,13 +1321,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1344,13 +1356,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1375,13 +1391,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1406,13 +1426,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1437,13 +1461,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1468,13 +1496,17 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
checked=""
class="ant-switch ant-switch-checked"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1499,12 +1531,16 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
class="ant-form-item-control"
>
<span
class="ant-switch"
tabindex="0"
class="ant-form-item-children"
>
<span
class="ant-switch-inner"
/>
class="ant-switch"
tabindex="0"
>
<span
class="ant-switch-inner"
/>
</span>
</span>
</div>
</div>
@@ -1528,68 +1564,72 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
<div
class="ant-form-item-control"
>
<div
class="ant-radio-group ant-radio-group-default"
<span
class="ant-form-item-children"
>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
<div
class="ant-radio-group ant-radio-group-default"
>
<span
class="ant-radio-button ant-radio-button-checked"
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
value="default"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Default
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
class="ant-radio-button ant-radio-button-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
value="default"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Default
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<input
class="ant-radio-button-input"
type="radio"
value="middle"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Middle
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="middle"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Middle
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<input
class="ant-radio-button-input"
type="radio"
value="small"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Small
</span>
</label>
</div>
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="small"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Small
</span>
</label>
</div>
</span>
</div>
</div>
</div>
@@ -6983,7 +7023,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
rowspan="4"
>
<span>
@@ -7021,7 +7061,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
</tr>
<tr>
<th
class=""
class="ant-table-column-has-filters"
rowspan="3"
>
<span>
@@ -7147,7 +7187,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7156,7 +7196,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
1
</td>
@@ -7195,7 +7235,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7204,7 +7244,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
2
</td>
@@ -7243,7 +7283,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7252,7 +7292,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
3
</td>
@@ -7291,7 +7331,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7300,7 +7340,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
4
</td>
@@ -7339,7 +7379,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7348,7 +7388,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
5
</td>
@@ -7387,7 +7427,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7396,7 +7436,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
6
</td>
@@ -7435,7 +7475,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7444,7 +7484,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
7
</td>
@@ -7483,7 +7523,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7492,7 +7532,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
8
</td>
@@ -7531,7 +7571,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7540,7 +7580,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
9
</td>
@@ -7579,7 +7619,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7588,7 +7628,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
10
</td>
@@ -7646,7 +7686,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
rowspan="4"
>
<span>
@@ -7684,7 +7724,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7697,7 +7737,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7710,7 +7750,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7723,7 +7763,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7736,7 +7776,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7749,7 +7789,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7762,7 +7802,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7775,7 +7815,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7788,7 +7828,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -7801,7 +7841,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -8086,7 +8126,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -8117,7 +8157,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
</span>
</th>
<th
class="ant-table-column-sort"
class="ant-table-column-has-filters ant-table-column-sort"
>
<span>
Age
@@ -8144,7 +8184,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
</span>
</th>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Address
@@ -8183,7 +8223,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -8192,12 +8232,12 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
Jim Green
</td>
<td
class="ant-table-column-sort"
class="ant-table-column-has-filters ant-table-column-sort"
>
42
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 1 Lake Park
</td>
@@ -8206,7 +8246,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -8215,12 +8255,12 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
John Brown
</td>
<td
class="ant-table-column-sort"
class="ant-table-column-has-filters ant-table-column-sort"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
New York No. 1 Lake Park
</td>
@@ -8229,7 +8269,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -8238,12 +8278,12 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
Joe Black
</td>
<td
class="ant-table-column-sort"
class="ant-table-column-has-filters ant-table-column-sort"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
Sidney No. 1 Lake Park
</td>
@@ -8252,7 +8292,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -8261,12 +8301,12 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
Jim Red
</td>
<td
class="ant-table-column-sort"
class="ant-table-column-has-filters ant-table-column-sort"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 2 Lake Park
</td>
@@ -8974,7 +9014,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
>
<tr>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Name
@@ -9005,7 +9045,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
</span>
</th>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Age
@@ -9032,7 +9072,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
</span>
</th>
<th
class=""
class="ant-table-column-has-filters"
>
<span>
Address
@@ -9071,7 +9111,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -9080,12 +9120,12 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
John Brown
</td>
<td
class=""
class="ant-table-column-has-filters"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
New York No. 1 Lake Park
</td>
@@ -9094,7 +9134,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -9103,12 +9143,12 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
Jim Green
</td>
<td
class=""
class="ant-table-column-has-filters"
>
42
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 1 Lake Park
</td>
@@ -9117,7 +9157,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -9126,12 +9166,12 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
Joe Black
</td>
<td
class=""
class="ant-table-column-has-filters"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
Sidney No. 1 Lake Park
</td>
@@ -9140,7 +9180,7 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
class="ant-table-row ant-table-row-level-0"
>
<td
class=""
class="ant-table-column-has-filters"
>
<span
class="ant-table-row-indent indent-level-0"
@@ -9149,12 +9189,12 @@ exports[`renders ./components/table/demo/reset-filter.md correctly 1`] = `
Jim Red
</td>
<td
class=""
class="ant-table-column-has-filters"
>
32
</td>
<td
class=""
class="ant-table-column-has-filters"
>
London No. 2 Lake Park
</td>

View File

@@ -465,7 +465,7 @@ exports[`Table renders empty table without emptyText when loading 1`] = `
class="ant-spin ant-spin-spinning ant-table-without-pagination ant-table-spin-holder"
>
<span
class="ant-spin-dot"
class="ant-spin-dot ant-spin-dot-spin"
>
<i />
<i />

View File

@@ -48,7 +48,7 @@ let BodyRow = (props) => {
initialClientOffset,
...restProps
} = props;
const style = { cursor: 'move' };
const style = { ...restProps.style, cursor: 'move' };
let className = restProps.className;
if (isOver && initialClientOffset) {

View File

@@ -79,6 +79,27 @@ const columns = [{
| onHeaderRow | Set props on per header row | Function(column, index) | - |
| onRow | Set props on per row | Function(record, index) | - |
#### onRow usage
Same as `onRow` `onHeaderRow` `onCell` `onHeaderCell`
```jsx
<Table
onRow={(record) => {
return {
onClick: () => {}, // click row
onMouseEnter: () => {}, // mouse enter row
onXxxx...
};
)}
onHeaderRow={(column) => {
return {
onClick: () => {}, // click header row
};
)}
/>
```
### Column
One of the Table `columns` prop for describing the table's columns, Column has the same API.

View File

@@ -80,6 +80,28 @@ const columns = [{
| onHeaderRow | 设置头部行属性 | Function(column, index) | - |
| onRow | 设置行属性 | Function(record, index) | - |
#### onRow 用法
适用于 `onRow` `onHeaderRow` `onCell` `onHeaderCell`
```jsx
<Table
onRow={(record) => {
return {
onClick: () => {}, // 点击行
onMouseEnter: () => {}, // 鼠标移入行
onXxxx...
};
)}
onHeaderRow={(column) => {
return {
onClick: () => {}, // 点击表头行
};
)}
/>
```
### Column
列描述数据对象,是 columns 中的一项Column 使用相同的 API。

View File

@@ -10,7 +10,6 @@
.@{table-prefix-cls} {
.reset-component;
overflow: hidden;
position: relative;
border-radius: @border-radius-base @border-radius-base 0 0;
@@ -24,7 +23,6 @@
border-spacing: 0;
text-align: left;
border-radius: @border-radius-base @border-radius-base 0 0;
overflow: hidden;
}
&-thead > tr > th {
@@ -64,6 +62,11 @@
.@{table-prefix-cls}-filter-selected.@{iconfont-css-prefix}-filter {
color: @primary-color;
}
// https://github.com/ant-design/ant-design/issues/8979
&.@{table-prefix-cls}-column-has-filters {
overflow: hidden;
}
}
&-tbody > tr > td {
@@ -223,8 +226,9 @@
width: 14px;
height: 6px;
cursor: pointer;
position: relative;
&:hover .@{iconfont-css-prefix} {
color: @text-color;
color: @primary-4;
}
&.on {
.@{iconfont-css-prefix}-caret-up,
@@ -243,11 +247,11 @@
}
&-up:after {
top: -30px;
bottom: -2px;
}
&-down:after {
bottom: -30px;
top: 2px;
}
.@{iconfont-css-prefix}-caret-up,

View File

@@ -1,7 +1,7 @@
.@{table-prefix-cls}-middle {
> .@{table-prefix-cls}-title,
> .@{table-prefix-cls}-footer {
padding: @table-padding-vertical*2/3 @table-padding-horizontal/2;
padding: @table-padding-vertical*3/4 @table-padding-horizontal/2;
}
> .@{table-prefix-cls}-content {
> .@{table-prefix-cls}-header > table,
@@ -14,7 +14,7 @@
> .@{table-prefix-cls}-fixed-right > .@{table-prefix-cls}-body-outer > .@{table-prefix-cls}-body-inner > table {
> .@{table-prefix-cls}-thead > tr > th,
> .@{table-prefix-cls}-tbody > tr > td {
padding: @table-padding-vertical*2/3 @table-padding-horizontal/2;
padding: @table-padding-vertical*3/4 @table-padding-horizontal/2;
}
}
}
@@ -83,6 +83,10 @@
border-right: @border-width-base @border-style-base @border-color-split;
}
.@{table-prefix-cls}-content {
border-right: @border-width-base @border-style-base @border-color-split;
}
.@{table-prefix-cls}-footer {
border: 0;
border-top: @border-width-base @border-style-base @border-color-split;
@@ -96,5 +100,10 @@
border-left: 0;
border-bottom: 0;
}
.@{table-prefix-cls}-thead > tr > th:last-child,
.@{table-prefix-cls}-tbody > tr > td:last-child {
border-right: none;
}
}
}

View File

@@ -30,7 +30,7 @@ Ant Design has 3 types of Tabs for different situations.
| tabBarStyle | Tab bar style object | object | - |
| tabPosition | Position of tabs | `top` \| `right` \| `bottom` \| `left` | `top` |
| type | Basic style of tabs | `line` \| `card` \| `editable-card` | `line` |
| onChange | Callback executed when active tab is changed | Function | - |
| onChange | Callback executed when active tab is changed | Function(activeKey) {} | - |
| onEdit | Callback executed when tab is added or removed. Only works while `type="editable-card"` | (targetKey, action): void | - |
| onNextClick | Callback executed when next button is clicked | Function | - |
| onPrevClick | Callback executed when prev button is clicked | Function | - |

View File

@@ -33,7 +33,7 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。
| tabBarStyle | tab bar 的样式对象 | object | - |
| tabPosition | 页签位置,可选值有 `top` `right` `bottom` `left` | string | 'top' |
| type | 页签的基本样式,可选 `line``card` `editable-card` 类型 | string | 'line' |
| onChange | 切换面板的回调 | Function | 无 |
| onChange | 切换面板的回调 | Function(activeKey) {} | 无 |
| onEdit | 新增和删除页签的回调,在 `type="editable-card"` 时有效 | (targetKey, action): void | 无 |
| onNextClick | next 按钮被点击的回调 | Function | 无 |
| onPrevClick | prev 按钮被点击的回调 | Function | 无 |

View File

@@ -1,6 +1,7 @@
import * as React from 'react';
import RcUpload from 'rc-upload';
import classNames from 'classnames';
import uniqBy from 'lodash.uniqby';
import LocaleReceiver from '../locale-provider/LocaleReceiver';
import defaultLocale from '../locale-provider/default';
import Dragger from './Dragger';
@@ -153,8 +154,8 @@ export default class Upload extends React.Component<UploadProps, UploadState> {
this.handleRemove(file);
}
onChange = (info: UploadChangeParam, updateState = true) => {
if (!('fileList' in this.props) && updateState) {
onChange = (info: UploadChangeParam) => {
if (!('fileList' in this.props)) {
this.setState({ fileList: info.fileList });
}
@@ -186,8 +187,8 @@ export default class Upload extends React.Component<UploadProps, UploadState> {
if (result === false) {
this.onChange({
file,
fileList,
}, false);
fileList: uniqBy(fileList.concat(this.state.fileList), (item: any) => item.uid),
});
return false;
} else if (result && (result as PromiseLike<any>).then) {
return result;

View File

@@ -72,12 +72,10 @@ export default class UploadList extends React.Component<UploadListProps, any> {
let icon = <Icon type={file.status === 'uploading' ? 'loading' : 'paper-clip'} />;
if (listType === 'picture' || listType === 'picture-card') {
if (file.status === 'uploading' || (!file.thumbUrl && !file.url)) {
if (listType === 'picture-card') {
icon = <div className={`${prefixCls}-list-item-uploading-text`}>{locale.uploading}</div>;
} else {
icon = <Icon className={`${prefixCls}-list-item-thumbnail`} type="picture" />;
}
if (listType === 'picture-card' && file.status === 'uploading') {
icon = <div className={`${prefixCls}-list-item-uploading-text`}>{locale.uploading}</div>;
} else if (!file.thumbUrl && !file.url) {
icon = <Icon className={`${prefixCls}-list-item-thumbnail`} type="picture" />;
} else {
icon = (
<a

View File

@@ -118,7 +118,7 @@ describe('Upload List', () => {
});
});
it('does not change filelist when beforeUpload returns false', () => {
it('does concat filelist when beforeUpload returns false', () => {
const handleChange = jest.fn();
const wrapper = mount(
<Upload
@@ -139,8 +139,8 @@ describe('Upload List', () => {
},
});
expect(wrapper.state().fileList).toBe(fileList);
expect(handleChange.mock.calls[0][0].fileList).toHaveLength(1);
expect(wrapper.state().fileList.length).toBe(fileList.length + 1);
expect(handleChange.mock.calls[0][0].fileList).toHaveLength(3);
});
// https://github.com/ant-design/ant-design/issues/7762

View File

@@ -353,9 +353,17 @@
}
.@{upload-item}-name {
margin: 8px 0 0;
padding: 0;
text-align: center;
line-height: @line-height-base;
display: none;
}
.anticon-picture + .@{upload-item}-name {
display: block;
}
.@{upload-item}-uploading {
&.@{upload-item} {
background-color: @background-color-light;

View File

@@ -41,7 +41,6 @@ Following the Ant Design specification, we developed a React UI library `antd` t
## Version
- Stable: [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- Next [![npm (next)](https://img.shields.io/npm/v/antd/next.svg?style=flat-square)](https://www.npmjs.org/package/antd)
You can subscribe to this feed for new version notifications: https://github.com/ant-design/ant-design/releases.atom

View File

@@ -41,7 +41,6 @@ title: Ant Design of React
## 版本
- 稳定版:[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- 预览版:[![npm (next)](https://img.shields.io/npm/v/antd/next.svg?style=flat-square)](https://www.npmjs.org/package/antd)
你可以订阅https://github.com/ant-design/ant-design/releases.atom 来获得稳定版发布的通知。

View File

@@ -207,4 +207,4 @@ There are a lot of great boilerplates like create-react-app in the React communi
- [comerc/cra-ts-antd](https://github.com/comerc/cra-ts-antd)
- [react-boilerplate/react-boilerplate](https://github.com/ant-design/react-boilerplate)
- [kriasoft/react-starter-kit](https://github.com/ant-design/react-starter-kit)
- [next.js](https://github.com/zeit/next.js/tree/v3-beta/examples/with-ant-design)
- [next.js](https://github.com/zeit/next.js/tree/master/examples/with-ant-design)

View File

@@ -207,4 +207,4 @@ React 生态圈中还有很多优秀的脚手架,使用它们并引入 antd
- [kriasoft/react-starter-kit](https://github.com/ant-design/react-starter-kit)
- [create-react-app-antd](https://github.com/ant-design/create-react-app-antd)
- [cra-ts-antd](https://github.com/comerc/cra-ts-antd)
- [next.js](https://github.com/zeit/next.js/tree/v3-beta/examples/with-ant-design)
- [next.js](https://github.com/zeit/next.js/tree/master/examples/with-ant-design)

View File

@@ -63,7 +63,7 @@ Ant Design 受到 5 音阶以及自然律的启发定义了 10 个不同尺寸
## 字重
字重的选择同样基于秩序、稳定、克制的原则。多数情况下,只出现 regular 以及 medium 的两种字体重量,分别对应代码中的 400 和 500。在英文字体加粗的情况下会采用 semibold 的字体重量对应代码中的600。
字重的选择同样基于秩序、稳定、克制的原则。多数情况下,只出现 regular 以及 medium 的两种字体重量,分别对应代码中的 400 和 500。在英文字体加粗的情况下会采用 semibold 的字体重量,对应代码中的 600。
<div class="font-samples">
<div>
@@ -85,7 +85,7 @@ Ant Design 受到 5 音阶以及自然律的启发定义了 10 个不同尺寸
## 字体颜色
文本颜色如果和背景颜色太接近就会难以阅读。考虑到无障碍设计的需求,我们参考了 WCAG的标准将正文文本、标题和背景色之间保持在了 7:1 以上的 AAA 级对比度。
文本颜色如果和背景颜色太接近就会难以阅读。考虑到无障碍设计的需求,我们参考了 WCAG 的标准,将正文文本、标题和背景色之间保持在了 7:1 以上的 AAA 级对比度。
<div>
<img src="https://gw.alipayobjects.com/zos/rmsportal/jPbEabWakVQHosHxhQPR.png" />
@@ -96,5 +96,5 @@ Ant Design 受到 5 音阶以及自然律的启发定义了 10 个不同尺寸
字体系统的构建,是『动态秩序之美』的第一步。在实际的设计中,我们还有三点建议:
1. **建立体系化的设计思路:**在同一个系统的 UI 设计中先建立体系化的设计思路,对主、次、辅助、标题、展示等类别的字体做统一的规划,再落地到具体场景中进行微调。建立体系化的设计思路有助于强化横向字体落地的一致性,提高字体应用的性价比,减少不必要的样式浪费。
1. **少即是多:**在视觉展现上能够用尽量少的样式去实现设计目的。避免毫无意义的使用大量字阶、颜色、重强调视觉重点或对比关系。
1. **少即是多:**在视觉展现上能够用尽量少的样式去实现设计目的。避免毫无意义的使用大量字阶、颜色、重强调视觉重点或对比关系。
1. **尝试让字体像音符一样跳跃:**在需要拉开差距的时候可以尝试在字阶表中跳跃的选择字体大小,会令字阶之间产生一种微妙的韵律感。

View File

@@ -24,7 +24,7 @@ We supply a series of design principles, practical patterns and high quality des
## Front-end Implementation
[React](http://facebook.github.io/react/) is used to encapsulate a library of Ant Design components. Any other version of frameworks to implement is also welcome.
[React](http://facebook.github.io/react/) is used to encapsulate a library of components which embody our design language. We welcome the community to implement [our design system](https://ant.design/docs/spec/introduce) in other front-end frameworks of their choice.
- [Ant Design of React](/docs/react/introduce) (official implementation)
- <div class="outside-link"><a href="http://ng.ant.design" target="_blank">NG-ZORRO - Ant Design of Angular</a></div>
@@ -44,8 +44,8 @@ We supply a series of design principles, practical patterns and high quality des
- [Didi](http://www.xiaojukeji.com/)
- [Eleme](https://www.ele.me/)
> If your company or products use Ant Design, welcome to click [here](https://github.com/ant-design/ant-design/issues/477) to leave a message.
> If your company or products use Ant Design, and you'd like to be added to this growing list, click [here](https://github.com/ant-design/ant-design/issues/477) to leave us a message.
## How to Contribute
Welcome to contribute to Ant Design on Github. If you have any suggestions for improvement, questions,or concerns, do not hesitate to advice us [here](https://github.com/ant-design/ant-design/issues).
Contributions to Ant Design on Github are welcomed! Whether you have questions, concerns, or suggestions for improving Ant Design - please don't hesitate to reach out to us [here](https://github.com/ant-design/ant-design/issues).

View File

@@ -1,6 +1,6 @@
{
"name": "antd",
"version": "3.2.0",
"version": "3.2.2",
"title": "Ant Design",
"description": "An enterprise-class UI design language and React-based implementation",
"homepage": "http://ant.design/",
@@ -47,6 +47,7 @@
"dom-closest": "^0.2.0",
"enquire.js": "^2.1.1",
"lodash.debounce": "^4.0.8",
"lodash.uniqby": "^4.7.0",
"moment": "^2.19.3",
"omit.js": "^1.0.0",
"prop-types": "^15.5.7",
@@ -83,7 +84,7 @@
"warning": "~3.0.0"
},
"devDependencies": {
"@babel/types": "7.0.0-beta.36",
"@babel/types": "7.0.0-beta.40",
"@types/react": "^16.0.0",
"@types/react-dom": "^16.0.0",
"ansi-styles": "^3.2.0",

View File

@@ -55,6 +55,7 @@ module.exports = {
'app.footer.design-platform': 'Ant Financial Design Platform',
'app.footer.antux': 'Sitemap Template',
'app.footer.community': 'Community',
'app.footer.help': 'Help',
'app.footer.change-log': 'Change Log',
'app.footer.faq': 'FAQ',
'app.footer.feedback': 'Feedback',
@@ -72,6 +73,14 @@ module.exports = {
'app.footer.commitment': 'Our Commitment to Customer Protection',
'app.footer.company': 'Ant Financial',
'app.footer.ant-design': 'UI Design Language',
'app.footer.yuque': 'YuQue',
'app.footer.yuque.slogan': 'Write your document as a team',
'app.footer.fengdie': 'FengDie',
'app.footer.fengdie.slogan': 'Mobile web app builder',
'app.footer.zhihu': 'Zhihu',
'app.footer.zhihu.xtech': 'Experience Cloud Blog',
'app.footer.seeconf': 'Seeking Experience & Engineering Conference',
'app.footer.xcloud': 'Ant Experience Cloud',
'app.publish.title': 'antd@3.0.0 has been released! 🎉 🎉 🎉',
'app.publish.greeting': 'Hello, ',
'app.publish.intro': ' has been released, and please upgrade. ',

View File

@@ -63,7 +63,7 @@
.text-wrapper {
width: 54%;
max-width: 560px;
max-width: 420px;
min-width: 420px;
min-height: 336px;
color: #0d1a26;
> * {

View File

@@ -13,14 +13,14 @@ export default class IconSet extends React.Component {
logo: [
'android', 'android-o', 'apple', 'apple-o', 'windows', 'windows-o', 'ie', 'chrome', 'github', 'aliwangwang', 'aliwangwang-o', 'dingding', 'dingding-o',
'weibo-square', 'weibo-circle', 'taobao-circle', 'html5', 'weibo', 'twitter', 'wechat', 'youtube', 'alipay-circle', 'taobao', 'skype', 'qq', 'medium-workmark', 'gitlab', 'medium', 'linkedin', 'google-plus',
'dropbox', 'facebook', 'codepen', 'amazon', 'google', 'codepen-circle', 'alipay', 'ant-design', 'aliyun',
'dropbox', 'facebook', 'codepen', 'amazon', 'google', 'codepen-circle', 'alipay', 'ant-design', 'aliyun', 'zhihu', 'slack', 'slack-square', 'behance', 'behance-square', 'dribbble', 'dribbble-square', 'instagram', 'yuque',
],
other: ['lock', 'unlock', 'area-chart', 'pie-chart', 'bar-chart', 'dot-chart', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'code-o', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'edit', 'ellipsis', 'file', 'file-text', 'file-unknown', 'file-pdf', 'file-word', 'file-excel', 'file-jpg', 'file-ppt', 'file-add', 'folder', 'folder-open', 'folder-add', 'hdd', 'frown', 'frown-o', 'meh', 'meh-o', 'smile', 'smile-o', 'inbox', 'laptop', 'appstore-o', 'appstore', 'line-chart', 'link', 'mail', 'mobile', 'notification', 'paper-clip', 'picture', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'tablet', 'tag', 'tag-o', 'tags', 'tags-o', 'to-top', 'upload', 'user', 'video-camera', 'home', 'loading', 'loading-3-quarters', 'cloud-upload-o', 'cloud-download-o', 'cloud-upload', 'cloud-o', 'star-o', 'star', 'heart-o', 'heart', 'environment', 'environment-o', 'eye', 'eye-o', 'camera', 'camera-o', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customer-service', 'qrcode', 'scan', 'like', 'like-o', 'dislike', 'dislike-o', 'message', 'pay-circle', 'pay-circle-o', 'calculator', 'pushpin', 'pushpin-o', 'bulb', 'select', 'switcher', 'rocket', 'bell', 'disconnect', 'database', 'compass', 'barcode', 'hourglass', 'key', 'flag', 'layout', 'printer', 'sound', 'usb', 'skin', 'tool', 'sync', 'wifi', 'car', 'schedule', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'man', 'woman', 'shop', 'gift', 'idcard', 'medicine-box', 'red-envelope', 'coffee', 'copyright', 'trademark', 'safety', 'wallet', 'bank', 'trophy', 'contacts', 'global', 'shake', 'api', 'fork', 'dashboard', 'form', 'table', 'profile'],
other: ['lock', 'unlock', 'area-chart', 'pie-chart', 'bar-chart', 'dot-chart', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'code-o', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'edit', 'ellipsis', 'file', 'file-text', 'file-unknown', 'file-pdf', 'file-word', 'file-excel', 'file-jpg', 'file-ppt', 'file-markdown', 'file-add', 'folder', 'folder-open', 'folder-add', 'hdd', 'frown', 'frown-o', 'meh', 'meh-o', 'smile', 'smile-o', 'inbox', 'laptop', 'appstore-o', 'appstore', 'line-chart', 'link', 'mail', 'mobile', 'notification', 'paper-clip', 'picture', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'tablet', 'tag', 'tag-o', 'tags', 'tags-o', 'to-top', 'upload', 'user', 'video-camera', 'home', 'loading', 'loading-3-quarters', 'cloud-upload-o', 'cloud-download-o', 'cloud-upload', 'cloud-o', 'star-o', 'star', 'heart-o', 'heart', 'environment', 'environment-o', 'eye', 'eye-o', 'camera', 'camera-o', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customer-service', 'qrcode', 'scan', 'like', 'like-o', 'dislike', 'dislike-o', 'message', 'pay-circle', 'pay-circle-o', 'calculator', 'pushpin', 'pushpin-o', 'bulb', 'select', 'switcher', 'rocket', 'bell', 'disconnect', 'database', 'compass', 'barcode', 'hourglass', 'key', 'flag', 'layout', 'printer', 'sound', 'usb', 'skin', 'tool', 'sync', 'wifi', 'car', 'schedule', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'man', 'woman', 'shop', 'gift', 'idcard', 'medicine-box', 'red-envelope', 'coffee', 'copyright', 'trademark', 'safety', 'wallet', 'bank', 'trophy', 'contacts', 'global', 'shake', 'api', 'fork', 'dashboard', 'form', 'table', 'profile'],
};
// Show badges
newIcons = [
'aliyun',
'zhihu', 'file-markdown', 'slack', 'slack-square', 'behance', 'behance-square', 'dribbble', 'dribbble-square', 'instagram', 'yuque',
];
render() {

View File

@@ -89,12 +89,7 @@ class Footer extends React.Component {
<Row>
<Col md={6} sm={24} xs={24}>
<div className="footer-center">
<h2>Ant Design</h2>
<div>
<a target="_blank " href="https://github.com/ant-design/ant-design">
GitHub
</a>
</div>
<h2><FormattedMessage id="app.footer.resources" /></h2>
<div>
<a href="http://pro.ant.design">Ant Design Pro</a>
</div>
@@ -111,39 +106,6 @@ class Footer extends React.Component {
<FormattedMessage id="app.footer.awesome" />
</a>
</div>
<div>
<a target="_blank " href="http://ant-design.gitee.io/">
<FormattedMessage id="app.footer.chinamirror" />
</a>
</div>
<div style={{ marginTop: 16 }}>
<ColorPicker
type="sketch"
small
color={this.state.color}
position="top"
presetColors={[
'#F5222D',
'#FA541C',
'#FA8C16',
'#FAAD14',
'#FADB14',
'#A0D911',
'#52C41A',
'#13C2C2',
'#1890FF',
'#2F54EB',
'#722ED1',
'#EB2F96',
]}
onChangeComplete={this.handleColorChange}
/>
</div>
</div>
</Col>
<Col md={6} sm={24} xs={24}>
<div className="footer-center">
<h2><FormattedMessage id="app.footer.resources" /></h2>
<div>
<a href="http://scaffold.ant.design">Scaffolds</a>
<span> - </span>
@@ -152,10 +114,6 @@ class Footer extends React.Component {
<div>
<a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva">dva</a> - <FormattedMessage id="app.footer.dva" />
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva-cli">dva-cli</a> -
<FormattedMessage id="app.footer.dev-tools" />
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://motion.ant.design">Ant Motion</a>
<span> - </span>
@@ -171,11 +129,53 @@ class Footer extends React.Component {
<span> - </span>
<FormattedMessage id="app.footer.antux" />
</div>
<div>
<a target="_blank " href="http://ant-design.gitee.io/">
<FormattedMessage id="app.footer.chinamirror" />
</a>
</div>
</div>
</Col>
<Col md={6} sm={24} xs={24}>
<div className="footer-center">
<h2><FormattedMessage id="app.footer.community" /></h2>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://zhuanlan.zhihu.com/antdesign">
<FormattedMessage id="app.footer.zhihu" />
</a>
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://medium.com/ant-design/">
Medium
</a>
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://twitter.com/antdesignui">
Twitter
</a>
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://zhuanlan.zhihu.com/xtech">
<FormattedMessage id="app.footer.zhihu.xtech" />
</a>
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://seeconf.alipay.com/">
SEE Conf
</a>
<span> - </span>
<FormattedMessage id="app.footer.seeconf" />
</div>
</div>
</Col>
<Col md={6} sm={24} xs={24}>
<div className="footer-center">
<h2><FormattedMessage id="app.footer.help" /></h2>
<div>
<a target="_blank " href="https://github.com/ant-design/ant-design">
GitHub
</a>
</div>
<div>
<a href="/changelog">
<FormattedMessage id="app.footer.change-log" />
@@ -224,6 +224,20 @@ class Footer extends React.Component {
<img className="title-icon" src="https://gw.alipayobjects.com/zos/rmsportal/nBVXkrFdWHxbZlmMbsaH.svg" alt="" />
<FormattedMessage id="app.footer.more-product" />
</h2>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://yuque.com/">
<FormattedMessage id="app.footer.yuque" />
</a>
<span> - </span>
<FormattedMessage id="app.footer.yuque.slogan" />
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://yunfengdie.com/">
<FormattedMessage id="app.footer.fengdie" />
</a>
<span> - </span>
<FormattedMessage id="app.footer.fengdie.slogan" />
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://antv.alipay.com/">AntV</a>
<span> - </span>
@@ -234,6 +248,34 @@ class Footer extends React.Component {
<span> - </span>
<FormattedMessage id="app.footer.eggjs" />
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="http://xcloud.alipay.com/">
<FormattedMessage id="app.footer.xcloud" />
</a>
</div>
<div style={{ marginTop: 20 }}>
<ColorPicker
type="sketch"
small
color={this.state.color}
position="top"
presetColors={[
'#F5222D',
'#FA541C',
'#FA8C16',
'#FAAD14',
'#FADB14',
'#A0D911',
'#52C41A',
'#13C2C2',
'#1890FF',
'#2F54EB',
'#722ED1',
'#EB2F96',
]}
onChangeComplete={this.handleColorChange}
/>
</div>
</div>
</Col>
</Row>

View File

@@ -47,7 +47,7 @@ module.exports = {
'app.footer.scaffolds': '脚手架市场',
'app.footer.dev-tools': '开发工具',
'app.footer.dva': '应用框架',
'app.footer.resources': '资源链接',
'app.footer.resources': '相关资源',
'app.footer.data-vis': '数据可视化',
'app.footer.eggjs': '企业级 Node 开发框架',
'app.footer.motion': '设计动效',
@@ -55,6 +55,7 @@ module.exports = {
'app.footer.design-platform': '蚂蚁金服设计平台',
'app.footer.antux': '页面逻辑素材',
'app.footer.community': '社区',
'app.footer.help': '帮助',
'app.footer.change-log': '更新记录',
'app.footer.faq': '常见问题',
'app.footer.feedback': '反馈和建议',
@@ -72,6 +73,14 @@ module.exports = {
'app.footer.commitment': '权益保障承诺书',
'app.footer.company': '蚂蚁金融服务集团',
'app.footer.ant-design': '蚂蚁 UI 体系',
'app.footer.yuque': '语雀',
'app.footer.yuque.slogan': '企业文档管理平台',
'app.footer.fengdie': '云凤蝶',
'app.footer.fengdie.slogan': '移动建站平台',
'app.footer.zhihu': '知乎专栏',
'app.footer.zhihu.xtech': '体验科技专栏',
'app.footer.seeconf': '蚂蚁体验科技大会',
'app.footer.xcloud': '蚂蚁体验云',
'app.publish.title': 'antd@3.0.0 发布!🎉 🎉 🎉',
'app.publish.greeting': '你好,',
'app.publish.intro': ' 已正式发布,欢迎升级。',

View File

@@ -95,3 +95,5 @@ declare module "*.json" {
declare module "prop-types"
declare module "lodash.debounce"
declare module "lodash.uniqby"