diff --git a/src/Image.tsx b/src/Image.tsx index 4a480d3..7727366 100644 --- a/src/Image.tsx +++ b/src/Image.tsx @@ -119,6 +119,7 @@ const ImageInternal: CompoundedComponent = props => { cover, classNames: previewClassNames = {}, styles: previewStyles = {}, + rootClassName: previewRootClassName, ...restProps }: PreviewConfig = preview && typeof preview === 'object' ? preview : {}; @@ -262,7 +263,7 @@ const ImageInternal: CompoundedComponent = props => { imgCommonProps={imgCommonProps} classNames={previewClassNames} styles={previewStyles} - rootClassName={rootClassName} + rootClassName={classnames(previewRootClassName, rootClassName)} {...restProps} /> )} diff --git a/src/Preview/index.tsx b/src/Preview/index.tsx index dd86ed5..06ba49e 100644 --- a/src/Preview/index.tsx +++ b/src/Preview/index.tsx @@ -68,6 +68,8 @@ export type ToolbarRenderInfoType = { export interface InternalPreviewConfig { // Semantic + /** Better to use `classNames.root` instead */ + rootClassName?: string; classNames?: Partial>; styles?: Partial>; @@ -108,7 +110,6 @@ export interface InternalPreviewConfig { export interface PreviewProps extends InternalPreviewConfig { // Misc prefixCls: string; - rootClassName?: string; // Origin image Info imageInfo?: { diff --git a/tests/preview.test.tsx b/tests/preview.test.tsx index 608b28a..aa9b2c8 100644 --- a/tests/preview.test.tsx +++ b/tests/preview.test.tsx @@ -643,7 +643,7 @@ describe('Preview', () => { it('Customize preview props', () => { const src = 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png'; - const { container } = render( + render( { expect(document.querySelectorAll('.custom-className')).toHaveLength(2); }); + it('preview.rootClassName should be correct', () => { + const src = 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png'; + render( + , + ); + + expect(document.querySelector('.rc-image-preview.custom-className')).toBeTruthy(); + }); + it('if async src set should be correct', () => { const src = 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*P0S-QIRUbsUAAAAAAAAAAABkARQnAQ';