import * as React from 'react'; import styles from '@patternfly/react-styles/css/components/Icon/icon'; import { css } from '@patternfly/react-styles'; import { Spinner } from '../Spinner'; export interface IconComponentProps extends Omit, 'size'> { /** Icon content */ children?: React.ReactNode; /** Icon when isInProgress is set to true. Defaults to a 1em spinner. */ progressIcon?: React.ReactNode; /** Additional classes applied to the icon container */ className?: string; /** Size of the icon component container and icon. */ size?: 'sm' | 'md' | 'lg' | 'xl'; /** Size of icon. Overrides the icon size set by the size property. */ iconSize?: 'sm' | 'md' | 'lg' | 'xl'; /** Size of progress icon. Overrides the icon size set by the size property. */ progressIconSize?: 'sm' | 'md' | 'lg' | 'xl'; /** Status color of the icon */ status?: 'custom' | 'info' | 'success' | 'warning' | 'danger'; /** Indicates the icon is inline and should inherit the text font size and color. Overriden by size and iconSize properties. */ isInline?: boolean; /** Indicates the icon is in progress. Setting this property to true will swap the icon with the progressIcon. */ isInProgress?: boolean; /** Aria-label for the default progress icon */ defaultProgressArialabel?: string; /** @beta Flag indicating whether the icon passed as children should be mirrored for * right to left (RTL) languages. This will not mirror the icon passed to progressIcon. */ shouldMirrorRTL?: boolean; } export const Icon: React.FunctionComponent = ({ children, className, progressIcon, size, iconSize, progressIconSize, status, isInline = false, isInProgress = false, defaultProgressArialabel = 'Loading...', shouldMirrorRTL = false, ...props }: IconComponentProps) => { const _progressIcon = progressIcon ?? ; return ( {children} {isInProgress && ( {_progressIcon} )} ); }; Icon.displayName = 'Icon';