diff options
Diffstat (limited to 'src/components/atoms/links/link.tsx')
| -rw-r--r-- | src/components/atoms/links/link.tsx | 27 |
1 files changed, 8 insertions, 19 deletions
diff --git a/src/components/atoms/links/link.tsx b/src/components/atoms/links/link.tsx index 8991f38..1765bb5 100644 --- a/src/components/atoms/links/link.tsx +++ b/src/components/atoms/links/link.tsx @@ -1,17 +1,13 @@ import NextLink from 'next/link'; -import { FC, ReactNode } from 'react'; +import { AnchorHTMLAttributes, FC, ReactNode } from 'react'; import styles from './link.module.scss'; -export type LinkProps = { +export type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & { /** * The link body. */ children: ReactNode; /** - * Set additional classnames to the link. - */ - className?: string; - /** * True if it is a download link. Default: false. */ download?: boolean; @@ -34,33 +30,26 @@ export type LinkProps = { * * Render a link. */ -const Link: FC<LinkProps> = ({ +export const Link: FC<LinkProps> = ({ children, className = '', download = false, external = false, href, lang, + ...props }) => { const downloadClass = download ? styles['link--download'] : ''; + const linkClass = `${styles.link} ${downloadClass} ${className}`; + const externalLinkClass = `${linkClass} ${styles['link--external']}`; return external ? ( - <a - href={href} - hrefLang={lang} - className={`${styles.link} ${styles['link--external']} ${downloadClass} ${className}`} - > + <a {...props} className={externalLinkClass} href={href} hrefLang={lang}> {children} </a> ) : ( - <NextLink - className={`${styles.link} ${downloadClass} ${className}`} - href={href} - hrefLang={lang} - > + <NextLink {...props} className={linkClass} href={href} hrefLang={lang}> {children} </NextLink> ); }; - -export default Link; |
