Files
portfolio/src/components/TextLink.astro

42 lines
995 B
Plaintext

---
import type { HTMLAttributes } from "astro/types";
interface Props extends HTMLAttributes<"a"> {
includeExternalLinkIcon?: boolean;
}
import { Icon } from "astro-icon/components";
const {
href,
class: className,
includeExternalLinkIcon = true,
...attrs
} = Astro.props;
const linkIsExternal: boolean =
href !== undefined && href !== null
? href.toString().startsWith("http")
: false;
---
<a
href={href}
class:list={["group text-primary inline transition", className]}
target={href?.toString().startsWith("http") ? "_blank" : undefined}
rel={linkIsExternal ? "noopener noreferrer" : undefined}
{...attrs}
><span class="group-hover:text-primary-100"><slot /></span>{
includeExternalLinkIcon && linkIsExternal && (
<sup class="ml-0.5 inline-block">
<Icon
name="mdi:external-link"
class:list={[
"text-primary group-hover:text-primary-100 m-0 inline-block"
]}
/>
</sup>
)
}
</a>