github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: update drawer

pull/309/head
tangjinzhou 2018-12-08 19:07:04 +08:00
parent 3fb4067d1a
commit 3ca22aa070
15 changed files with 12459 additions and 12305 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`DatePicker prop locale should works 1`] = `<span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Избери дата" class="ant-calendar-picker-input ant-input"><i class="ant-calendar-picker-clear anticon anticon-cross-circle"><!----></i><span class="ant-calendar-picker-icon"></span></div></span>`; exports[`DatePicker prop locale should works 1`] = `<span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Избери дата" class="ant-calendar-picker-input ant-input"><i class="ant-calendar-picker-clear anticon anticon-close-circle"><svg viewBox="64 64 896 896" data-icon="close-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path></svg></i><i class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span>`;

2
components/date-picker/__tests__/__snapshots__/WeekPicker.test.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`WeekPicker should support style prop 1`] = `<span class="ant-calendar-picker" style="width: 400px;"><span class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><span class="ant-calendar-picker-icon"></span></span></span>`; exports[`WeekPicker should support style prop 1`] = `<span class="ant-calendar-picker" style="width: 400px;"><span class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><i class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></span></span>`;

19
components/drawer/__tests__/Drawer.test.js
View File

@ -57,6 +57,25 @@ describe('Drawer', () => {
}) })
}) })
it('render top drawer', async () => {
const props = {
propsData: {
visible: true,
height: 400,
placement: 'top',
getContainer: false,
},
slots: {
default: 'Here is content of Drawer',
},
sync: false,
}
const wrapper = mount(Drawer, props)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
})
})
it('have a title', async () => { it('have a title', async () => {
const props = { const props = {
propsData: { propsData: {

30
components/drawer/__tests__/MultiDrawer.test.js
View File

@ -2,7 +2,9 @@ import { mount } from '@vue/test-utils'
import Drawer from '..' import Drawer from '..'
import Button from '../../button' import Button from '../../button'
import { asyncExpect } from '@/tests/utils' import { asyncExpect } from '@/tests/utils'
export function $$ (className) {
return document.body.querySelectorAll(className)
}
const MultiDrawer = { const MultiDrawer = {
props: { props: {
placement: { placement: {
@ -27,6 +29,7 @@ const MultiDrawer = {
this.childrenDrawer = true this.childrenDrawer = true
}, },
onChildrenDrawerClose () { onChildrenDrawerClose () {
console.log('hello')
this.childrenDrawer = false this.childrenDrawer = false
}, },
}, },
@ -35,7 +38,6 @@ const MultiDrawer = {
props: { props: {
title: 'Multi-level drawer', title: 'Multi-level drawer',
width: 520, width: 520,
closable: false,
visible: this.visible, visible: this.visible,
getContainer: false, getContainer: false,
wrapClassName: 'test_drawer', wrapClassName: 'test_drawer',
@ -49,7 +51,7 @@ const MultiDrawer = {
props: { props: {
title: 'Two-level Drawer', title: 'Two-level Drawer',
width: 320, width: 320,
closable: false, wrapClassName: 'Two-level',
visible: this.childrenDrawer, visible: this.childrenDrawer,
getContainer: false, getContainer: false,
placement: this.placement, placement: this.placement,
@ -137,7 +139,7 @@ describe('Drawer', () => {
}, 1000) }, 1000)
}) })
it('render right MultiDrawer', async () => { it('render left MultiDrawer', async () => {
document.body.innerHTML = '' document.body.innerHTML = ''
const wrapper = mount(MultiDrawer, { const wrapper = mount(MultiDrawer, {
propsData: { propsData: {
@ -157,4 +159,24 @@ describe('Drawer', () => {
expect(wrapper.find('#two_drawer_text').exists()).toBe(true) expect(wrapper.find('#two_drawer_text').exists()).toBe(true)
}, 1000) }, 1000)
}) })
it('render top MultiDrawer', async () => {
const wrapper = mount(MultiDrawer, {
propsData: {
placement: 'top',
},
sync: false,
})
await asyncExpect(() => {
wrapper.find('#open_drawer').trigger('click')
}, 0)
await asyncExpect(() => {
wrapper.find('#open_two_drawer').trigger('click')
}, 0)
await asyncExpect(() => {
const translateY = wrapper.find('.ant-drawer.test_drawer').element.parentElement.style.transform
expect(translateY).toEqual('translateY(180px)')
expect(wrapper.find('#two_drawer_text').exists()).toBe(true)
}, 1000)
})
}) })

21
components/drawer/__tests__/__snapshots__/Drawer.test.js.snap
View File

@ -6,7 +6,7 @@ exports[`Drawer class is test_drawer 1`] = `
<div class="ant-drawer-mask"></div> <div class="ant-drawer-mask"></div>
<div class="ant-drawer-content-wrapper" style="transform: translateX(100%); width: 256px;"> <div class="ant-drawer-content-wrapper" style="transform: translateX(100%); width: 256px;">
<div class="ant-drawer-content"> <div class="ant-drawer-content">
<div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%; opacity: 0;"><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"></span></button> <div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%; opacity: 0;"><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"><i class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span></button>
<div class="ant-drawer-body">Here is content of Drawer</div> <div class="ant-drawer-body">Here is content of Drawer</div>
</div> </div>
</div> </div>
@ -54,7 +54,7 @@ exports[`Drawer have a title 1`] = `
<div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%;"> <div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%;">
<div class="ant-drawer-header"> <div class="ant-drawer-header">
<div class="ant-drawer-title">Test Title</div> <div class="ant-drawer-title">Test Title</div>
</div><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"></span></button> </div><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"><i class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span></button>
<div class="ant-drawer-body">Here is content of Drawer</div> <div class="ant-drawer-body">Here is content of Drawer</div>
</div> </div>
</div> </div>
@ -69,7 +69,22 @@ exports[`Drawer render correctly 1`] = `
<div class="ant-drawer-mask"></div> <div class="ant-drawer-mask"></div>
<div class="ant-drawer-content-wrapper" style="transform: translateX(100%); width: 400px;"> <div class="ant-drawer-content-wrapper" style="transform: translateX(100%); width: 400px;">
<div class="ant-drawer-content"> <div class="ant-drawer-content">
<div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%;"><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"></span></button> <div class="ant-drawer-wrapper-body" style="overflow: auto; height: 100%;"><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"><i class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span></button>
<div class="ant-drawer-body">Here is content of Drawer</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`Drawer render top drawer 1`] = `
<div>
<div class="ant-drawer ant-drawer-top">
<div class="ant-drawer-mask"></div>
<div class="ant-drawer-content-wrapper" style="transform: translateY(-100%); height: 400px;">
<div class="ant-drawer-content">
<div class="ant-drawer-wrapper-body"><button aria-label="Close" class="ant-drawer-close"><span class="ant-drawer-close-x"><i class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span></button>
<div class="ant-drawer-body">Here is content of Drawer</div> <div class="ant-drawer-body">Here is content of Drawer</div>
</div> </div>
</div> </div>

13
components/drawer/__tests__/__snapshots__/demo.test.js.snap
View File

@ -1,11 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/drawer/demo/basic-left.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open</span></button>
<!---->
</div>
`;
exports[`renders ./components/drawer/demo/basic-right.md correctly 1`] = ` exports[`renders ./components/drawer/demo/basic-right.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open</span></button> <div><button type="button" class="ant-btn ant-btn-primary"><span>Open</span></button>
<!----> <!---->
@ -18,6 +12,13 @@ exports[`renders ./components/drawer/demo/multi-level-drawer.md correctly 1`] =
</div> </div>
`; `;
exports[`renders ./components/drawer/demo/placement.md correctly 1`] = `
<div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default" style="margin-right: 8px;"><label class="ant-radio-wrapper"><span class="ant-radio"><input type="radio" class="ant-radio-input" value="top"><span class="ant-radio-inner"></span></span><span>top</span></label><label class="ant-radio-wrapper"><span class="ant-radio"><input type="radio" class="ant-radio-input" value="right"><span class="ant-radio-inner"></span></span><span>right</span></label><label class="ant-radio-wrapper"><span class="ant-radio"><input type="radio" class="ant-radio-input" value="bottom"><span class="ant-radio-inner"></span></span><span>bottom</span></label><label class="ant-radio-wrapper ant-radio-wrapper-checked"><span class="ant-radio ant-radio-checked"><input type="radio" class="ant-radio-input" value="left"><span class="ant-radio-inner"></span></span><span>left</span></label></div> <button type="button" class="ant-btn ant-btn-primary"><span>Open</span></button>
<!---->
</div>
`;
exports[`renders ./components/drawer/demo/user-profile.md correctly 1`] = ` exports[`renders ./components/drawer/demo/user-profile.md correctly 1`] = `
<div> <div>
<div class="ant-list ant-list-split ant-list-bordered"> <div class="ant-list ant-list-split ant-list-bordered">

47
components/drawer/demo/basic-left.md
View File

@ -1,47 +0,0 @@
<cn>
#### 左侧滑出
基础抽屉，点击触发按钮抽屉从左滑出，点击遮罩区关闭
</cn>
<us>
#### Left Slider
Basic drawer.
</us>
```html
<template>
<div>
<a-button type="primary" @click="showDrawer">
Open
</a-button>
<a-drawer
placement="left"
:closable="false"
@close="onClose"
:visible="visible"
>
<span slot="title">Basic Drawer</span>
<p>Some contents...</p>
<p>Some contents...</p>
<p>Some contents...</p>
</a-drawer>
</div>
</template>
<script>
export default {
data() {
return {
visible: false,
}
},
methods: {
showDrawer() {
this.visible = true
},
onClose() {
this.visible = false
},
},
}
</script>
```

30
components/drawer/demo/index.vue
View File

@ -1,6 +1,6 @@
<script> <script>
import BasicRight from './basic-right' import BasicRight from './basic-right'
import BasicLeft from './basic-left' import Placement from './placement'
import UserProfile from './user-profile' import UserProfile from './user-profile'
import MultiLevelDrawer from './multi-level-drawer' import MultiLevelDrawer from './multi-level-drawer'
import FromDrawer from './from-drawer' import FromDrawer from './from-drawer'
@ -14,26 +14,34 @@ import '../style'
const md = { const md = {
cn: `# Drawer 抽屉 cn: `# Drawer 抽屉
抽屉从父窗体边缘滑入，覆盖住部分父窗体内容。用户在抽屉内操作时不必离开当前任务，操作完成后，可以平滑地回到到原任务。 屏幕边缘滑出的浮层面板。
## 何时使用
## 何时使用
抽屉从父窗体边缘滑入，覆盖住部分父窗体内容。用户在抽屉内操作时不必离开当前任务，操作完成后，可以平滑地回到到原任务。
* 当需要一个附加的面板来控制父窗体内容，这个面板在需要时呼出。比如，控制界面展示样式，往界面中添加内容。
* 当需要在当前任务流中插入临时任务，创建或预览附加内容。比如展示协议条款，创建子对象。
* 当需要一个附加的面板来控制父窗体内容，这个面板在需要时呼出。比如，控制界面展示样式，往界面中添加内容。
* 当需要在当前任务流中插入临时任务，创建或预览附加内容。比如展示协议条款，创建子对象。
## 代码演示 ## 代码演示
`, `,
us: `# Drawer us: `# Drawer
A Drawer is a panel that is typically overlaid on top of a page and slides in from the side. It contains a set of information or actions. Since that user can interact with the Drawer without leaving the current page, tasks can be achieved more efficient within the same context. Panel slides from screen edge.
## When To Use
* Use a Form to create or edit a set of information. ## When To Use
* Processing subtasks. When subtasks are too heavy for Popover and we still want to keep the subtasks in the context of the main task, Drawer comes very handy.
* When a same Form is needed in multiple places. A Drawer is a panel that is typically overlaid on top of a page and slides in from the side. It contains a set of information or actions. Since that user can interact with the Drawer without leaving the current page, tasks can be achieved more efficient within the same context.
* Use a Form to create or edit a set of information.
* Processing subtasks. When subtasks are too heavy for Popover and we still want to keep the subtasks in the context of the main task, Drawer comes very handy.
* When a same Form is needed in multiple places.
## Examples ## Examples
`, `,
} }
export default { export default {
category: 'Components', category: 'Components',
type: 'Feedback', type: 'Feedback',
zhType: '反馈',
title: 'Drawer', title: 'Drawer',
subtitle: '抽屉', subtitle: '抽屉',
render () { render () {
@ -41,7 +49,7 @@ export default {
<div> <div>
<md cn={md.cn} us={md.us} /> <md cn={md.cn} us={md.us} />
<BasicRight /> <BasicRight />
<BasicLeft /> <Placement />
<FromDrawer /> <FromDrawer />
<UserProfile /> <UserProfile />
<MultiLevelDrawer /> <MultiLevelDrawer />

61
components/drawer/demo/placement.md Normal file
View File

@ -0,0 +1,61 @@
<cn>
#### 自定义位置
自定义位置，点击触发按钮抽屉从相应的位置滑出，点击遮罩区关闭
</cn>
<us>
#### Custom Placement
Basic drawer.
</us>
```html
<template>
<div>
<a-radio-group
style="margin-right: 8px"
:defaultValue="placement"
@change="onChange"
>
<a-radio value="top">top</a-radio>
<a-radio value="right">right</a-radio>
<a-radio value="bottom">bottom</a-radio>
<a-radio value="left">left</a-radio>
</a-radio-group>
<a-button type="primary" @click="showDrawer">
Open
</a-button>
<a-drawer
title="Basic Drawer"
:placement="placement"
:closable="false"
@close="onClose"
:visible="visible"
>
<p>Some contents...</p>
<p>Some contents...</p>
<p>Some contents...</p>
</a-drawer>
</div>
</template>
<script>
export default {
data() {
return {
visible: false,
placement: 'left'
}
},
methods: {
showDrawer() {
this.visible = true
},
onClose() {
this.visible = false
},
onChange(e) {
this.placement = e.target.value
}
},
}
</script>
```

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

@ -12,10 +12,12 @@
| maskStyle | Style for Drawer's mask element. | object | {} | | maskStyle | Style for Drawer's mask element. | object | {} |
| title | The title for Drawer. | string\|slot | - | | title | The title for Drawer. | string\|slot | - |
| visible | Whether the Drawer dialog is visible or not. | boolean | false | | visible | Whether the Drawer dialog is visible or not. | boolean | false |
| width | Width of the Drawer dialog. | string\|number | 256 |
| wrapClassName | The class name of the container of the Drawer dialog. | string | - | | wrapClassName | The class name of the container of the Drawer dialog. | string | - |
| width | Width of the Drawer dialog. | string\|number | 256 |
| height | placement is `top` or `bottom`, height of the Drawer dialog. | string\|number | - |
| className | The class name of the container of the Drawer dialog. | string | - |
| zIndex | The `z-index` of the Drawer. | Number | 1000 | | zIndex | The `z-index` of the Drawer. | Number | 1000 |
| placement | The placement of the Drawer. | 'left' \| 'right' | 'right' | placement | The placement of the Drawer. | 'top' \| 'right' \| 'bottom' \| 'left' | 'right' |
## Methods ## Methods

71
components/drawer/index.jsx
View File

@ -1,7 +1,10 @@
import warning from 'warning'
import classNames from 'classnames'
import VcDrawer from '../vc-drawer/src' import VcDrawer from '../vc-drawer/src'
import PropTypes from '../_util/vue-types' import PropTypes from '../_util/vue-types'
import BaseMixin from '../_util/BaseMixin' import BaseMixin from '../_util/BaseMixin'
import { getComponentFromProp, getOptionProps } from '../_util/props-util' import Icon from '../icon'
import { getComponentFromProp, getOptionProps, getClass } from '../_util/props-util'
const Drawer = { const Drawer = {
name: 'ADrawer', name: 'ADrawer',
@ -10,14 +13,15 @@ const Drawer = {
destroyOnClose: PropTypes.bool, destroyOnClose: PropTypes.bool,
getContainer: PropTypes.any, getContainer: PropTypes.any,
maskClosable: PropTypes.bool.def(true), maskClosable: PropTypes.bool.def(true),
mask: PropTypes.bool, mask: PropTypes.bool.def(true),
maskStyle: PropTypes.object, maskStyle: PropTypes.object,
title: PropTypes.any, title: PropTypes.any,
visible: PropTypes.bool, visible: PropTypes.bool,
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(256), width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(256),
height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(256),
zIndex: PropTypes.number, zIndex: PropTypes.number,
prefixCls: PropTypes.string.def('ant-drawer'), prefixCls: PropTypes.string.def('ant-drawer'),
placement: PropTypes.string.def('right'), placement: PropTypes.oneOf(['top', 'right', 'bottom', 'left']).def('right'),
level: PropTypes.any.def(null), level: PropTypes.any.def(null),
wrapClassName: PropTypes.string, wrapClassName: PropTypes.string,
}, },
@ -88,7 +92,16 @@ const Drawer = {
getDestoryOnClose () { getDestoryOnClose () {
return this.destroyOnClose && !this.visible return this.destroyOnClose && !this.visible
}, },
// get drawar push width or height
getPushTransform (placement) {
if (placement === 'left' || placement === 'right') {
return `translateX(${placement === 'left' ? 180 : -180}px)`
}
if (placement === 'top' || placement === 'bottom') {
return `translateY(${placement === 'top' ? 180 : -180}px)`
}
},
// render drawer body dom
renderBody () { renderBody () {
if (this.destoryClose && !this.visible) { if (this.destoryClose && !this.visible) {
return null return null
@ -110,6 +123,7 @@ const Drawer = {
} }
const { prefixCls, closable } = this.$props const { prefixCls, closable } = this.$props
const title = getComponentFromProp(this, 'title') const title = getComponentFromProp(this, 'title')
// is have header dom
let header let header
if (title) { if (title) {
header = ( header = (
@ -118,6 +132,7 @@ const Drawer = {
</div> </div>
) )
} }
// is have closer button
let closer let closer
if (closable) { if (closable) {
closer = ( closer = (
@ -127,7 +142,9 @@ const Drawer = {
aria-label='Close' aria-label='Close'
class={`${prefixCls}-close`} class={`${prefixCls}-close`}
> >
<span class={`${prefixCls}-close-x`} /> <span class={`${prefixCls}-close-x`}>
<Icon type='close'/>
</span>
</button> </button>
) )
} }
@ -146,31 +163,49 @@ const Drawer = {
</div> </div>
) )
}, },
getRcDrawerStyle () {
const { zIndex, placement, maskStyle } = this.$props
return this.$data._push
? {
...maskStyle,
zIndex,
transform: this.getPushTransform(placement),
}
: {
...maskStyle,
zIndex,
}
},
}, },
render () { render () {
const props = getOptionProps(this) const props = getOptionProps(this)
const { zIndex, visible, placement, mask, wrapClassName, ...rest } = props const { width, height, visible, placement, wrapClassName, ...rest } = props
const vcDrawerStyle = this.$data._push const haveMask = rest.mask ? '' : 'no-mask'
? { const offsetStyle = {}
zIndex, if (placement === 'left' || placement === 'right') {
transform: `translateX(${placement === 'left' ? 180 : -180}px)`, offsetStyle.width = typeof width === 'number' ? `${width}px` : width
} } else {
: { zIndex } offsetStyle.height = typeof height === 'number' ? `${height}px` : height
}
const vcDrawerProps = { const vcDrawerProps = {
props: { props: {
handler: false, handler: false,
open: visible,
showMask: mask,
placement,
wrapClassName,
...rest, ...rest,
...offsetStyle,
open: visible,
showMask: props.mask,
placement,
wrapClassName: classNames({
[wrapClassName]: !!wrapClassName,
[haveMask]: !!haveMask,
}),
}, },
on: { on: {
maskClick: this.onMaskClick, maskClick: this.onMaskClick,
...this.$listeners, ...this.$listeners,
}, },
style: vcDrawerStyle, style: this.getRcDrawerStyle(),
} }
return ( return (
<VcDrawer <VcDrawer

5
components/drawer/index.zh-CN.md
View File

@ -10,10 +10,11 @@
| maskStyle | 遮罩样式 | object | {} | | maskStyle | 遮罩样式 | object | {} |
| title | 标题 | string \| slot | - | | title | 标题 | string \| slot | - |
| visible | Drawer 是否可见 | boolean | - | | visible | Drawer 是否可见 | boolean | - |
| width | 宽度 | string \| number | 256 |
| wrapClassName | 对话框外层容器的类名 | string | - | | wrapClassName | 对话框外层容器的类名 | string | - |
| width | 宽度 | string \| number | 256 |
| height | 高度, 在 `placement` 为 `top` 或 `bottom` 时使用 | string \| number | 256 |
| zIndex | 设置 Drawer 的 `z-index` | Number | 1000 | | zIndex | 设置 Drawer 的 `z-index` | Number | 1000 |
| placement | 抽屉的方向 | 'left' \| 'right' | 'right' | placement | 抽屉的方向 | 'top' \| 'right' \| 'bottom' \| 'left' | 'right'
## 方法 ## 方法

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

@ -20,7 +20,7 @@ exports[`renders ./components/input/demo/basic.md correctly 1`] = `<input placeh
exports[`renders ./components/input/demo/group.md correctly 1`] = ` exports[`renders ./components/input/demo/group.md correctly 1`] = `
<div><span class="ant-input-group ant-input-group-lg"><div class="ant-col-5"><input defaultvalue="0571" type="text" class="ant-input"></div><div class="ant-col-8"><input defaultvalue="26888888" type="text" class="ant-input"></div></span> <br> <span class="ant-input-group ant-input-group-compact"><input defaultvalue="0571" type="text" class="ant-input" style="width: 20%;"><input defaultvalue="26888888" type="text" class="ant-input" style="width: 30%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Zhejiang" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Zhejiang</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div> <div><span class="ant-input-group ant-input-group-lg"><div class="ant-col-5"><input defaultvalue="0571" type="text" class="ant-input"></div><div class="ant-col-8"><input defaultvalue="26888888" type="text" class="ant-input"></div></span> <br> <span class="ant-input-group ant-input-group-compact"><input defaultvalue="0571" type="text" class="ant-input" style="width: 20%;"><input defaultvalue="26888888" type="text" class="ant-input" style="width: 30%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Zhejiang" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Zhejiang</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</div><input defaultvalue="Xihu District, Hangzhou" type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div> </div><input defaultvalue="Xihu District, Hangzhou" type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</div><input defaultvalue="input content" type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><input defaultvalue="input content" type="text" class="ant-input" style="width: 50%;"><span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><span class="ant-calendar-picker-icon"></span></div></span></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1-1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option1-1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div> </div><input defaultvalue="input content" type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><input defaultvalue="input content" type="text" class="ant-input" style="width: 50%;"><span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><i class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span></span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1-1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option1-1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</div> </div>
<div class="ant-select ant-select-enabled"> <div class="ant-select ant-select-enabled">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"> <div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single">

653
components/locale-provider/__tests__/__snapshots__/demo.test.js.snap
View File

@ -35,345 +35,346 @@ exports[`renders ./components/locale-provider/demo/all.md correctly 1`] = `
</div> </div>
</div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span> </div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span>
</div> </div>
</div> <span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><span class="ant-calendar-picker-icon"></span> </div> <span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><i class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" id="" class="ant-time-picker-input"><span class="ant-time-picker-icon"></span></span> <span tabindex="0" class="ant-calendar-picker" style="width: 200px;"><span class="ant-calendar-picker-input ant-input"><input readonly="true" placeholder="Start date" tabindex="-1" class="ant-calendar-range-picker-input"><span class="ant-calendar-range-picker-separator"> ~ </span><input readonly="true" placeholder="End date" tabindex="-1" class="ant-calendar-range-picker-input"><i class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
</div></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" id="" class="ant-time-picker-input"><span class="ant-time-picker-icon"></span></span> <span tabindex="0" class="ant-calendar-picker" style="width: 200px;"><span class="ant-calendar-picker-input ant-input"><input readonly="true" placeholder="Start date" tabindex="-1" class="ant-calendar-range-picker-input"><span class="ant-calendar-range-picker-separator"> ~ </span><input readonly="true" placeholder="End date" tabindex="-1" class="ant-calendar-range-picker-input"><span class="ant-calendar-picker-icon"></span></span></span> <path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path>
</div> </svg></i></span></span>
<div class="example"><button type="button" class="ant-btn ant-btn-primary"><span>Show Modal</span></button> <button type="button" class="ant-btn ant-btn-default"><span>Show info</span></button> <button type="button" class="ant-btn ant-btn-default"><span>Show confirm</span></button> <a href="#" class="">Click to confirm</a></div> </div>
<div classname="example"> <div class="example"><button type="button" class="ant-btn ant-btn-primary"><span>Show Modal</span></button> <button type="button" class="ant-btn ant-btn-default"><span>Show info</span></button> <button type="button" class="ant-btn ant-btn-default"><span>Show confirm</span></button> <a href="#" class="">Click to confirm</a></div>
<div class="ant-transfer"> <div classname="example">
<div class="ant-transfer-list"> <div class="ant-transfer">
<div class="ant-transfer-list-header"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label><span class="ant-transfer-list-header-selected"><span>0 item</span><span class="ant-transfer-list-header-title"></span></span></div> <div class="ant-transfer-list">
<div class="ant-transfer-list-body ant-transfer-list-body-with-search"> <div class="ant-transfer-list-header"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label><span class="ant-transfer-list-header-selected"><span>0 item</span><span class="ant-transfer-list-header-title"></span></span></div>
<div class="ant-transfer-list-body-search-wrapper"> <div class="ant-transfer-list-body ant-transfer-list-body-with-search">
<div><input value="" placeholder="Search here" type="text" class="ant-input ant-transfer-list-search ant-transfer-list-search"><span class="ant-transfer-list-search-action"><i class="anticon anticon-search"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></div> <div class="ant-transfer-list-body-search-wrapper">
<div><input value="" placeholder="Search here" type="text" class="ant-input ant-transfer-list-search ant-transfer-list-search"><span class="ant-transfer-list-search-action"><i class="anticon anticon-search"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></div>
</div>
<ul class="ant-transfer-list-content"></ul>
<div class="ant-transfer-list-body-not-found">Not Found</div>
</div> </div>
<ul class="ant-transfer-list-content"></ul>
<div class="ant-transfer-list-body-not-found">Not Found</div>
</div> </div>
</div> <div class="ant-transfer-operation"><button type="button" disabled="disabled" class="ant-btn ant-btn-primary ant-btn-sm"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<div class="ant-transfer-operation"><button type="button" disabled="disabled" class="ant-btn ant-btn-primary ant-btn-sm"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""> <path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path>
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path> </svg></i></button><button type="button" disabled="disabled" class="ant-btn ant-btn-primary ant-btn-sm"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
</svg></i></button><button type="button" disabled="disabled" class="ant-btn ant-btn-primary ant-btn-sm"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""> <path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path>
<path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path> </svg></i></button></div>
</svg></i></button></div> <div class="ant-transfer-list">
<div class="ant-transfer-list"> <div class="ant-transfer-list-header"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label><span class="ant-transfer-list-header-selected"><span>0 item</span><span class="ant-transfer-list-header-title"></span></span></div>
<div class="ant-transfer-list-header"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label><span class="ant-transfer-list-header-selected"><span>0 item</span><span class="ant-transfer-list-header-title"></span></span></div> <div class="ant-transfer-list-body ant-transfer-list-body-with-search">
<div class="ant-transfer-list-body ant-transfer-list-body-with-search"> <div class="ant-transfer-list-body-search-wrapper">
<div class="ant-transfer-list-body-search-wrapper"> <div><input value="" placeholder="Search here" type="text" class="ant-input ant-transfer-list-search ant-transfer-list-search"><span class="ant-transfer-list-search-action"><i class="anticon anticon-search"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></div>
<div><input value="" placeholder="Search here" type="text" class="ant-input ant-transfer-list-search ant-transfer-list-search"><span class="ant-transfer-list-search-action"><i class="anticon anticon-search"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></div> </div>
<ul class="ant-transfer-list-content"></ul>
<div class="ant-transfer-list-body-not-found">Not Found</div>
</div> </div>
<ul class="ant-transfer-list-content"></ul>
<div class="ant-transfer-list-body-not-found">Not Found</div>
</div> </div>
</div> </div>
</div> </div>
</div> <div style="width: 319px; border: 1px solid #d9d9d9; border-radius: 4px;">
<div style="width: 319px; border: 1px solid #d9d9d9; border-radius: 4px;"> <div class="">
<div class=""> <div class="ant-fullcalendar-header">
<div class="ant-fullcalendar-header"> <div class="ant-select ant-select-enabled ant-select-sm ant-fullcalendar-year-select">
<div class="ant-select ant-select-enabled ant-select-sm ant-fullcalendar-year-select"> <div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"> <div class="ant-select-selection__rendered">
<div class="ant-select-selection__rendered"> <div title="2016" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">2016</div>
<div title="2016" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">2016</div> </div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span>
</div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span> </div>
</div> </div>
</div> <div class="ant-select ant-select-enabled ant-select-sm ant-fullcalendar-month-select">
<div class="ant-select ant-select-enabled ant-select-sm ant-fullcalendar-month-select"> <div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="0" class="ant-select-selection ant-select-selection--single"> <div class="ant-select-selection__rendered">
<div class="ant-select-selection__rendered"> <div title="Nov" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Nov</div>
<div title="Nov" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Nov</div> </div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span>
</div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span> </div>
</div> </div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-small"><label class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"><span class="ant-radio-button ant-radio-button-checked"><input type="radio" class="ant-radio-button-input" value="date"><span class="ant-radio-button-inner"></span></span><span>Month</span></label><label class="ant-radio-button-wrapper"><span class="ant-radio-button"><input type="radio" class="ant-radio-button-input" value="month"><span class="ant-radio-button-inner"></span></span><span>Year</span></label></div>
</div> </div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-small"><label class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"><span class="ant-radio-button ant-radio-button-checked"><input type="radio" class="ant-radio-button-input" value="date"><span class="ant-radio-button-inner"></span></span><span>Month</span></label><label class="ant-radio-button-wrapper"><span class="ant-radio-button"><input type="radio" class="ant-radio-button-input" value="month"><span class="ant-radio-button-inner"></span></span><span>Year</span></label></div> <div tabindex="0" class="ant-fullcalendar ant-fullcalendar-full">
</div> <div class="ant-fullcalendar-calendar-body">
<div tabindex="0" class="ant-fullcalendar ant-fullcalendar-full"> <table cellspacing="0" role="grid" class="ant-fullcalendar-table">
<div class="ant-fullcalendar-calendar-body"> <thead>
<table cellspacing="0" role="grid" class="ant-fullcalendar-table"> <tr role="row">
<thead> <th role="columnheader" title="Sun" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Su</span></th>
<tr role="row"> <th role="columnheader" title="Mon" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Mo</span></th>
<th role="columnheader" title="Sun" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Su</span></th> <th role="columnheader" title="Tue" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Tu</span></th>
<th role="columnheader" title="Mon" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Mo</span></th> <th role="columnheader" title="Wed" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">We</span></th>
<th role="columnheader" title="Tue" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Tu</span></th> <th role="columnheader" title="Thu" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Th</span></th>
<th role="columnheader" title="Wed" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">We</span></th> <th role="columnheader" title="Fri" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Fr</span></th>
<th role="columnheader" title="Thu" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Th</span></th> <th role="columnheader" title="Sat" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Sa</span></th>
<th role="columnheader" title="Fri" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Fr</span></th> </tr>
<th role="columnheader" title="Sat" class="ant-fullcalendar-column-header"><span class="ant-fullcalendar-column-header-inner">Sa</span></th> </thead>
</tr> <tbody class="ant-fullcalendar-tbody">
</thead> <tr role="row" class="">
<tbody class="ant-fullcalendar-tbody"> <td role="gridcell" title="October 30, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-month-cell">
<tr role="row" class=""> <div class="ant-fullcalendar-date">
<td role="gridcell" title="October 30, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-month-cell"> <div class="ant-fullcalendar-value">30</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">30</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="October 31, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-month-cell ant-fullcalendar-last-day-of-month">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="October 31, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-month-cell ant-fullcalendar-last-day-of-month"> <div class="ant-fullcalendar-value">31</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">31</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 1, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 1, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">01</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">01</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 2, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 2, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">02</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">02</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 3, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 3, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">03</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">03</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 4, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 4, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">04</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">04</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 5, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 5, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">05</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">05</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> <tr role="row" class="">
</tr> <td role="gridcell" title="November 6, 2016" class="ant-fullcalendar-cell">
<tr role="row" class=""> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 6, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">06</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">06</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 7, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 7, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">07</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">07</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 8, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 8, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">08</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">08</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 9, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 9, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">09</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">09</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 10, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 10, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">10</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">10</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 11, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 11, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">11</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">11</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 12, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 12, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">12</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">12</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> <tr role="row" class="">
</tr> <td role="gridcell" title="November 13, 2016" class="ant-fullcalendar-cell">
<tr role="row" class=""> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 13, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">13</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">13</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 14, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 14, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">14</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">14</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 15, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 15, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">15</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">15</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 16, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 16, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">16</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">16</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 17, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 17, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">17</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">17</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 18, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 18, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">18</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">18</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 19, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 19, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">19</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">19</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> <tr role="row" class="ant-fullcalendar-current-week ant-fullcalendar-active-week">
</tr> <td role="gridcell" title="November 20, 2016" class="ant-fullcalendar-cell">
<tr role="row" class="ant-fullcalendar-current-week ant-fullcalendar-active-week"> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 20, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">20</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">20</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 21, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 21, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">21</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">21</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 22, 2016" class="ant-fullcalendar-cell ant-fullcalendar-today ant-fullcalendar-selected-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 22, 2016" class="ant-fullcalendar-cell ant-fullcalendar-today ant-fullcalendar-selected-day"> <div class="ant-fullcalendar-value">22</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">22</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 23, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 23, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">23</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">23</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 24, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 24, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">24</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">24</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 25, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 25, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">25</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">25</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 26, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 26, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">26</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">26</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> <tr role="row" class="">
</tr> <td role="gridcell" title="November 27, 2016" class="ant-fullcalendar-cell">
<tr role="row" class=""> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 27, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">27</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">27</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 28, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 28, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">28</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">28</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 29, 2016" class="ant-fullcalendar-cell">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 29, 2016" class="ant-fullcalendar-cell"> <div class="ant-fullcalendar-value">29</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">29</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="November 30, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-day-of-month">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="November 30, 2016" class="ant-fullcalendar-cell ant-fullcalendar-last-day-of-month"> <div class="ant-fullcalendar-value">30</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">30</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 1, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 1, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">01</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">01</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 2, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 2, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">02</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">02</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 3, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 3, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">03</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">03</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> <tr role="row" class="">
</tr> <td role="gridcell" title="December 4, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
<tr role="row" class=""> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 4, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">04</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">04</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 5, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 5, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">05</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">05</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 6, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 6, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">06</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">06</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 7, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 7, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">07</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">07</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 8, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 8, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">08</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">08</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 9, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 9, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">09</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">09</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> <td role="gridcell" title="December 10, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day">
</td> <div class="ant-fullcalendar-date">
<td role="gridcell" title="December 10, 2016" class="ant-fullcalendar-cell ant-fullcalendar-next-month-btn-day"> <div class="ant-fullcalendar-value">10</div>
<div class="ant-fullcalendar-date"> <div class="ant-fullcalendar-content"></div>
<div class="ant-fullcalendar-value">10</div> </div>
<div class="ant-fullcalendar-content"></div> </td>
</div> </tr>
</td> </tbody>
</tr> </table>
</tbody> </div>
</table>
</div> </div>
</div> </div>
</div> </div>
<!---->
</div> </div>
<!---->
</div>
</div> </div>
`; `;

23802
components/locale-provider/__tests__/__snapshots__/index.test.js.snap
View File

File diff suppressed because it is too large Load Diff