diff options
Diffstat (limited to 'src/components/molecules/buttons/help-button.tsx')
| -rw-r--r-- | src/components/molecules/buttons/help-button.tsx | 15 |
1 files changed, 12 insertions, 3 deletions
diff --git a/src/components/molecules/buttons/help-button.tsx b/src/components/molecules/buttons/help-button.tsx index 4945bb4..d933829 100644 --- a/src/components/molecules/buttons/help-button.tsx +++ b/src/components/molecules/buttons/help-button.tsx @@ -3,14 +3,19 @@ import { FC } from 'react'; import { useIntl } from 'react-intl'; import styles from './help-button.module.scss'; -export type HelpButtonProps = Pick<ButtonProps, 'onClick'>; +export type HelpButtonProps = Pick<ButtonProps, 'onClick'> & { + /** + * Set additional classes to the button. + */ + classes?: string; +}; /** * HelpButton component * * Render a button with an interrogation mark icon. */ -const HelpButton: FC<HelpButtonProps> = ({ onClick }) => { +const HelpButton: FC<HelpButtonProps> = ({ classes = '', onClick }) => { const intl = useIntl(); const text = intl.formatMessage({ defaultMessage: 'Help', @@ -19,7 +24,11 @@ const HelpButton: FC<HelpButtonProps> = ({ onClick }) => { }); return ( - <Button shape="circle" additionalClasses={styles.btn} onClick={onClick}> + <Button + shape="circle" + additionalClasses={`${styles.btn} ${classes}`} + onClick={onClick} + > <span className="screen-reader-text">{text}</span> <span className={styles.icon}>?</span> </Button> |
