<script lang="ts">
	import { fadeDefault } from '$lib/Transitions';
	import { fade } from 'svelte/transition';

	let { number }: { number: number } = $props();
</script>

{#if number > 0}
	<span
		class="absolute -top-1.5 -right-1 z-1 rounded-xs bg-teal-600 px-1 text-xs font-semibold drop-shadow-sm"
		transition:fade={fadeDefault}
	>
		{number}
	</span>
{/if}