export const workflowLogs = tv({
slots: {
viewport:
"overflow-y-auto border-x border-b border-(--y-border) bg-(--y-bg) typography-monospace-regular",
"h-[min(70dvh,60rem)] flex-[1_1_auto] overflow-y-auto border-x border-b border-(--y-border) bg-(--y-bg) typography-monospace-regular",
sizer: "relative w-full",
row: "absolute top-0 left-0 flex w-full",
header: "sticky top-0 z-10 flex w-full cursor-pointer items-center gap-xs border-y border-(--y-border) bg-(--y-card) px-2.5 text-left hover:bg-(--y-soft)",
header: "ic-box sticky top-0 z-10 flex w-full cursor-pointer items-center gap-xs border-y border-(--y-border) bg-(--y-card) px-2.5 text-left hover:bg-(--y-soft)",
chevron: "size-3.5 shrink-0 text-(--y-muted)",
name: "truncate text-(--y-text)",
elapsed: "ml-auto shrink-0 text-(--y-muted) tabular-nums",
body: "w-full min-w-0 px-sm",
490 unmodified lines
Expand all
<TriangleAlert class="size-4" aria-hidden="true" /> no logs for this workflow
{/if}
</div>
{:else}
<div class="relative">
<!-- in the desktop pane this grows to the pane's bottom, and the viewport with it -->
<div class="relative flex flex-col" data-fill-pane>
{#if finder.open}
<LineSearch
label="find in logs"
bind:query={finder.query}
bind:clientHeight={viewportHeight}
{onscroll}
{onwheel}
class={classes().viewport()}
style="height: min(70dvh, 60rem)"
>
{#if topCapHeight !== null}
<div
class={classes().topCap({ closed: topCapHeight < TOP_CAP })}