Primitive Run Card Components

1"use client";
2 
3import type React from "react";
4import ReactMarkdown, { type Components } from "react-markdown";
5import remarkGfm from "remark-gfm";
6 
7import {
8  SEGMENT_PALETTE,
9  segmentsPageCount,
10  type Segment,
11} from "@/lib/segments";
12import { FileThumbnail } from "@/components/ui/file-thumbnail";
13import { PageRibbon, type RibbonRow } from "@/components/ui/page-ribbon";
14import { RunCard, type RunStatus } from "@/components/ui/run-card";
15import { SegmentLegend } from "@/components/ui/segment-legend";
16import type { Source, SourceAnchor } from "@/lib/document-source";
17 
18/**
19 * Prop-driven primitive run cards — one card per Retab primitive (classify,
20 * split, partition, parse, extract), each framing the source document with that
21 * primitive's result over the shared {@link RunCard} shell. Presentational: the
22 * caller resolves the result (a category, `Segment[]`, markdown, or extract
23 * fields) and passes it in, so the same cards render a static demo or a live
24 * workflow run's per-block result.
25 */
26 
27// The sample pages are US-Letter; one page aspect lets coordinate-anchored
28// overlays (the extract source boxes) map onto the cropped thumbnail.
29const PAGE_ASPECT = 800 / 1036;
30 
31export type PrimitiveRunCardFile = { name: string; type: string };
32 
33interface PrimitiveRunCardBase {
34  /** Source document the run was over. */
35  file: PrimitiveRunCardFile;
36  /** Run lifecycle pill; defaults to "completed". */
37  status?: RunStatus | null;
38  /** Makes the whole card a button. */
39  onClick?: () => void;
40}
41 
42// ── Classification ────────────────────────────────────────────────────────────
43 
44export interface ClassificationRunCardProps extends PrimitiveRunCardBase {
45  /** Page image rendered behind the result. */
46  previewImageUrl?: string;
47  /**
48   * Custom media rendered in the shared RunCard frame. Use this when a consumer
49   * owns document loading/cropping behavior but still wants the shared
50   * classification footer and run-card shell.
51   */
52  media?: React.ReactNode;
53  /** Aspect ratio for custom media; defaults to the RunCard media frame. */
54  mediaAspectRatio?: number;
55  category: string;
56  reasoning?: string;
57}
58 
59export function ClassificationRunCard({
60  file,
61  previewImageUrl,
62  media,
63  mediaAspectRatio,
64  category,
65  reasoning,
66  status = "completed",
67  onClick,
68}: ClassificationRunCardProps) {
69// … truncated