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

fix: Table column align with sorter and filter (#30744)

Browse Source 
* fix: Table column align with sorter and filter

close #30741

* update snapshot
This commit is contained in:
afc163 2021-05-28 13:27:58 +08:00 committed by GitHub
parent 201c6cadf1
commit 7427f52a64
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 884 additions and 502 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
components/config-provider/__tests__/__snapshots__/components.test.js.snap
View File

@ -22846,11 +22846,16 @@ exports[`ConfigProvider components Table configProvider 1`] = `
> >
<div <div
class="config-table-filter-column" class="config-table-filter-column"
>
<span
class="config-table-column-title"
> >
<div <div
class="config-table-column-sorters" class="config-table-column-sorters"
> >
<span> <span
class="config-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -22900,6 +22905,7 @@ exports[`ConfigProvider components Table configProvider 1`] = `
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="config-dropdown-trigger config-table-filter-trigger" class="config-dropdown-trigger config-table-filter-trigger"
role="button" role="button"
@ -23120,11 +23126,16 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
> >
<div <div
class="config-table-filter-column" class="config-table-filter-column"
>
<span
class="config-table-column-title"
> >
<div <div
class="config-table-column-sorters" class="config-table-column-sorters"
> >
<span> <span
class="config-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -23174,6 +23185,7 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="config-dropdown-trigger config-table-filter-trigger" class="config-dropdown-trigger config-table-filter-trigger"
role="button" role="button"
@ -23394,11 +23406,16 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
> >
<div <div
class="config-table-filter-column" class="config-table-filter-column"
>
<span
class="config-table-column-title"
> >
<div <div
class="config-table-column-sorters" class="config-table-column-sorters"
> >
<span> <span
class="config-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -23448,6 +23465,7 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="config-dropdown-trigger config-table-filter-trigger" class="config-dropdown-trigger config-table-filter-trigger"
role="button" role="button"
@ -23668,11 +23686,16 @@ exports[`ConfigProvider components Table configProvider virtual and dropdownMatc
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -23722,6 +23745,7 @@ exports[`ConfigProvider components Table configProvider virtual and dropdownMatc
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -23942,11 +23966,16 @@ exports[`ConfigProvider components Table normal 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -23996,6 +24025,7 @@ exports[`ConfigProvider components Table normal 1`] = `
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -24216,11 +24246,16 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
> >
<div <div
class="prefix-Table-filter-column" class="prefix-Table-filter-column"
>
<span
class="prefix-Table-column-title"
> >
<div <div
class="prefix-Table-column-sorters" class="prefix-Table-column-sorters"
> >
<span> <span
class="prefix-Table-column-title"
>
Name Name
</span> </span>
<span <span
@ -24270,6 +24305,7 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger prefix-Table-filter-trigger" class="ant-dropdown-trigger prefix-Table-filter-trigger"
role="button" role="button"

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

@ -6672,8 +6672,12 @@ exports[`Locale Provider should display the text as ar 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -11686,8 +11690,12 @@ exports[`Locale Provider should display the text as az 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -16700,8 +16708,12 @@ exports[`Locale Provider should display the text as bg 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -21714,8 +21726,12 @@ exports[`Locale Provider should display the text as by 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -26728,8 +26744,12 @@ exports[`Locale Provider should display the text as ca 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -31742,8 +31762,12 @@ exports[`Locale Provider should display the text as cs 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -36756,8 +36780,12 @@ exports[`Locale Provider should display the text as da 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -41770,8 +41798,12 @@ exports[`Locale Provider should display the text as de 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -46784,8 +46816,12 @@ exports[`Locale Provider should display the text as el 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -51798,8 +51834,12 @@ exports[`Locale Provider should display the text as en 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -56812,8 +56852,12 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -61826,8 +61870,12 @@ exports[`Locale Provider should display the text as es 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -66840,8 +66888,12 @@ exports[`Locale Provider should display the text as et 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -71854,8 +71906,12 @@ exports[`Locale Provider should display the text as fa 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -76868,8 +76924,12 @@ exports[`Locale Provider should display the text as fi 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -81882,8 +81942,12 @@ exports[`Locale Provider should display the text as fr 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -86896,8 +86960,12 @@ exports[`Locale Provider should display the text as fr 2`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -91910,8 +91978,12 @@ exports[`Locale Provider should display the text as fr 3`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -96924,8 +96996,12 @@ exports[`Locale Provider should display the text as ga 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -101938,8 +102014,12 @@ exports[`Locale Provider should display the text as gl 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -106952,8 +107032,12 @@ exports[`Locale Provider should display the text as he 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -111966,8 +112050,12 @@ exports[`Locale Provider should display the text as hi 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -116980,8 +117068,12 @@ exports[`Locale Provider should display the text as hr 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -121994,8 +122086,12 @@ exports[`Locale Provider should display the text as hu 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -127008,8 +127104,12 @@ exports[`Locale Provider should display the text as hy-am 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -132022,8 +132122,12 @@ exports[`Locale Provider should display the text as id 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -137036,8 +137140,12 @@ exports[`Locale Provider should display the text as is 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -142050,8 +142158,12 @@ exports[`Locale Provider should display the text as it 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -147064,8 +147176,12 @@ exports[`Locale Provider should display the text as ja 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -152078,8 +152194,12 @@ exports[`Locale Provider should display the text as kk 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -157092,8 +157212,12 @@ exports[`Locale Provider should display the text as kn 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -162106,8 +162230,12 @@ exports[`Locale Provider should display the text as ko 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -167120,8 +167248,12 @@ exports[`Locale Provider should display the text as ku 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -172134,8 +172266,12 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -177148,8 +177284,12 @@ exports[`Locale Provider should display the text as lt 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -182162,8 +182302,12 @@ exports[`Locale Provider should display the text as lv 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -187176,8 +187320,12 @@ exports[`Locale Provider should display the text as mk 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -192190,8 +192338,12 @@ exports[`Locale Provider should display the text as mn-mn 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -197204,8 +197356,12 @@ exports[`Locale Provider should display the text as ms-my 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -202218,8 +202374,12 @@ exports[`Locale Provider should display the text as nb 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -207232,8 +207392,12 @@ exports[`Locale Provider should display the text as ne-np 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -212246,8 +212410,12 @@ exports[`Locale Provider should display the text as nl 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -217260,8 +217428,12 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -222274,8 +222446,12 @@ exports[`Locale Provider should display the text as pl 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -227288,8 +227464,12 @@ exports[`Locale Provider should display the text as pt 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -232302,8 +232482,12 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -237316,8 +237500,12 @@ exports[`Locale Provider should display the text as ro 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -242330,8 +242518,12 @@ exports[`Locale Provider should display the text as ru 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -247344,8 +247536,12 @@ exports[`Locale Provider should display the text as sk 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -252358,8 +252554,12 @@ exports[`Locale Provider should display the text as sl 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -257372,8 +257572,12 @@ exports[`Locale Provider should display the text as sr 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -262386,8 +262590,12 @@ exports[`Locale Provider should display the text as sv 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -267400,8 +267608,12 @@ exports[`Locale Provider should display the text as ta 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -272414,8 +272626,12 @@ exports[`Locale Provider should display the text as th 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -277428,8 +277644,12 @@ exports[`Locale Provider should display the text as tr 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -282442,8 +282662,12 @@ exports[`Locale Provider should display the text as uk 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -287456,8 +287680,12 @@ exports[`Locale Provider should display the text as vi 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -292470,8 +292698,12 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -297484,8 +297716,12 @@ exports[`Locale Provider should display the text as zh-hk 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -302498,8 +302734,12 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"

24
components/table/__tests__/__snapshots__/Table.filter.test.js.snap
View File

@ -66,8 +66,12 @@ exports[`Table.filter renders custom filter icon as ReactNode 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -166,8 +170,12 @@ exports[`Table.filter renders custom filter icon as string correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -280,8 +288,12 @@ exports[`Table.filter renders custom filter icon with right Tooltip title 1`] =
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -406,8 +418,12 @@ exports[`Table.filter renders filter correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -526,8 +542,12 @@ exports[`Table.filter should support getPopupContainer 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -774,8 +794,12 @@ exports[`Table.filter should support getPopupContainer from ConfigProvider 1`] =
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"

8
components/table/__tests__/__snapshots__/Table.sorter.test.js.snap
View File

@ -11,7 +11,9 @@ exports[`Table.sorter renders sorter icon correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -99,7 +101,9 @@ exports[`Table.sorter should support defaultOrder in Column 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Age Age
</span> </span>
<span <span

96
components/table/__tests__/__snapshots__/demo.test.js.snap
View File

@ -40,7 +40,9 @@ exports[`renders ./components/table/demo/ajax.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -96,8 +98,12 @@ exports[`renders ./components/table/demo/ajax.md correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Gender Gender
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -1055,8 +1061,12 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -1089,8 +1099,12 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Age Age
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -1123,11 +1137,16 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Address Address
</span> </span>
<span <span
@ -1177,6 +1196,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -2698,7 +2718,9 @@ Array [
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Age Age
</span> </span>
<span <span
@ -2754,8 +2776,12 @@ Array [
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Address Address
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -2789,7 +2815,9 @@ Array [
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Action Action
</span> </span>
<span <span
@ -8422,8 +8450,12 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Name Name
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -8479,7 +8511,9 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Age Age
</span> </span>
<span <span
@ -9438,11 +9472,16 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -9473,6 +9512,7 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -9506,7 +9546,9 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Age Age
</span> </span>
<span <span
@ -9562,8 +9604,12 @@ exports[`renders ./components/table/demo/head.md correctly 1`] = `
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
Address Address
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -10149,7 +10195,9 @@ exports[`renders ./components/table/demo/multiple-sorter.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Chinese Score Chinese Score
</span> </span>
<span <span
@ -10206,7 +10254,9 @@ exports[`renders ./components/table/demo/multiple-sorter.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Math Score Math Score
</span> </span>
<span <span
@ -10263,7 +10313,9 @@ exports[`renders ./components/table/demo/multiple-sorter.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
English Score English Score
</span> </span>
<span <span
@ -12433,11 +12485,16 @@ Array [
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Name Name
</span> </span>
<span <span
@ -12487,6 +12544,7 @@ Array [
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -12520,7 +12578,9 @@ Array [
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Age Age
</span> </span>
<span <span
@ -12576,11 +12636,16 @@ Array [
> >
<div <div
class="ant-table-filter-column" class="ant-table-filter-column"
>
<span
class="ant-table-column-title"
> >
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Address Address
</span> </span>
<span <span
@ -12630,6 +12695,7 @@ Array [
</span> </span>
</span> </span>
</div> </div>
</span>
<span <span
class="ant-dropdown-trigger ant-table-filter-trigger" class="ant-dropdown-trigger ant-table-filter-trigger"
role="button" role="button"
@ -12899,7 +12965,9 @@ exports[`renders ./components/table/demo/resizable-column.md correctly 1`] = `
<div <div
class="ant-table-column-sorters" class="ant-table-column-sorters"
> >
<span> <span
class="ant-table-column-title"
>
Amount Amount
</span> </span>
<span <span

6
components/table/hooks/useFilter/FilterDropdown.tsx
View File

@ -87,6 +87,7 @@ function renderFilterItems({
} }
export interface FilterDropdownProps<RecordType> { export interface FilterDropdownProps<RecordType> {
tablePrefixCls: string;
prefixCls: string; prefixCls: string;
dropdownPrefixCls: string; dropdownPrefixCls: string;
column: ColumnType<RecordType>; column: ColumnType<RecordType>;
@ -101,6 +102,7 @@ export interface FilterDropdownProps<RecordType> {
function FilterDropdown<RecordType>(props: FilterDropdownProps<RecordType>) { function FilterDropdown<RecordType>(props: FilterDropdownProps<RecordType>) {
const { const {
tablePrefixCls,
prefixCls, prefixCls,
column, column,
dropdownPrefixCls, dropdownPrefixCls,
@ -281,8 +283,8 @@ function FilterDropdown<RecordType>(props: FilterDropdownProps<RecordType>) {
const { direction } = React.useContext(ConfigContext); const { direction } = React.useContext(ConfigContext);
return ( return (
<div className={classNames(`${prefixCls}-column`)}> <div className={`${prefixCls}-column`}>
{children} <span className={`${tablePrefixCls}-column-title`}>{children}</span>
<Dropdown <Dropdown
overlay={menu} overlay={menu}
trigger={['click']} trigger={['click']}

8
components/table/hooks/useFilter/index.tsx
View File

@ -87,6 +87,7 @@ function injectFilter<RecordType>(
...newColumn, ...newColumn,
title: (renderProps: ColumnTitleProps<RecordType>) => ( title: (renderProps: ColumnTitleProps<RecordType>) => (
<FilterDropdown <FilterDropdown
tablePrefixCls={prefixCls}
prefixCls={`${prefixCls}-filter`} prefixCls={`${prefixCls}-filter`}
dropdownPrefixCls={dropdownPrefixCls} dropdownPrefixCls={dropdownPrefixCls}
column={newColumn} column={newColumn}
@ -214,9 +215,10 @@ function useFilter<RecordType>({
return collectedStates; return collectedStates;
}, [mergedColumns, filterStates]); }, [mergedColumns, filterStates]);
const getFilters = React.useCallback(() => generateFilterInfo(mergedFilterStates), [ const getFilters = React.useCallback(
mergedFilterStates, () => generateFilterInfo(mergedFilterStates),
]); [mergedFilterStates],
);
const triggerFilter = (filterState: FilterState<RecordType>) => { const triggerFilter = (filterState: FilterState<RecordType>) => {
const newFilterStates = mergedFilterStates.filter(({ key }) => key !== filterState.key); const newFilterStates = mergedFilterStates.filter(({ key }) => key !== filterState.key);

4
components/table/hooks/useSorter.tsx
View File

@ -154,7 +154,9 @@ function injectSorter<RecordType>(
title: (renderProps: ColumnTitleProps<RecordType>) => { title: (renderProps: ColumnTitleProps<RecordType>) => {
const renderSortTitle = ( const renderSortTitle = (
<div className={`${prefixCls}-column-sorters`}> <div className={`${prefixCls}-column-sorters`}>
<span>{renderColumnTitle(column.title, renderProps)}</span> <span className={`${prefixCls}-column-title`}>
{renderColumnTitle(column.title, renderProps)}
</span>
<span <span
className={classNames(`${prefixCls}-column-sorter`, { className={classNames(`${prefixCls}-column-sorter`, {
[`${prefixCls}-column-sorter-full`]: !!(upNode && downNode), [`${prefixCls}-column-sorter-full`]: !!(upNode && downNode),

4
components/table/style/index.less
View File

@ -231,6 +231,10 @@
background: @table-body-sort-bg; background: @table-body-sort-bg;
} }
&-column-title {
flex: 1;
}
&-column-sorters { &-column-sorters {
display: flex; display: flex;
flex: auto; flex: auto;