mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 09:26:06 +08:00
Merge branch 'master' into feature-3.8.0
This commit is contained in:
Wei Zhu
commit
6199340b5f
221
.circleci/config.yml
Normal file
221
.circleci/config.yml
Normal file
@ -0,0 +1,221 @@
|
||||
version: 2
|
||||
|
||||
references:
|
||||
container_config: &container_config
|
||||
docker:
|
||||
- image: circleci/node:8
|
||||
working_directory: ~/ant-design
|
||||
|
||||
attach_workspace: &attach_workspace
|
||||
attach_workspace:
|
||||
at: ~/ant-design
|
||||
|
||||
install_react: &install_react
|
||||
run: REACT=15 ./scripts/install-react.sh
|
||||
|
||||
react_15: &react_15
|
||||
environment:
|
||||
REACT: 15
|
||||
|
||||
react_16: &react_16
|
||||
environment:
|
||||
REACT: 16
|
||||
|
||||
jobs:
|
||||
setup:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- run: node -v
|
||||
- run: npm -v
|
||||
- run: npm install
|
||||
- run:
|
||||
command: |
|
||||
set +eo
|
||||
npm ls
|
||||
true
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- node_modules
|
||||
|
||||
dist:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run dist
|
||||
- run: node ./tests/dekko/dist.test.js
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- dist
|
||||
|
||||
compile:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run compile
|
||||
- run: node ./tests/dekko/lib.test.js
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- lib
|
||||
- es
|
||||
|
||||
lint:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run lint
|
||||
|
||||
test_dist:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 2
|
||||
environment:
|
||||
LIB_DIR: dist
|
||||
|
||||
test_lib:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 2
|
||||
environment:
|
||||
LIB_DIR: lib
|
||||
|
||||
test_es:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 2
|
||||
environment:
|
||||
LIB_DIR: es
|
||||
|
||||
test_dom:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm test -- -w 2 --coverage
|
||||
- run: bash <(curl -s https://codecov.io/bash)
|
||||
|
||||
test_node:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run test-node -- -w 2
|
||||
|
||||
test_dist_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 2 -u
|
||||
environment:
|
||||
LIB_DIR: dist
|
||||
|
||||
test_lib_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 2 -u
|
||||
environment:
|
||||
LIB_DIR: lib
|
||||
|
||||
test_es_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 2 -u
|
||||
environment:
|
||||
LIB_DIR: es
|
||||
|
||||
test_dom_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run: npm test -- -w 2 -u
|
||||
|
||||
test_node_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run: npm run test-node -- -w 2 -u
|
||||
|
||||
workflows:
|
||||
version: 2
|
||||
build-test:
|
||||
jobs:
|
||||
- setup
|
||||
- dist:
|
||||
requires:
|
||||
- setup
|
||||
- compile:
|
||||
requires:
|
||||
- setup
|
||||
- lint:
|
||||
requires:
|
||||
- setup
|
||||
- test_dist:
|
||||
requires:
|
||||
- dist
|
||||
- test_lib:
|
||||
requires:
|
||||
- compile
|
||||
- test_es:
|
||||
requires:
|
||||
- compile
|
||||
- test_dom:
|
||||
requires:
|
||||
- setup
|
||||
- test_node:
|
||||
requires:
|
||||
- setup
|
||||
- test_dist_15:
|
||||
requires:
|
||||
- dist
|
||||
- test_lib_15:
|
||||
requires:
|
||||
- compile
|
||||
- test_es_15:
|
||||
requires:
|
||||
- compile
|
||||
- test_dom_15:
|
||||
requires:
|
||||
- setup
|
||||
- test_node_15:
|
||||
requires:
|
||||
- setup
|
||||
@ -8,7 +8,6 @@ node_js:
|
||||
cache:
|
||||
directories:
|
||||
- $HOME/.npm
|
||||
- node_modules
|
||||
|
||||
matrix:
|
||||
fast_finish: true
|
||||
|
||||
@ -15,6 +15,18 @@ timeline: true
|
||||
|
||||
---
|
||||
|
||||
## 3.7.1
|
||||
|
||||
`2018-07-21`
|
||||
|
||||
- 🐞 Fix popup content can't display in Drawer component.[#11304](https://github.com/ant-design/ant-design/issues/11304)
|
||||
- 🐞 Card using `tabList` support `disabled` prop.[#11212](https://github.com/ant-design/ant-design/issues/11212)
|
||||
- 🐞 Fix Link of Anchor not sync when `href` update.[#11287](https://github.com/ant-design/ant-design/pull/11287/files) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🐞 Fix Menu component style.[#11299](https://github.com/ant-design/ant-design/issues/11299)
|
||||
- 🐞 Fix Drawer component don't have animation when `destroyOnClose` is set.[#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 Fix DirectoryTree can't expand when `expandedKeys` is in control.[#11366](https://github.com/ant-design/ant-design/issues/11366)
|
||||
- 🐞 Fix Button with Tooltip under ButtonGroup style issue when Button is `disabled`.[11321](https://github.com/ant-design/ant-design/pull/11321) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
|
||||
## 3.7.0
|
||||
|
||||
3.7.0 is a heavy update that brings a lot of exciting changes and new features.
|
||||
|
||||
@ -15,6 +15,18 @@ timeline: true
|
||||
|
||||
---
|
||||
|
||||
## 3.7.1
|
||||
|
||||
`2018-07-21`
|
||||
|
||||
- 🐞 修复 Drawer 内无法显示弹层组件的问题。[#11304](https://github.com/ant-design/ant-design/issues/11304)
|
||||
- 🐞 带页签的卡片页签支持 disabled 属性。[#11212](https://github.com/ant-design/ant-design/issues/11212)
|
||||
- 🐞 修复锚点链接组件 href 改变不更新的问题。 [#11287](https://github.com/ant-design/ant-design/pull/11287/files) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🐞 修复 Menu 样式细节问题。[#11299](https://github.com/ant-design/ant-design/issues/11299)
|
||||
- 🐞 修复 Drawer 组件设置 `destroyOnClose` 后关闭动画消失。[#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 修复 DirectoryTree 在 `expandedKeys` 属性可控时点击无法展开的问题。[#11366](https://github.com/ant-design/ant-design/issues/11366)
|
||||
- 🐞 修复 ButtonGroup 中使用 Tooltip 的 Button 在 `disabled` 时样式不正确的问题。[11321](https://github.com/ant-design/ant-design/pull/11321) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
|
||||
## 3.7.0
|
||||
|
||||
3.7.0是一个重磅更新，带来了很多激动人心的变化和新特性。
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
[](https://travis-ci.org/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://david-dm.org/ant-design/ant-design)
|
||||
[](https://david-dm.org/ant-design/ant-design#info=devDependencies&view=list)
|
||||
[](https://david-dm.org/ant-design/ant-design?type=dev)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://www.npmtrends.com/antd)
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
[](https://travis-ci.org/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://david-dm.org/ant-design/ant-design)
|
||||
[](https://david-dm.org/ant-design/ant-design#info=devDependencies&view=list)
|
||||
[](https://david-dm.org/ant-design/ant-design?type=dev)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://www.npmtrends.com/antd)
|
||||
|
||||
@ -3,7 +3,7 @@ import { createElement, Component } from 'react';
|
||||
import omit from 'omit.js';
|
||||
import classNames from 'classnames';
|
||||
|
||||
function getNumberArray(num: string | number | undefined) {
|
||||
function getNumberArray(num: string | number | undefined | null) {
|
||||
return num ?
|
||||
num.toString()
|
||||
.split('')
|
||||
@ -14,16 +14,16 @@ function getNumberArray(num: string | number | undefined) {
|
||||
export interface ScrollNumberProps {
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
count?: string | number;
|
||||
count?: string | number | null;
|
||||
component?: string;
|
||||
onAnimated?: Function;
|
||||
style?: React.CSSProperties;
|
||||
title?: string | number;
|
||||
title?: string | number | null;
|
||||
}
|
||||
|
||||
export interface ScrollNumberState {
|
||||
animateStarted?: boolean;
|
||||
count?: string | number;
|
||||
count?: string | number | null;
|
||||
}
|
||||
|
||||
export default class ScrollNumber extends Component<ScrollNumberProps, ScrollNumberState> {
|
||||
|
||||
@ -8,7 +8,7 @@ export { ScrollNumberProps } from './ScrollNumber';
|
||||
|
||||
export interface BadgeProps {
|
||||
/** Number to show in badge */
|
||||
count?: number | string;
|
||||
count?: number | string | null;
|
||||
showZero?: boolean;
|
||||
/** Max count to show */
|
||||
overflowCount?: number;
|
||||
|
||||
@ -109,7 +109,8 @@
|
||||
.button-group-base(@btnClassName) {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
> .@{btnClassName} {
|
||||
> .@{btnClassName},
|
||||
> span > .@{btnClassName} {
|
||||
position: relative;
|
||||
line-height: @btn-height-base - 2px;
|
||||
|
||||
@ -126,13 +127,15 @@
|
||||
}
|
||||
|
||||
// size
|
||||
&-lg > .@{btnClassName} {
|
||||
.button-size(@btn-height-lg; @btn-padding-lg; @btn-font-size-lg; @btn-border-radius-base);
|
||||
&-lg > .@{btnClassName},
|
||||
&-lg > span > .@{btnClassName} {
|
||||
.button-size(@btn-height-lg; @btn-padding-lg; @btn-font-size-lg; 0);
|
||||
line-height: @btn-height-lg - 2px;
|
||||
}
|
||||
|
||||
&-sm > .@{btnClassName} {
|
||||
.button-size(@btn-height-sm; @btn-padding-sm; @font-size-base; @btn-border-radius-sm);
|
||||
&-sm > .@{btnClassName},
|
||||
&-sm > span > .@{btnClassName} {
|
||||
.button-size(@btn-height-sm; @btn-padding-sm; @font-size-base; 0);
|
||||
line-height: @btn-height-sm - 2px;
|
||||
> .@{iconfont-css-prefix} {
|
||||
font-size: @font-size-base;
|
||||
@ -260,7 +263,7 @@
|
||||
border-left-color: transparent;
|
||||
}
|
||||
|
||||
.@{btnClassName}:not(:first-child):not(:last-child) {
|
||||
.@{btnClassName} {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@ -268,17 +271,42 @@
|
||||
> span:first-child > .@{btnClassName} {
|
||||
margin-left: 0;
|
||||
}
|
||||
> .@{btnClassName}:only-child {
|
||||
border-radius: @btn-border-radius-base;
|
||||
}
|
||||
> span:only-child > .@{btnClassName} {
|
||||
border-radius: @btn-border-radius-base;
|
||||
}
|
||||
|
||||
> .@{btnClassName}:first-child:not(:last-child),
|
||||
> span:first-child:not(:last-child) > .@{btnClassName} {
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: @btn-border-radius-base;
|
||||
border-top-left-radius: @btn-border-radius-base;
|
||||
}
|
||||
|
||||
> .@{btnClassName}:last-child:not(:first-child),
|
||||
> span:last-child:not(:first-child) > .@{btnClassName} {
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-right-radius: @btn-border-radius-base;
|
||||
border-top-right-radius: @btn-border-radius-base;
|
||||
}
|
||||
|
||||
&-sm {
|
||||
> .@{btnClassName}:only-child {
|
||||
border-radius: @btn-border-radius-sm;
|
||||
}
|
||||
> span:only-child > .@{btnClassName} {
|
||||
border-radius: @btn-border-radius-sm;
|
||||
}
|
||||
> .@{btnClassName}:first-child:not(:last-child),
|
||||
> span:first-child:not(:last-child) > .@{btnClassName} {
|
||||
border-bottom-left-radius: @btn-border-radius-sm;
|
||||
border-top-left-radius: @btn-border-radius-sm;
|
||||
}
|
||||
> .@{btnClassName}:last-child:not(:first-child),
|
||||
> span:last-child:not(:first-child) > .@{btnClassName} {
|
||||
border-bottom-right-radius: @btn-border-radius-sm;
|
||||
border-top-right-radius: @btn-border-radius-sm;
|
||||
}
|
||||
}
|
||||
|
||||
& > & {
|
||||
|
||||
@ -4,7 +4,7 @@ type: Data Entry
|
||||
title: Checkbox
|
||||
---
|
||||
|
||||
Checkbox.
|
||||
Checkbox component.
|
||||
|
||||
## When To Use
|
||||
|
||||
|
||||
@ -30,6 +30,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
|
||||
showDate: nextProps.value,
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
private input: any;
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import { render } from 'enzyme';
|
||||
import Drawer from '..';
|
||||
|
||||
describe('Drawer', () => {
|
||||
it('render correctly', () => {
|
||||
const wrapper = mount(
|
||||
const wrapper = render(
|
||||
<Drawer
|
||||
visible
|
||||
width={400}
|
||||
@ -13,11 +13,11 @@ describe('Drawer', () => {
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('have a title', () => {
|
||||
const wrapper = mount(
|
||||
const wrapper = render(
|
||||
<Drawer
|
||||
visible
|
||||
title="Test Title"
|
||||
@ -26,11 +26,11 @@ describe('Drawer', () => {
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('closable is false', () => {
|
||||
const wrapper = mount(
|
||||
const wrapper = render(
|
||||
<Drawer
|
||||
visible
|
||||
closable={false}
|
||||
@ -39,11 +39,11 @@ describe('Drawer', () => {
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('destroyOnClose is true', () => {
|
||||
const wrapper = mount(
|
||||
const wrapper = render(
|
||||
<Drawer
|
||||
destroyOnClose
|
||||
visible={false}
|
||||
@ -52,6 +52,20 @@ describe('Drawer', () => {
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('wrapClassName is test_drawer', () => {
|
||||
const wrapper = render(
|
||||
<Drawer
|
||||
destroyOnClose
|
||||
visible={false}
|
||||
wrapClassName="test_drawer"
|
||||
getContainer={false}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
@ -33,7 +33,6 @@ class DrawerEventTester extends React.Component {
|
||||
<Drawer
|
||||
visible={visible}
|
||||
onClose={this.onClose}
|
||||
destroyOnClose
|
||||
getContainer={false}
|
||||
{...this.props}
|
||||
>
|
||||
@ -88,4 +87,26 @@ describe('Drawer', () => {
|
||||
wrapper.find('.ant-drawer-mask').simulate('click');
|
||||
expect(wrapper.instance().state.visible).toBe(true);
|
||||
});
|
||||
|
||||
it('destroyOnClose is true onClose', () => {
|
||||
const wrapper = mount(<DrawerEventTester destroyOnClose />);
|
||||
wrapper.find('button.ant-btn').simulate('click');
|
||||
expect(wrapper.find('.ant-drawer-wrapper-body').exists()).toBe(true);
|
||||
|
||||
wrapper.setState({
|
||||
visible: false,
|
||||
});
|
||||
wrapper.find('.ant-drawer-wrapper-body').simulate('transitionend');
|
||||
expect(wrapper.find('.ant-drawer-wrapper-body').exists()).toBe(false);
|
||||
});
|
||||
|
||||
it('no mask and no closable', () => {
|
||||
const wrapper = mount(<DrawerEventTester destroyOnClose />);
|
||||
|
||||
wrapper.find('button.ant-btn').simulate('click');
|
||||
expect(wrapper.instance().state.visible).toBe(true);
|
||||
|
||||
wrapper.find('.ant-drawer-close').simulate('click');
|
||||
expect(wrapper.instance().state.visible).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
116
components/drawer/__tests__/MultiDrawer.test.js
Normal file
116
components/drawer/__tests__/MultiDrawer.test.js
Normal file
@ -0,0 +1,116 @@
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import Drawer from '..';
|
||||
import Button from '../../button';
|
||||
|
||||
class MultiDrawer extends React.Component {
|
||||
state = { visible: false, childrenDrawer: false };
|
||||
|
||||
showDrawer = () => {
|
||||
this.setState({
|
||||
visible: true,
|
||||
});
|
||||
};
|
||||
|
||||
onClose = () => {
|
||||
this.setState({
|
||||
visible: false,
|
||||
});
|
||||
};
|
||||
|
||||
showChildrenDrawer = () => {
|
||||
this.setState({
|
||||
childrenDrawer: true,
|
||||
});
|
||||
};
|
||||
|
||||
onChildrenDrawerClose = () => {
|
||||
this.setState({
|
||||
childrenDrawer: false,
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { childrenDrawer, visible } = this.state;
|
||||
const { placement } = this.props;
|
||||
return (
|
||||
<div>
|
||||
<Button type="primary" id="open_drawer" onClick={this.showDrawer}>
|
||||
Open drawer
|
||||
</Button>
|
||||
<Drawer
|
||||
title="Multi-level drawer"
|
||||
wrapClassName="test_drawer"
|
||||
width={520}
|
||||
closable={false}
|
||||
onClose={this.onClose}
|
||||
getContainer={false}
|
||||
placement={placement}
|
||||
visible={visible}
|
||||
>
|
||||
<Button type="primary" id="open_two_drawer" onClick={this.showChildrenDrawer}>
|
||||
Two-level drawer
|
||||
</Button>
|
||||
<Drawer
|
||||
title="Two-level Drawer"
|
||||
width={320}
|
||||
closable={false}
|
||||
getContainer={false}
|
||||
placement={placement}
|
||||
onClose={this.onChildrenDrawerClose}
|
||||
visible={childrenDrawer}
|
||||
>
|
||||
<div id="two_drawer_text">
|
||||
This is two-level drawer
|
||||
</div>
|
||||
</Drawer>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
width: '100%',
|
||||
borderTop: '1px solid #e8e8e8',
|
||||
padding: '10px 16px',
|
||||
textAlign: 'right',
|
||||
left: 0,
|
||||
background: '#fff',
|
||||
borderRadius: '0 0 4px 4px',
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
style={{
|
||||
marginRight: 8,
|
||||
}}
|
||||
onClick={this.onClose}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={this.onClose} type="primary">
|
||||
Submit
|
||||
</Button>
|
||||
</div>
|
||||
</Drawer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
describe('Drawer', () => {
|
||||
it('render right MultiDrawer', () => {
|
||||
const wrapper = mount(<MultiDrawer placement="right" />);
|
||||
wrapper.find('button#open_drawer').simulate('click');
|
||||
wrapper.find('button#open_two_drawer').simulate('click');
|
||||
const translateX = wrapper.find('.ant-drawer.test_drawer').get(0).props.style.transform;
|
||||
expect(translateX).toEqual('translateX(-180px)');
|
||||
expect(wrapper.find('#two_drawer_text').exists()).toBe(true);
|
||||
});
|
||||
|
||||
it('render right MultiDrawer', () => {
|
||||
const wrapper = mount(<MultiDrawer placement="left" />);
|
||||
wrapper.find('button#open_drawer').simulate('click');
|
||||
wrapper.find('button#open_two_drawer').simulate('click');
|
||||
const translateX = wrapper.find('.ant-drawer.test_drawer').get(0).props.style.transform;
|
||||
expect(translateX).toEqual('translateX(180px)');
|
||||
expect(wrapper.find('#two_drawer_text').exists()).toBe(true);
|
||||
});
|
||||
});
|
||||
@ -1,21 +1,25 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Drawer closable is false 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right ant-drawer-open"
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="transform:translateX(100%);width:256px"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
style="overflow: auto; height: 100%; width: 256px;"
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow:auto;height:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
@ -30,7 +34,9 @@ exports[`Drawer closable is false 1`] = `
|
||||
`;
|
||||
|
||||
exports[`Drawer destroyOnClose is true 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right"
|
||||
>
|
||||
@ -39,13 +45,29 @@ exports[`Drawer destroyOnClose is true 1`] = `
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="transform:translateX(100%);width:256px"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
style="overflow: auto; height: 100%; width: 256px;"
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow:auto;height:100%;opacity:0;transition:opacity .3s"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -53,21 +75,25 @@ exports[`Drawer destroyOnClose is true 1`] = `
|
||||
`;
|
||||
|
||||
exports[`Drawer have a title 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right ant-drawer-open"
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="transform:translateX(100%);width:256px"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
style="overflow: auto; height: 100%; width: 256px;"
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow:auto;height:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-header"
|
||||
@ -99,21 +125,66 @@ exports[`Drawer have a title 1`] = `
|
||||
`;
|
||||
|
||||
exports[`Drawer render correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right ant-drawer-open"
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="transform:translateX(100%);width:400px"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
style="overflow: auto; height: 100%; width: 400px;"
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow:auto;height:100%"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Drawer wrapClassName is test_drawer 1`] = `
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right test_drawer"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="transform:translateX(100%);width:256px"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow:auto;height:100%;opacity:0;transition:opacity .3s"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
|
||||
@ -10,7 +10,9 @@ exports[`Drawer render correctly 1`] = `
|
||||
open
|
||||
</span>
|
||||
</button>
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-right ant-drawer-open"
|
||||
>
|
||||
@ -19,12 +21,14 @@ exports[`Drawer render correctly 1`] = `
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="width: 256px;"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
style="overflow: auto; height: 100%; width: 256px;"
|
||||
class="ant-drawer-wrapper-body"
|
||||
style="overflow: auto; height: 100%;"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
|
||||
@ -52,16 +52,16 @@ class App extends React.Component {
|
||||
<Drawer
|
||||
title="Multi-level drawer"
|
||||
width={520}
|
||||
wrapClassName="test_drawer"
|
||||
closable={false}
|
||||
onClose={this.onClose}
|
||||
visible={this.state.visible}
|
||||
push={this.state.childrenDrawer}
|
||||
>
|
||||
<Button type="primary" onClick={this.showChildrenDrawer}>
|
||||
Two-level drawer
|
||||
</Button>
|
||||
<Drawer
|
||||
title="Food"
|
||||
title="Two-level Drawer"
|
||||
width={320}
|
||||
closable={false}
|
||||
onClose={this.onChildrenDrawerClose}
|
||||
|
||||
@ -2,7 +2,6 @@ import * as React from 'react';
|
||||
import RcDrawer from 'rc-drawer';
|
||||
import PropTypes from 'prop-types';
|
||||
import createReactContext, { Context } from 'create-react-context';
|
||||
import isNumeric from '../_util/isNumeric';
|
||||
|
||||
const DrawerContext: Context<Drawer | null> = createReactContext(null);
|
||||
|
||||
@ -73,6 +72,7 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
|
||||
};
|
||||
|
||||
praentDrawer: Drawer;
|
||||
destoryClose: boolean;
|
||||
public componentDidUpdate(preProps: DrawerProps) {
|
||||
if (preProps.visible !== this.props.visible && this.praentDrawer) {
|
||||
if (this.props.visible) {
|
||||
@ -106,18 +106,37 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
|
||||
push: false,
|
||||
});
|
||||
}
|
||||
onDestoryTransitionEnd = () => {
|
||||
const isDestroyOnClose = this.getDestoryOnClose();
|
||||
if (!isDestroyOnClose) {
|
||||
return;
|
||||
}
|
||||
if (!this.props.visible) {
|
||||
this.destoryClose = true;
|
||||
this.forceUpdate();
|
||||
}
|
||||
}
|
||||
|
||||
getDestoryOnClose = () => (this.props.destroyOnClose && !this.props.visible);
|
||||
|
||||
renderBody = () => {
|
||||
const { destroyOnClose, visible, width, placement } = this.props;
|
||||
let containerStyle: React.CSSProperties = { width };
|
||||
if (placement === 'left' || placement === 'right') {
|
||||
containerStyle = {
|
||||
if (this.destoryClose && !this.props.visible) {
|
||||
return null;
|
||||
}
|
||||
this.destoryClose = false;
|
||||
const { placement } = this.props;
|
||||
|
||||
const containerStyle: React.CSSProperties = placement === 'left'
|
||||
|| placement === 'right' ? {
|
||||
overflow: 'auto',
|
||||
height: '100%',
|
||||
width,
|
||||
};
|
||||
}
|
||||
if (destroyOnClose && !visible) {
|
||||
return <div style={containerStyle}/>;
|
||||
} : {};
|
||||
|
||||
const isDestroyOnClose = this.getDestoryOnClose();
|
||||
if (isDestroyOnClose) {
|
||||
// Increase the opacity transition, delete children after closing.
|
||||
containerStyle.opacity = 0;
|
||||
containerStyle.transition = 'opacity .3s';
|
||||
}
|
||||
const { prefixCls, title, closable } = this.props;
|
||||
let header;
|
||||
@ -142,7 +161,11 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={containerStyle}>
|
||||
<div
|
||||
className={`${prefixCls}-wrapper-body`}
|
||||
style={containerStyle}
|
||||
onTransitionEnd={this.onDestoryTransitionEnd}
|
||||
>
|
||||
{header}
|
||||
{closer}
|
||||
<div className={`${prefixCls}-body`} style={this.props.style}>
|
||||
@ -152,10 +175,7 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
|
||||
);
|
||||
}
|
||||
renderProvider = (value: Drawer) => {
|
||||
let { width, zIndex, style, placement, ...rest } = this.props;
|
||||
if (isNumeric(width)) {
|
||||
width = `${width}px`;
|
||||
}
|
||||
let { zIndex, style, placement, ...rest } = this.props;
|
||||
const RcDrawerStyle = this.state.push
|
||||
? {
|
||||
zIndex,
|
||||
@ -173,7 +193,7 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
|
||||
showMask={this.props.mask}
|
||||
placement={placement}
|
||||
style={RcDrawerStyle}
|
||||
class={this.props.wrapClassName}
|
||||
className={this.props.wrapClassName}
|
||||
>
|
||||
{this.renderBody()}
|
||||
</RcDrawer>
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
z-index: @zindex-modal;
|
||||
transition: transform .3s @ease-in-out-circ;
|
||||
transition: transform 0.3s @ease-in-out-circ;
|
||||
> * {
|
||||
transition: transform .3s @ease-in-out-circ;
|
||||
transition: transform 0.3s @ease-in-out-circ;
|
||||
}
|
||||
|
||||
&-content-wrapper {
|
||||
@ -27,10 +27,8 @@
|
||||
}
|
||||
&-left {
|
||||
&.@{dawer-prefix-cls}-open {
|
||||
.@{dawer-prefix-cls} {
|
||||
&-wrapper {
|
||||
box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
.@{dawer-prefix-cls}-content-wrapper {
|
||||
box-shadow: @shadow-1-right;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -41,10 +39,8 @@
|
||||
}
|
||||
}
|
||||
&.@{dawer-prefix-cls}-open {
|
||||
& .@{dawer-prefix-cls} {
|
||||
&-wrapper {
|
||||
box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
.@{dawer-prefix-cls}-content-wrapper {
|
||||
box-shadow: @shadow-1-left;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -140,7 +136,7 @@
|
||||
opacity: 0;
|
||||
background-color: @modal-mask-bg;
|
||||
height: 100%;
|
||||
transition: opacity .3s @ease-in-out-circ;
|
||||
transition: opacity 0.3s @ease-in-out-circ;
|
||||
filter: ~"alpha(opacity=50)";
|
||||
}
|
||||
|
||||
@ -151,4 +147,3 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -236,9 +236,14 @@ form {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.@{ant-prefix}-input-number + .@{form-prefix-cls}-text {
|
||||
.@{ant-prefix}-input-number {
|
||||
+ .@{form-prefix-cls}-text {
|
||||
margin-left: 8px;
|
||||
}
|
||||
&-handler-wrap {
|
||||
z-index: 2; // https://github.com/ant-design/ant-design/issues/6289
|
||||
}
|
||||
}
|
||||
|
||||
.@{ant-prefix}-select,
|
||||
.@{ant-prefix}-cascader-picker {
|
||||
|
||||
@ -109,7 +109,6 @@
|
||||
opacity: 0;
|
||||
border-radius: 0 @border-radius-base @border-radius-base 0;
|
||||
transition: opacity 0.24s linear 0.1s;
|
||||
z-index: 2; // https://github.com/ant-design/ant-design/issues/6289
|
||||
}
|
||||
|
||||
&-handler-wrap:hover &-handler {
|
||||
|
||||
@ -19,6 +19,7 @@ import classNames from 'classnames';
|
||||
import omit from 'omit.js';
|
||||
import PropTypes from 'prop-types';
|
||||
import Icon from '../icon';
|
||||
import isNumeric from '../_util/isNumeric';
|
||||
|
||||
const dimensionMap = {
|
||||
xs: '480px',
|
||||
@ -66,10 +67,6 @@ const generateId = (() => {
|
||||
};
|
||||
})();
|
||||
|
||||
const isNumeric = (n: any) => {
|
||||
return !isNaN(parseFloat(n)) && isFinite(n);
|
||||
};
|
||||
|
||||
export default class Sider extends React.Component<SiderProps, SiderState> {
|
||||
static __ANT_LAYOUT_SIDER: any = true;
|
||||
|
||||
|
||||
@ -10,20 +10,21 @@ export interface MentionProps {
|
||||
prefixCls?: string;
|
||||
suggestionStyle?: React.CSSProperties;
|
||||
suggestions?: Array<any>;
|
||||
onSearchChange?: Function;
|
||||
onChange?: Function;
|
||||
onSearchChange?: (value: string, trigger: string) => any;
|
||||
onChange?: (contentState: any) => any;
|
||||
notFoundContent?: any;
|
||||
loading?: Boolean;
|
||||
loading?: boolean;
|
||||
style?: React.CSSProperties;
|
||||
defaultValue?: any;
|
||||
value?: any;
|
||||
className?: string;
|
||||
multiLines?: Boolean;
|
||||
prefix?: string;
|
||||
multiLines?: boolean;
|
||||
prefix?: string | string[];
|
||||
placeholder?: string;
|
||||
getSuggestionContainer?: (triggerNode: Element) => HTMLElement;
|
||||
onFocus?: React.FocusEventHandler<HTMLElement>;
|
||||
onBlur?: React.FocusEventHandler<HTMLElement>;
|
||||
onSelect?: (suggestion: string, data?: any) => any;
|
||||
readOnly?: boolean;
|
||||
disabled?: boolean;
|
||||
placement?: MentionPlacement;
|
||||
|
||||
@ -32,6 +32,7 @@
|
||||
border-color: @menu-dark-bg;
|
||||
border-bottom: 0;
|
||||
top: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&-dark&-horizontal > &-item > a:before {
|
||||
|
||||
@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import shallowEqual from 'shallowequal';
|
||||
import Radio from './radio';
|
||||
import { RadioGroupProps, RadioGroupState, RadioChangeEvent } from './interface';
|
||||
import { RadioGroupProps, RadioGroupState, RadioChangeEvent, RadioGroupButtonStyle } from './interface';
|
||||
|
||||
function getCheckedValue(children: React.ReactNode) {
|
||||
let value = null;
|
||||
@ -21,7 +21,7 @@ export default class RadioGroup extends React.Component<RadioGroupProps, RadioGr
|
||||
static defaultProps = {
|
||||
disabled: false,
|
||||
prefixCls: 'ant-radio',
|
||||
buttonStyle: 'outline',
|
||||
buttonStyle: 'outline' as RadioGroupButtonStyle,
|
||||
};
|
||||
|
||||
static childContextTypes = {
|
||||
|
||||
@ -2,6 +2,8 @@ import * as React from 'react';
|
||||
import { AbstractCheckboxGroupProps } from '../checkbox/Group';
|
||||
import { AbstractCheckboxProps } from '../checkbox/Checkbox';
|
||||
|
||||
export type RadioGroupButtonStyle = 'outline' | 'solid';
|
||||
|
||||
export interface RadioGroupProps extends AbstractCheckboxGroupProps {
|
||||
defaultValue?: any;
|
||||
value?: any;
|
||||
@ -12,7 +14,7 @@ export interface RadioGroupProps extends AbstractCheckboxGroupProps {
|
||||
name?: string;
|
||||
children?: React.ReactNode;
|
||||
id?: string;
|
||||
buttonStyle?: 'outline' | 'solid';
|
||||
buttonStyle?: RadioGroupButtonStyle;
|
||||
}
|
||||
|
||||
export interface RadioGroupState {
|
||||
|
||||
@ -26,7 +26,7 @@ Select component to select value from options.
|
||||
| allowClear | Show clear button. | boolean | false |
|
||||
| autoFocus | Get focus by default | boolean | false |
|
||||
| defaultActiveFirstOption | Whether active first option by default | boolean | true |
|
||||
| defaultValue | Initial selected option. | string\|number\|string\[]\|number\[] | - |
|
||||
| defaultValue | Initial selected option. | string\|string\[]<br />number\|number\[] | - |
|
||||
| disabled | Whether disabled select | boolean | false |
|
||||
| dropdownClassName | className of dropdown menu | string | - |
|
||||
| dropdownMatchSelectWidth | Whether dropdown's width is same with select. | boolean | true |
|
||||
|
||||
@ -27,7 +27,7 @@ title: Select
|
||||
| allowClear | 支持清除 | boolean | false |
|
||||
| autoFocus | 默认获取焦点 | boolean | false |
|
||||
| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true |
|
||||
| defaultValue | 指定默认选中的条目 | string\|string\[]\|number\|number\[] | - |
|
||||
| defaultValue | 指定默认选中的条目 | string\|string\[]<br />number\|number\[] | - |
|
||||
| disabled | 是否禁用 | boolean | false |
|
||||
| dropdownClassName | 下拉菜单的 className 属性 | string | - |
|
||||
| dropdownMatchSelectWidth | 下拉菜单和选择器同宽 | boolean | true |
|
||||
|
||||
@ -481,6 +481,11 @@
|
||||
font-size: @font-size-sm;
|
||||
}
|
||||
|
||||
&-item-group-list &-item:first-child:not(:last-child),
|
||||
&-item-group:not(:last-child) &-item-group-list &-item:last-child {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
&-item {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
@ -223,6 +223,16 @@ describe('Table.filter', () => {
|
||||
expect(handleChange).toBeCalledWith({}, { name: ['boy'] }, {});
|
||||
});
|
||||
|
||||
it('should not fire change event on close filterDropdown without changing anything', () => {
|
||||
const handleChange = jest.fn();
|
||||
const wrapper = mount(createTable({ onChange: handleChange }));
|
||||
const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
||||
|
||||
dropdownWrapper.find('.clear').simulate('click');
|
||||
|
||||
expect(handleChange).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('three levels menu', () => {
|
||||
const filters = [
|
||||
{ text: 'Upper', value: 'Upper' },
|
||||
|
||||
@ -109,6 +109,7 @@ exports[`Table.filter renders filter correctly 1`] = `
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="0"
|
||||
>
|
||||
<td
|
||||
class="ant-table-column-has-filters"
|
||||
@ -122,6 +123,7 @@ exports[`Table.filter renders filter correctly 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="1"
|
||||
>
|
||||
<td
|
||||
class="ant-table-column-has-filters"
|
||||
@ -135,6 +137,7 @@ exports[`Table.filter renders filter correctly 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="2"
|
||||
>
|
||||
<td
|
||||
class="ant-table-column-has-filters"
|
||||
@ -148,6 +151,7 @@ exports[`Table.filter renders filter correctly 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="3"
|
||||
>
|
||||
<td
|
||||
class="ant-table-column-has-filters"
|
||||
|
||||
@ -43,6 +43,7 @@ exports[`Table.pagination renders pagination correctly 1`] = `
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="0"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
@ -56,6 +57,7 @@ exports[`Table.pagination renders pagination correctly 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="1"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
|
||||
@ -72,6 +72,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="0"
|
||||
>
|
||||
<td
|
||||
class="ant-table-fixed-columns-in-body ant-table-selection-column"
|
||||
@ -106,6 +107,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="1"
|
||||
>
|
||||
<td
|
||||
class="ant-table-fixed-columns-in-body ant-table-selection-column"
|
||||
@ -140,6 +142,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="2"
|
||||
>
|
||||
<td
|
||||
class="ant-table-fixed-columns-in-body ant-table-selection-column"
|
||||
@ -174,6 +177,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="3"
|
||||
>
|
||||
<td
|
||||
class="ant-table-fixed-columns-in-body ant-table-selection-column"
|
||||
@ -262,6 +266,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="0"
|
||||
>
|
||||
<td
|
||||
class="ant-table-selection-column"
|
||||
@ -287,6 +292,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="1"
|
||||
>
|
||||
<td
|
||||
class="ant-table-selection-column"
|
||||
@ -312,6 +318,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="2"
|
||||
>
|
||||
<td
|
||||
class="ant-table-selection-column"
|
||||
@ -337,6 +344,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="3"
|
||||
>
|
||||
<td
|
||||
class="ant-table-selection-column"
|
||||
|
||||
@ -70,6 +70,7 @@ exports[`Table renders JSX correctly 1`] = `
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="1"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
@ -93,6 +94,7 @@ exports[`Table renders JSX correctly 1`] = `
|
||||
</tr>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
data-row-key="2"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -108,8 +108,10 @@ export default class FilterMenu<T> extends React.Component<FilterMenuProps<T>, F
|
||||
}
|
||||
|
||||
confirmFilter() {
|
||||
if (this.state.selectedKeys !== this.props.selectedKeys) {
|
||||
this.props.confirmFilter(this.props.column, this.state.selectedKeys);
|
||||
const { selectedKeys } = this.state;
|
||||
|
||||
if (!shallowequal(selectedKeys, this.props.selectedKeys)) {
|
||||
this.props.confirmFilter(this.props.column, selectedKeys);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -160,7 +160,7 @@ const columns = [{
|
||||
| selectedRowKeys | 指定选中项的 key 数组，需要和 onChange 进行配合 | string\[] | \[] |
|
||||
| selections | 自定义选择项 [配置项](#selection), 设为 `true` 时使用默认选择项 | object\[]\|boolean | true |
|
||||
| type | 多选/单选，`checkbox` or `radio` | string | `checkbox` |
|
||||
| onChange | 选中项发生变化的时的回调 | Function(selectedRowKeys, selectedRows) | - |
|
||||
| onChange | 选中项发生变化时的回调 | Function(selectedRowKeys, selectedRows) | - |
|
||||
| onSelect | 用户手动选择/取消选择某列的回调 | Function(record, selected, selectedRows, nativeEvent) | - |
|
||||
| onSelectAll | 用户手动选择/取消选择所有列的回调 | Function(selected, selectedRows, changeRows) | - |
|
||||
| onSelectInvert | 用户手动选择反选的回调 | Function(selectedRows) | - |
|
||||
|
||||
@ -47,6 +47,7 @@
|
||||
border-radius: @border-radius-base;
|
||||
box-shadow: @box-shadow-base;
|
||||
min-height: 32px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
// Arrows
|
||||
|
||||
10
package.json
10
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "antd",
|
||||
"version": "3.7.0",
|
||||
"version": "3.7.1",
|
||||
"title": "Ant Design",
|
||||
"description": "An enterprise-class UI design language and React-based implementation",
|
||||
"homepage": "http://ant.design/",
|
||||
@ -59,7 +59,7 @@
|
||||
"rc-checkbox": "~2.1.5",
|
||||
"rc-collapse": "~1.9.0",
|
||||
"rc-dialog": "~7.1.0",
|
||||
"rc-drawer": "~1.5.9",
|
||||
"rc-drawer": "~1.6.2",
|
||||
"rc-dropdown": "~2.2.0",
|
||||
"rc-editor-mention": "^1.0.2",
|
||||
"rc-form": "^2.1.0",
|
||||
@ -105,7 +105,7 @@
|
||||
"babel-preset-react": "^6.16.0",
|
||||
"babel-preset-stage-0": "^6.16.0",
|
||||
"bezier-easing": "^2.0.3",
|
||||
"bisheng": "^0.29.0",
|
||||
"bisheng": "^0.28.0",
|
||||
"bisheng-plugin-antd": "^0.16.0",
|
||||
"bisheng-plugin-description": "^0.1.1",
|
||||
"bisheng-plugin-react": "^0.6.0",
|
||||
@ -151,8 +151,8 @@
|
||||
"react": "^16.3.2",
|
||||
"react-color": "^2.11.7",
|
||||
"react-copy-to-clipboard": "^5.0.0",
|
||||
"react-dnd": "^3.0.2",
|
||||
"react-dnd-html5-backend": "^3.0.2",
|
||||
"react-dnd": "^5.0.0",
|
||||
"react-dnd-html5-backend": "^5.0.1",
|
||||
"react-document-title": "^2.0.1",
|
||||
"react-dom": "^16.3.2",
|
||||
"react-github-button": "^0.1.1",
|
||||
|
||||
@ -24,7 +24,7 @@ module.exports = {
|
||||
'app.demo.codepen': 'Open in CodePen',
|
||||
'app.demo.codesandbox': 'Open in CodeSandbox',
|
||||
'app.demo.riddle': 'Open in Riddle',
|
||||
'app.home.slogan': 'A UI Design Language',
|
||||
'app.home.slogan': 'The world\'s second most popular React UI framework',
|
||||
'app.home.introduce': 'A design system with values of Nature and Determinacy for better user experience of enterprise applications',
|
||||
'app.home.design-language': 'Design Language',
|
||||
'app.home.solution': 'Solution',
|
||||
|
||||
@ -202,20 +202,31 @@
|
||||
.markdown.api-container table {
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
font-family: @code-family;
|
||||
border-width: 0;
|
||||
margin: 2em 0;
|
||||
th, td {
|
||||
padding: 14px 16px;
|
||||
border-width: 1px 0;
|
||||
border-color: @border-color-split;
|
||||
}
|
||||
th {
|
||||
border-width: 0 0 2px 0;
|
||||
}
|
||||
td:first-child {
|
||||
font-weight: 500;
|
||||
width: 20%;
|
||||
font-family: "Lucida Console", Consolas, Menlo, Courier, monospace;
|
||||
color: @blue-9;
|
||||
}
|
||||
td:nth-child(3) {
|
||||
width: 22%;
|
||||
font-size: 12px;
|
||||
font-family: "Lucida Console", Consolas, Menlo, Courier, monospace;
|
||||
font-size: @font-size-base - 1px;
|
||||
color: @magenta-7;
|
||||
word-break: break-all;
|
||||
}
|
||||
td:last-child {
|
||||
width: 13%;
|
||||
font-size: 12px;
|
||||
font-family: "Lucida Console", Consolas, Menlo, Courier, monospace;
|
||||
font-size: @font-size-base - 1px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
17
tests/__mocks__/react.js
vendored
17
tests/__mocks__/react.js
vendored
@ -1,11 +1,18 @@
|
||||
import createReactContext from 'create-react-context/lib/implementation';
|
||||
|
||||
const React = require.requireActual('react');
|
||||
|
||||
if (!React.createContext) {
|
||||
React.createContext = () => {
|
||||
const Provider = ({ children }) => children;
|
||||
const Consumer = ({ children }) => children();
|
||||
return { Provider, Consumer };
|
||||
React.createContext = createReactContext;
|
||||
}
|
||||
|
||||
if (!React.createRef) {
|
||||
React.createRef = () => {
|
||||
const ref = function setRef(node) {
|
||||
ref.current = node;
|
||||
};
|
||||
return ref;
|
||||
};
|
||||
}
|
||||
|
||||
module.exports = React;
|
||||
Object.assign(module.exports, React);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user