mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-18 22:36:31 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

Merge branch 'master' into antd-3.0

Browse Source
This commit is contained in:
afc163 2017-09-12 09:41:51 +08:00
commit b24483545c
28 changed files with 188 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
CHANGELOG.en-US.md
View File

@ -17,6 +17,23 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
---
## 2.13.1
`2017-09-10`
- 🐞 Fix Card.Grid broken style. [commit/c7d6ce](https://github.com/ant-design/ant-design/commit/c7d6ce5d3f7bfae1f2252d702fb1bdf04fdc80cb)
- 🐞 Fix Cascader overlaping text. [#7475](https://github.com/ant-design/ant-design/issues/7475)
- 🐞 Fix simple mode Pagination prev and next button missing. [#7500](https://github.com/ant-design/ant-design/issues/7500)
- 🐞 Fix Slider typings. [#7532](https://github.com/ant-design/ant-design/issues/7532)
- Table
- 🐞 Fix empty data scroll style. [#7457](https://github.com/ant-design/ant-design/issues/7457) [#7468](https://github.com/ant-design/ant-design/issues/7468) [#7470](https://github.com/ant-design/ant-design/issues/7470) [#7509](https://github.com/ant-design/ant-design/issues/7509)
- 🌟 Make supplement for API docs. [#7525](https://github.com/ant-design/ant-design/pull/7525) [@hansnow](https://github.com/hansnow)
- 🐞 Fix Upload typings. [#7507](https://github.com/ant-design/ant-design/pull/7507) [@WingGao](https://github.com/WingGao)
- 🐞 Fix inlineCollapsed Menu when Submenu is opened. [#7514](https://github.com/ant-design/ant-design/issues/7514)
- 🐞 Fix validateStatus styles of some Form Controls. [#7498](https://github.com/ant-design/ant-design/issues/7498)
- 🐞 Fix @link-hover-decoration not working. [#7531](https://github.com/ant-design/ant-design/issues/7531)
- 🌟 Optimize the English documentation of some components. [@khalibloo](https://github.com/khalibloo)
## 2.13.0
`2017-09-01`
@ -30,6 +47,7 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
- 🌟 Menu can not be selected defaultly now.
- 🌟 Add a third parameter `originalElement` to Pagination's `itemRender`.
- 🌟 Add `backfill` prop to AutoComplete, items are selected by keyborad will be backfilled to the search input. [#5764](https://github.com/ant-design/ant-design/issues/5764)
- 🌟 Add `firstActiveValue` prop to Select to allow specify active item when open select first time. [#6318](https://github.com/ant-design/ant-design/issues/6318) [@L-x-C](https://github.com/ant-design/ant-design/issues/6318)
- LocaleProvider
- 🌟 Add Persian. [#6878](https://github.com/ant-design/ant-design/pull/6878) [@mkermani144](https://github.com/mkermani144)
- 🌟 Add Greek. [#6928](https://github.com/ant-design/ant-design/pull/6928) [@michmach](https://github.com/michmach)

18
CHANGELOG.zh-CN.md
View File

@ -17,6 +17,23 @@ timeline: true
---
## 2.13.1
`2017-09-10`
- 🐞 修复了 Card.Grid 的样式问题。[commit/c7d6ce](https://github.com/ant-design/ant-design/commit/c7d6ce5d3f7bfae1f2252d702fb1bdf04fdc80cb)
- 🐞 修复了 Cascader 指针图标与文字重叠的问题。[#7475](https://github.com/ant-design/ant-design/issues/7475)
- 🐞 修复了 Pagination 在简洁模式下前后按钮未展示的问题。[#7500](https://github.com/ant-design/ant-design/issues/7500)
- 🐞 修复了 Slider 的 type 定义。[#7532](https://github.com/ant-design/ant-design/issues/7532)
- Table
- 🐞 修复了在空数据情况下包含固定列时的一些样式问题。[#7457](https://github.com/ant-design/ant-design/issues/7457) [#7468](https://github.com/ant-design/ant-design/issues/7468) [#7470](https://github.com/ant-design/ant-design/issues/7470) [#7509](https://github.com/ant-design/ant-design/issues/7509)
- 🌟 补充了 API 文档。[#7525](https://github.com/ant-design/ant-design/pull/7525) [@hansnow](https://github.com/hansnow)
- 🐞 修复了 Upload 的 type 定义。 [#7507](https://github.com/ant-design/ant-design/pull/7507) [@WingGao](https://github.com/WingGao)
- 🐞 修复了 Submenu 展开时 inlineCollapsed Menu 的样式问题。[#7514](https://github.com/ant-design/ant-design/issues/7514)
- 🐞 修复了一些表单控件的校验样式问题。[#7498](https://github.com/ant-design/ant-design/issues/7498)
- 🐞 修复了 @link-hover-decoration 无效的问题。[#7531](https://github.com/ant-design/ant-design/issues/7531)
- 🌟 优化了部分组件的英文文档。[@khalibloo](https://github.com/khalibloo)
## 2.13.0
`2017-09-01`
@ -30,6 +47,7 @@ timeline: true
- 🌟 Menu 默认调整为不能选中。
- 🌟 Pagination 的 `itemRender` 新增第三个参数 `originalElement`。
- 🌟 AutoComplete 新增 `backfill` 属性，键盘选择时能回填选中项到输入框中。[#5764](https://github.com/ant-design/ant-design/issues/5764)
- 🌟 Select 新增 `firstActiveValue` 属性，允许指定首次打开时默认选中的项。[#6318](https://github.com/ant-design/ant-design/issues/6318) [@L-x-C](https://github.com/ant-design/ant-design/issues/6318)
- LocaleProvider
- 🌟 新增波斯语。[#6878](https://github.com/ant-design/ant-design/pull/6878) [@mkermani144](https://github.com/mkermani144)
- 🌟 新增希腊语。[#6928](https://github.com/ant-design/ant-design/pull/6928) [@michmach](https://github.com/michmach)

8
components/alert/index.en-US.md
View File

@ -8,18 +8,18 @@ Alert component for feedback.
## When To Use
- When you need to show alert messages for users.
- When you need to show alert messages to users.
- When you need a persistent static container which is closable by user actions.
## API
| Property | Description | Type | Default |
|----------- |--------------------------------------------------------- | ---------- |-------|
| type | Type of Alert styles, options:`success`, `info`, `warning`, `error` | string | `info`, in `banner` mode it's `warning` |
| type | Type of Alert styles, options: `success`, `info`, `warning`, `error` | string | `info`, in `banner` mode default is `warning` |
| closable | Whether Alert can be closed | boolean | - |
| closeText | Close text to show | string\|ReactNode | - |
| message | Content of Alert | string\|ReactNode | - |
| description | Additional content of Alert | string\|ReactNode | - |
| onClose | Callback when close Alert | Function | - |
| showIcon | Whether to show icon | boolean | false, in `banner` mode it's true |
| onClose | Callback when Alert is closed | Function | - |
| showIcon | Whether to show icon | boolean | false, in `banner` mode default is true |
| banner | Whether to show as banner | boolean | false |

57
components/button/__tests__/__snapshots__/demo.test.js.snap
View File

@ -480,12 +480,13 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
class="ant-radio-group"
>
<label
class="ant-radio-button-wrapper"
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
>
<span
class="ant-radio-button"
class="ant-radio-button ant-radio-button-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
/>
@ -498,13 +499,12 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
</span>
</label>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button ant-radio-button-checked"
class="ant-radio-button"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
/>
@ -538,7 +538,40 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
<br />
<br />
<button
class="ant-btn ant-btn-primary ant-btn-circle ant-btn-icon-only"
class="ant-btn ant-btn-primary ant-btn-lg"
type="button"
>
<span>
Primary
</span>
</button>
<button
class="ant-btn ant-btn-lg"
type="button"
>
<span>
Normal
</span>
</button>
<button
class="ant-btn ant-btn-dashed ant-btn-lg"
type="button"
>
<span>
Dashed
</span>
</button>
<button
class="ant-btn ant-btn-danger ant-btn-lg"
type="button"
>
<span>
Danger
</span>
</button>
<br />
<button
class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg ant-btn-icon-only"
type="button"
>
<i
@ -546,7 +579,7 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
/>
</button>
<button
class="ant-btn ant-btn-primary"
class="ant-btn ant-btn-primary ant-btn-lg"
type="button"
>
<i
@ -556,17 +589,9 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
Download
</span>
</button>
<button
class="ant-btn ant-btn-primary"
type="button"
>
<span>
Normal
</span>
</button>
<br />
<div
class="ant-btn-group"
class="ant-btn-group ant-btn-group-lg"
>
<button
class="ant-btn ant-btn-primary"

8
components/button/demo/size.md
View File

@ -22,7 +22,7 @@ import { Button, Radio, Icon } from 'antd';
class ButtonSize extends React.Component {
state = {
size: 'default',
size: 'large',
};
handleSizeChange = (e) => {
@ -39,9 +39,13 @@ class ButtonSize extends React.Component {
<Radio.Button value="small">Small</Radio.Button>
</Radio.Group>
<br /><br />
<Button type="primary" size={size}>Primary</Button>
<Button size={size}>Normal</Button>
<Button type="dashed" size={size}>Dashed</Button>
<Button type="danger" size={size}>Danger</Button>
<br />
<Button type="primary" shape="circle" icon="download" size={size} />
<Button type="primary" icon="download" size={size}>Download</Button>
<Button type="primary" size={size}>Normal</Button>
<br />
<Button.Group size={size}>
<Button type="primary">

1
components/cascader/style/index.less
View File

@ -178,6 +178,7 @@
}
&-expand {
position: relative;
padding-right: 24px;
&:after {
.iconfont-font("\e61f");
.iconfont-size-under-12px(8px);

2
components/form/Form.tsx
View File

@ -71,6 +71,8 @@ export type GetFieldDecoratorOptions = {
rules?: ValidationRule[];
/** 是否和其他控件互斥，特别用于 Radio 单选控件 */
exclusive?: boolean;
/** Normalize value to form component */
normalize?: (value: any, prevValue: any, allValues: any) => any;
};
// function create

2
components/index.tsx
View File

@ -1,3 +1,4 @@
/* @remove-on-es-build-begin */
// this file is not used if use https://github.com/ant-design/babel-plugin-import
const ENV = process.env.NODE_ENV;
if (ENV !== 'production' &&
@ -10,6 +11,7 @@ if (ENV !== 'production' &&
'please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.',
);
}
/* @remove-on-es-build-end */
export { default as Affix } from './affix';

11
components/menu/index.tsx
View File

@ -99,20 +99,21 @@ export default class Menu extends React.Component<MenuProps, any> {
nextProps.mode !== 'inline') {
this.switchModeFromInline = true;
}
if ('openKeys' in nextProps) {
this.setState({ openKeys: nextProps.openKeys });
return;
}
if ((nextProps.inlineCollapsed && !this.props.inlineCollapsed) ||
(nextContext.siderCollapsed && !this.context.siderCollapsed)) {
this.switchModeFromInline = !!this.state.openKeys.length;
this.inlineOpenKeys = this.state.openKeys;
this.handleOpenChange([]);
this.setState({ openKeys: [] });
}
if ((!nextProps.inlineCollapsed && this.props.inlineCollapsed) ||
(!nextContext.siderCollapsed && this.context.siderCollapsed)) {
this.handleOpenChange(this.inlineOpenKeys);
this.setState({ openKeys: this.inlineOpenKeys });
this.inlineOpenKeys = [];
}
if ('openKeys' in nextProps) {
this.setState({ openKeys: nextProps.openKeys });
}
}
handleClick = (e) => {
this.handleOpenChange([]);

14
components/message/index.en-US.md
View File

@ -5,11 +5,11 @@ noinstant: true
title: Message
---
Display global messages as feedbacks to user operations.
Display global messages as feedback in response to user operations.
## When To Use
- To provide feedbacks such as success, warning, error etc.
- To provide feedback such as success, warning, error etc.
- A message is displayed at top and center and will be dismissed automatically, as a non-interrupting light-weighted prompt.
## API
@ -26,8 +26,8 @@ This components provides some static methods, with usage and arguments as follow
| Argument | Description | Type | Default |
|------------|------------------------------------|--------------------------|--------------|
| content | content of the message | string\|ReactNode | - |
| duration | time before auto-dismiss,in seconds | number | 1.5 |
| onClose | Specify a function that will be called after the message closed| Function | - |
| duration | time before auto-dismiss, in seconds | number | 1.5 |
| onClose | Specify a function that will be called when the message is closed| Function | - |
Methods for global configuration and destruction are also provided:
@ -45,6 +45,6 @@ message.config({
| Argument | Description | Type | Default |
|------------|------------------------------------|--------------------------|-------------|
| top | distance to top | number | 24px |
| duration | time before auto-dismiss,in seconds | number | 1.5 |
| getContainer | specify render container | () => HTMLElement | () => document.body |
| top | distance from top | number | 24px |
| duration | time before auto-dismiss, in seconds | number | 1.5 |
| getContainer | Return the mount node for Message | () => HTMLElement | () => document.body |

60
components/modal/index.en-US.md
View File

@ -8,9 +8,9 @@ Modal dialogs.
## When To Use
When requiring users to interact with application, but without jumping to a new page to interrupt
the user's workflow, you can use `Modal` to create a new floating layer over the current page for user
getting feedback or information purposes.
When requiring users to interact with the application, but without jumping to a new page and interrupting
the user's workflow, you can use `Modal` to create a new floating layer over the current page to get user
feedback or display information.
Additionally, if you need show a simple confirmation dialog, you can use `antd.Modal.confirm()`,
and so on.
@ -18,28 +18,28 @@ and so on.
| Property | Description | Type | Default |
|------------|----------------|------------------|--------------|
| visible | Determine whether a modal dialog is visible or not | boolean | no |
| confirmLoading | Determine whether to apply loading visual effect for OK button or not | boolean | no |
| title | The modal dialog's title | string\|ReactNode | no |
| closable | Determine whether a close (x) button is visible on top right of the modal dialog or not | boolean | true |
| onOk | Specify a function that will be called when a user clicked OK button | function(e) | no |
| onCancel | Specify a function that will be called when a user clicked mask, close button on top right or cancel button | function(e) | no |
| width | Width of a modal dialog | string\|number | 520 |
| footer | Footer content, set as `footer={null}` when you don't need default buttons | string\|ReactNode | OK and cancel button |
| okText | Text of the OK button | string | OK |
| okType | type of the confirmation button | string | primary |
| cancelText | Text of the Cancel button | string | Cancel |
| maskClosable | Determine whether to close the modal dialog when clicked mask of it. | boolean | true |
| visible | Whether the modal dialog is visible or not | boolean | false |
| confirmLoading | Whether to apply loading visual effect for OK button or not | boolean | false |
| title | The modal dialog's title | string\|ReactNode | - |
| closable | Whether a close (x) button is visible on top right of the modal dialog or not | boolean | true |
| onOk | Specify a function that will be called when a user clicks the OK button | function(e) | - |
| onCancel | Specify a function that will be called when a user clicks mask, close button on top right or Cancel button | function(e) | - |
| width | Width of the modal dialog | string\|number | 520 |
| footer | Footer content, set as `footer={null}` when you don't need default buttons | string\|ReactNode | OK and Cancel buttons |
| okText | Text of the OK button | string | `OK` |
| okType | Button `type` of the OK button | string | `primary` |
| cancelText | Text of the Cancel button | string | `Cancel` |
| maskClosable | Whether to close the modal dialog when the mask (area outside the modal) is clicked | boolean | true |
| style | Style of floating layer, typically used at least for adjusting the position. | object | - |
| wrapClassName | The class name of the container of the modal dialog | string | - |
| afterClose | Specify a function that will be called when modal is closed completely. | function | - |
| getContainer | Return the mount node for Modal | (instance): HTMLElement | () => document.body |
| zIndex | To set the `z-index` of Modal | Number | 1000 |
| zIndex | The `z-index` of the Modal | Number | 1000 |
#### Destroy on close
> The state of Modal will be preserved at it's component lifecircle.
> If you wish to open it with brand new state everytime, you need to reset state manually.
> The state of Modal will be preserved at it's component lifecycle.
> If you wish to open it with a brand new state everytime, you need to reset state manually.
### Modal.method()
@ -56,19 +56,19 @@ The properties of the object are follows:
| Property | Description | Type | Default |
|------------|----------------|------------------|---------------|
| title | Title | string\|ReactNode | no |
| content | Content | string\|ReactNode | no |
| onOk | Specify a function that will be called when a user clicked OK button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | no |
| onCancel | Specify a function that will be called when a user clicked Cancel button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | no |
| width | Width of dialog | string\|number | 416 |
| iconType | Type of Icon component | string | question-circle |
| okText | Text of OK button | string | OK |
| okType | type of the confirmation button | string | primary |
| cancelText | Text of cancel button | string | Cancel |
| maskClosable | Determine whether to close the modal dialog when clicked mask of it. | Boolean | `false` |
| zIndex | To set the `z-index` of Modal | Number | 1000 |
| title | Title | string\|ReactNode | - |
| content | Content | string\|ReactNode | - |
| onOk | Specify a function that will be called when the user clicks the OK button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | - |
| onCancel | Specify a function that will be called when the user clicks the Cancel button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | - |
| width | Width of the modal dialog | string\|number | 416 |
| iconType | Icon `type` of the Icon component | string | `question-circle` |
| okText | Text of the OK button | string | `OK` |
| okType | Button `type` of the OK button | string | `primary` |
| cancelText | Text of the Cancel button | string | `Cancel` |
| maskClosable | Whether to close the modal dialog when the mask (area outside the modal) is clicked | Boolean | `false` |
| zIndex | The `z-index` of the Modal | Number | 1000 |
All the `Modal.method`s will return a reference, and then we can close the popup by the reference.
All the `Modal.method`s will return a reference, and then we can close the modal dialog by the reference.
```jsx
const ref = Modal.info();

27
components/notification/index.en-US.md
View File

@ -5,10 +5,10 @@ noinstant: true
title: Notification
---
To display a notification message globally.
Display a notification message globally.
## When To Use
To display a notification message at the four corner of the view port. Typically it can be
To display a notification message at any of the four corners of the viewport. Typically it can be
used in the following cases:
- A notification with complex content.
@ -35,14 +35,13 @@ The properties of config are as follows:
| className | Customized CSS class | string | - |
| style | Customized inline style | Object | - |
| btn | Customized close button | ReactNode | - |
| icon | Customized icon | ReactNode | _ |
| key | The unique identifier of current notification | string | - |
| onClose | Specify a function that will be called after clicking the default close button | Function | - |
| duration | A notification box is closed after 4.5s by default. When specifying `duration` to null or 0, it will never be closed automatically | number | 4.5 |
| placement | To set the position, which can be one of `topLeft` `topRight` `bottomLeft` `bottomRight` | string | topRight |
| icon | Customized icon | ReactNode | - |
| key | The unique identifier of the Notification | string | - |
| onClose | Specify a function that will be called when the close button is clicked | Function | - |
| duration | Time in seconds before Notification is closed. When set to 0 or null, it will never be closed automatically | number | 4.5 |
| placement | Position of Notification, can be one of `topLeft` `topRight` `bottomLeft` `bottomRight` | string | `topRight` |
`notification` also provide a global `config()` method that can be used for specifying the default options. Once this method is used, all the notification boxes
will take into account these globally defined options before displaying.
`notification` also provides a global `config()` method that can be used for specifying the default options. Once this method is used, all the notification boxes will take into account these globally defined options when displaying.
- `notification.config(options)`
```js
@ -55,8 +54,8 @@ notification.config({
| Property | Description | Type | Default |
| ------------ | ---------------------------------------- | -------------- | ------------------- |
| placement | To set the position, which can be one of `topLeft` `topRight` `bottomLeft` `bottomRight` | string | topRight |
| top | Offset to top, when message pop up from `topRight` or `topLeft` (unit: pixels). | number | 24 |
| bottom | Offset to bottom, when message pop up from `bottomRight` or `bottomLeft` (unit: pixels). | number | 24 |
| duration | A duration to close notification automatically by default (unit: second) | number | 4.5 |
| getContainer | specify render container | () => HTMLNode | () => document.body |
| placement | Position of Notification, can be one of `topLeft` `topRight` `bottomLeft` `bottomRight` | string | `topRight` |
| top | Distance from the top of the viewport, when `placement` is `topRight` or `topLeft` (unit: pixels). | number | 24 |
| bottom | Distance from the bottom of the viewport, when `placement` is `bottomRight` or `bottomLeft` (unit: pixels). | number | 24 |
| duration | Time in seconds before Notification is closed. When set to 0 or null, it will never be closed automatically | number | 4.5 |
| getContainer | Return the mount node for Notification | () => HTMLNode | () => document.body |

18
components/popconfirm/index.en-US.md
View File

@ -8,23 +8,23 @@ A simple and compact confirmation dialog of an action.
## When To Use
A simple and compact dialog used for asking an user confirmation.
A simple and compact dialog used for asking for user confirmation.
The difference with `confirm` is more lightweight than the static popped full-screen confirm modal.
The difference with the `confirm` modal dialog is that it's more lightweight than the static popped full-screen confirm modal.
## API
| Param | Description | Type | Default value |
|-----------|------------------------------------------|---------------|--------|
| title | title of the confirmation box | string\|ReactNode | none |
| onConfirm | callback of confirmation | function(e) | none |
| onCancel | callback of cancel | function(e) | none |
| okText | text of the confirmation button | string | Confirm |
| okType | type of the confirmation button | string | primary |
| cancelText| text of the cancel button | string | Cancel |
| title | title of the confirmation box | string\|ReactNode | - |
| onConfirm | callback of confirmation | function(e) | - |
| onCancel | callback of cancel | function(e) | - |
| okText | text of the Confirm button | string | `Confirm` |
| okType | Button `type` of the Confirm button | string | `primary` |
| cancelText| text of the Cancel button | string | `Cancel` |
Consult [Tooltip's documentation](https://ant.design/components/tooltip/#API) to find more APIs.
## Note
Please ensure that the child node of `Popconfirm` accepts `onMouseEnter`, `onMouseLeave`, `onFocus`, `onClick` event.
Please ensure that the child node of `Popconfirm` accepts `onMouseEnter`, `onMouseLeave`, `onFocus`, `onClick` events.

12
components/progress/index.en-US.md
View File

@ -4,11 +4,11 @@ type: Feedback
title: Progress
---
To display the current progress of an operation flow.
Display the current progress of an operation flow.
## When To Use
If it will take a long time to complete the operation, you can use `Progress` to show the current progress and status.
If it will take a long time to complete an operation, you can use `Progress` to show the current progress and status.
- When an operation will interrupt the current interface, or it needs to run in the background for more than 2 seconds.
- When you need to display the completion percentage of an operation.
@ -17,14 +17,14 @@ If it will take a long time to complete the operation, you can use `Progress` to
Property | Description | Type | Default
-----|-----|-----|------
type | to set the type, options: `line` `circle` `dashboard`| string | line
type | to set the type, options: `line` `circle` `dashboard`| string | `line`
percent | to set the completion percentage | number | 0
format | template function of the content | function(percent) | `percent => percent + '%'`
status | to set the status of the progress, options: `success` `exception` `active` | string | -
showInfo | determine whether to display the progress value and the status icon | boolean | true
status | to set the status of the Progress, options: `success` `exception` `active` | string | -
showInfo | whether to display the progress value and the status icon | boolean | true
strokeWidth `(type=line)` | to set the width of the progress bar, unit: `px` | number | 10
strokeWidth `(type=circle)` | to set the width of the circular progress bar, unit: percentage of the canvas width | number | 6
width `(type=circle)` | to set the canvas width of the circular progress bar, unit: `px` | number | 132
gapDegree `(type=circle)` | the gap degree of half circle, 0 ~ 360 | number | 0
gapPosition `(type=circle)` | the gap position | Enum{ 'top', 'bottom', 'left', 'right' } | `top`
gapPosition `(type=circle)` | the gap position, options: `top` `bottom` `left` `right` | string | `top`

2
components/select/index.en-US.md
View File

@ -51,7 +51,7 @@ Select component to select value from options.
| getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](http://codepen.io/anon/pen/xVBOVQ?editors=001) | function(triggerNode) | () => document.body |
| labelInValue | whether to embed label in value, turn the format of value from `string` to `{key: string, label: ReactNode}` | boolean | false |
| tokenSeparators | Separator used to tokenize on tag/multiple mode | string[] | |
| firstActiveValue | Value of action option by default | string\|string[] | - |
### Option props

1
components/select/index.zh-CN.md
View File

@ -52,6 +52,7 @@ title: Select
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](http://codepen.io/anon/pen/xVBOVQ?editors=001) | Function(triggerNode) | () => document.body |
| labelInValue | 是否把每个选项的 label 包装到 value 中，会把 Select 的 value 类型从 `string` 变为 `{key: string, label: ReactNode}` 的格式 | boolean | false |
| tokenSeparators | 在 tags 和 multiple 模式下自动分词的分隔符 | string[] | |
| firstActiveValue | 默认高亮的选项 | string\|string[] | - |
> 注意，如果发现下拉菜单跟随页面滚动，或者需要在其他弹层中触发 Select，请尝试使用 `getPopupContainer={triggerNode => triggerNode.parentNode}` 将下拉弹层渲染节点固定在触发器的父元素中。

2
components/slider/index.tsx
View File

@ -30,6 +30,8 @@ export interface SliderProps {
onChange?: (value: SliderValue) => void;
onAfterChange?: (value: SliderValue) => void;
tipFormatter?: void | ((value: number) => React.ReactNode);
className?: string;
id?: string;
}
export default class Slider extends React.Component<SliderProps, any> {

6
components/spin/index.en-US.md
View File

@ -14,8 +14,8 @@ When part of the page is waiting for asynchronous data or during a rendering pro
Property | Description | Type | Default Value
---------|-------------|------|--------------
size | size of spin, available in `small`, `default` and `large` | string | 'default'
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 | -
delay | specifies a delay millisecond for loading state (prevent flush) | number (millisecond) | -
tip | customize description content when Spin has children | string | -
delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | -
wrapperClassName | className of wrapper when Spin has children | string | -

2
components/style/core/base.less
View File

@ -69,7 +69,7 @@ h1, h2, h3, h4, h5, h6 {
a {
color: @link-color;
background: transparent;
text-decoration: none;
text-decoration: @link-hover-decoration;
outline: none;
cursor: pointer;
transition: color .3s ease;

2
components/table/index.en-US.md
View File

@ -71,6 +71,8 @@ const columns = [{
| indentSize | indent size in pixels of tree data | number | 15 |
| onRowClick | callback that is called when a row is clicked | Function(record, index, event) | - |
| onRowDoubleClick| callback that is called when a row is double clicked | Function(record, index, event) | - |
| onRowMouseEnter | callback that is called when mouse enter a row | Function(record, index, event) | - |
| onRowMouseLeave | callback that is called when mouse leave a row | Function(record, index, event) | - |
| bordered | whether to show all table borders | boolean | false |
| showHeader | whether to show table header | boolean | true |
| footer | table footer renderer | Function(currentPageData) | |

2
components/table/index.zh-CN.md
View File

@ -72,6 +72,8 @@ const columns = [{
| indentSize | 展示树形数据时，每层缩进的宽度，以 px 为单位 | number | 15 |
| onRowClick | 点击行时触发 | Function(record, index, event) | - |
| onRowDoubleClick| 双击行时触发 | Function(record, index, event) | - |
| onRowMouseEnter | 鼠标移入行时触发 | Function(record, index, event) | - |
| onRowMouseLeave | 鼠标移出行时触发 | Function(record, index, event) | - |
| bordered | 是否展示外边框和列边框 | boolean | false |
| showHeader | 是否显示表头 | boolean | true |
| footer | 表格尾部 | Function(currentPageData) | |

2
components/table/style/index.less
View File

@ -473,6 +473,8 @@
}
> td > * {
color: transparent !important;
opacity: 0 !important;
height: 0 !important;
}
}

2
components/transfer/index.en-US.md
View File

@ -33,7 +33,7 @@ One or more elements can be selected from either column, one click on the proper
| searchPlaceholder | The hint text of the search box. | string | 'Search here' |
| notFoundContent | Text to display when a column is empty. | string\|ReactNode | 'The list is empty' |
| footer | A function used for rendering the footer. | (props): ReactNode | |
| lazy | property of [react-lazy-load](https://github.com/loktar00/react-lazy-load) for lazy rendering items | object | `{ height: 32, offset: 32 }` |
| lazy | property of [react-lazy-load](https://github.com/loktar00/react-lazy-load) for lazy rendering items. Turn off it by set to `false`. | object\|boolean | `{ height: 32, offset: 32 }` |
| onSearchChange | A callback function which is executed when search field are changed | (direction: 'left'\|'right', event: Event): void | - |
## Warning

2
components/transfer/index.tsx
View File

@ -37,7 +37,7 @@ export interface TransferProps {
body?: (props: TransferListProps) => React.ReactNode;
rowKey?: (record: TransferItem) => string;
onSearchChange?: (direction: 'left' | 'right', e: Event) => void;
lazy?: {};
lazy?: {} | boolean;
onScroll?: (direction: 'left' | 'right', e: Event) => void;
}

2
components/transfer/index.zh-CN.md
View File

@ -35,7 +35,7 @@ title: Transfer
| searchPlaceholder | 搜索框的默认值 | string | '请输入搜索内容' |
| notFoundContent | 当列表为空时显示的内容 | string\|ReactNode | '列表为空' |
| footer | 底部渲染函数 | (props): ReactNode | |
| lazy | Transfer 使用了 [react-lazy-load](https://github.com/loktar00/react-lazy-load) 优化性能，这里可以设置相关参数 | object | `{ height: 32, offset: 32 }` |
| lazy | Transfer 使用了 [react-lazy-load](https://github.com/loktar00/react-lazy-load) 优化性能，这里可以设置相关参数。设为 `false` 可以关闭懒加载。 | object\|boolean | `{ height: 32, offset: 32 }` |
| onSearchChange | 搜索框内容时改变时的回调函数 | (direction: 'left'\|'right', event: Event): void | - |
## 注意

2
docs/react/recommendation.en-US.md
View File

@ -10,7 +10,7 @@ Category | Recommended Components
Router | [react-router](https://github.com/ReactTraining/react-router)
Layout | [react-blocks](http://whoisandy.github.io/react-blocks/)
Drag and drop | [react-dnd](https://github.com/gaearon/react-dnd) [react-draggable](https://github.com/mzabriskie/react-draggable)
Code Editor | [react-codemirror](https://github.com/JedWatson/react-codemirror)
Code Editor | [react-codemirror2](https://github.com/scniro/react-codemirror2)
Rich Text Editor | [react-quill](https://github.com/zenoamaro/react-quill) [react-draft-wysiwyg](https://github.com/jpuri/react-draft-wysiwyg) [react-lz-editor](https://github.com/leejaen/react-lz-editor)(Ant Design style)
Color Picker | [rc-color-picker](https://github.com/react-component/color-picker) [react-color](http://casesandberg.github.io/react-color/)
Media Query | [react-responsive](https://github.com/contra/react-responsive) [react-media](https://github.com/ReactTraining/react-media)

2
docs/react/recommendation.zh-CN.md
View File

@ -10,7 +10,7 @@ title: 社区精选组件
路由 | [react-router](https://github.com/ReactTraining/react-router)
布局 | [react-blocks](https://github.com/whoisandy/react-blocks)
拖拽 | [react-dnd](https://github.com/gaearon/react-dnd) [react-draggable](https://github.com/mzabriskie/react-draggable)
代码编辑器 | [react-codemirror](https://github.com/JedWatson/react-codemirror)
代码编辑器 | [react-codemirror2](https://github.com/scniro/react-codemirror2)
富文本编辑器 | [react-quill](https://github.com/zenoamaro/react-quill) [react-draft-wysiwyg](https://github.com/jpuri/react-draft-wysiwyg) [react-lz-editor](https://github.com/leejaen/react-lz-editor)（Ant Design 风格）
拾色器 | [rc-color-picker](https://github.com/react-component/color-picker) [react-color](http://casesandberg.github.io/react-color/)
响应式 | [react-responsive](https://github.com/contra/react-responsive) [react-media](https://github.com/ReactTraining/react-media)

8
site/bisheng.config.js
View File

@ -63,10 +63,14 @@ module.exports = {
};
config.externals = {
react: 'React',
'react-dom': 'ReactDOM',
'react-router-dom': 'ReactRouterDOM',
};
if (isDev) {
Object.assign(config.externals, {
react: 'React',
'react-dom': 'ReactDOM',
});
}
config.babel.plugins.push([
require.resolve('babel-plugin-transform-runtime'),