diff --git a/components/config-provider/__tests__/style.test.tsx b/components/config-provider/__tests__/style.test.tsx index d07cbd231a..cc8f7fdbe3 100644 --- a/components/config-provider/__tests__/style.test.tsx +++ b/components/config-provider/__tests__/style.test.tsx @@ -38,6 +38,7 @@ import Switch from '../../switch'; import Table from '../../table'; import Tabs from '../../tabs'; import Tag from '../../tag'; +import Transfer from '../../transfer'; import Tree from '../../tree'; import Typography from '../../typography'; import Upload from '../../upload'; @@ -852,6 +853,52 @@ describe('ConfigProvider support style and className props', () => { expect(element).toHaveStyle({ color: 'blue' }); }); + it('Should Transfer className works', () => { + const mockData = [ + { + key: '0-0', + title: `content`, + description: `description of content`, + }, + ]; + + const { container } = render( + + + , + ); + + expect(container.querySelector('.ant-transfer')).toHaveClass('test-class'); + }); + + it('Should Transfer style works', () => { + const mockData = [ + { + key: '0-0', + title: `content`, + description: `description of content`, + }, + ]; + + const { container } = render( + + + , + ); + + expect(container.querySelector('.ant-transfer')).toHaveStyle('color: red; font-size: 16px;'); + }); + it('Should Tree className works', () => { const treeData = [ { diff --git a/components/config-provider/context.ts b/components/config-provider/context.ts index fe4f7e0fff..5605baf432 100644 --- a/components/config-provider/context.ts +++ b/components/config-provider/context.ts @@ -120,6 +120,7 @@ export interface ConfigConsumerProps { radio?: ComponentStyleConfig; rate?: ComponentStyleConfig; switch?: ComponentStyleConfig; + transfer?: ComponentStyleConfig; avatar?: ComponentStyleConfig; message?: ComponentStyleConfig; tag?: ComponentStyleConfig; diff --git a/components/config-provider/index.en-US.md b/components/config-provider/index.en-US.md index 9fd164e475..04bc15b8a8 100644 --- a/components/config-provider/index.en-US.md +++ b/components/config-provider/index.en-US.md @@ -139,6 +139,7 @@ const { | table | Set Table common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | tabs | Set Tabs common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | tag | Set Tag common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | +| transfer | Set Transfer common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | tree | Set Tree common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | typography | Set Typography common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | upload | Set Upload common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | diff --git a/components/config-provider/index.tsx b/components/config-provider/index.tsx index 4c876bcc2c..9ff1323c2a 100644 --- a/components/config-provider/index.tsx +++ b/components/config-provider/index.tsx @@ -164,6 +164,7 @@ export interface ConfigProviderProps { radio?: ComponentStyleConfig; rate?: ComponentStyleConfig; switch?: ComponentStyleConfig; + transfer?: ComponentStyleConfig; avatar?: ComponentStyleConfig; message?: ComponentStyleConfig; tag?: ComponentStyleConfig; @@ -290,6 +291,7 @@ const ProviderChildren: React.FC = (props) => { radio, rate, switch: SWITCH, + transfer, avatar, message, tag, @@ -378,6 +380,7 @@ const ProviderChildren: React.FC = (props) => { radio, rate, switch: SWITCH, + transfer, avatar, message, tag, diff --git a/components/config-provider/index.zh-CN.md b/components/config-provider/index.zh-CN.md index e3a7eae115..60422552b4 100644 --- a/components/config-provider/index.zh-CN.md +++ b/components/config-provider/index.zh-CN.md @@ -142,6 +142,7 @@ const { | tabs | 设置 Tabs 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | tag | 设置 Tag 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | tree | 设置 Tree 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | +| transfer | 设置 Transfer 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | typography | 设置 Typography 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | upload | 设置 Upload 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | diff --git a/components/transfer/index.tsx b/components/transfer/index.tsx index 1c6f2d734a..6b8366a062 100644 --- a/components/transfer/index.tsx +++ b/components/transfer/index.tsx @@ -143,6 +143,7 @@ const Transfer = ( getPrefixCls, renderEmpty, direction: dir, + transfer, } = useContext(ConfigContext); const prefixCls = getPrefixCls('transfer', customizePrefixCls); @@ -336,6 +337,7 @@ const Transfer = ( [`${prefixCls}-rtl`]: dir === 'rtl', }, getStatusClassNames(prefixCls, mergedStatus, hasFeedback), + transfer?.className, className, rootClassName, hashId, @@ -348,7 +350,7 @@ const Transfer = ( const [leftTitle, rightTitle] = getTitles(listLocale); return wrapSSR( - + > prefixCls={`${prefixCls}-list`} titleText={leftTitle}