blob: f42244494f98f2a96af0502f0f734bdf38caaf16 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
import { FC } from 'react';
import { useIntl } from 'react-intl';
import ButtonLink, {
type ButtonLinkProps,
} from '../../atoms/buttons/button-link';
import Arrow from '../../atoms/icons/arrow';
import styles from './back-to-top.module.scss';
export type BackToTopProps = Pick<ButtonLinkProps, 'target'> & {
/**
* Set additional classnames to the button wrapper.
*/
className?: string;
};
/**
* BackToTop component
*
* Render a back to top link.
*/
const BackToTop: FC<BackToTopProps> = ({ className = '', target }) => {
const intl = useIntl();
const linkName = intl.formatMessage({
defaultMessage: 'Back to top',
description: 'BackToTop: link text',
id: 'm+SUSR',
});
return (
<div className={`${styles.wrapper} ${className}`}>
<ButtonLink
shape="square"
target={`#${target}`}
aria-label={linkName}
className={styles.link}
>
<Arrow aria-hidden={true} direction="top" />
</ButtonLink>
</div>
);
};
export default BackToTop;
|
