test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-11 10:05:07 +08:00
Code Issues Actions 186 Packages Projects Releases Wiki Activity

Merge branch 'master' into feature-2.10

Browse Source
This commit is contained in:
afc163 2017-04-13 11:12:41 +08:00
commit b8888cfb04
59 changed files with 673 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.en-US.md
View File

@ -478,6 +478,7 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
* RangePicker can set presetted ranges. [demo](https://ant.design/components/date-picker/#components-date-picker-demo-presetted-ranges)
* Fix "Now" button doesn't work while `DatePicker[showTime]` is set. [#3748](https://github.com/ant-design/ant-design/issues/3748)
* Fix `RangePicker[format]` should work. [#3808](https://github.com/ant-design/ant-design/issues/3808)
* Fix issue that RangePicker `placeholder=['xx', 'xx']` not working.
* Add and update some icons. [#3977](https://github.com/ant-design/ant-design/pull/3977)
* New component `Input.Search`. [demo](https://ant.design/components/input/#components-input-demo-search-input)
* Mention onSelect event will get complete record. [#3867](https://github.com/ant-design/ant-design/issues/3867)

1
CHANGELOG.zh-CN.md
View File

@ -478,6 +478,7 @@ timeline: true
* RangePicker 现在可以自定义快捷选择。[demo](https://ant.design/components/date-picker/#components-date-picker-demo-presetted-ranges)
* 修复 DatePicker 设置 `showTime` 后 “此刻” 按钮失效的问题。[#3748](https://github.com/ant-design/ant-design/issues/3748)
* 修复 `RangePicker[format]` 失效的问题。[#3808](https://github.com/ant-design/ant-design/issues/3808)
* 修复 RangePicker `placeholder=['xx', 'xx']` 失效的问题。
* 新增并优化部分 Icon。[#3977](https://github.com/ant-design/ant-design/pull/3977)
* 新增 Input.Search 控件。[demo](https://ant.design/components/input/#components-input-demo-search-input)
* Mention onSelect 事件现在可以获取完整的数据。[#3867](https://github.com/ant-design/ant-design/issues/3867)

3
README-zh_CN.md
View File

@ -13,7 +13,8 @@
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
[![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
[![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
一套企业级的 UI 设计语言和 React 实现。

3
README.md
View File

@ -13,7 +13,8 @@
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
[![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
[![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
An enterprise-class UI design language and React-based implementation.

7
components/affix/index.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import addEventListener from 'rc-util/lib/Dom/addEventListener';
import classNames from 'classnames';
import shallowequal from 'shallowequal';
@ -60,9 +61,9 @@ export interface AffixProps {
export default class Affix extends React.Component<AffixProps, any> {
static propTypes = {
offsetTop: React.PropTypes.number,
offsetBottom: React.PropTypes.number,
target: React.PropTypes.func,
offsetTop: PropTypes.number,
offsetBottom: PropTypes.number,
target: PropTypes.func,
};
scrollEvent: any;

3
components/anchor/AnchorLink.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import AnchorHelper, { scrollTo } from './anchorHelper';
@ -18,7 +19,7 @@ export interface AnchorLinkProps {
export default class AnchorLink extends React.Component<AnchorLinkProps, any> {
static __ANT_ANCHOR_LINK = true;
static contextTypes = {
anchorHelper: React.PropTypes.any,
anchorHelper: PropTypes.any,
};
static defaultProps = {

3
components/anchor/index.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import addEventListener from 'rc-util/lib/Dom/addEventListener';
import AnchorLink from './AnchorLink';
@ -27,7 +28,7 @@ export default class Anchor extends React.Component<AnchorProps, any> {
};
static childContextTypes = {
anchorHelper: React.PropTypes.any,
anchorHelper: PropTypes.any,
};
refs: {

13
components/breadcrumb/Breadcrumb.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import { cloneElement } from 'react';
import warning from '../_util/warning';
import BreadcrumbItem from './BreadcrumbItem';
@ -43,12 +44,12 @@ export default class Breadcrumb extends React.Component<BreadcrumbProps, any> {
};
static propTypes = {
prefixCls: React.PropTypes.string,
separator: React.PropTypes.node,
routes: React.PropTypes.array,
params: React.PropTypes.object,
linkRender: React.PropTypes.func,
nameRender: React.PropTypes.func,
prefixCls: PropTypes.string,
separator: PropTypes.node,
routes: PropTypes.array,
params: PropTypes.object,
linkRender: PropTypes.func,
nameRender: PropTypes.func,
};
componentDidMount() {

17
components/button/button.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Icon from '../icon';
import omit from 'omit.js';
@ -60,14 +61,14 @@ export default class Button extends React.Component<ButtonProps, any> {
};
static propTypes = {
type: React.PropTypes.string,
shape: React.PropTypes.oneOf(['circle', 'circle-outline']),
size: React.PropTypes.oneOf(['large', 'default', 'small']),
htmlType: React.PropTypes.oneOf(['submit', 'button', 'reset']),
onClick: React.PropTypes.func,
loading: React.PropTypes.oneOfType([React.PropTypes.bool, React.PropTypes.object]),
className: React.PropTypes.string,
icon: React.PropTypes.string,
type: PropTypes.string,
shape: PropTypes.oneOf(['circle', 'circle-outline']),
size: PropTypes.oneOf(['large', 'default', 'small']),
htmlType: PropTypes.oneOf(['submit', 'button', 'reset']),
onClick: PropTypes.func,
loading: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),
className: PropTypes.string,
icon: PropTypes.string,
};
timeout: number;

4
components/button/style/index.less
View File

@ -82,10 +82,6 @@
display: block;
}
.@{iconfont-css-prefix} {
transition: all .3s @ease-in-out;
}
&&-loading:not(&-circle):not(&-circle-outline) {
padding-left: 29px;
pointer-events: none;

9
components/checkbox/Group.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Checkbox from './Checkbox';
import PureRenderMixin from 'rc-util/lib/PureRenderMixin';
@ -34,10 +35,10 @@ export default class CheckboxGroup extends React.Component<CheckboxGroupProps, C
prefixCls: 'ant-checkbox-group',
};
static propTypes = {
defaultValue: React.PropTypes.array,
value: React.PropTypes.array,
options: React.PropTypes.array.isRequired,
onChange: React.PropTypes.func,
defaultValue: PropTypes.array,
value: PropTypes.array,
options: PropTypes.array.isRequired,
onChange: PropTypes.func,
};
constructor(props) {
super(props);

3
components/date-picker/RangePicker.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import moment from 'moment';
import PropTypes from 'prop-types';
import RangeCalendar from 'rc-calendar/lib/RangeCalendar';
import RcDatePicker from 'rc-calendar/lib/Picker';
import classNames from 'classnames';
@ -10,7 +11,7 @@ import warning from '../_util/warning';
export default class RangePicker extends React.Component<any, any> {
static contextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
static defaultProps = {
prefixCls: 'ant-calendar',

3
components/date-picker/createPicker.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import moment from 'moment';
import PropTypes from 'prop-types';
import MonthCalendar from 'rc-calendar/lib/MonthCalendar';
import RcDatePicker from 'rc-calendar/lib/Picker';
import classNames from 'classnames';
@ -18,7 +19,7 @@ export default function createPicker(TheCalendar) {
// use class typescript error
const CalenderWrapper = React.createClass<any, any>({
contextTypes: {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
},
getDefaultProps() {
return {

1
components/date-picker/style/MonthPicker.less
View File

@ -2,5 +2,6 @@
.@{calendar-prefix-cls}-month-panel,
.@{calendar-prefix-cls}-year-panel {
top: 0;
height: 248px;
}
}

4
components/date-picker/style/RangePicker.less
View File

@ -3,8 +3,8 @@
.@{calendar-prefix-cls}-range-picker-input {
background-color: transparent;
border: 0;
height: 18px;
line-height: 18px;
height: 100%;
line-height: 100%;
outline: 0;
width: 43%;
text-align: center;

27
components/form/FormItem.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import PureRenderMixin from 'rc-util/lib/PureRenderMixin';
import Row from '../row';
@ -41,22 +42,22 @@ export default class FormItem extends React.Component<FormItemProps, any> {
};
static propTypes = {
prefixCls: React.PropTypes.string,
label: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.node]),
labelCol: React.PropTypes.object,
help: React.PropTypes.oneOfType([React.PropTypes.node, React.PropTypes.bool]),
validateStatus: React.PropTypes.oneOf(['', 'success', 'warning', 'error', 'validating']),
hasFeedback: React.PropTypes.bool,
wrapperCol: React.PropTypes.object,
className: React.PropTypes.string,
id: React.PropTypes.string,
children: React.PropTypes.node,
colon: React.PropTypes.bool,
prefixCls: PropTypes.string,
label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
labelCol: PropTypes.object,
help: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),
validateStatus: PropTypes.oneOf(['', 'success', 'warning', 'error', 'validating']),
hasFeedback: PropTypes.bool,
wrapperCol: PropTypes.object,
className: PropTypes.string,
id: PropTypes.string,
children: PropTypes.node,
colon: PropTypes.bool,
};
static contextTypes = {
form: React.PropTypes.object,
vertical: React.PropTypes.bool,
form: PropTypes.object,
vertical: PropTypes.bool,
};
context: FormItemContext;

3
components/form/demo/customized-form-controls.md
View File

@ -10,13 +10,14 @@ title:
自定义或第三方的表单控件，也可以与 Form 组件一起使用。只要该组件遵循以下的约定：
> * 提供受控属性 `value` 或其它与 [`valuePropName`](http://ant.design/components/form/#getFieldDecorator-参数) 的值同名的属性。
> * 提供 `onChange` 事件或 [`trigger`](http://ant.design/components/form/#getFieldDecorator-参数) 的值同名的事件。
> * 不能是函数式组件。
## en-US
Customized or third-party form controls can be used in Form, too. Controls must follow these conventions:
> * It has a controlled property `value` or other name which is equal to the value of [`valuePropName`](http://ant.design/components/form/?locale=en-US#getFieldDecorator's-parameters).
> * It has event `onChange` or an event which name is equal to the value of [`trigger`](http://ant.design/components/form/?locale=en-US#getFieldDecorator's-parameters).
> * It must be a class component.
````jsx
import { Form, Input, Select, Button } from 'antd';

2
components/grid/__tests__/index.test.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import TestUtils from 'react-dom/test-utils';
import { Col, Row } from '..';
describe('Grid', () => {

15
components/grid/row.tsx
View File

@ -2,6 +2,7 @@ import React from 'react';
import { Children, cloneElement } from 'react';
import classNames from 'classnames';
import assign from 'object-assign';
import PropTypes from 'prop-types';
export interface RowProps {
className?: string;
@ -19,13 +20,13 @@ export default class Row extends React.Component<RowProps, any> {
};
static propTypes = {
type: React.PropTypes.string,
align: React.PropTypes.string,
justify: React.PropTypes.string,
className: React.PropTypes.string,
children: React.PropTypes.node,
gutter: React.PropTypes.number,
prefixCls: React.PropTypes.string,
type: PropTypes.string,
align: PropTypes.string,
justify: PropTypes.string,
className: PropTypes.string,
children: PropTypes.node,
gutter: PropTypes.number,
prefixCls: PropTypes.string,
};
render() {
const { type, justify, align, className, gutter, style, children,

2
components/icon/__tests__/index.test.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import TestUtils from 'react-dom/test-utils';
import { wrap } from 'react-stateless-wrapper';
import AntIcon from '..';

4
components/icon/index.tsx
View File

@ -11,7 +11,7 @@ export interface IconProps {
style?: React.CSSProperties;
}
export default (props: IconProps) => {
const Icon = (props: IconProps) => {
const { type, className = '', spin } = props;
const classString = classNames({
anticon: true,
@ -20,3 +20,5 @@ export default (props: IconProps) => {
}, className);
return <i {...omit(props, ['type', 'spin'])} className={classString} />;
};
export default Icon;

10
components/input-number/__tests__/__snapshots__/demo.test.js.snap
View File

@ -57,7 +57,7 @@ exports[`renders ./components/input-number/demo/digit.md correctly 1`] = `
/>
</span>
<span
class="ant-input-number-handler ant-input-number-handler-down ant-input-number-handler-down-disabled"
class="ant-input-number-handler ant-input-number-handler-down "
unselectable="unselectable"
>
<span
@ -170,7 +170,7 @@ exports[`renders ./components/input-number/demo/formatter.md correctly 1`] = `
class="ant-input-number-input"
max="Infinity"
min="-Infinity"
value="$ 100"
value="$ 1,000"
/>
</div>
</div>
@ -181,7 +181,7 @@ exports[`renders ./components/input-number/demo/formatter.md correctly 1`] = `
class="ant-input-number-handler-wrap"
>
<span
class="ant-input-number-handler ant-input-number-handler-up "
class="ant-input-number-handler ant-input-number-handler-up ant-input-number-handler-up-disabled"
unselectable="unselectable"
>
<span
@ -205,8 +205,8 @@ exports[`renders ./components/input-number/demo/formatter.md correctly 1`] = `
<input
autocomplete="off"
class="ant-input-number-input"
max="Infinity"
min="-Infinity"
max="100"
min="0"
value="100%"
/>
</div>

20
components/input-number/demo/formatter.md
View File

@ -7,11 +7,11 @@ title:
## zh-CN
展示具有具体含义的数据。
通过 `formatter` 格式化数字，以展示具有具体含义的数据，往往需要配合 `parser` 一起使用。
## en-US
Display value within it's situation.
Display value within it's situation with `formatter`, and we usually use `parser` at the same time.
````jsx
import { InputNumber } from 'antd';
@ -22,8 +22,20 @@ function onChange(value) {
ReactDOM.render(
<div>
<InputNumber formatter={value => `$ ${value}`} defaultValue={100} onChange={onChange} />
<InputNumber formatter={value => `${value.replace('%', '')}%`} defaultValue={100} onChange={onChange} />
<InputNumber
defaultValue={1000}
formatter={value => `$ ${value.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}`}
parser={value => value.replace(/\$\s?|(,*)/g, '')}
onChange={onChange}
/>
<InputNumber
defaultValue={100}
min={0}
max={100}
formatter={value => `${value}%`}
parser={value => value.replace('%', '')}
onChange={onChange}
/>
</div>
, mountNode);
````

1
components/input-number/index.tsx
View File

@ -13,6 +13,7 @@ export interface InputNumberProps {
disabled?: boolean;
size?: 'large' | 'small' | 'default';
formatter?: (value: number | string | undefined) => string;
parser?: (displayValue: string | undefined) => number;
placeholder?: string;
style?: React.CSSProperties;
className?: string;

3
components/input/style/mixin.less
View File

@ -175,7 +175,6 @@
}
// Reset rounded corners
> span > .@{inputClass}:first-child,
> .@{inputClass}:first-child,
&-addon:first-child {
border-bottom-right-radius: 0;
@ -241,6 +240,8 @@
border-radius: 0;
border-right-width: 0;
vertical-align: middle;
float: none;
display: inline-block;
}
// Undo float for .ant-input-group .ant-input

261
components/layout/__tests__/__snapshots__/demo.test.js.snap
View File

@ -297,6 +297,267 @@ exports[`renders ./components/layout/demo/fixed.md correctly 1`] = `
</div>
`;
exports[`renders ./components/layout/demo/fixed-sider.md correctly 1`] = `
<div
class="ant-layout ant-layout-has-sider"
style="height:100vh;"
>
<div
class="ant-layout-sider"
style="overflow:auto;flex:0 0 200px;width:200px;"
>
<div
class="logo"
/>
<ul
aria-activedescendant=""
class="ant-menu ant-menu-inline ant-menu-dark ant-menu-root"
role="menu"
tabindex="0"
>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-user"
/>
<span
class="nav-text"
>
nav 1
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-video-camera"
/>
<span
class="nav-text"
>
nav 2
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-upload"
/>
<span
class="nav-text"
>
nav 3
</span>
</li>
<li
aria-selected="true"
class="ant-menu-item-selected ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-bar-chart"
/>
<span
class="nav-text"
>
nav 4
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-cloud-o"
/>
<span
class="nav-text"
>
nav 5
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-appstore-o"
/>
<span
class="nav-text"
>
nav 6
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-team"
/>
<span
class="nav-text"
>
nav 7
</span>
</li>
<li
aria-selected="false"
class="ant-menu-item"
role="menuitem"
style="padding-left:24px;"
>
<i
class="anticon anticon-shop"
/>
<span
class="nav-text"
>
nav 8
</span>
</li>
</ul>
</div>
<div
class="ant-layout"
>
<div
class="ant-layout-header"
style="background:#fff;padding:0;"
/>
<div
class="ant-layout-content"
style="margin:24px 16px 0;overflow:initial;"
>
<div
style="padding:24px;background:#fff;text-align:center;"
>
...
<br />
Really
<br />
...
<br />
...
<br />
...
<br />
long
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
...
<br />
content
</div>
</div>
<div
class="ant-layout-footer"
style="text-align:center;"
>
Ant Design ©2016 Created by Ant UED
</div>
</div>
</div>
`;
exports[`renders ./components/layout/demo/responsive.md correctly 1`] = `
<div
class="ant-layout ant-layout-has-sider"

92
components/layout/demo/fixed-sider.md Normal file
View File

@ -0,0 +1,92 @@
---
order: 7
iframe: 360
title:
zh-CN: 固定侧边栏
en-US: Fixed Sider
---
## zh-CN
当内容较长时，使用固定侧边栏可以提供更好的体验。
## en-US
When dealing with long content, a fixed sider can provide a better user experience.
````jsx
import { Layout, Menu, Icon } from 'antd';
const { Header, Content, Footer, Sider } = Layout;
ReactDOM.render(<Layout style={{ height: '100vh' }}>
<Sider style={{ overflow: 'auto' }}>
<div className="logo" />
<Menu theme="dark" mode="inline" defaultSelectedKeys={['4']}>
<Menu.Item key="1">
<Icon type="user" />
<span className="nav-text">nav 1</span>
</Menu.Item>
<Menu.Item key="2">
<Icon type="video-camera" />
<span className="nav-text">nav 2</span>
</Menu.Item>
<Menu.Item key="3">
<Icon type="upload" />
<span className="nav-text">nav 3</span>
</Menu.Item>
<Menu.Item key="4">
<Icon type="bar-chart" />
<span className="nav-text">nav 4</span>
</Menu.Item>
<Menu.Item key="5">
<Icon type="cloud-o" />
<span className="nav-text">nav 5</span>
</Menu.Item>
<Menu.Item key="6">
<Icon type="appstore-o" />
<span className="nav-text">nav 6</span>
</Menu.Item>
<Menu.Item key="7">
<Icon type="team" />
<span className="nav-text">nav 7</span>
</Menu.Item>
<Menu.Item key="8">
<Icon type="shop" />
<span className="nav-text">nav 8</span>
</Menu.Item>
</Menu>
</Sider>
<Layout>
<Header style={{ background: '#fff', padding: 0 }} />
<Content style={{ margin: '24px 16px 0', overflow: 'initial' }}>
<div style={{ padding: 24, background: '#fff', textAlign: 'center' }}>
...
<br />
Really
<br />...<br />...<br />...<br />
long
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />...
<br />...<br />...<br />...<br />...<br />...<br />
content
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>
Ant Design ©2016 Created by Ant UED
</Footer>
</Layout>
</Layout>, mountNode);
````
````css
#components-layout-demo-fixed-sider .logo {
height: 32px;
background: #333;
border-radius: 6px;
margin: 16px;
}
````

5
components/locale-provider/index.tsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import { changeConfirmLocale } from '../modal/locale';
export interface LocaleProviderProps {
@ -18,11 +19,11 @@ export interface LocaleProviderProps {
export default class LocaleProvider extends React.Component<LocaleProviderProps, any> {
static propTypes = {
locale: React.PropTypes.object,
locale: PropTypes.object,
};
static childContextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
getChildContext() {

2
components/locale-provider/style/index.less
View File

@ -1 +1,3 @@
// placeholder
@import "../../style/themes/default";
@import "../../style/core/index";

3
components/menu/style/index.less
View File

@ -53,6 +53,9 @@
&:hover {
color: @primary-color;
}
&:focus {
text-decoration: none;
}
&:before {
position: absolute;
background-color: transparent;

4
components/modal/Modal.tsx
View File

@ -1,6 +1,6 @@
import { PropTypes } from 'react';
import React from 'react';
import Dialog from 'rc-dialog';
import PropTypes from 'prop-types';
import addEventListener from 'rc-util/lib/Dom/addEventListener';
import Button from '../button';
@ -93,7 +93,7 @@ export default class Modal extends React.Component<ModalProps, any> {
};
static contextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
context: ModalContext;

2
components/popover/__tests__/index.test.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import TestUtils from 'react-dom/test-utils';
import Popover from '..';
describe('Popover', () => {

5
components/select/index.tsx
View File

@ -1,4 +1,5 @@
import React, { PropTypes } from 'react';
import React from 'react';
import PropTypes from 'prop-types';
import RcSelect, { Option, OptGroup } from 'rc-select';
import classNames from 'classnames';
import warning from '../_util/warning';
@ -90,7 +91,7 @@ export default class Select extends React.Component<SelectProps, any> {
};
static contextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
context: SelectContext;

2
components/slider/__tests__/__snapshots__/demo.test.js.snap
View File

@ -266,7 +266,7 @@ exports[`renders ./components/slider/demo/input-number.md correctly 1`] = `
/>
</span>
<span
class="ant-input-number-handler ant-input-number-handler-down ant-input-number-handler-down-disabled"
class="ant-input-number-handler ant-input-number-handler-down "
unselectable="unselectable"
>
<span

5
components/style/themes/default.less
View File

@ -252,6 +252,11 @@
@spin-dot-size: 20px;
@spin-dot-size-lg: 32px;
// Table
// --
@table-header-bg: @background-color-base;
@table-row-hover-bg: @primary-1;
// TimePicker
// ---
@time-picker-panel-column-width: 56px;

2
components/switch/__tests__/__snapshots__/demo.test.js.snap
View File

@ -15,7 +15,7 @@ exports[`renders ./components/switch/demo/disabled.md correctly 1`] = `
<div>
<span
class="ant-switch ant-switch-disabled"
tabindex="0"
tabindex="-1"
>
<span
class="ant-switch-inner"

31
components/table/Table.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import RcTable from 'rc-table';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import assign from 'object-assign';
import Pagination, { PaginationProps } from '../pagination';
@ -102,21 +103,21 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
static ColumnGroup = ColumnGroup;
static propTypes = {
dataSource: React.PropTypes.array,
columns: React.PropTypes.array,
prefixCls: React.PropTypes.string,
useFixedHeader: React.PropTypes.bool,
rowSelection: React.PropTypes.object,
className: React.PropTypes.string,
size: React.PropTypes.string,
loading: React.PropTypes.oneOfType([
React.PropTypes.bool,
React.PropTypes.object,
dataSource: PropTypes.array,
columns: PropTypes.array,
prefixCls: PropTypes.string,
useFixedHeader: PropTypes.bool,
rowSelection: PropTypes.object,
className: PropTypes.string,
size: PropTypes.string,
loading: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.object,
]),
bordered: React.PropTypes.bool,
onChange: React.PropTypes.func,
locale: React.PropTypes.object,
dropdownPrefixCls: React.PropTypes.string,
bordered: PropTypes.bool,
onChange: PropTypes.func,
locale: PropTypes.object,
dropdownPrefixCls: PropTypes.string,
};
static defaultProps = {
@ -135,7 +136,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
};
static contextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
context: TableContext;

28
components/table/__tests__/__snapshots__/demo.test.js.snap
View File

@ -6589,12 +6589,9 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
>
<table
class="ant-table-fixed"
style="width:1010px;"
style="width:130%;"
>
<colgroup>
<col
style="width:100px;min-width:100px;"
/>
<col
style="width:100px;min-width:100px;"
/>
@ -6602,17 +6599,16 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
style="width:200px;min-width:200px;"
/>
<col
style="width:50px;min-width:50px;"
style="width:200px;min-width:200px;"
/>
<col
style="width:100px;min-width:100px;"
/>
<col
style="width:200px;min-width:200px;"
/>
<col
style="width:200px;min-width:200px;"
style="width:100px;min-width:100px;"
/>
<col />
<col />
<col
style="width:60px;min-width:60px;"
/>
@ -6755,12 +6751,9 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
>
<table
class="ant-table-fixed"
style="width:1010px;"
style="width:130%;"
>
<colgroup>
<col
style="width:100px;min-width:100px;"
/>
<col
style="width:100px;min-width:100px;"
/>
@ -6768,17 +6761,16 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
style="width:200px;min-width:200px;"
/>
<col
style="width:50px;min-width:50px;"
style="width:200px;min-width:200px;"
/>
<col
style="width:100px;min-width:100px;"
/>
<col
style="width:200px;min-width:200px;"
/>
<col
style="width:200px;min-width:200px;"
style="width:100px;min-width:100px;"
/>
<col />
<col />
<col
style="width:60px;min-width:60px;"
/>

8
components/table/demo/grouping-columns.md
View File

@ -36,7 +36,7 @@ const columns = [{
title: 'Age',
dataIndex: 'age',
key: 'age',
width: 100,
width: 200,
sorter: (a, b) => a.age - b.age,
}, {
title: 'Address',
@ -51,7 +51,7 @@ const columns = [{
title: 'Building',
dataIndex: 'building',
key: 'building',
width: 50,
width: 100,
}, {
title: 'Door No.',
dataIndex: 'number',
@ -66,12 +66,10 @@ const columns = [{
title: 'Company Address',
dataIndex: 'companyAddress',
key: 'companyAddress',
width: 200,
}, {
title: 'Company Name',
dataIndex: 'companyName',
key: 'companyName',
width: 200,
}],
}, {
title: 'Gender',
@ -102,7 +100,7 @@ ReactDOM.render(
dataSource={data}
bordered
size="middle"
scroll={{ x: 1010, y: 240 }}
scroll={{ x: '130%', y: 240 }}
/>
, mountNode);
```

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

@ -2,7 +2,6 @@
@import "../../style/mixins/index";
@table-prefix-cls: ~"@{ant-prefix}-table";
@table-head-background-color: @background-color-base;
.@{table-prefix-cls}-wrapper {
.clearfix;
@ -29,7 +28,7 @@
}
&-thead > tr > th {
background: @table-head-background-color;
background: @table-header-bg;
font-weight: 500;
transition: background .3s ease;
text-align: left;
@ -66,7 +65,7 @@
&.@{table-prefix-cls}-row-hover,
&:hover {
& > td {
background: @primary-1;
background: @table-row-hover-bg;
}
}
}
@ -77,13 +76,13 @@
&-footer {
padding: 16px 8px;
background: @table-head-background-color;
background: @table-header-bg;
border-radius: 0 0 @border-radius-base @border-radius-base;
position: relative;
&:before {
content: '';
height: 1px;
background: @table-head-background-color;
background: @table-header-bg;
position: absolute;
top: -1px;
width: 100%;
@ -148,17 +147,19 @@
&-thead > tr > th.@{table-prefix-cls}-selection-column,
&-tbody > tr > td.@{table-prefix-cls}-selection-column {
text-align: center;
min-width: 62px;
width: 62px;
}
&-expand-icon-th,
&-row-expand-icon-cell {
text-align: center;
min-width: 50px;
width: 50px;
}
&-header {
background: @table-head-background-color;
background: @table-header-bg;
overflow: hidden;
}

4
components/tree-select/style/index.less
View File

@ -84,6 +84,10 @@
&.@{select-tree-prefix-cls}-bottom_close,
&.@{select-tree-prefix-cls}-noline_close {
.antTreeSwitcherIcon();
.ie-rotate(3);
&:after {
transform: rotate(270deg) scale(0.59);
}
}
}
}

3
components/upload/Upload.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import RcUpload from 'rc-upload';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import assign from 'object-assign';
import Dragger from './Dragger';
@ -41,7 +42,7 @@ export default class Upload extends React.Component<UploadProps, any> {
};
static contextTypes = {
antLocale: React.PropTypes.object,
antLocale: PropTypes.object,
};
context: UploadContext;

10
docs/react/getting-started.en-US.md
View File

@ -161,11 +161,15 @@ There are some [scaffolds](https://github.com/ant-design/ant-design/issues/129)
## Import on Demand
If you see a log like below screenshot, you might import all components by writing `import { Button } from 'antd';`, this will affect your app's network perfermance.
If you see logs like below screenshot, you might import all components by writing `import { Button } from 'antd';`, this will affect your app's network perfermance.
> ![](https://zos.alipayobjects.com/rmsportal/vgcHJRVZFmPjAawwVoXK.png)
```
You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.
```
But, we can import individual components on demand:
> ![](https://zos.alipayobjects.com/rmsportal/GHIRszVcmjccgZRakJDQ.png)
However, we can import individual components on demand:
```jsx
import Button from 'antd/lib/button';

8
docs/react/getting-started.zh-CN.md
View File

@ -159,9 +159,13 @@ IE8 需要配合使用 [react@0.14.x](https://facebook.github.io/react/blog/2016
## 按需加载
如果你在控制台看到下面的提示，则你可能使用了 `import { Button } from 'antd';` 的写法引入了 antd 下所有的模块，这会影响应用的网络性能。
如果你在开发环境的控制台看到下面的提示，那么你可能使用了 `import { Button } from 'antd';` 的写法引入了 antd 下所有的模块，这会影响应用的网络性能。
> ![](https://zos.alipayobjects.com/rmsportal/vgcHJRVZFmPjAawwVoXK.png)
```
You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.
```
> ![](https://zos.alipayobjects.com/rmsportal/GHIRszVcmjccgZRakJDQ.png)
可以通过以下的写法来按需加载组件。

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

@ -164,6 +164,6 @@ If you'd like to help us improve antd, just create a [Pull Request](https://gith
## Need Help?
For questions on how to use antd, please post questions to [stackoverflow](http://stackoverflow.com/questions/tagged/antd) using the `antd` tag. If you're not finding what you need on stackoverflow, you can find us on [gitter](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) as well.
For questions on how to use antd, please post questions to [stackoverflow](http://stackoverflow.com/questions/tagged/antd) using the `antd` tag. If you're not finding what you need on stackoverflow, you can find us on [gitter](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) as well.
As always, we encourage experienced users to help those who are not familiar with `antd`!

3
docs/react/introduce.zh-CN.md
View File

@ -173,4 +173,5 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
1. [Stack Overflow](http://stackoverflow.com/questions/tagged/antd)（英文）
2. [Segment Fault](https://segmentfault.com/t/antd)（中文）
3. [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
3. [![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
4. [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）

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

@ -11,8 +11,7 @@ Router | [react-router](https://github.com/ReactTraining/react-router)
Layout | [react-blocks](http://whoisandie.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)
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)
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)
Copy to clipboard | [react-copy-to-clipboard](https://github.com/nkbt/react-copy-to-clipboard)

4
docs/react/use-with-create-react-app.en-US.md
View File

@ -96,8 +96,8 @@ Ok, you now see a blue primary button displaying in page now, next you can choos
## Advanced Guides
We are successd to run antd components now, but in the real world, there are still lots of problems about antd-demo.
For instance, we actully import all components in the project which will be a serious network perfermance issue.
We are successfully running antd components now; but in the real world, there are still lots of problems about antd-demo.
For instance, we actually import all components in the project which will cause a serious network perfermance issue.
> You will see a warning in your browser console.
> ![](https://zos.alipayobjects.com/rmsportal/vgcHJRVZFmPjAawwVoXK.png)

2
docs/spec/data-display.md
View File

@ -22,7 +22,7 @@ title:
> 1. 表格中的时间、状态、操作栏需保持词语完整不过行。
> 2. 当数据为空时，可使用『- -』来表示暂无数据。
## 折叠面板
## 折叠面板 Collapse
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/UzmOpWyvIZmFibFPOjuo.png">

109
docs/spec/icon.en-US.md Normal file
View File

@ -0,0 +1,109 @@
---
order: 4
title: Icons
---
An icon is a graphical representation of meaning. Icons can be used to express actions, state, and even to categorize data. Ant Design's icons adhere to the following two principles and are designed for cross-platform consistency:
- Graphics that are clear, intuitive, and simple enjoy a higher degree of recognition and are more easily understood
- All icons in the user interface should be consistent in style (detail design, perspective, stroke weight, etc.)
---
## System icons
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/gcOflMziKUIdaeLlObPj.png">
System icons are often used to represent commonly used operations, such as: save, edit, delete. The library also includes icons to represent file types and state.
- [View the icon library](/components/icon/#Application-Icons)
### Key contour lines
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/psKuOznmgqzqQoumcAxT.png" alt="Ant Design's grid and key contour lines">
Contour lines play an important role in making various icons with the same visual effect. We recommend using a template following Ant Design's contour lines when creating new icons.
Please make all icons in the 1024×1024 resolution (16×16 64 times).
- [Illustrator tips](https://zos.alipayobjects.com/rmsportal/hmNuLjCkBssupcZgYAde.png)
<img class="preview-img no-padding inline" align="right" src="https://zos.alipayobjects.com/rmsportal/XzoySLGeUaMCOVymkyZq.png" alt="Square contour">
<img class="preview-img no-padding inline" align="right" src="https://zos.alipayobjects.com/rmsportal/fdWiCCIQiJIViSNhmcHo.png" alt="Horizontal rectangle contour">
<img class="preview-img no-padding inline" align="right" src="https://zos.alipayobjects.com/rmsportal/xEvvEZHaSlstcozKgoBd.png" alt="Circular contour">
<img class="preview-img no-padding inline" align="right" src="https://zos.alipayobjects.com/rmsportal/GyBKoeSnRDFPvJudEgOA.png" alt="Vertical rectangle contour">
### Design details
#### Stroke weight
<img class="preview-img no-padding good" align="right" src="https://zos.alipayobjects.com/rmsportal/WnOptTBWISNYeRpYnlcg.png" alt="Correct example" description="Line thickness is consistently 72px">
<img class="preview-img no-padding bad" align="right" src="https://zos.alipayobjects.com/rmsportal/pdLgzaadpHndkqAPLNmx.png" alt="Incorrect example" description="Line thickness is not uniform">
Consistent stroke weight is the key to maintaining the visual unity of the entire icon system. Ant Design's icons have a consistent line width of 72px.
#### Corners
<img class="preview-img no-padding good" align="right" src="https://zos.alipayobjects.com/rmsportal/FBhKrLDoNmfgwZRbfXRi.png" alt="Correct example" description="The icon's corners are properly rounded">
<img class="preview-img no-padding bad" align="right" src="https://zos.alipayobjects.com/rmsportal/NtrZWeUsfVWiOjRcWDqv.png" alt="Incorrect example" description="The icon's corners are not rounded">
Consistent rounding of corners and sizing of angles is also an important element in maintaining visual unity.
Icons that follow Ant Design should have rounded corners and edges using a 72px radius. Angles should be a multiple of 45°.
#### Visual correction
<img class="preview-img no-padding good" align="right" src="https://zos.alipayobjects.com/rmsportal/xOFtYOCPdCHNwAzYVqSJ.png" alt="Correct example" description="For the intricate “JPG” lettering, an outline is added for readability">
<img class="preview-img no-padding bad" align="right" src="https://zos.alipayobjects.com/rmsportal/pxpaZCbYqucHqnxyazta.png" alt="Incorrect example" description="The text in the icon is crowded and hard to read">
In certain special cases (for example, when the icon is too compact), adjustments to line width, outlines, or other subtle changes may be made to increase readability.
### Perspective
<img class="preview-img no-padding good" align="right" src="https://zos.alipayobjects.com/rmsportal/YqNpTvpCeBeRAPWSFJbz.png" alt="Correct example" description="Maintains a flat, simple style">
<img class="preview-img no-padding bad" align="right" src="https://zos.alipayobjects.com/rmsportal/tqMBxDQruzWhunynJaNC.png" alt="Incorrect example" description="Icons should not have depth nor varying perspectives">
Always keep a simple, flat style. Icons should not have a sense of depth nor a large amount of detail.
### Naming conventions
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/RjDmLIjLtUdoIQDIuVrw.png">
Uniform naming conventions make finding icons faster and easier. For example, icons with a surrounding outline have a uniform "-o" suffix.
### Icon sizing
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/nHFxbYpwlUHwOcrkvgGw.png">
Icons should be scaled according to the text size, according to the Ant Design specification.
For example, icons inline with 12pt font should be 12px in size with 8px of spacing.
### Color
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/uYhuxxiWZlgVwdmfqUli.png" description="Colors demonstrated - @Black = #000000、@White = #FFFFFF、@Blue-6 = #108EE9">
The color of the icon should be consistent the color of the surrounding copy, unless the icon is being used to express state (in which case it should be colored accordingly).
---
## Pictographs
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/tFBnAjChLpybfxtnotTx.png">
While certain icons may be used to express an action or to communicate state, other icons may act as pictographs which can be used to either communicate meaning or to help a user remember an abstract concept.
> Note: The design principles for system icons (stroke weight, etc.) also apply to pictographs.
### Pictograph sizing
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/ByDcWtCrgspVLqjTsFdu.png">
Conventionally, we recommend storing pictograph icons in three sizes: 32px, 48px, and 64px. That said, the physical dimensions of an icon should match the dimensions of where it is used.
### Colors
<img class="preview-img no-padding" align="right" src="https://zos.alipayobjects.com/rmsportal/QfFDvJISCInKnjsshowY.png">
Pictographs should either be monochrome (using a neutral color) or consist of two colors (the neutral color + primary color), with the primary color not exceeding 40% of the pictograph's area.

4
docs/spec/icon.md → docs/spec/icon.zh-CN.md
View File

@ -1,8 +1,6 @@
---
order: 4
title:
zh-CN: 图标
en-US: Icon
title: 图标
---
图标是具有指代意义的图形，也是一种标识。通过使用图标表达命令，强调状态，表示产品或类别。为了系统及跨平台之间图形认知保持一致，

8
package.json
View File

@ -39,14 +39,15 @@
"css-animation": "^1.2.5",
"dom-closest": "^0.2.0",
"lodash.debounce": "^4.0.8",
"moment": "~2.18.0",
"moment": "^2.18.1",
"object-assign": "~4.1.0",
"omit.js": "^0.1.0",
"prop-types": "^15.5.7",
"rc-animate": "~2.3.0",
"rc-calendar": "~8.1.0",
"rc-cascader": "~0.11.0",
"rc-checkbox": "~1.5.0",
"rc-collapse": "~1.6.4",
"rc-collapse": "~1.7.0",
"rc-dialog": "~6.5.0",
"rc-dropdown": "~1.4.8",
"rc-editor-mention": "~0.5.2",
@ -124,7 +125,7 @@
"rc-scroll-anim": "^1.0.3",
"rc-tween-one": "^1.1.2",
"react": "^15.0.0",
"react-addons-test-utils": "^15.0.0",
"react-addons-test-utils": "^15.5.1",
"react-color-standalone": "^2.4.2-1",
"react-copy-to-clipboard": "^4.0.1",
"react-document-title": "^2.0.1",
@ -133,6 +134,7 @@
"react-intl": "^2.0.1",
"react-stateless-wrapper": "^1.0.2",
"react-sublime-video": "^0.2.0",
"react-test-renderer": "^15.5.4",
"reqwest": "^2.0.5",
"rimraf": "^2.5.4",
"stylelint": "^7.8.0",

3
site/theme/en-US.js
View File

@ -49,7 +49,8 @@ module.exports = {
'app.footer.feedback': 'Feedback',
'app.footer.stackoverflow': 'StackOverflow',
'app.footer.segmentfault': 'SegmentFault',
'app.footer.discuss': 'Chat Room',
'app.footer.discuss-en': 'Chat Room (English)',
'app.footer.discuss-cn': 'Chat Room (中文)',
'app.footer.bug-report': 'Bug Report',
'app.footer.issues': 'Issues',
'app.footer.version': 'Version: ',

11
site/theme/static/template.html
View File

@ -96,6 +96,17 @@
/* eslint-enable */
}
</script>
<!-- Hotjar Tracking Code for ant.design -->
<script>
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:473408,hjsv:5};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'//static.hotjar.com/c/hotjar-','.js?sv=');
</script>
</head>
<body>
<div id="react-content">

3
site/theme/template/Content/ComponentDoc.jsx
View File

@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import DocumentTitle from 'react-document-title';
import { FormattedMessage } from 'react-intl';
import classNames from 'classnames';
@ -9,7 +10,7 @@ import EditButton from './EditButton';
export default class ComponentDoc extends React.Component {
static contextTypes = {
intl: React.PropTypes.object,
intl: PropTypes.object,
}
constructor(props) {

3
site/theme/template/Content/Demo.jsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import CopyToClipboard from 'react-copy-to-clipboard';
import classNames from 'classnames';
@ -9,7 +10,7 @@ import BrowserFrame from '../BrowserFrame';
export default class Demo extends React.Component {
static contextTypes = {
intl: React.PropTypes.object,
intl: PropTypes.object,
}
constructor(props) {

7
site/theme/template/Layout/Footer.jsx
View File

@ -126,7 +126,12 @@ class Footer extends React.Component {
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design">
<FormattedMessage id="app.footer.discuss" />
<FormattedMessage id="app.footer.discuss-cn" />
</a>
</div>
<div>
<a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design-english">
<FormattedMessage id="app.footer.discuss-en" />
</a>
</div>
<div>

3
site/theme/template/Layout/index.jsx
View File

@ -1,5 +1,6 @@
import React, { cloneElement } from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import { addLocaleData, IntlProvider } from 'react-intl';
import { LocaleProvider } from 'antd';
import enUS from 'antd/lib/locale-provider/en_US';
@ -22,7 +23,7 @@ if (typeof window !== 'undefined') {
export default class Layout extends React.Component {
static contextTypes = {
router: React.PropTypes.object.isRequired,
router: PropTypes.object.isRequired,
}
constructor(props) {

3
site/theme/zh-CN.js
View File

@ -49,7 +49,8 @@ module.exports = {
'app.footer.feedback': '反馈和建议',
'app.footer.stackoverflow': 'StackOverflow',
'app.footer.segmentfault': 'SegmentFault',
'app.footer.discuss': '在线讨论',
'app.footer.discuss-en': '在线讨论 (English)',
'app.footer.discuss-cn': '在线讨论 (中文)',
'app.footer.bug-report': '报告 Bug',
'app.footer.issues': '讨论列表',
'app.footer.version': '文档版本：',