50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
import React from "react";
|
|
import NextJSLink, { LinkProps } from "next/link";
|
|
|
|
interface Props extends Omit<LinkProps, "href" | "as"> {
|
|
children?: React.ReactNode;
|
|
to: string;
|
|
template?: string;
|
|
target?: string;
|
|
onClick?: (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
|
|
onMouseEnter?: (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
|
|
onMouseLeave?: (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
|
|
}
|
|
|
|
const Link: React.FC<Props> = ({
|
|
to, template, passHref, onClick, onMouseEnter, onMouseLeave, ...props
|
|
}) => {
|
|
if (template) {
|
|
return (
|
|
<NextJSLink
|
|
href={template}
|
|
passHref={passHref}
|
|
as={to}
|
|
{...props}
|
|
onClick={onClick}
|
|
onMouseEnter={onMouseEnter}
|
|
onMouseLeave={onMouseLeave}
|
|
/>
|
|
);
|
|
}
|
|
if (to.startsWith("/") || to.startsWith("#")) {
|
|
return (
|
|
<NextJSLink
|
|
href={to}
|
|
passHref={passHref}
|
|
{...props}
|
|
onClick={onClick}
|
|
onMouseEnter={onMouseEnter}
|
|
onMouseLeave={onMouseLeave}
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
// eslint-disable-next-line jsx-a11y/anchor-has-content
|
|
<a href={to} onClick={onClick} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} {...props} />
|
|
);
|
|
};
|
|
|
|
export default Link;
|