IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Alert: Fix forwardRef warning (#29577)

Browse Source
This commit is contained in:
Torkel Ödegaard 2020-12-03 17:35:34 +01:00 committed by GitHub
parent b63e6959df
commit fa64d7ece4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/grafana-ui/src/components/Alert/Alert.tsx
View File

@ -9,7 +9,7 @@ import { getColorsFromSeverity } from '../../utils/colors';
export type AlertVariant = 'success' | 'warning' | 'error' | 'info'; export type AlertVariant = 'success' | 'warning' | 'error' | 'info';
export interface Props extends HTMLAttributes<HTMLElement> { export interface Props extends HTMLAttributes<HTMLDivElement> {
title: string; title: string;
/** On click handler for alert button, mostly used for dismissing the alert */ /** On click handler for alert button, mostly used for dismissing the alert */
onRemove?: (event: React.MouseEvent) => void; onRemove?: (event: React.MouseEvent) => void;
@ -39,13 +39,13 @@ function getIconFromSeverity(severity: AlertVariant): string {
} }
} }
export const Alert: FC<Props> = React.forwardRef<HTMLElement, Props>( export const Alert: FC<Props> = React.forwardRef<HTMLDivElement, Props>(
({ title, buttonText, onButtonClick, onRemove, children, buttonContent, severity = 'error', ...restProps }) => { ({ title, buttonText, onButtonClick, onRemove, children, buttonContent, severity = 'error', ...restProps }, ref) => {
const theme = useTheme(); const theme = useTheme();
const styles = getStyles(theme, severity, !!buttonContent); const styles = getStyles(theme, severity, !!buttonContent);
return ( return (
<div className={styles.alert} aria-label={selectors.components.Alert.alert(severity)} {...restProps}> <div ref={ref} className={styles.alert} aria-label={selectors.components.Alert.alert(severity)} {...restProps}>
<div className={styles.icon}> <div className={styles.icon}>
<Icon size="xl" name={getIconFromSeverity(severity) as IconName} /> <Icon size="xl" name={getIconFromSeverity(severity) as IconName} />
</div> </div>