diff --git a/components/config-provider/__tests__/style.test.tsx b/components/config-provider/__tests__/style.test.tsx index 5e5541c93a..dab45def76 100644 --- a/components/config-provider/__tests__/style.test.tsx +++ b/components/config-provider/__tests__/style.test.tsx @@ -9,6 +9,7 @@ import Descriptions from '../../descriptions'; import Divider from '../../divider'; import Empty from '../../empty'; import Image from '../../image'; +import Input from '../../input'; import Mentions from '../../mentions'; import Modal from '../../modal'; import Pagination from '../../pagination'; @@ -256,6 +257,18 @@ describe('ConfigProvider support style and className props', () => { expect(element).toHaveStyle({ backgroundColor: 'red' }); }); + it('Should Input className & style works', () => { + const { container } = render( + + + , + ); + + const element = container.querySelector('.ant-input'); + expect(element).toHaveClass('cp-input'); + expect(element).toHaveStyle({ backgroundColor: 'red' }); + }); + it('Should Mentions className & style works', () => { const { container } = render( = (props) => { slider, breadcrumb, pagination, + input, empty, radio, } = props; @@ -318,6 +319,7 @@ const ProviderChildren: React.FC = (props) => { divider, steps, image, + input, mentions, modal, result, diff --git a/components/config-provider/index.zh-CN.md b/components/config-provider/index.zh-CN.md index 039c9fb77d..d1db85981a 100644 --- a/components/config-provider/index.zh-CN.md +++ b/components/config-provider/index.zh-CN.md @@ -113,14 +113,14 @@ const { | empty | 设置 Empty 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | form | 设置 Form 组件的通用属性 | { validateMessages?: [ValidateMessages](/components/form-cn#validatemessages), requiredMark?: boolean \| `optional`, colon?: boolean, scrollToFirstError?: boolean \| [Options](https://github.com/stipsan/scroll-into-view-if-needed/tree/ece40bd9143f48caf4b99503425ecb16b0ad8249#options)} | - | requiredMark: 4.8.0; colon: 4.18.0; scrollToFirstError: 5.2.0 | | image | 设置 Image 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | -| input | 设置 Input 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | +| input | 设置 Input 组件的通用属性 | { autoComplete?: string, className?: string, style?: React.CSSProperties } | - | 5.7.0 | | mentions | 设置 Mentions 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | modal | 设置 Modal 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | pagination | 设置 Pagination 组件的通用属性 | { showSizeChanger?: boolean, className?: string, style?: React.CSSProperties } | - | 5.7.0 | | radio | 设置 Radio 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | result | 设置 Result 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | segmented | 设置 Segmented 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | -| select | 设置 Select 组件的通用属性 | { className?: string, showSearch?: boolean, style?: React.CSSProperties } | - | | +| select | 设置 Select 组件的通用属性 | { className?: string, showSearch?: boolean, style?: React.CSSProperties } | - | 5.7.0 | | slider | 设置 Slider 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | | space | 设置 Space 的通用属性,参考 [Space](/components/space-cn) | { size: `small` \| `middle` \| `large` \| `number`, className?: string, style?: React.CSSProperties, classNames?: { item: string }, styles?: { item: React.CSSProperties } } | - | 5.6.0 | | spin | 设置 Spin 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 | diff --git a/components/input/Input.tsx b/components/input/Input.tsx index 1517c93ff5..06f0f7464d 100644 --- a/components/input/Input.tsx +++ b/components/input/Input.tsx @@ -80,6 +80,7 @@ const Input = forwardRef((props, ref) => { addonAfter, addonBefore, className, + style, rootClassName, onChange, classNames: classes, @@ -163,9 +164,10 @@ const Input = forwardRef((props, ref) => { disabled={mergedDisabled} onBlur={handleBlur} onFocus={handleFocus} + style={{ ...input?.style, ...style }} suffix={suffixNode} allowClear={mergedAllowClear} - className={classNames(className, rootClassName, compactItemClassnames)} + className={classNames(className, rootClassName, compactItemClassnames, input?.className)} onChange={handleChange} addonAfter={ addonAfter && (