diff --git a/packages/react-core/src/components/Icon/Icon.tsx b/packages/react-core/src/components/Icon/Icon.tsx index 2fe2e127a9c..e1debb4406c 100644 --- a/packages/react-core/src/components/Icon/Icon.tsx +++ b/packages/react-core/src/components/Icon/Icon.tsx @@ -24,6 +24,10 @@ export interface IconComponentProps extends Omit = ({ @@ -37,6 +41,7 @@ export const Icon: React.FunctionComponent = ({ isInline = false, isInProgress = false, defaultProgressArialabel = 'Loading...', + shouldMirrorRTL = false, ...props }: IconComponentProps) => { const _progressIcon = progressIcon ?? ; @@ -52,7 +57,16 @@ export const Icon: React.FunctionComponent = ({ )} {...props} > - {children} + + {children} + {isInProgress && ( {_progressIcon} )} diff --git a/packages/react-core/src/components/Icon/__tests__/Icon.test.tsx b/packages/react-core/src/components/Icon/__tests__/Icon.test.tsx index 595df963a1e..8c3373d3a39 100644 --- a/packages/react-core/src/components/Icon/__tests__/Icon.test.tsx +++ b/packages/react-core/src/components/Icon/__tests__/Icon.test.tsx @@ -194,3 +194,19 @@ test('renders progress icon successfully', () => { ); expect(asFragment()).toMatchSnapshot(); }); + +test('Renders with class pf-v5-m-mirror-inline-rtl on icon passed as children when shouldMirrorRTL is true', () => { + render(Icon content); + + expect(screen.getByText('Icon content')).toHaveClass('pf-v5-m-mirror-inline-rtl'); +}); + +test('Does not render with class pf-v5-m-mirror-inline-rtl on progressIcon when shouldMirrorRTL is true', () => { + render( + + Icon content + + ); + + expect(screen.getByText('Progress icon')).not.toHaveClass('pf-v5-m-mirror-inline-rtl'); +});