Files
trevstack/client/src/lib/ui/Button.svelte
2025-04-10 19:15:21 -04:00

33 lines
752 B
Svelte

<script lang="ts">
import { Button } from 'bits-ui';
import { cn } from '$lib/utils';
import type { Snippet } from 'svelte';
type me = MouseEvent & { currentTarget: EventTarget & HTMLButtonElement };
let {
className,
type,
onclick,
children
}: {
className?: string;
type?: 'submit' | 'reset' | 'button' | null;
onclick?: (e: me) => void;
children?: Snippet<[]>;
} = $props();
</script>
<Button.Root
{type}
class={cn(
'bg-sky text-crust focus:outline-sky flex w-fit cursor-pointer items-center justify-center rounded p-2 px-4 text-sm font-medium transition-all hover:brightness-120 focus:outline-2 focus:outline-offset-1',
className
)}
onclick={(e: me) => {
onclick?.(e);
}}
>
{@render children?.()}
</Button.Root>