Something went wrong. Try again.
Monorepo for Tangled tangled.org
Something went wrong. Try again.
Svelte
at icy/tmrrpn
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970<script lang="ts"> import MessageSquarePlus from "$icon/message-square-plus"; import Reply from "$icon/reply"; import { type MarkupContext } from "$lib/markup"; import CommentEditor from "./CommentEditor.svelte"; import type { ThreadInput } from "./comments";
interface Props { subjectUri: string; subjectCid?: string; replyToUri?: string; replyToCid?: string; authorDid: string; authorHandle: string; markup: MarkupContext; // "thread" tucks the box into a comment card, matching its canvas background variant?: "default" | "thread"; autofocus?: boolean; onsubmitted?: (submitted: ThreadInput) => void; oncancel?: () => void; }
let { subjectUri, subjectCid, replyToUri, replyToCid, authorDid, authorHandle, markup, variant = "default", autofocus = false, onsubmitted, oncancel }: Props = $props();
const isThread = $derived(variant === "thread");</script>
{#snippet editor()} <CommentEditor {subjectUri} {subjectCid} {replyToUri} {replyToCid} {authorDid} {authorHandle} {markup} rows={isThread ? 4 : 6} placeholder={isThread ? "Write a reply. Markdown is supported." : "Add to the discussion. Markdown is supported."} submitLabel={isThread ? "Reply" : "Comment"} submitIcon={isThread ? Reply : MessageSquarePlus} {autofocus} {onsubmitted} {oncancel} />{/snippet}
{#if isThread} <div class="bg-background-default/50 p-4"> {@render editor()} </div>{:else} <div class="rounded-sm border border-border-default bg-background-default p-4 drop-shadow-xs"> {@render editor()} </div>{/if}