blob: 8a52231a021e8bfe4273fa05f80e7d7ea5b5da8f (
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
44
45
|
import ButtonLink from '@components/atoms/buttons/button-link';
import Arrow from '@components/atoms/icons/arrow';
import { VFC } from 'react';
import { useIntl } from 'react-intl';
import styles from './back-to-top.module.scss';
export type BackToTopProps = {
/**
* Set additional classnames to the button wrapper.
*/
className?: string;
/**
* An element id (without hashtag) to use as anchor.
*/
target: string;
};
/**
* BackToTop component
*
* Render a back to top link.
*/
const BackToTop: VFC<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 direction="top" />
</ButtonLink>
</div>
);
};
export default BackToTop;
|
