2023-07-15 17:46:19 +03:00
|
|
|
import { Link } from 'react-router-dom';
|
|
|
|
|
2023-12-13 14:32:57 +03:00
|
|
|
|
2023-07-15 17:46:19 +03:00
|
|
|
interface TextURLProps {
|
|
|
|
text: string
|
2023-12-18 19:42:27 +03:00
|
|
|
title?: string
|
2023-12-05 01:22:44 +03:00
|
|
|
href?: string
|
2023-12-08 19:24:08 +03:00
|
|
|
color?: string
|
2023-12-05 01:22:44 +03:00
|
|
|
onClick?: () => void
|
2023-07-15 17:46:19 +03:00
|
|
|
}
|
|
|
|
|
2023-12-18 19:42:27 +03:00
|
|
|
function TextURL({ text, href, title, color='clr-text-url', onClick }: TextURLProps) {
|
2023-12-08 19:24:08 +03:00
|
|
|
const design = `cursor-pointer hover:underline ${color}`;
|
2023-12-05 01:22:44 +03:00
|
|
|
if (href) {
|
|
|
|
return (
|
2023-12-18 19:42:27 +03:00
|
|
|
<Link tabIndex={-1}
|
2023-12-08 19:24:08 +03:00
|
|
|
className={design}
|
2023-12-18 19:42:27 +03:00
|
|
|
title={title}
|
2023-12-05 01:22:44 +03:00
|
|
|
to={href}
|
|
|
|
>
|
2023-07-15 17:46:19 +03:00
|
|
|
{text}
|
|
|
|
</Link>
|
2023-12-05 01:22:44 +03:00
|
|
|
);
|
|
|
|
} else if (onClick) {
|
|
|
|
return (
|
2023-12-18 19:42:27 +03:00
|
|
|
<span tabIndex={-1}
|
2023-12-08 19:24:08 +03:00
|
|
|
className={design}
|
2023-12-05 01:22:44 +03:00
|
|
|
onClick={onClick}
|
|
|
|
>
|
|
|
|
{text}
|
|
|
|
</span>);
|
|
|
|
} else {
|
|
|
|
return null;
|
|
|
|
}
|
2023-07-15 17:46:19 +03:00
|
|
|
}
|
|
|
|
|
2023-12-13 14:32:57 +03:00
|
|
|
export default TextURL;
|