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 select

pull/309/head
tangjinzhou 2018-12-11 11:40:27 +08:00
parent 0eafff36d8
commit 4e0d5ce4b7
19 changed files with 379 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/_util/vnode.js
View File

@ -51,7 +51,7 @@ export function cloneVNodes (vnodes, deep) {
return res
}
export function cloneElement (n, nodeProps, deep) {
export function cloneElement (n, nodeProps = {}, deep) {
let ele = n
if (Array.isArray(n)) {
ele = filterEmpty(n)[0]

12
components/auto-complete/__tests__/__snapshots__/demo.test.js.snap
View File

@ -10,7 +10,7 @@ exports[`renders ./components/auto-complete/demo/basic.md correctly 1`] = `
<div class="ant-select-search__field__wrap"><input value="" type="text" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -26,7 +26,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
<div class="ant-select-search__field__wrap"><span class="ant-input-affix-wrapper ant-select-search__field" value=""><input value="" type="text" class="ant-input"><span class="ant-input-suffix"><i class="certain-category-icon 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></span><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</div>
@ -41,7 +41,7 @@ exports[`renders ./components/auto-complete/demo/custom.md correctly 1`] = `
<div class="ant-select-search__field__wrap"><textarea value="" placeholder="input here" class="custom ant-input ant-select-search__field" style="height: 50px;"></textarea><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -56,7 +56,7 @@ exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly
<div class="ant-select-search__field__wrap"><input value="" type="text" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -71,7 +71,7 @@ exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
<div class="ant-select-search__field__wrap"><input value="" type="text" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -87,7 +87,7 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly
<div class="ant-select-search__field__wrap"><span class="ant-input-affix-wrapper ant-select-search__field" value=""><input value="" type="text" class="ant-input"><span class="ant-input-suffix"><button type="button" class="search-btn ant-btn ant-btn-primary ant-btn-lg"><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></button></span></span><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</div>

20
components/calendar/__tests__/__snapshots__/demo.test.js.snap
View File

@ -7,14 +7,14 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled ant-fullcalendar-month-select">
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default"><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>
@ -313,14 +313,14 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<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 class="ant-select-selection__rendered">
<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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</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>
@ -619,14 +619,14 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled ant-fullcalendar-month-select">
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default"><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>
@ -1032,14 +1032,14 @@ exports[`renders ./components/calendar/demo/select.md correctly 1`] = `
<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="2017" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">2017</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled ant-fullcalendar-month-select">
<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="Jan" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Jan</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default"><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>
@ -1336,14 +1336,14 @@ exports[`renders ./components/calendar/demo/select.md correctly 1`] = `
<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="2017" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">2017</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled ant-fullcalendar-month-select">
<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="Jan" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Jan</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default"><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>

4
components/calendar/__tests__/__snapshots__/index.test.js.snap
View File

@ -7,14 +7,14 @@ exports[`Calendar Calendar should support locale 1`] = `
<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="2018年" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">2018年</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled ant-fullcalendar-month-select">
<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="Oct" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Oct</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-radio-group ant-radio-group-outline ant-radio-group-default"><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>月</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>年</span></label></div>

21
components/date-picker/__tests__/DatePicker.test.js
View File

@ -146,28 +146,25 @@ describe('DatePicker', () => {
}, { sync: false, attachToDocument: true })
await asyncExpect(() => {
openPanel(wrapper)
})
}, 0)
await asyncExpect(() => {
nextYear()
}, 1000)
await asyncExpect(() => {
expect(handleChange).not.toBeCalled()
}, 0)
await asyncExpect(() => {
nextMonth()
}, 0)
await asyncExpect(() => {
expect(handleChange).not.toBeCalled()
})
await asyncExpect(() => {
nextMonth()
})
await asyncExpect(() => {
expect(handleChange).not.toBeCalled()
})
await asyncExpect(() => {
selectDateFromBody(moment('2017-12-22'))
})
}, 1000)
await asyncExpect(() => {
expect(handleChange).toBeCalled()
})
await asyncExpect(() => {
})
}, 0)
})
it('clear input', async () => {

10
components/form/__tests__/__snapshots__/demo.test.js.snap
View File

@ -129,7 +129,7 @@ exports[`renders ./components/form/demo/coordinated.vue correctly 1`] = `
<div class="ant-row ant-form-item">
<div class="ant-col-5 ant-form-item-label"><label for="gender" title="Gender" class="ant-form-item-required">Gender</label></div>
<div class="ant-col-12 ant-form-item-control-wrapper">
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-select ant-select-enabled" data-__meta="[object Object]" data-__field="[object Object]" id="gender"><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 unselectable="on" class="ant-select-selection__placeholder" style="display: block;">Select a option and change input text above</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-select ant-select-enabled" data-__meta="[object Object]" data-__field="[object Object]" id="gender"><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 unselectable="on" class="ant-select-selection__placeholder" style="display: block;">Select a option and change input text above</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span>
<!---->
</div>
@ -383,7 +383,7 @@ exports[`renders ./components/form/demo/register.vue correctly 1`] = `
<div class="ant-row ant-form-item">
<div class="ant-col-xs-24 ant-col-sm-8 ant-form-item-label"><label for="phone" title="Phone Number" class="ant-form-item-required">Phone Number</label></div>
<div class="ant-col-xs-24 ant-col-sm-16 ant-form-item-control-wrapper">
<div class="ant-form-item-control"><span class="ant-form-item-children"><span class="ant-input-group-wrapper" style="width: 100%;"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 70px;" data-__meta="[object Object]" data-__field="[object Object]" id="prefix"><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="+86" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">+86</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
<div class="ant-form-item-control"><span class="ant-form-item-children"><span class="ant-input-group-wrapper" style="width: 100%;"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 70px;" data-__meta="[object Object]" data-__field="[object Object]" id="prefix"><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="+86" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">+86</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span><input type="text" data-__meta="[object Object]" data-__field="[object Object]" id="phone" class="ant-input"></span></span></span>
<!---->
</div>
@ -395,7 +395,7 @@ exports[`renders ./components/form/demo/register.vue correctly 1`] = `
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-select ant-select-combobox ant-select-enabled ant-select-show-search ant-select-auto-complete" data-__meta="[object Object]" data-__field="[object Object]" id="website"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div unselectable="on" class="ant-select-selection__placeholder" style="display: block;">website</div><ul><li class="ant-select-search ant-select-search--inline"><div class="ant-select-search__field__wrap"><input value="" type="text" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div></span>
<!---->
@ -506,7 +506,7 @@ exports[`renders ./components/form/demo/validate-other.vue correctly 1`] = `
<div class="ant-row ant-form-item">
<div class="ant-col-6 ant-form-item-label"><label for="select" title="Select" class="ant-form-item-required">Select</label></div>
<div class="ant-col-14 ant-form-item-control-wrapper">
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-select ant-select-enabled" data-__meta="[object Object]" data-__field="[object Object]" id="select"><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 unselectable="on" class="ant-select-selection__placeholder" style="display: block;">Please select a country</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-select ant-select-enabled" data-__meta="[object Object]" data-__field="[object Object]" id="select"><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 unselectable="on" class="ant-select-selection__placeholder" style="display: block;">Please select a country</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span>
<!---->
</div>
@ -674,7 +674,7 @@ exports[`renders ./components/form/demo/validate-static.vue correctly 1`] = `
<div class="ant-row ant-form-item">
<div class="ant-col-xs-24 ant-col-sm-5 ant-form-item-label"><label title="Error" class="">Error</label></div>
<div class="ant-col-xs-24 ant-col-sm-12 ant-form-item-control-wrapper">
<div class="ant-form-item-control has-feedback has-error"><span class="ant-form-item-children"><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="Option 1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option 1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
<div class="ant-form-item-control has-feedback has-error"><span class="ant-form-item-children"><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="Option 1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option 1</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span>
<!---->
</div>

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

@ -3,8 +3,8 @@
exports[`renders ./components/input/demo/addon.md correctly 1`] = `
<div>
<div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon">Http://</span><input defaultvalue="mysite" type="text" class="ant-input"><span class="ant-input-group-addon">.com</span></span></span></div>
<div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 90px;"><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="Http://" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Http://</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</div></span><input defaultvalue="mysite" type="text" class="ant-input"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 80px;"><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=".com" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">.com</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
<div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 90px;"><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="Http://" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Http://</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span><input defaultvalue="mysite" type="text" class="ant-input"><span class="ant-input-group-addon"><div class="ant-select ant-select-enabled" style="width: 80px;"><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=".com" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">.com</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div></span></span></span></div>
<div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><input defaultvalue="mysite" type="text" class="ant-input"><span class="ant-input-group-addon"><i class="anticon anticon-setting"><svg viewBox="64 64 896 896" data-icon="setting" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 0 0 9.3-35.2l-.9-2.6a443.74 443.74 0 0 0-79.7-137.9l-1.8-2.1a32.12 32.12 0 0 0-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 0 0-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 0 0-25.8 25.7l-15.8 85.4a351.86 351.86 0 0 0-99 57.4l-81.9-29.1a32 32 0 0 0-35.1 9.5l-1.8 2.1a446.02 446.02 0 0 0-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 0 0-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0 0 35.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0 0 25.8 25.7l2.7.5a449.4 449.4 0 0 0 159 0l2.7-.5a32.05 32.05 0 0 0 25.8-25.7l15.7-85a350 350 0 0 0 99.7-57.6l81.3 28.9a32 32 0 0 0 35.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 0 1-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 0 1-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 0 1 512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 0 1 400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 0 1 624 502c0 29.9-11.7 58-32.8 79.2z"></path></svg></i></span></span></span></div>
</div>
@ -18,19 +18,19 @@ exports[`renders ./components/input/demo/autosize-textarea.md correctly 1`] = `
exports[`renders ./components/input/demo/basic.md correctly 1`] = `<input placeholder="Basic usage" type="text" class="ant-input">`;
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><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"><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><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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div>
<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="Option2-2" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Option2-2</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</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="Between" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Between</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</div><input placeholder="Minimum" type="text" class="ant-input" style="width: 100px; text-align: center;"><input placeholder="~" type="text" disabled="disabled" class="ant-input ant-input-disabled" style="width: 30px; border-left: 0; pointer-events: none; background-color: rgb(255, 255, 255);"><input placeholder="Maximum" type="text" class="ant-input" style="width: 100px; text-align: center; border-left: 0;"></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="Sign Up" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Sign Up</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</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="Between" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Between</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div><input placeholder="Minimum" type="text" class="ant-input" style="width: 100px; text-align: center;"><input placeholder="~" type="text" disabled="disabled" class="ant-input ant-input-disabled" style="width: 30px; border-left: 0; pointer-events: none; background-color: rgb(255, 255, 255);"><input placeholder="Maximum" type="text" class="ant-input" style="width: 100px; text-align: center; border-left: 0;"></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="Sign Up" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Sign Up</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div>
<div class="ant-select ant-select-combobox ant-select-enabled ant-select-show-search ant-select-auto-complete" style="width: 200px;">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" class="ant-select-selection ant-select-selection--single">
@ -41,10 +41,10 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
<div class="ant-select-search__field__wrap"><input value="" type="text" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
</li>
</ul>
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled" style="width: 30%;"><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="Home" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Home</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon"></i></span></div>
</span> <br> <span class="ant-input-group ant-input-group-compact"><div class="ant-select ant-select-enabled" style="width: 30%;"><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="Home" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Home</div></div><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
</div><span tabindex="0" class="ant-cascader-picker" style="width: 70%;"><input value="" placeholder="Select Address" type="text" readonly="true" class="ant-input ant-cascader-input ant-cascader-input "><span class="ant-cascader-picker-label"></span><i class="ant-cascader-picker-arrow anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
</svg></i></span></span></div>

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

@ -24,7 +24,7 @@ exports[`renders ./components/locale-provider/demo/all.md correctly 1`] = `
<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="10 / page" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">10 / page</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</li>
@ -37,7 +37,7 @@ exports[`renders ./components/locale-provider/demo/all.md correctly 1`] = `
<div class="ant-select-search ant-select-search--inline" style="display: none;">
<div class="ant-select-search__field__wrap"><input autocomplete="off" value="" class="ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</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"><i class="ant-time-picker-clock-icon anticon anticon-clock-circle"><svg viewBox="64 64 896 896" data-icon="clock-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 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></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="">
<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>
@ -80,14 +80,14 @@ exports[`renders ./components/locale-provider/demo/all.md correctly 1`] = `
<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="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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<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 class="ant-select-selection__rendered">
<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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</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>
@ -400,7 +400,7 @@ exports[`renders ./components/locale-provider/demo/basic.md correctly 1`] = `
<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="10 / page" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">10 / page</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</li>

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

File diff suppressed because it is too large Load Diff

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

@ -14,7 +14,7 @@ exports[`renders ./components/notification/demo/placement.md correctly 1`] = `
<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="topRight" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">topRight</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div> <button type="button" class="ant-btn ant-btn-primary"><span>Open the notification box</span></button>
</div>

8
components/pagination/__tests__/__snapshots__/demo.test.js.snap
View File

@ -42,7 +42,7 @@ exports[`renders ./components/pagination/demo/changer.md correctly 1`] = `
<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="10 / page" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">10 / page</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</li>
@ -71,7 +71,7 @@ exports[`renders ./components/pagination/demo/changer.md correctly 1`] = `
<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="20 / page" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">20 / page</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</li>
@ -116,7 +116,7 @@ exports[`renders ./components/pagination/demo/custom-changer.md correctly 1`] =
<div class="ant-select-selection-selected-value" style="display: block; opacity: 1;"><span>10条/页</span>
<!---->
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</li>
@ -200,7 +200,7 @@ exports[`renders ./components/pagination/demo/mini.md correctly 1`] = `
<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="10 / page" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">10 / page</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-pagination-options-quick-jumper">Goto<input type="text"></div>

49
components/select/__tests__/__snapshots__/demo.test.js.snap
View File

@ -20,14 +20,14 @@ exports[`renders ./components/select/demo/basic.md correctly 1`] = `
<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="Lucy" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-disabled" style="width: 120px;">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="-1" class="ant-select-selection ant-select-selection--single">
<div class="ant-select-selection__rendered">
<div title="Lucy" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</div>
@ -39,14 +39,14 @@ exports[`renders ./components/select/demo/coordinate.md correctly 1`] = `
<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><span unselectable="unselectable" class="ant-select-arrow"><i class="ant-select-arrow-icon anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-enabled" style="width: 120px;">
<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="Hangzhou" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Hangzhou</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
</div>
@ -57,7 +57,7 @@ exports[`renders ./components/select/demo/label-in-value.md correctly 1`] = `
<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="Lucy (101)" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy (101)</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -69,10 +69,10 @@ exports[`renders ./components/select/demo/multiple.md correctly 1`] = `
<div unselectable="on" class="ant-select-selection__placeholder" style="display: none;">Please select</div>
<div>
<li unselectable="unselectable" title="a1" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">a1</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
<div class="ant-select-selection__choice__content">a1</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li unselectable="unselectable" title="b2" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">b2</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
<div class="ant-select-selection__choice__content">b2</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li class="ant-select-search ant-select-search--inline">
<div class="ant-select-search__field__wrap"><input autocomplete="off" value="" class="ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
@ -88,7 +88,7 @@ exports[`renders ./components/select/demo/optgroup.md correctly 1`] = `
<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="Lucy" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -98,7 +98,7 @@ exports[`renders ./components/select/demo/options.md correctly 1`] = `
<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="北京 010" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">北京</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -111,7 +111,7 @@ exports[`renders ./components/select/demo/search.md correctly 1`] = `
<div class="ant-select-search ant-select-search--inline" style="display: none;">
<div class="ant-select-search__field__wrap"><input autocomplete="off" value="" class="ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div>
`;
@ -155,7 +155,7 @@ exports[`renders ./components/select/demo/size.md correctly 1`] = `
" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
a1
</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 anticon anticon-down"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
</div>
</div> <br>
<div class="ant-select ant-select-enabled" style="width: 200px;">
@ -168,14 +168,14 @@ exports[`renders ./components/select/demo/size.md correctly 1`] = `
" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">
a1
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li unselectable="unselectable" title="
b2
" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">
b2
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li class="ant-select-search ant-select-search--inline">
<div class="ant-select-search__field__wrap"><input autocomplete="off" value="" class="ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
@ -194,14 +194,14 @@ exports[`renders ./components/select/demo/size.md correctly 1`] = `
" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">
a1
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li unselectable="unselectable" title="
b2
" class="ant-select-selection__choice">
<div class="ant-select-selection__choice__content">
b2
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-selection__choice__remove-icon">×</i></span>
</div><span class="ant-select-selection__choice__remove"><i class="ant-select-remove-icon 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>
</li>
<li class="ant-select-search ant-select-search--inline">
<div class="ant-select-search__field__wrap"><input autocomplete="off" value="" class="ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
@ -213,6 +213,25 @@ exports[`renders ./components/select/demo/size.md correctly 1`] = `
</div>
`;
exports[`renders ./components/select/demo/suffix.md correctly 1`] = `
<div>
<div class="ant-select ant-select-enabled" style="width: 120px;">
<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="Lucy" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy</div>
</div><span unselectable="unselectable" class="ant-select-arrow"><i class="anticon anticon-smile"><svg viewBox="64 64 896 896" data-icon="smile" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"></path></svg></i></span>
</div>
</div>
<div class="ant-select ant-select-disabled" style="width: 120px;">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="-1" class="ant-select-selection ant-select-selection--single">
<div class="ant-select-selection__rendered">
<div title="Lucy" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Lucy</div>
</div><span unselectable="unselectable" class="ant-select-arrow"><i class="anticon anticon-meh"><svg viewBox="64 64 896 896" data-icon="meh" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 565H360c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h304c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"></path></svg></i></span>
</div>
</div>
</div>
`;
exports[`renders ./components/select/demo/tags.md correctly 1`] = `
<div class="ant-select ant-select-enabled" style="width: 100%;">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" class="ant-select-selection ant-select-selection--multiple">

52
components/select/__tests__/index.test.js
View File

@ -92,4 +92,56 @@ describe('Select', () => {
expect(dropdownWrapper.findAll({ name: 'MenuItem' }).at(0).text()).toBe('not at all')
})
})
it('should be controlled by open prop', async () => {
const onDropdownVisibleChange = jest.fn()
const wrapper = mount({
props: {
open: {
type: Boolean,
default: true,
},
},
render () {
return (
<Select open={this.open} onDropdownVisibleChange={onDropdownVisibleChange}>
<Option value='1'>1</Option>
</Select>
)
},
}, { sync: false })
let triggerComponent = null
mount({
render () {
triggerComponent = wrapper.find({ name: 'Trigger' }).vm.getComponent()
return triggerComponent
},
}, { sync: false })
await asyncExpect(() => {
// console.log(triggerComponent.componentInstance.visible)
expect(triggerComponent.componentInstance.visible).toBe(true)
})
await asyncExpect(() => {
wrapper.find('.ant-select').trigger('click')
expect(onDropdownVisibleChange).toHaveBeenLastCalledWith(false)
})
await asyncExpect(() => {
expect(triggerComponent.componentInstance.visible).toBe(true)
wrapper.setProps({ open: false })
})
await asyncExpect(() => {
mount({
render () {
triggerComponent = wrapper.find({ name: 'Trigger' }).vm.getComponent()
return triggerComponent
},
}, { sync: false })
})
await asyncExpect(() => {
expect(triggerComponent.componentInstance.visible).toBe(false)
wrapper.find('.ant-select').trigger('click')
expect(onDropdownVisibleChange).toHaveBeenLastCalledWith(true)
expect(triggerComponent.componentInstance.visible).toBe(false)
})
})
})

2
components/select/demo/index.vue
View File

@ -10,6 +10,7 @@ import Optgroup from './optgroup'
import SearchBox from './search-box'
import Search from './search'
import SelectUsers from './select-users'
import Suffix from './suffix'
import CN from '../index.zh-CN.md'
import US from '../index.en-US.md'
@ -48,6 +49,7 @@ export default {
<SearchBox/>
<Search/>
<SelectUsers/>
<Suffix/>
<api>
<CN slot='cn' />
<US/>

38
components/select/demo/suffix.md Normal file
View File

@ -0,0 +1,38 @@
<cn>
#### 后缀图标
基本使用。
</cn>
<us>
#### Suffix
Basic Usage
</us>
```html
<template>
<div>
<a-select defaultValue="lucy" style="width: 120px" @change="handleChange">
<a-icon slot="suffixIcon" type="smile" />
<a-select-option value="jack">Jack</a-select-option>
<a-select-option value="lucy">Lucy</a-select-option>
<a-select-option value="disabled" disabled>Disabled</a-select-option>
<a-select-option value="Yiminghe">yiminghe</a-select-option>
</a-select>
<a-select defaultValue="lucy" style='width: 120px' disabled>
<a-icon slot="suffixIcon" type="meh" />
<a-select-option value="lucy">Lucy</a-select-option>
</a-select>
</div>
</template>
<script>
export default {
methods: {
handleChange(value) {
console.log(`selected ${value}`);
}
}
}
</script>
```

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

@ -12,6 +12,7 @@
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| allowClear | Show clear button. | boolean | false |
| autoClearSearchValue | Whether the current search will be cleared on selecting an item. Only applies when `mode` is set to `multiple` or `tags`. | boolean | true |
| autoFocus | Get focus by default | boolean | false |
| defaultActiveFirstOption | Whether active first option by default | boolean | true |
| defaultValue | Initial selected option. | string\|string\[]<br />number\|number\[] | - |
@ -33,9 +34,12 @@
| showSearch | Whether show search input in single mode. | boolean | false |
| showArrow | Whether to show the drop-down arrow | boolean | true |
| size | Size of Select input. `default` `large` `small` | string | default |
| suffixIcon | The custom suffix icon | string \| VNode \| slot | - |
| tokenSeparators | Separator used to tokenize on tag/multiple mode | string\[] | |
| value(v-model) | Current selected option. | string\|number\|string\[]\|number\[] | - |
| options | Data of the selectOption, manual construction work is no longer needed if this property has been set | array&lt;{value, label, [disabled, key, title]}> | \[] |
| defaultOpen | Initial open state of dropdown | boolean | - |
| open | Controlled open state of dropdown | boolean | - |
### events
| Events Name | Description | Arguments |
@ -50,7 +54,7 @@
| popupScroll | Called when dropdown scrolls | function |
| search | Callback function that is fired when input changed. | function(value: string) |
| select | Called when a option is selected, the params are option's value (or key) and option instance. | function(value, option:Option) |
| dropdownVisibleChange | Call when dropdown open | function(open) |
### Select Methods
@ -67,6 +71,7 @@
| key | Same usage as `value`. If Vue request you to set this property, you can set it to value of option, and then omit value property. | string | |
| title | `title` of Select after select this Option | string | - |
| value | default to filter with this property | string\|number | - |
| class | additional class to option | string | - |
### OptGroup props

46
components/select/index.jsx
View File

@ -1,10 +1,13 @@
import warning from 'warning'
import omit from 'omit.js'
import PropTypes from '../_util/vue-types'
import { Select as VcSelect, Option, OptGroup } from '../vc-select'
import LocaleReceiver from '../locale-provider/LocaleReceiver'
import defaultLocale from '../locale-provider/default'
import { getComponentFromProp, getOptionProps, filterEmpty } from '../_util/props-util'
import { getComponentFromProp, getOptionProps, filterEmpty, isValidElement } from '../_util/props-util'
import Icon from '../icon'
import { cloneElement } from '../_util/vnode'
const AbstractSelectProps = () => ({
prefixCls: PropTypes.string,
@ -33,6 +36,7 @@ const AbstractSelectProps = () => ({
getPopupContainer: PropTypes.func,
open: PropTypes.bool,
defaultOpen: PropTypes.bool,
autoClearSearchValue: PropTypes.bool,
})
const Value = PropTypes.shape({
key: PropTypes.string,
@ -57,12 +61,6 @@ const SelectProps = {
mode: PropTypes.string,
optionLabelProp: PropTypes.string,
firstActiveValue: PropTypes.oneOfType([String, PropTypes.arrayOf(String)]),
// onChange?: (value: SelectValue, option: React.ReactElement<any> | React.ReactElement<any>[]) => void;
// onSelect?: (value: SelectValue, option: React.ReactElement<any>) => any;
// onDeselect?: (value: SelectValue) => any;
// onBlur?: () => any;
// onFocus?: () => any;
// onInputKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
maxTagCount: PropTypes.number,
maxTagPlaceholder: PropTypes.any,
dropdownMatchSelectWidth: PropTypes.bool,
@ -72,6 +70,7 @@ const SelectProps = {
tokenSeparators: PropTypes.arrayOf(PropTypes.string),
getInputElement: PropTypes.func,
options: PropTypes.array,
suffixIcon: PropTypes.any,
}
const SelectPropTypes = {
@ -143,6 +142,10 @@ const Select = {
options,
...restProps
} = getOptionProps(this)
let suffixIcon = getComponentFromProp(this, 'suffixIcon')
suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon
const rest = omit(restProps, ['inputIcon', 'removeIcon', 'clearIcon', 'suffixIcon'])
const cls = {
[`${prefixCls}-lg`]: size === 'large',
[`${prefixCls}-sm`]: size === 'small',
@ -159,9 +162,32 @@ const Select = {
tags: mode === 'tags',
combobox: this.isCombobox(),
}
const inputIcon = suffixIcon && (
isValidElement(suffixIcon)
? cloneElement(suffixIcon) : suffixIcon) || (
<Icon type='down' class={`${prefixCls}-arrow-icon`} />
)
const removeIcon = (
<Icon type='close' class={`${prefixCls}-remove-icon`} />
)
const clearIcon = (
<Icon type='close-circle' theme='filled' class={`${prefixCls}-clear-icon`} />
)
const menuItemSelectedIcon = (
<Icon type='check' class={`${prefixCls}-selected-icon`} />
)
const selectProps = {
props: {
...restProps,
inputIcon,
removeIcon,
clearIcon,
menuItemSelectedIcon,
...rest,
...modeConfig,
prefixCls,
optionLabelProp: optionLabelProp || 'children',
@ -170,8 +196,8 @@ const Select = {
placeholder: getComponentFromProp(this, 'placeholder'),
children: options
? options.map((option) => {
const { key, label = option.title, ...restOption } = option
return <Option key={key} {...{ props: restOption }}>{label}</Option>
const { key, label = option.title, on, class: cls, style, ...restOption } = option
return <Option key={key} {...{ props: restOption, on, class: cls, style }}>{label}</Option>
})
: filterEmpty(this.$slots.default),
__propsSymbol__: Symbol(),

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

@ -11,6 +11,7 @@
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| allowClear | 支持清除 | boolean | false |
| autoClearSearchValue | 是否在选中项后清空搜索框，只在 `mode` 为 `multiple` 或 `tags` 时有效。 | boolean | true |
| autoFocus | 默认获取焦点 | boolean | false |
| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true |
| defaultValue | 指定默认选中的条目 | string\|string\[]\|number\|number\[] | - |
@ -24,7 +25,7 @@
| labelInValue | 是否把每个选项的 label 包装到 value 中，会把 Select 的 value 类型从 `string` 变为 `{key: string, label: vNodes}` 的格式 | boolean | false |
| maxTagCount | 最多显示多少个 tag | number | - |
| maxTagPlaceholder | 隐藏 tag 时显示的内容 | slot/function(omittedValues) | - |
| mode | 设置 Select 的模式 | 'default' \| 'multiple' \| 'tags' \| 'combobox' | - |
| mode | 设置 Select 的模式为多选或标签 | 'default' \| 'multiple' \| 'tags' \| 'combobox' | - |
| notFoundContent | 当下拉列表为空时显示的内容 | string\|slot | 'Not Found' |
| optionFilterProp | 搜索时过滤对应的 option 属性，如设置为 children 表示对内嵌内容进行搜索 | string | value |
| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` （combobox 模式下为 `value`） |
@ -32,10 +33,12 @@
| showSearch | 使单选模式可搜索 | boolean | false |
| showArrow | 是否显示下拉小箭头 | boolean | true |
| size | 选择框大小，可选 `large` `small` | string | default |
| suffixIcon | 自定义的选择框后缀图标 | string \| VNode \| slot | - |
| tokenSeparators | 在 tags 和 multiple 模式下自动分词的分隔符 | string\[] | |
| value(v-model) | 指定当前选中的条目 | string\|string\[]\|number\|number\[] | - |
| options | options 数据，如果设置则不需要手动构造 selectOption 节点 | array&lt;{value, label, [disabled, key, title]}> | \[] |
| defaultOpen | 是否默认展开下拉菜单 | boolean | - |
| open | 是否展开下拉菜单 | boolean | - |
> 注意，如果发现下拉菜单跟随页面滚动，或者需要在其他弹层中触发 Select，请尝试使用 `getPopupContainer={triggerNode => triggerNode.parentNode}` 将下拉弹层渲染节点固定在触发器的父元素中。
@ -52,6 +55,7 @@
| popupScroll | 下拉列表滚动时的回调 | function |
| search | 文本框值变化时回调 | function(value: string) |
| select | 被选中时调用，参数为选中项的 value (或 key) 值 | function(value, option:Option) |
| dropdownVisibleChange | 展开下拉菜单的回调 | function(open) |
### Select Methods
@ -68,6 +72,7 @@
| key | 和 value 含义一致。如果 Vue 需要你设置此项，此项值与 value 的值相同，然后可以省略 value 设置 | string | |
| title | 选中该 Option 后，Select 的 title | string | - |
| value | 默认根据此属性值进行筛选 | string\|number | - |
| class | Option 器类名 | string | - |
### OptGroup props

4
components/vc-select/SelectTrigger.jsx
View File

@ -54,6 +54,7 @@ export default {
transitionName: PropTypes.string,
getPopupContainer: PropTypes.func,
backfillValue: PropTypes.any,
menuItemSelectedIcon: PropTypes.any,
},
created () {
this.saveDropdownMenuRef = saveRef(this, 'dropdownMenuRef')
@ -95,7 +96,7 @@ export default {
getDropdownElement (newProps) {
const {
value, firstActiveValue, defaultActiveFirstOption,
dropdownMenuStyle, getDropdownPrefixCls, backfillValue,
dropdownMenuStyle, getDropdownPrefixCls, backfillValue, menuItemSelectedIcon,
} = this
const { menuSelect, menuDeselect, popupScroll } = this.$listeners
const dropdownMenuProps = {
@ -104,6 +105,7 @@ export default {
prefixCls: getDropdownPrefixCls(),
value, firstActiveValue, defaultActiveFirstOption, dropdownMenuStyle,
backfillValue,
menuItemSelectedIcon,
},
on: {
...newProps.on,