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

Merge branch '1.x-stable'

Browse Source
This commit is contained in:
afc163 2016-07-21 14:34:37 +08:00
commit 42d34a5db3
29 changed files with 128 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
CHANGELOG.md
View File

@ -1,6 +1,6 @@
---
order: 3
chinese: 更新日志
title: 更新日志
toc: false
timeline: true
---
@ -9,6 +9,23 @@ timeline: true
---
## 1.6.5
`2016-07-16`
- 修复 Input 的 `value prop on input should not be null` 警告并且导致在表单中无法重置的问题。[#2335](https://github.com/ant-design/ant-design/issues/2335)
- 优化 FormItem 的布局实现，修复表单布局不支持响应式布局的问题。[#2305](https://github.com/ant-design/ant-design/issues/2305)
- 修复带时间的 DatePicker 的 onChange 触发逻辑。[#2399](https://github.com/ant-design/ant-design/issues/2399#issuecomment-232893146)
- 修复 Transfer 搜索后全选的问题。[#2396](https://github.com/ant-design/ant-design/issues/2396)
- 修复 Cascader 样式会被 ant-input 样式覆盖的问题。[#2400](https://github.com/ant-design/ant-design/issues/2400)
- 修复 Table 删除数据时导致当前页数溢出的问题。[#2301](https://github.com/ant-design/ant-design/pull/2301)
- 修复 Table 删除数据时导致当前页数溢出的问题。[#2301](https://github.com/ant-design/ant-design/pull/2301)
- 修复 resize 浏览器时 Affix 元素没有和原来的位置同步的问题。[#1987](https://github.com/ant-design/ant-design/issues/1987)
- 给 Affix 元素添加占位，修复固定时页面跳动的问题。
- 修复 Select combobox 模式会导致页面出现横向滚动条的问题。[#2353](https://github.com/ant-design/ant-design/issues/2353)
- 修复 Upload 组件已上传文件链接点击无效的问题。[#2331](https://github.com/ant-design/ant-design/issues/2331)
- 修复 Upload 上传过程中删除图片后的报错问题。[#2342](https://github.com/ant-design/ant-design/issues/2342)
## 1.6.4
`2016-07-08`

5
README-zh_CN.md
View File

@ -11,9 +11,8 @@
## 特性
- 提炼和服务企业级中后台产品的交互语言和视觉风格。
- [React Component](http://react-component.github.io/badgeboard/) 上精心封装的高质量 UI 库。
- 基于 npm + webpack + babel 的工作流，支持 ES2015。
- [React Component](http://react-component.github.io/badgeboard/) 基础上精心封装的高质量 UI 组件。
- 基于 npm + webpack + babel 的工作流，支持 ES2015 和 TypeScript。
## 安装

2
components/breadcrumb/demo/router.md
View File

@ -44,7 +44,7 @@ const Home = (props) => (
borderBottom: '1px dashed #ccc',
}}
>
Click the navigation above to switch the page,breadcrumb is right here:
Click the navigation above to switch:
</div>
<Breadcrumb {...props} />
</div>

3
components/breadcrumb/demo/withIcon.md
View File

@ -23,7 +23,7 @@ ReactDOM.render(
</Breadcrumb.Item>
<Breadcrumb.Item href="">
<Icon type="user" />
Application List
<span>Application List</span>
</Breadcrumb.Item>
<Breadcrumb.Item>
Application
@ -31,4 +31,3 @@ ReactDOM.render(
</Breadcrumb>
, mountNode);
````

8
components/breadcrumb/style/index.less
View File

@ -8,6 +8,10 @@
a {
color: @text-color;
transition: all .3s;
&:hover {
color: tint(@primary-color, 20%);
}
}
& > span:last-child {
@ -24,7 +28,9 @@
color: @border-color-base;
}
.anticon + span {
&-link {
> .anticon + span {
margin-left: 4px;
}
}
}

4
components/cascader/index.tsx
View File

@ -150,6 +150,10 @@ export default class Cascader extends React.Component<CascaderProps, any> {
'onPopupVisibleChange',
'changeOnSelect',
'expandTrigger',
'popupVisible',
'getPopupContainer',
'loadData',
'popupClassName',
]);
return (

2
components/form/style/mixin.less
View File

@ -86,7 +86,7 @@
input[type="radio"]:focus,
input[type="checkbox"]:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline: 5px auto -webkit-focus-ring-color; // lesshint spaceAroundOperator: false
outline-offset: -2px;
}

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

@ -161,7 +161,7 @@
// Reset Select's style in addon
.ant-select {
margin: -(@input-padding-vertical-base + 1) (-@input-padding-horizontal);
margin: -(@input-padding-vertical-base + 1) (-@input-padding-horizontal); // lesshint spaceAroundOperator: false
.ant-select-selection {
background-color: inherit;

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

@ -151,6 +151,7 @@
&.@{menu-prefix-cls}-submenu-disabled {
color: #999 !important;
cursor: not-allowed;
background: none;
> a {
color: #999 !important;
pointer-events: none;

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

@ -34,7 +34,7 @@
&-bg {
border-radius: 100px;
background-color: @info-color;
transition: all 0.3s linear 0s;
transition: all .4s @ease-out-circ 0s;
position: relative;
}

23
components/steps/demo/error.md
View File

@ -9,19 +9,12 @@ title: 步骤运行错误
import { Steps } from 'antd';
const Step = Steps.Step;
const steps = [{
title: '已完成',
description: '这里是多信息的描述啊',
}, {
title: '错误示例',
description: '这里是多信息的耶哦耶哦哦耶哦耶',
}, {
title: '又一个待运行',
description: '描述啊描述啊',
}, {
title: '待运行',
description: '这里是多信息的描述啊',
}].map((s, i) => <Step key={i} title={s.title} description={s.description} />);
ReactDOM.render(<Steps current={1} status="error">{steps}</Steps>, mountNode);
ReactDOM.render(
<Steps current={1} status="error">
<Step title="已完成" description="这里是多信息的描述" />
<Step title="进行中" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
</Steps>
, mountNode);
````

6
components/steps/demo/icon.md
View File

@ -9,9 +9,11 @@ title: 带图标的步骤条
import { Steps } from 'antd';
const Step = Steps.Step;
ReactDOM.render(<Steps>
ReactDOM.render(
<Steps>
<Step status="finish" title="步骤1" icon="cloud" />
<Step status="process" title="步骤2" icon="apple" />
<Step status="wait" title="步骤3" icon="github" />
</Steps>, mountNode);
</Steps>
, mountNode);
````

23
components/steps/demo/simple.md
View File

@ -9,19 +9,12 @@ title: 基本用法
import { Steps } from 'antd';
const Step = Steps.Step;
const steps = [{
title: '已完成',
description: '这里是多信息的描述啊',
}, {
title: '进行中',
description: '这里是多信息的耶哦耶哦哦耶哦耶',
}, {
title: '又一个待运行',
description: '描述啊描述啊',
}, {
title: '待运行',
description: '这里是多信息的描述啊',
}].map((s, i) => <Step key={i} title={s.title} description={s.description} />);
ReactDOM.render(<Steps current={1}>{steps}</Steps>, mountNode);
ReactDOM.render(
<Steps current={1}>
<Step title="已完成" description="这里是多信息的描述" />
<Step title="进行中" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
</Steps>
, mountNode);
````

23
components/steps/demo/small-size.md
View File

@ -9,19 +9,12 @@ title: 迷你版
import { Steps } from 'antd';
const Step = Steps.Step;
const steps = [{
status: 'finish',
title: '已完成',
}, {
status: 'process',
title: '进行中',
}, {
status: 'wait',
title: '待运行',
}, {
status: 'wait',
title: '待运行',
}].map((s, i) => <Step key={i} title={s.title} description={s.description} />);
ReactDOM.render(<Steps size="small" current={1}>{steps}</Steps>, mountNode);
ReactDOM.render(
<Steps size="small" current={1}>
<Step title="已完成" />
<Step title="进行中" />
<Step title="待运行" />
<Step title="待运行" />
</Steps>
, mountNode);
````

30
components/steps/demo/step-next.md
View File

@ -5,43 +5,33 @@ title: 切换到下一步
随机生成 3~6 个步骤，初始随机进行到其中一个步骤。
````css
#components-steps-demo-step-next > div > div {
margin-bottom: 30px;
}
````
````jsx
import { Steps, Button } from 'antd';
const Step = Steps.Step;
const array = Array.apply(null, Array(Math.floor(Math.random() * 3) + 3));
const steps = array.map((item, i) => {
return {
const steps = array.map((item, i) => ({
title: `步骤${i + 1}`,
};
});
}));
const App = React.createClass({
getInitialState() {
return {
currentStep: Math.floor(Math.random() * steps.length),
current: Math.floor(Math.random() * steps.length),
};
},
next() {
let s = this.state.currentStep + 1;
if (s === steps.length) {
s = 0;
let current = this.state.current + 1;
if (current === steps.length) {
current = 0;
}
this.setState({
currentStep: s,
});
this.setState({ current });
},
render() {
const cs = this.state.currentStep;
const { current } = this.state;
return (
<div>
<div style={{ marginBottom: 24 }}>当前正在执行第 {cs + 1} 步</div>
<Steps current={cs}>
<div style={{ marginBottom: 24 }}>当前正在执行第 {current + 1} 步</div>
<Steps current={current}>
{steps.map((s, i) => <Step key={i} title={s.title} description={s.description} />)}
</Steps>
<div style={{ marginTop: 24 }}>

21
components/steps/demo/vertical-small.md
View File

@ -9,17 +9,12 @@ title: 竖直方向的小型步骤条
import { Steps } from 'antd';
const Step = Steps.Step;
const steps = [{
title: '已完成',
description: '这里是信息的描述',
}, {
title: '进行中',
description: '这里是信息的描述',
}, {
title: '待运行',
description: '这里是信息的描述',
}].map((s, i) => <Step key={i} title={s.title} description={s.description} />);
ReactDOM.render(<Steps size="small" direction="vertical" current={1}>{steps}</Steps>,
mountNode);
ReactDOM.render(
<Steps direction="vertical" size="small" current={1}>
<Step title="已完成" description="这里是多信息的描述" />
<Step title="进行中" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
</Steps>
, mountNode);
````

24
components/steps/demo/vertical.md
View File

@ -9,20 +9,12 @@ title: 竖直方向的步骤条
import { Steps } from 'antd';
const Step = Steps.Step;
const steps = [{
title: '已完成',
description: '这里是信息的描述',
}, {
title: '进行中',
description: '这里是信息的描述',
}, {
title: '待运行',
description: '这里是信息的描述',
}, {
title: '又一个待运行',
description: '这里是信息的描述',
}].map((s, i) => <Step key={i} title={s.title} description={s.description} />);
ReactDOM.render(<Steps direction="vertical" current={1}>{steps}</Steps>,
mountNode);
ReactDOM.render(
<Steps direction="vertical" current={1}>
<Step title="已完成" description="这里是多信息的描述" />
<Step title="进行中" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
<Step title="待运行" description="这里是多信息的描述" />
</Steps>
, mountNode);
````

4
docs/react/introduce.md
View File

@ -28,8 +28,8 @@ english: Ant Design of React
## 特性
- Designed as Ant Design，提炼和服务企业级中后台产品的交互语言和视觉风格。
- [React Component](http://react-component.github.io/badgeboard/) 上精心封装的高质量 UI 库。
- 基于 npm + webpack + babel 的工作流，支持 ES2015。
- [React Component](http://react-component.github.io/badgeboard/) 基础上精心封装的高质量 UI 组件。
- 基于 npm + webpack + babel 的工作流，支持 ES2015 和 TypeScript。
## 安装

2
docs/spec/introduce.md
View File

@ -4,7 +4,7 @@ english: Ant Design
---
<div style="text-align:center;background:#FBFBFB;margin:40px 0;">
<img align="middle" width="600" src="https://os.alipayobjects.com/rmsportal/mgesTPFxodmIwpi.png">
<img width="600" src="https://os.alipayobjects.com/rmsportal/mgesTPFxodmIwpi.png">
</div>
在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，给设计师和工程师带来很多困扰和重复建设，大大降低了产品的研发效率。我们（蚂蚁金服体验技术部）经过大量的项目实践和总结，沉淀出一个中台设计语言 Ant Design。旨在统一中台项目的前端 UI 设计，屏蔽不必要的设计差异和实现成本，解放设计和前端的研发资源。

2
docs/spec/transition.md
View File

@ -77,4 +77,4 @@ english: 巧用过渡
## 自然运动
参加 [Ant Motion 动画语言](http://motion.ant.design/#/language/)。
参见 [Ant Motion 动画语言](http://motion.ant.design/#/language/)。

4
package.json
View File

@ -1,6 +1,6 @@
{
"name": "antd",
"version": "1.6.4",
"version": "1.6.5",
"title": "Ant Design",
"description": "一个 UI 设计语言",
"homepage": "http://ant.design/",
@ -101,7 +101,7 @@
"jsonml-to-react-component": "~0.2.0",
"jsonml.js": "^0.1.0",
"jsonp": "^0.2.0",
"lesshint": "^1.2.1",
"lesshint": "^2.0.0",
"lodash.debounce": "^4.0.6",
"nunjucks": "^2.4.2",
"pre-commit": "1.x",

2
scripts/lesshint-report.js
View File

@ -1,5 +1,5 @@
/* eslint-disable */
var originReport = require('lesshint/lib/reporters/stylish').report;
var originReport = require('lesshint/lib/reporters/default').report;
module.exports = {
report: function (errors) {

2
site/theme/static/highlight.less
View File

@ -75,7 +75,7 @@ pre[class*="language-"] {
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
background: #f7f7f7;
}
/* Inline code */

3
site/theme/static/markdown.less
View File

@ -15,7 +15,7 @@
.markdown h1 {
color: #404040;
font-weight: bold;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
margin-top: 8px;
@ -34,6 +34,7 @@
.markdown h5,
.markdown h6 {
color: #404040;
font-family: lato,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;

8
site/theme/template/Content/Article.jsx
View File

@ -14,12 +14,15 @@ export default class Article extends React.Component {
return;
}
const checkImgUrl = 'http://alipay-rmsdeploy-dev-image.oss-cn-hangzhou-zmf.aliyuncs.com/rmsportal/JdVaTbZzPxEldUi.png';
utils.ping(checkImgUrl, status => {
this.pingTimer = utils.ping(checkImgUrl, status => {
if (status === 'responded') {
links.forEach(link => (link.style.display = 'block'));
}
});
}
componentWillUnmount() {
clearTimeout(this.pingTimer);
}
getArticle(article) {
const { content } = this.props;
const { meta } = content;
@ -45,6 +48,7 @@ export default class Article extends React.Component {
const { meta, description } = content;
const { title, subtitle, chinese, english } = meta;
return (
<DocumentTitle title={`${title || chinese || english} - Ant Design`}>
<article className="markdown">
@ -62,7 +66,7 @@ export default class Article extends React.Component {
)
}
{
!(content.toc && meta.toc) ? null :
(!content.toc || content.toc.length <= 1 || meta.toc === false) ? null :
<section className="toc">{props.utils.toReactComponent(content.toc)}</section>
}
{

7
site/theme/template/Content/MainContent.jsx
View File

@ -138,10 +138,9 @@ export default class MainContent extends React.Component {
const locale = this.context.intl.locale;
const moduleData = this.props.moduleData;
const localizedPageData = moduleData.filter((page) => {
return page.meta.filename.toLowerCase()
.startsWith(props.location.pathname);
})[0];
const localizedPageData = moduleData.filter(
page => page.meta.filename.toLowerCase().startsWith(props.location.pathname)
)[0];
return (
<div className="main-wrapper">

8
site/theme/template/utils.jsx
View File

@ -17,9 +17,9 @@ export function collectDocs(docs) {
export function getMenuItems(data) {
const menuMeta = data.map((item) => item.meta);
const menuItems = {};
menuMeta.sort((a, b) => {
return parseInt(a.order, 10) - parseInt(b.order, 10);
}).forEach((meta) => {
menuMeta.sort(
(a, b) => (a.order || 0) - (b.order || 0)
).forEach((meta) => {
const category = meta.category || 'topLevel';
if (!menuItems[category]) {
menuItems[category] = {};
@ -49,5 +49,5 @@ export function ping(url, callback) {
img.onload = () => finish('responded');
img.onerror = () => finish('error');
img.src = url;
setTimeout(() => finish('timeout'), 1500);
return setTimeout(() => finish('timeout'), 1500);
}