hestia/src/lib/components/Navigation/Link.svelte
Baobeld 1fa98c204c
Bug: use clsx on svelte element classNames (#60)
use clsx on svelte element classNames
2025-01-16 22:11:38 -05:00

24 lines
807 B
Svelte

<script lang="ts">
import type { DaisyColor } from '$lib/types';
import clsx from 'clsx';
import type { SvelteHTMLElements } from 'svelte/elements';
import { twMerge } from 'tailwind-merge';
type Props = { color?: DaisyColor; hover?: boolean } & SvelteHTMLElements['a'];
let { children, class: className, color, hover, ...props }: Props = $props();
</script>
<a
class={twMerge('link', clsx(className))}
class:link-primary={color === 'primary'}
class:link-secondary={color === 'secondary'}
class:link-accent={color === 'accent'}
class:link-neutral={color === 'neutral'}
class:link-info={color === 'info'}
class:link-success={color === 'success'}
class:link-warning={color === 'warning'}
class:link-error={color === 'error'}
class:link-hover={hover}
{...props}>{@render children?.()}</a
>