This commit is contained in:
Timothy Jaeryang Baek
2026-03-26 18:42:42 -05:00
parent 4c872a8d12
commit 308fa924a5
@@ -108,7 +108,7 @@
<div {id} class="w-full"> <div {id} class="w-full">
{#if allEmbeds.length > 0} {#if allEmbeds.length > 0}
<!-- Embed mode: render iframes directly like ToolCallDisplay --> <!-- Embeds rendered directly above the collapsed group -->
{#each allEmbeds as embedItem, idx} {#each allEmbeds as embedItem, idx}
<div id={`${id}-embed-${idx}`}> <div id={`${id}-embed-${idx}`}>
<FullHeightIframe <FullHeightIframe
@@ -121,59 +121,59 @@
/> />
</div> </div>
{/each} {/each}
{:else} {/if}
<!-- svelte-ignore a11y-no-static-element-interactions -->
<button <!-- svelte-ignore a11y-no-static-element-interactions -->
class="w-fit text-left text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition cursor-pointer" <button
aria-label={$i18n.t('Toggle details')} class="w-fit text-left text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition cursor-pointer"
aria-expanded={open} aria-label={$i18n.t('Toggle details')}
on:click={() => { aria-expanded={open}
open = !open; on:click={() => {
}} open = !open;
> }}
<div class="flex items-center gap-1.5"> >
<!-- Status icon --> <div class="flex items-center gap-1.5">
{#if hasPending} <!-- Status icon -->
<div> {#if hasPending}
<Spinner className="size-4" /> <div>
</div> <Spinner className="size-4" />
{:else if toolCallCount > 0} </div>
<div class="text-emerald-500 dark:text-emerald-400"> {:else if toolCallCount > 0}
<CheckCircle className="size-4" strokeWidth="2" /> <div class="text-emerald-500 dark:text-emerald-400">
</div> <CheckCircle className="size-4" strokeWidth="2" />
{:else} </div>
<div class="text-gray-400 dark:text-gray-500"> {:else}
<Sparkles className="size-3.5" /> <div class="text-gray-400 dark:text-gray-500">
</div> <Sparkles className="size-3.5" />
</div>
{/if}
<!-- Summary text -->
<div class="flex-1 line-clamp-1">
<span class="text-gray-600 dark:text-gray-300 {hasPending ? 'shimmer' : ''}"
>{prefixText}</span
>
{#if summaryText}
<span class="text-gray-400 dark:text-gray-500">{summaryText}</span>
{/if} {/if}
<!-- Summary text -->
<div class="flex-1 line-clamp-1">
<span class="text-gray-600 dark:text-gray-300 {hasPending ? 'shimmer' : ''}"
>{prefixText}</span
>
{#if summaryText}
<span class="text-gray-400 dark:text-gray-500">{summaryText}</span>
{/if}
</div>
<!-- Chevron -->
<div class="flex shrink-0 self-center text-gray-400 dark:text-gray-500">
{#if open}
<ChevronUp strokeWidth="3.5" className="size-3" />
{:else}
<ChevronDown strokeWidth="3.5" className="size-3" />
{/if}
</div>
</div> </div>
</button>
{#if open} <!-- Chevron -->
<div transition:slide={{ duration: 300, easing: quintOut, axis: 'y' }}> <div class="flex shrink-0 self-center text-gray-400 dark:text-gray-500">
<div class="mb-0.5 space-y-0.5"> {#if open}
<slot name="content" /> <ChevronUp strokeWidth="3.5" className="size-3" />
</div> {:else}
<ChevronDown strokeWidth="3.5" className="size-3" />
{/if}
</div> </div>
{/if} </div>
</button>
{#if open}
<div transition:slide={{ duration: 300, easing: quintOut, axis: 'y' }}>
<div class="mb-0.5 space-y-0.5">
<slot name="content" />
</div>
</div>
{/if} {/if}
</div> </div>