diff --git a/packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.tsx b/packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.tsx index 8139228a81c..477104a4375 100644 --- a/packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.tsx +++ b/packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.tsx @@ -7,7 +7,7 @@ import { selectors } from '@grafana/e2e-selectors'; import { HorizontalGroup, Input } from '..'; import { useStyles2 } from '../../themes'; import { IconName } from '../../types/icon'; -import { Button } from '../Button'; +import { Button, ButtonVariant } from '../Button'; import { Modal } from '../Modal/Modal'; export interface ConfirmModalProps { @@ -21,8 +21,12 @@ export interface ConfirmModalProps { description?: React.ReactNode; /** Text for confirm button */ confirmText: string; + /** Variant for confirm button */ + confirmVariant?: ButtonVariant; /** Text for dismiss button */ dismissText?: string; + /** Variant for dismiss button */ + dismissVariant?: ButtonVariant; /** Icon for the modal header */ icon?: IconName; /** Text user needs to fill in before confirming */ @@ -43,8 +47,10 @@ export const ConfirmModal = ({ body, description, confirmText, + confirmVariant = 'destructive', confirmationText, dismissText = 'Cancel', + dismissVariant = 'secondary', alternativeText, icon = 'exclamation-triangle', onConfirm, @@ -79,11 +85,11 @@ export const ConfirmModal = ({ ) : null} -