Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
12345678910111213141516171819202122232425262728293031323334353637<script lang="ts"> import UserRound from "$icon/user-round";
interface Props { src?: string; handle?: string; size?: string; class?: string; }
let { src, handle, size = "size-10", class: className = "" }: Props = $props();
let failed = $state(false);
$effect(() => { if (src) failed = false; });</script>
{#if src && !failed} <img {src} alt={handle ? `${handle}'s avatar` : "avatar"} class={`${size} shrink-0 rounded-full border border-border-default object-cover ${className}`} onerror={() => (failed = true)} />{:else} <span class={`${size} flex shrink-0 items-center justify-center rounded-full border border-border-default bg-background-inset text-foreground-subtle ${className}`} role={handle ? "img" : undefined} aria-label={handle ? `${handle}'s avatar` : undefined} aria-hidden={handle ? undefined : "true"} > <UserRound class="size-1/2" /> </span>{/if}