Files
frontend-svelte/src/shared/ui/Link/Link.svelte
T
2026-04-23 14:59:32 +03:00

46 lines
1003 B
Svelte

<!--
Component: Link
A styled link component based on the footer link design.
Supports optional icon snippet and standard anchor attributes.
-->
<script lang="ts">
import { cn } from '$shared/lib';
import type { Snippet } from 'svelte';
import type { HTMLAnchorAttributes } from 'svelte/elements';
interface Props extends HTMLAnchorAttributes {
/**
* Link content
*/
children?: Snippet;
/**
* Optional icon snippet
*/
icon?: Snippet;
/**
* CSS classes
*/
class?: string;
}
let {
children,
icon,
class: className,
...rest
}: Props = $props();
</script>
<a
class={cn(
'group inline-flex items-center gap-1 text-2xs font-mono uppercase tracking-wider-mono',
'text-neutral-400 hover:text-brand transition-colors',
'bg-surface/80 dark:bg-dark-bg/80 backdrop-blur-sm px-2 py-1 pointer-events-auto',
className,
)}
{...rest}
>
{@render children?.()}
{@render icon?.()}
</a>