fix: empty in cascader/select/table/treeSelect (#24279)

* fix: empty in cascader\select\table\treeSelect

* fix: snap
This commit is contained in:
xrkffgg 2020-05-19 14:45:57 +08:00 committed by GitHub
parent 8bd10889c6
commit ce78029933
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 92 additions and 78 deletions

View File

@ -608,7 +608,7 @@ exports[`Cascader have a notFoundContent that fit trigger input width 1`] = `
class="ant-cascader-menu"
>
<li
class="ant-cascader-menu-item ant-cascader-menu-item-disabled"
class="ant-cascader-menu-item"
role="menuitem"
title=""
>
@ -1493,7 +1493,7 @@ exports[`Cascader should render not found content 1`] = `
],
}
}
className=""
className="ant-cascader-menu-empty"
destroyPopupOnHide={false}
getClassNameFromAlign={[Function]}
getRootDomNode={[Function]}
@ -1552,7 +1552,7 @@ exports[`Cascader should render not found content 1`] = `
target={[Function]}
>
<PopupInner
className="ant-cascader-menus"
className="ant-cascader-menus ant-cascader-menu-empty"
hiddenClassName="ant-cascader-menus-hidden"
onMouseDown={[Function]}
onTouchStart={[Function]}
@ -1566,7 +1566,7 @@ exports[`Cascader should render not found content 1`] = `
visible={true}
>
<div
className="ant-cascader-menus"
className="ant-cascader-menus ant-cascader-menu-empty"
onMouseDown={[Function]}
onTouchStart={[Function]}
style={
@ -1687,7 +1687,7 @@ exports[`Cascader should render not found content 1`] = `
},
]
}
popupClassName=""
popupClassName="ant-cascader-menu-empty"
popupPlacement="bottomLeft"
popupVisible={true}
prefixCls="ant-cascader"
@ -1808,7 +1808,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
],
}
}
className=""
className="ant-cascader-menu-empty"
destroyPopupOnHide={false}
getClassNameFromAlign={[Function]}
getRootDomNode={[Function]}
@ -1867,7 +1867,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
target={[Function]}
>
<PopupInner
className="ant-cascader-menus"
className="ant-cascader-menus ant-cascader-menu-empty"
hiddenClassName="ant-cascader-menus-hidden"
onMouseDown={[Function]}
onTouchStart={[Function]}
@ -1881,7 +1881,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
visible={true}
>
<div
className="ant-cascader-menus"
className="ant-cascader-menus ant-cascader-menu-empty"
onMouseDown={[Function]}
onTouchStart={[Function]}
style={
@ -1988,7 +1988,6 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
options={
Array [
Object {
"disabled": true,
"label": <Context.Consumer>
[Function]
</Context.Consumer>,
@ -1996,7 +1995,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
},
]
}
popupClassName=""
popupClassName="ant-cascader-menu-empty"
popupPlacement="bottomLeft"
popupVisible={true}
prefixCls="ant-cascader"
@ -2011,7 +2010,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
style={Object {}}
>
<li
className="ant-cascader-menu-item ant-cascader-menu-item-disabled"
className="ant-cascader-menu-item"
key="ANT_CASCADER_NOT_FOUND"
onClick={[Function]}
onDoubleClick={[Function]}

View File

@ -535,7 +535,6 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
{
[names.label]: notFoundContent || renderEmpty('Cascader'),
[names.value]: 'ANT_CASCADER_NOT_FOUND',
disabled: true,
},
];
}
@ -610,8 +609,10 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
const getPopupContainer = props.getPopupContainer || getContextPopupContainer;
const rest = omit(props, ['inputIcon', 'expandIcon', 'loadingIcon', 'bordered']);
const rcCascaderRtlPopupClassName = classNames(popupClassName, {
const rcCascaderPopupClassName = classNames(popupClassName, {
[`${prefixCls}-menu-${direction}`]: direction === 'rtl',
[`${prefixCls}-menu-empty`]:
options.length === 1 && options[0].value === 'ANT_CASCADER_NOT_FOUND',
});
return (
<RcCascader
@ -626,7 +627,7 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
dropdownMenuColumnStyle={dropdownMenuColumnStyle}
expandIcon={expandIcon}
loadingIcon={loadingIcon}
popupClassName={rcCascaderRtlPopupClassName}
popupClassName={rcCascaderPopupClassName}
popupPlacement={this.getPopupPlacement(direction)}
>
{input}

View File

@ -204,6 +204,11 @@
background: transparent;
}
}
.@{cascader-prefix-cls}-menu-empty & {
color: @disabled-color;
cursor: default;
pointer-events: none;
}
&-active:not(&-disabled) {
&,
&:hover {

View File

@ -19481,7 +19481,7 @@ exports[`ConfigProvider components Table configProvider 1`] = `
class="config-spin-container"
>
<div
class="config-table"
class="config-table config-table-empty"
>
<div
class="config-table-container"
@ -19755,7 +19755,7 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
class="config-spin-container"
>
<div
class="config-table"
class="config-table config-table-empty"
>
<div
class="config-table-container"
@ -20029,7 +20029,7 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
class="config-spin-container"
>
<div
class="config-table config-table-middle"
class="config-table config-table-middle config-table-empty"
>
<div
class="config-table-container"
@ -20303,7 +20303,7 @@ exports[`ConfigProvider components Table normal 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -20577,7 +20577,7 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
class="ant-spin-container"
>
<div
class="prefix-Table"
class="prefix-Table prefix-Table-empty"
>
<div
class="prefix-Table-container"

View File

@ -510,7 +510,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"

View File

@ -6620,7 +6620,7 @@ exports[`Locale Provider should display the text as ar 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -11607,7 +11607,7 @@ exports[`Locale Provider should display the text as az 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -16594,7 +16594,7 @@ exports[`Locale Provider should display the text as bg 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -21581,7 +21581,7 @@ exports[`Locale Provider should display the text as ca 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -26568,7 +26568,7 @@ exports[`Locale Provider should display the text as cs 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -31555,7 +31555,7 @@ exports[`Locale Provider should display the text as da 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -36542,7 +36542,7 @@ exports[`Locale Provider should display the text as de 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -41529,7 +41529,7 @@ exports[`Locale Provider should display the text as el 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -46516,7 +46516,7 @@ exports[`Locale Provider should display the text as en 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -51503,7 +51503,7 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -56490,7 +56490,7 @@ exports[`Locale Provider should display the text as es 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -61477,7 +61477,7 @@ exports[`Locale Provider should display the text as et 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -66464,7 +66464,7 @@ exports[`Locale Provider should display the text as fa 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -71451,7 +71451,7 @@ exports[`Locale Provider should display the text as fi 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -76438,7 +76438,7 @@ exports[`Locale Provider should display the text as fr 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -81425,7 +81425,7 @@ exports[`Locale Provider should display the text as fr 2`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -86412,7 +86412,7 @@ exports[`Locale Provider should display the text as he 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -91399,7 +91399,7 @@ exports[`Locale Provider should display the text as hi 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -96386,7 +96386,7 @@ exports[`Locale Provider should display the text as hr 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -101373,7 +101373,7 @@ exports[`Locale Provider should display the text as hu 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -106360,7 +106360,7 @@ exports[`Locale Provider should display the text as hy-am 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -111347,7 +111347,7 @@ exports[`Locale Provider should display the text as id 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -116334,7 +116334,7 @@ exports[`Locale Provider should display the text as is 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -121321,7 +121321,7 @@ exports[`Locale Provider should display the text as it 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -126308,7 +126308,7 @@ exports[`Locale Provider should display the text as ja 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -131295,7 +131295,7 @@ exports[`Locale Provider should display the text as kn 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -136282,7 +136282,7 @@ exports[`Locale Provider should display the text as ko 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -141269,7 +141269,7 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -146256,7 +146256,7 @@ exports[`Locale Provider should display the text as lv 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -151243,7 +151243,7 @@ exports[`Locale Provider should display the text as mk 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -156230,7 +156230,7 @@ exports[`Locale Provider should display the text as mn-mn 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -161217,7 +161217,7 @@ exports[`Locale Provider should display the text as ms-my 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -166204,7 +166204,7 @@ exports[`Locale Provider should display the text as nb 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -171191,7 +171191,7 @@ exports[`Locale Provider should display the text as ne-np 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -176178,7 +176178,7 @@ exports[`Locale Provider should display the text as nl 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -181165,7 +181165,7 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -186152,7 +186152,7 @@ exports[`Locale Provider should display the text as pl 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -191139,7 +191139,7 @@ exports[`Locale Provider should display the text as pt 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -196126,7 +196126,7 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -201113,7 +201113,7 @@ exports[`Locale Provider should display the text as ro 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -206100,7 +206100,7 @@ exports[`Locale Provider should display the text as ru 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -211087,7 +211087,7 @@ exports[`Locale Provider should display the text as sk 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -216074,7 +216074,7 @@ exports[`Locale Provider should display the text as sl 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -221061,7 +221061,7 @@ exports[`Locale Provider should display the text as sr 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -226048,7 +226048,7 @@ exports[`Locale Provider should display the text as sv 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -231035,7 +231035,7 @@ exports[`Locale Provider should display the text as ta 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -236022,7 +236022,7 @@ exports[`Locale Provider should display the text as th 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -241009,7 +241009,7 @@ exports[`Locale Provider should display the text as tr 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -245996,7 +245996,7 @@ exports[`Locale Provider should display the text as uk 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -250983,7 +250983,7 @@ exports[`Locale Provider should display the text as vi 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -255970,7 +255970,7 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -260957,7 +260957,7 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"

View File

@ -198,6 +198,10 @@
&-hidden {
display: none;
}
&-empty {
color: @disabled-color;
}
}
// ========================= Options =========================
@ -214,6 +218,7 @@
&-item-empty {
.item();
color: @disabled-color;
}
&-item {

View File

@ -459,6 +459,7 @@ function Table<RecordType extends object = any>(props: TableProps<RecordType>) {
[`${prefixCls}-middle`]: mergedSize === 'middle',
[`${prefixCls}-small`]: mergedSize === 'small',
[`${prefixCls}-bordered`]: bordered,
[`${prefixCls}-empty`]: rawData.length === 0,
})}
data={pageData}
rowKey={getRowKey}

View File

@ -117,7 +117,7 @@ exports[`Table rtl render component should be rendered correctly in RTL directio
class="ant-spin-container"
>
<div
class="ant-table ant-table-rtl"
class="ant-table ant-table-empty ant-table-rtl"
>
<div
class="ant-table-container"

View File

@ -11,7 +11,7 @@ exports[`renders ./components/table/demo/ajax.md correctly 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"

View File

@ -11,7 +11,7 @@ exports[`Table renders empty table 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -148,7 +148,7 @@ exports[`Table renders empty table with custom emptyText 1`] = `
class="ant-spin-container"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"
@ -240,7 +240,7 @@ exports[`Table renders empty table with fixed columns 1`] = `
class="ant-spin-container"
>
<div
class="ant-table ant-table-fixed-column ant-table-scroll-horizontal ant-table-has-fix-left ant-table-has-fix-right"
class="ant-table ant-table-empty ant-table-fixed-column ant-table-scroll-horizontal ant-table-has-fix-left ant-table-has-fix-right"
>
<div
class="ant-table-container"
@ -480,7 +480,7 @@ exports[`Table renders empty table without emptyText when loading 1`] = `
class="ant-spin-container ant-spin-blur"
>
<div
class="ant-table"
class="ant-table ant-table-empty"
>
<div
class="ant-table-container"

View File

@ -494,6 +494,9 @@
// ========================= Placeholder ==========================
&-tbody > tr&-placeholder {
text-align: center;
.@{table-prefix-cls}-empty & {
color: @disabled-color;
}
&:hover {
> td {
background: @component-background;