@meridianlabs/inspect-scout-viewer 0.4.6 → 0.4.8

package/lib/app/transcripts/columnFilter/ColumnFilterControl.d.ts

@@ -0,0 +1,16 @@
+import { FC } from 'react';
+import { ScalarValue } from '../../../api/api';
+import { SimpleCondition } from '../../../query/types';
+import { FilterType } from '../../../state/store';
+interface ColumnFilterControlProps {
+    columnId: string;
+    filterType: FilterType;
+    condition: SimpleCondition | null;
+    onChange: (condition: SimpleCondition | null) => void;
+    /** Autocomplete suggestions for the filter value */
+    suggestions?: ScalarValue[];
+    /** Called when the popover opens/closes (for fetching suggestions) */
+    onOpenChange?: (columnId: string | null) => void;
+}
+export declare const ColumnFilterControl: FC<ColumnFilterControlProps>;
+export {};

package/lib/app/transcripts/columnFilter/ColumnFilterEditor.d.ts

@@ -0,0 +1,31 @@
+import { FC } from 'react';
+import { ScalarValue } from '../../../api/api';
+import { OperatorModel } from '../../../query';
+import { FilterType } from '../../../state/store';
+export interface AvailableColumn {
+    id: string;
+    label: string;
+}
+export interface ColumnFilterEditorProps {
+    columnId: string;
+    filterType: FilterType;
+    operator: OperatorModel;
+    operatorOptions: OperatorModel[];
+    rawValue: string;
+    /** Second value for BETWEEN/NOT BETWEEN operators */
+    rawValue2?: string;
+    isValueDisabled: boolean;
+    /** True if operator expects a range with two values (BETWEEN, NOT BETWEEN) */
+    isRangeOperator?: boolean;
+    onOperatorChange: (operator: OperatorModel) => void;
+    onValueChange: (value: string) => void;
+    /** Handler for second value changes (BETWEEN operators) */
+    onValue2Change?: (value: string) => void;
+    onCommit?: () => void;
+    onCancel?: () => void;
+    suggestions?: ScalarValue[];
+    mode?: "add" | "edit";
+    availableColumns?: AvailableColumn[];
+    onColumnChange?: (columnId: string) => void;
+}
+export declare const ColumnFilterEditor: FC<ColumnFilterEditorProps>;

package/lib/app/transcripts/columnFilter/DurationInput.d.ts

@@ -0,0 +1,9 @@
+import { ChangeEvent, FC } from 'react';
+export interface DurationInputProps {
+    id: string;
+    value: string;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
+    autoFocus?: boolean;
+}
+export declare const DurationInput: FC<DurationInputProps>;

package/lib/app/transcripts/columnFilter/index.d.ts

@@ -0,0 +1,7 @@
+export { ColumnFilterControl } from './ColumnFilterControl';
+export { ColumnFilterButton } from './ColumnFilterButton';
+export { ColumnFilterEditor } from './ColumnFilterEditor';
+export { useColumnFilter } from './useColumnFilter';
+export type { UseColumnFilterParams, UseColumnFilterReturn, } from './useColumnFilter';
+export type { ColumnFilterEditorProps } from './ColumnFilterEditor';
+export type { ColumnFilterButtonProps } from './ColumnFilterButton';

package/lib/app/transcripts/columnFilter/useAddFilterPopover.d.ts

@@ -0,0 +1,34 @@
+import { OperatorModel } from '../../../query';
+import { ColumnFilter } from '../../../state/store';
+export interface AvailableColumn {
+    id: string;
+    label: string;
+}
+interface UseAddFilterPopoverParams {
+    filters: Record<string, ColumnFilter>;
+    onAddFilter: (filter: ColumnFilter) => void;
+    onFilterColumnChange?: (columnId: string | null) => void;
+}
+/**
+ * Hook for managing the "Add Filter" popover state.
+ * Wraps useColumnFilter with column selection and open/close logic.
+ */
+export declare function useAddFilterPopover({ filters, onAddFilter, onFilterColumnChange, }: UseAddFilterPopoverParams): {
+    isOpen: boolean;
+    setIsOpen: import('react').Dispatch<import('react').SetStateAction<boolean>>;
+    selectedColumnId: string | null;
+    availableColumns: AvailableColumn[];
+    operator: "=" | "!=" | "<" | "<=" | ">" | ">=" | "IN" | "NOT IN" | "LIKE" | "NOT LIKE" | "ILIKE" | "NOT ILIKE" | "IS NULL" | "IS NOT NULL" | "BETWEEN" | "NOT BETWEEN";
+    setOperator: (op: OperatorModel) => void;
+    operatorOptions: ("=" | "!=" | "<" | "<=" | ">" | ">=" | "IN" | "NOT IN" | "LIKE" | "NOT LIKE" | "ILIKE" | "NOT ILIKE" | "IS NULL" | "IS NOT NULL" | "BETWEEN" | "NOT BETWEEN")[];
+    value: string;
+    setValue: (value: string) => void;
+    value2: string;
+    setValue2: (value: string) => void;
+    isValueDisabled: boolean;
+    isRangeOperator: boolean;
+    handleColumnChange: (newColumnId: string) => void;
+    commitAndClose: () => void;
+    cancelAndClose: () => void;
+};
+export {};

package/lib/app/transcripts/columnFilter/useColumnFilter.d.ts

@@ -0,0 +1,27 @@
+import { OperatorModel } from '../../../query';
+import { SimpleCondition } from '../../../query/types';
+import { FilterType } from '../../../state/store';
+export interface UseColumnFilterParams {
+    columnId: string;
+    filterType: FilterType;
+    condition: SimpleCondition | null;
+    isOpen: boolean;
+}
+export interface UseColumnFilterReturn {
+    operator: OperatorModel;
+    setOperator: (operator: OperatorModel) => void;
+    operatorOptions: OperatorModel[];
+    value: string;
+    setValue: (value: string) => void;
+    /** Second value for BETWEEN/NOT BETWEEN operators */
+    value2: string;
+    setValue2: (value: string) => void;
+    /** True if operator requires no value (IS NULL, IS NOT NULL) */
+    usesValue: boolean;
+    /** True if operator expects a list of values (IN, NOT IN) */
+    usesListValue: boolean;
+    /** True if operator expects a range with two values (BETWEEN, NOT BETWEEN) */
+    usesRangeValue: boolean;
+    buildCondition: (operator: OperatorModel, value: string, value2?: string) => SimpleCondition | null | undefined;
+}
+export declare function useColumnFilter({ columnId, filterType, condition, isOpen, }: UseColumnFilterParams): UseColumnFilterReturn;

package/lib/app/transcripts/columnFilter/useColumnFilterPopover.d.ts

@@ -0,0 +1,25 @@
+import { SimpleCondition } from '../../../query/types';
+import { FilterType } from '../../../state/store';
+import { useColumnFilter } from './useColumnFilter';
+export interface UseColumnFilterPopoverParams {
+    columnId: string;
+    filterType: FilterType;
+    condition: SimpleCondition | null;
+    onChange: (condition: SimpleCondition | null) => void;
+}
+export interface UseColumnFilterPopoverReturn {
+    isOpen: boolean;
+    setIsOpen: (open: boolean) => void;
+    operator: ReturnType<typeof useColumnFilter>["operator"];
+    setOperator: ReturnType<typeof useColumnFilter>["setOperator"];
+    operatorOptions: ReturnType<typeof useColumnFilter>["operatorOptions"];
+    value: ReturnType<typeof useColumnFilter>["value"];
+    setValue: ReturnType<typeof useColumnFilter>["setValue"];
+    value2: ReturnType<typeof useColumnFilter>["value2"];
+    setValue2: ReturnType<typeof useColumnFilter>["setValue2"];
+    isValueDisabled: ReturnType<typeof useColumnFilter>["usesValue"];
+    isRangeOperator: ReturnType<typeof useColumnFilter>["usesRangeValue"];
+    commitAndClose: () => void;
+    cancelAndClose: () => void;
+}
+export declare function useColumnFilterPopover({ columnId, filterType, condition, onChange, }: UseColumnFilterPopoverParams): UseColumnFilterPopoverReturn;

package/lib/app/transcripts/columnSizing/defaultStrategy.d.ts

@@ -0,0 +1,2 @@
+import { SizingStrategy } from './types';
+export declare const defaultStrategy: SizingStrategy;

package/lib/app/transcripts/columnSizing/fitContentStrategy.d.ts

@@ -0,0 +1,2 @@
+import { SizingStrategy } from './types';
+export declare const fitContentStrategy: SizingStrategy;

package/lib/app/transcripts/columnSizing/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export * from './utils';
+export * from './strategies';
+export * from './useColumnSizing';

package/lib/app/transcripts/columnSizing/strategies.d.ts

@@ -0,0 +1,10 @@
+import { ColumnSizingStrategyKey, SizingStrategy } from './types';
+/**
+ * Registry of all available sizing strategies.
+ */
+export declare const sizingStrategies: Record<ColumnSizingStrategyKey, SizingStrategy>;
+/**
+ * Get a sizing strategy by key.
+ * Falls back to default strategy if key is not found.
+ */
+export declare function getSizingStrategy(key: ColumnSizingStrategyKey): SizingStrategy;

package/lib/app/transcripts/columnSizing/types.d.ts

@@ -0,0 +1,47 @@
+import { ColumnSizingState } from '@tanstack/react-table';
+import { TranscriptInfo } from '../../../types/api-types';
+import { TranscriptColumn } from '../columns';
+/**
+ * Size constraints for a column.
+ */
+export interface ColumnSizeConstraints {
+    /** Default size in pixels */
+    size: number;
+    /** Minimum allowed size in pixels */
+    minSize: number;
+    /** Maximum allowed size in pixels */
+    maxSize: number;
+}
+/** Default minimum column size in pixels */
+export declare const DEFAULT_MIN_SIZE = 40;
+/** Default maximum column size in pixels */
+export declare const DEFAULT_MAX_SIZE = 600;
+/** Default column size in pixels when not specified */
+export declare const DEFAULT_SIZE = 150;
+/**
+ * Context provided to sizing strategies for computing column sizes.
+ */
+export interface SizingStrategyContext {
+    /** The table element for DOM measurements (may be null) */
+    tableElement: HTMLTableElement | null;
+    /** Column definitions */
+    columns: TranscriptColumn[];
+    /** Current data for content measurement */
+    data: TranscriptInfo[];
+    /** Pre-computed constraints for each column */
+    constraints: Map<string, ColumnSizeConstraints>;
+}
+/**
+ * Interface for column sizing strategies.
+ * Each strategy computes column sizes differently.
+ */
+export interface SizingStrategy {
+    /** Compute sizes for all columns */
+    computeSizes(context: SizingStrategyContext): ColumnSizingState;
+}
+/**
+ * Available sizing strategy keys.
+ * - "default": Uses the column's defined `size` property
+ * - "fit-content": Measures content and sizes columns to fit within min/max constraints
+ */
+export type ColumnSizingStrategyKey = "default" | "fit-content";

package/lib/app/transcripts/columnSizing/useColumnSizing.d.ts

@@ -0,0 +1,34 @@
+import { ColumnSizingState, OnChangeFn } from '@tanstack/react-table';
+import { TranscriptInfo } from '../../../types/api-types';
+import { TranscriptColumn } from '../columns';
+import { ColumnSizingStrategyKey } from './types';
+interface UseColumnSizingOptions {
+    /** Column definitions */
+    columns: TranscriptColumn[];
+    /** Reference to the table element for DOM measurement */
+    tableRef: React.RefObject<HTMLTableElement | null>;
+    /** Current data for content measurement */
+    data: TranscriptInfo[];
+}
+interface UseColumnSizingResult {
+    /** Current column sizing state */
+    columnSizing: ColumnSizingState;
+    /** Handler for column sizing changes with min/max enforcement */
+    handleColumnSizingChange: OnChangeFn<ColumnSizingState>;
+    /** Current sizing strategy key */
+    sizingStrategy: ColumnSizingStrategyKey;
+    /** Set the sizing strategy */
+    setSizingStrategy: (strategy: ColumnSizingStrategyKey) => void;
+    /** Apply auto-sizing based on current strategy (preserves manually resized columns) */
+    applyAutoSizing: () => void;
+    /** Reset a single column to its auto-calculated size */
+    resetColumnSize: (columnId: string) => void;
+    /** Reset all column sizing and clear manual resize tracking */
+    clearColumnSizing: () => void;
+}
+/**
+ * Hook for managing column sizing with min/max constraints and auto-sizing.
+ * Manually resized columns are preserved during auto-sizing operations.
+ */
+export declare function useColumnSizing({ columns, tableRef, data, }: UseColumnSizingOptions): UseColumnSizingResult;
+export {};

package/lib/app/transcripts/columnSizing/utils.d.ts

@@ -0,0 +1,14 @@
+import { TranscriptColumn } from '../columns';
+import { ColumnSizeConstraints } from './types';
+/**
+ * Extract size constraints from column definitions.
+ */
+export declare function getColumnConstraints(columns: TranscriptColumn[]): Map<string, ColumnSizeConstraints>;
+/**
+ * Clamp a size value to min/max constraints.
+ */
+export declare function clampSize(size: number, constraints: ColumnSizeConstraints): number;
+/**
+ * Get the column ID from a column definition.
+ */
+export declare function getColumnId(column: TranscriptColumn): string;

package/lib/app/transcripts/columns.d.ts

@@ -0,0 +1,37 @@
+import { ColumnDef } from '@tanstack/react-table';
+import { FilterType } from '../../state/store';
+import { TranscriptInfo } from '../../types/api-types';
+export declare const COLUMN_LABELS: Record<keyof TranscriptInfo, string>;
+export type TranscriptColumn = ColumnDef<TranscriptInfo> & {
+    meta?: {
+        align?: "left" | "center" | "right";
+        filterable?: boolean;
+        filterType?: FilterType;
+    };
+    /** Returns string for tooltip display */
+    titleValue?: (value: unknown) => string;
+    /** Returns string representation for column width measurement. Return null to skip content measurement. */
+    textValue?: (value: unknown) => string | null;
+    /** Minimum column width in pixels */
+    minSize?: number;
+    /** Maximum column width in pixels */
+    maxSize?: number;
+};
+export declare const DEFAULT_COLUMN_ORDER: Array<keyof TranscriptInfo>;
+export declare const DEFAULT_VISIBLE_COLUMNS: Array<keyof TranscriptInfo>;
+/**
+ * Get columns for the TranscriptsGrid.
+ * @param visibleColumnKeys - Optional list of column keys to display. If not provided, returns all columns in default order.
+ * @returns Array of column definitions in the order specified or default order.
+ */
+export declare function getTranscriptColumns(visibleColumnKeys?: Array<keyof TranscriptInfo>): TranscriptColumn[];
+/**
+ * Extract title value for tooltip from a cell.
+ */
+export declare function getCellTitleValue(cell: any, columnDef: TranscriptColumn): string;
+/**
+ * Get the filter type for a given column ID.
+ * @param columnId - The column ID to look up
+ * @returns The filter type for the column, or "string" as default
+ */
+export declare function getFilterTypeForColumn(columnId: string): FilterType;

package/lib/app/transcripts/constants.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Infinite Scroll Tuning
+ *
+ * Goal: user never hits bottom while waiting for next page.
+ *
+ * Formula: threshold >= scroll_speed × fetch_duration
+ *
+ * Assumptions:
+ *   row_height = 29px
+ *   fetch_duration = 300-1000ms (variable with fixed overhead)
+ *   max_scroll_speed = 1500px/s (typical fast scroller)
+ *
+ * Check at typical speed (1500px/s):
+ *   runway_time = 2000px / 1500px/s = 1333ms
+ *   worst_case_fetch = 1000ms
+ *   margin = 333ms ✓
+ *
+ * Check at extreme speed (5000px/s):
+ *   runway_time = 2000px / 5000px/s = 400ms
+ *   median_fetch = ~350ms
+ *   margin = 50ms (tight but ok) ✓
+ *
+ * Why large pageSize? Fetch duration is mostly fixed overhead, so larger
+ * pages = fewer fetches = fewer stall opportunities. 500 rows gives ~9.7s
+ * of scrolling per page at 1500px/s.
+ *
+ * Note: If threshold > pageSize_px, the next page is prefetched immediately
+ * after the current page loads. This is fine for maximum smoothness.
+ */
+export declare const TRANSCRIPTS_INFINITE_SCROLL_CONFIG: {
+    /** Number of rows to fetch per page (500 rows = 14,500px at 29px/row) */
+    readonly pageSize: 500;
+    /** Distance from bottom (in px) at which to trigger fetch (~69 rows) */
+    readonly threshold: 2000;
+};

package/lib/app/types.d.ts

@@ -51,6 +51,7 @@ export interface ScanResultData extends ScanResultSummary {
     transcriptAgentArgs?: Record<string, unknown>;
     transcriptScore?: JsonValue;
     transcriptSuccess?: boolean;
+    transcriptMessageCount?: number;
     transcriptTotalTime?: number;
     transcriptTotalTokens?: number;
     transcriptError?: string;

package/lib/components/AutocompleteInput.d.ts

@@ -0,0 +1,19 @@
+import { FC } from 'react';
+export interface AutocompleteInputProps {
+    id: string;
+    value: string;
+    onChange: (value: string) => void;
+    onCommit?: () => void;
+    onCancel?: () => void;
+    disabled?: boolean;
+    placeholder?: string;
+    suggestions: Array<string | number | boolean | null>;
+    autoFocus?: boolean;
+    maxSuggestions?: number;
+    charactersBeforeSuggesting?: number;
+    maxSuggestionWidth?: number;
+    className?: string;
+    /** When true, shows a dropdown toggle icon to browse all options */
+    allowBrowse?: boolean;
+}
+export declare const AutocompleteInput: FC<AutocompleteInputProps>;

package/lib/components/FindBand.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+interface FindBandProps {
+    onClose?: () => void;
+}
+export declare const FindBand: FC<FindBandProps>;
+export {};

package/lib/components/Modal.d.ts

@@ -0,0 +1,10 @@
+import { FC, ReactNode } from 'react';
+interface ModalProps {
+    show: boolean;
+    onHide: () => void;
+    title: string;
+    children: ReactNode;
+    footer?: ReactNode;
+}
+export declare const Modal: FC<ModalProps>;
+export {};

package/lib/components/ToolButton.d.ts

@@ -1,9 +1,10 @@
 import { ButtonHTMLAttributes, ReactNode } from 'react';
 interface ToolButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    label: string | ReactNode;
+    label?: string | ReactNode;
     classes?: string;
     icon?: string;
     latched?: boolean;
+    subtle?: boolean;
 }
 export declare const ToolButton: import('react').ForwardRefExoticComponent<ToolButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
 export {};

package/lib/components/ToolDropdownButton.d.ts

@@ -3,6 +3,9 @@ interface ToolDropdownButtonProps extends ButtonHTMLAttributes<HTMLButtonElement
     label: string | ReactNode;
     icon?: string;
     items: Record<string, () => void>;
+    dropdownAlign?: "left" | "right";
+    dropdownClassName?: string | string[];
+    subtle?: boolean;
 }
 export declare const ToolDropdownButton: import('react').ForwardRefExoticComponent<ToolDropdownButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
 export {};

package/lib/components/content/DisplayModeContext.d.ts

@@ -0,0 +1,9 @@
+export type DisplayMode = "rendered" | "raw";
+export interface DisplayModeContextType {
+    displayMode: DisplayMode;
+}
+export declare const DisplayModeContext: import('react').Context<DisplayModeContextType | null>;
+/**
+ * Hook to access display mode. Returns default "rendered" if no provider exists.
+ */
+export declare const useDisplayMode: () => DisplayMode;

package/lib/components/icons.d.ts

@@ -43,6 +43,7 @@ export declare const ApplicationIcons: {
     confirm: string;
     copy: string;
     display: string;
+    download: string;
     epoch: (epoch: string) => string;
     edit: string;
     error: string;
@@ -95,6 +96,7 @@ export declare const ApplicationIcons: {
     pendingTask: string;
     pendingTaskSubtle: string;
     play: string;
+    "play-circle": string;
     previous: string;
     refresh: string;
     refuse: string;
@@ -126,6 +128,7 @@ export declare const ApplicationIcons: {
     subtask: string;
     success: string;
     successSubtle: string;
+    threeDots: string;
     transcript: string;
     tree: {
         open: string;
@@ -135,4 +138,5 @@ export declare const ApplicationIcons: {
     usage: string;
     wrap: string;
     x: string;
+    xLarge: string;
 };

package/lib/components/transcript/ScoreEventView.d.ts

@@ -9,5 +9,4 @@ interface ScoreEventViewProps {
  * Renders the ScoreEventView component.
  */
 export declare const ScoreEventView: FC<ScoreEventViewProps>;
-export declare const renderScore: (value: unknown) => string | import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/transcript/TranscriptViewNodes.d.ts

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+import { EventNode, EventType } from './types';
+interface TranscriptViewNodesProps {
+    id: string;
+    eventNodes: EventNode[];
+    defaultCollapsedIds: Record<string, boolean>;
+    nodeFilter?: (node: EventNode<EventType>[]) => EventNode<EventType>[];
+    scrollRef?: React.RefObject<HTMLDivElement | null>;
+    initialEventId?: string | null;
+    className?: string | string[];
+}
+export declare const TranscriptViewNodes: FC<TranscriptViewNodesProps>;
+export {};

package/lib/components/transcript/outline/OutlineRow.d.ts

@@ -5,6 +5,7 @@ export interface OutlineRowProps {
     collapseScope: string;
     running?: boolean;
     selected?: boolean;
+    getEventUrl?: (eventId: string) => string | undefined;
 }
 export declare const OutlineRow: FC<OutlineRowProps>;
 export declare const summarizeNode: (node: EventNode) => ReactNode;

package/lib/components/transcript/types.d.ts

@@ -9,6 +9,8 @@ export declare const kTranscriptCollapseScope = "transcript-collapse";
 export declare const kTranscriptOutlineCollapseScope = "transcript-outline";
 export declare const kCollapsibleEventTypes: string[];
 export type EventType = SampleInitEvent | SampleLimitEvent | StateEvent | StoreEvent | ModelEvent | LoggerEvent | InfoEvent | StepEvent | SubtaskEvent | ScoreEvent | ScoreEditEvent | ToolEvent | InputEvent | ErrorEvent | ApprovalEvent | SandboxEvent | SpanBeginEvent | SpanEndEvent;
+export declare const eventTypeValues: readonly ["sample_init", "sample_limit", "state", "store", "model", "logger", "info", "step", "subtask", "score", "score_edit", "tool", "input", "error", "approval", "sandbox", "span_begin", "span_end"];
+export type EventTypeValue = (typeof eventTypeValues)[number];
 export declare class EventNode<T extends EventType = EventType> {
     id: string;
     event: T;

package/lib/index.d.ts

@@ -1,4 +1,6 @@
 export { App } from './App';
 export { apiScoutServer } from './api/api-scout-server';
+export { apiScoutServerV1 } from './api/api-scout-server-v1';
+export type { HeaderProvider } from './api/api-scout-server-v1';
 export type { ScanApi } from './api/api.ts';
 export { ApiProvider, StoreProvider, createStore } from './state/store';