chadtmiller.com/knotless

<script lang="ts">
	import type { Snippet } from 'svelte';
	import { date } from '#lib/format.ts';
	import Avatar from '#lib/atoms/Avatar.svelte';
	import Person from '#lib/molecules/Person.svelte';
	/** Something said on a pull or an issue: who said it, when, and what. */
	let { author, avatar, said, createdAt, html, end }: { author: string; avatar?: string | null; said: string; createdAt: string; html: string; end?: Snippet } =
		$props();
</script>

<div class="box comment">
	<div class="boxhead">
		<Avatar name={author} src={avatar} />
		<Person handle={author} />
		<span class="mute">{said} on {date(createdAt)}</span>
		{#if end}<span class="end">{@render end()}</span>{/if}
	</div>
	<div class="prose">{@html html}</div>
</div>