@tonyclaw/agent-inspector 4.0.1 → 4.0.3

package/src/components/proxy-viewer/formats/anthropic/ResponseView.tsx

@@ -1,81 +0,0 @@
-import { StopCircle, Zap } from "lucide-react";
-import { memo, type JSX } from "react";
-import type { AnthropicResponse } from "../../../../contracts/anthropic";
-import { formatTokens } from "../../../../lib/utils";
-import { Badge } from "../../../ui/badge";
-import { Separator } from "../../../ui/separator";
-import type { ResponseToolFocus } from "../index";
-import { ResponseContentBlockRenderer } from "./ContentBlocks";
-
-// eslint-disable-next-line @typescript-eslint/no-shadow -- named function gives React DevTools a readable displayName
-export const StructuredResponseViewAnthropic = memo(function StructuredResponseViewAnthropic({
-  response,
-  toolFocus,
-}: {
-  response: AnthropicResponse;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  let toolIndex = 0;
-
-  return (
-    <div className="space-y-3">
-      <div className="flex items-center gap-2 flex-wrap">
-        <Badge variant="secondary" className="text-[10px] px-1.5 py-0 h-5 font-mono">
-          {response.model}
-        </Badge>
-
-        {response.stop_reason !== null && (
-          <Badge
-            variant="outline"
-            className="text-[10px] px-1.5 py-0 h-5 font-mono flex items-center gap-1"
-          >
-            <StopCircle className="size-2.5" />
-            {response.stop_reason}
-          </Badge>
-        )}
-
-        <span className="flex items-center gap-1 text-muted-foreground text-xs">
-          <Zap className="size-3" />
-          <span className="font-mono tabular-nums">
-            {formatTokens(response.usage.input_tokens ?? 0)} in /{" "}
-            {formatTokens(response.usage.output_tokens ?? 0)} out
-          </span>
-          {response.usage.cache_creation_input_tokens !== undefined &&
-            response.usage.cache_creation_input_tokens !== null &&
-            response.usage.cache_creation_input_tokens > 0 && (
-              <span className="font-mono tabular-nums text-emerald-400">
-                KV Cache +{formatTokens(response.usage.cache_creation_input_tokens)}
-              </span>
-            )}
-          {response.usage.cache_read_input_tokens !== undefined &&
-            response.usage.cache_read_input_tokens !== null &&
-            response.usage.cache_read_input_tokens > 0 && (
-              <span className="font-mono tabular-nums text-purple-400">
-                KV Cache ~{formatTokens(response.usage.cache_read_input_tokens)}
-              </span>
-            )}
-        </span>
-      </div>
-
-      <Separator className="opacity-50" />
-
-      <div className="space-y-2">
-        {response.content.map((block, i) => {
-          const currentToolIndex = block.type === "tool_use" ? toolIndex : undefined;
-          if (block.type === "tool_use") toolIndex += 1;
-          return (
-            <ResponseContentBlockRenderer
-              key={i}
-              block={block}
-              toolIndex={currentToolIndex}
-              toolFocus={toolFocus}
-            />
-          );
-        })}
-        {response.content.length === 0 && (
-          <p className="text-xs text-muted-foreground italic">Empty response content</p>
-        )}
-      </div>
-    </div>
-  );
-});

package/src/components/proxy-viewer/formats/anthropic/thinkingExtract.ts

@@ -1,21 +0,0 @@
-// Regex to extract content wrapped in <think>...</thinking> tags (MiniMax format: <think>...</think>)
-const THINKING_TAG_REGEX = /<think>([\s\S]*?)<\/think>/gi;
-const THINKING_TAG_REGEX_SINGLE = /<think>([\s\S]*?)<\/think>/i;
-
-/**
- * Extract thinking content wrapped in <think> tags (thought balloon emoji) from text.
- * Returns { thinking, remainingText } where thinking is the extracted content
- * and remainingText is the original text with thinking tags removed.
- */
-export function extractThinkingFromContent(text: string): {
-  thinking: string | null;
-  remainingText: string;
-} {
-  const match = THINKING_TAG_REGEX_SINGLE.exec(text);
-  if (!match || match[1] === undefined) {
-    return { thinking: null, remainingText: text };
-  }
-  const thinking = match[1].trim();
-  const remainingText = text.replace(THINKING_TAG_REGEX, "").trim();
-  return { thinking, remainingText };
-}

package/src/components/proxy-viewer/formats/index.tsx

@@ -1,47 +0,0 @@
-import type { JSX } from "react";
-import type { ApiFormat } from "../../../contracts";
-import type { AnthropicResponse } from "../../../contracts/anthropic";
-import type { OpenAIResponse, OpenAIResponsesResponse } from "../../../contracts/openai";
-import { StructuredResponseViewAnthropic } from "./anthropic/ResponseView";
-import { OpenAIResponseView, OpenAIResponsesResponseView } from "./openai/ResponseView";
-
-export { StructuredResponseViewAnthropic } from "./anthropic/ResponseView";
-export { OpenAIResponseView, OpenAIResponsesResponseView } from "./openai/ResponseView";
-export { ResponseContentBlockRenderer } from "./anthropic/ContentBlocks";
-
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-
-function isOpenAIResponse(response: unknown): response is OpenAIResponse {
-  return isRecord(response) && response.object === "chat.completion";
-}
-
-function isOpenAIResponsesResponse(response: unknown): response is OpenAIResponsesResponse {
-  return isRecord(response) && response.object === "response";
-}
-
-function isAnthropicResponse(response: unknown): response is AnthropicResponse {
-  return isRecord(response) && response.type === "message" && Array.isArray(response.content);
-}
-
-export function formatViewFor(
-  apiFormat: ApiFormat | undefined,
-  response: unknown,
-  toolFocus?: ResponseToolFocus,
-): JSX.Element | null {
-  if (apiFormat === "openai" && isOpenAIResponse(response)) {
-    return <OpenAIResponseView response={response} toolFocus={toolFocus} />;
-  }
-  if (apiFormat === "openai" && isOpenAIResponsesResponse(response)) {
-    return <OpenAIResponsesResponseView response={response} toolFocus={toolFocus} />;
-  }
-  if (apiFormat === "anthropic" && isAnthropicResponse(response)) {
-    return <StructuredResponseViewAnthropic response={response} toolFocus={toolFocus} />;
-  }
-  return null;
-}
-export type ResponseToolFocus = {
-  focusedToolIndex: number | null;
-  toolFocusNonce: number;
-};

package/src/components/proxy-viewer/formats/openai/ResponseView.tsx

@@ -1,442 +0,0 @@
-import { StopCircle, Terminal, Zap } from "lucide-react";
-import { memo, Suspense, useEffect, useRef, useState, type JSX, type RefObject } from "react";
-import type {
-  OpenAIResponse,
-  OpenAIResponsesResponse,
-  OpenAIToolCall,
-} from "../../../../contracts/openai";
-import { safeGetOwnProperty } from "../../../../lib/objectUtils";
-import { formatTokens } from "../../../../lib/utils";
-import { AnswerMarkdown } from "../../AnswerMarkdown";
-import { Badge } from "../../../ui/badge";
-import { safeJsonValue } from "../../../ui/json-viewer-bulk";
-import { ScrollArea } from "../../../ui/scroll-area";
-import { Separator } from "../../../ui/separator";
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../ui/collapsible";
-import { ChevronDown, ChevronRight } from "lucide-react";
-import { ThinkingBlock } from "../anthropic/ContentBlocks";
-import { extractThinkingFromContent } from "../anthropic/thinkingExtract";
-import { LazyJsonViewer } from "../../lazy";
-import type { ResponseToolFocus } from "../index";
-
-// Re-export for use in other components
-export { extractThinkingFromContent } from "../anthropic/thinkingExtract";
-
-/** Best-effort JSON parse of an OpenAI `function.arguments` string. Returns
- *  the parsed object, or `null` on parse failure so the renderer can fall
- *  back to showing the raw string. */
-function parseToolArguments(raw: string | undefined): unknown {
-  if (raw === undefined || raw === "") return {};
-  try {
-    return JSON.parse(raw);
-  } catch {
-    return null;
-  }
-}
-
-/** One collapsible tool_use row, mirroring the Anthropic ToolUseBlock visual
- *  treatment (Terminal icon, soft tool accent, name as a Badge, JSON input in
- *  a scrollable JsonViewer). */
-function useToolFocus({
-  toolIndex,
-  toolFocus,
-  setOpen,
-}: {
-  toolIndex: number;
-  toolFocus?: ResponseToolFocus;
-  setOpen: (open: boolean) => void;
-}): RefObject<HTMLButtonElement | null> {
-  const triggerRef = useRef<HTMLButtonElement | null>(null);
-  const shouldFocus = toolFocus?.focusedToolIndex === toolIndex;
-
-  useEffect(() => {
-    if (!shouldFocus || toolFocus === undefined || toolFocus.toolFocusNonce <= 0) return undefined;
-    setOpen(true);
-    const timer = window.setTimeout(() => {
-      const trigger = triggerRef.current;
-      if (trigger === null) return;
-      trigger.scrollIntoView({ block: "center", behavior: "smooth" });
-      trigger.focus({ preventScroll: true });
-    }, 0);
-    return () => window.clearTimeout(timer);
-  }, [setOpen, shouldFocus, toolFocus, toolFocus?.toolFocusNonce]);
-
-  return triggerRef;
-}
-
-function OpenAIFunctionCallBlock({
-  name,
-  argumentsText,
-  toolIndex,
-  toolFocus,
-}: {
-  name: string | undefined;
-  argumentsText: string | undefined;
-  toolIndex: number;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  const blockRef = useRef<HTMLDivElement | null>(null);
-  const shouldFocus = toolFocus?.focusedToolIndex === toolIndex;
-
-  useEffect(() => {
-    if (!shouldFocus || toolFocus === undefined || toolFocus.toolFocusNonce <= 0) return undefined;
-    const timer = window.setTimeout(() => {
-      const block = blockRef.current;
-      if (block === null) return;
-      block.scrollIntoView({ block: "center", behavior: "smooth" });
-      block.focus({ preventScroll: true });
-    }, 0);
-    return () => window.clearTimeout(timer);
-  }, [shouldFocus, toolFocus, toolFocus?.toolFocusNonce]);
-
-  return (
-    <div
-      ref={blockRef}
-      tabIndex={-1}
-      className="border border-sky-400/20 rounded-md p-3 bg-muted/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-      data-response-tool-index={toolIndex}
-    >
-      <div className="text-xs text-sky-400/80 font-mono mb-1">function_call</div>
-      <div className="font-mono text-xs">
-        <span className="text-foreground/80">{name}</span>
-        <span className="text-muted-foreground">({argumentsText})</span>
-      </div>
-    </div>
-  );
-}
-
-function OpenAIToolCallBlock({
-  call,
-  toolIndex,
-  toolFocus,
-}: {
-  call: OpenAIToolCall;
-  toolIndex: number;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  const [open, setOpen] = useState(false);
-  const name = call.function.name ?? "(unnamed tool)";
-  const parsed = open ? parseToolArguments(call.function.arguments) : {};
-  const triggerRef = useToolFocus({ toolIndex, toolFocus, setOpen });
-
-  return (
-    <Collapsible open={open} onOpenChange={setOpen}>
-      <div className="border-l-2 border-sky-400/25 my-1" data-response-tool-index={toolIndex}>
-        <CollapsibleTrigger
-          ref={triggerRef}
-          className="flex items-center gap-1.5 px-3 py-1 w-full text-left cursor-pointer hover:bg-sky-400/[0.04] transition-colors rounded-r-sm group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-        >
-          <Terminal className="size-3.5 text-sky-400/70 shrink-0" />
-          <Badge variant="outline" className="text-[10px] font-mono px-1.5 py-0 h-4">
-            {name}
-          </Badge>
-          {call.id !== undefined && call.id !== "" && (
-            <span className="text-[10px] font-mono text-muted-foreground/60 truncate">
-              {call.id}
-            </span>
-          )}
-          <span className="flex-1" />
-          {open ? (
-            <ChevronDown className="size-3 text-muted-foreground" />
-          ) : (
-            <ChevronRight className="size-3 text-muted-foreground" />
-          )}
-        </CollapsibleTrigger>
-        <CollapsibleContent>
-          {open && (
-            <div className="px-3 pb-2">
-              <ScrollArea className="max-h-[60vh]">
-                {parsed === null ? (
-                  // JSON.parse failed — show the raw string so the user can
-                  // still see what the model tried to call.
-                  <pre className="font-mono text-xs whitespace-pre-wrap break-words text-rose-300/90">
-                    {call.function.arguments}
-                  </pre>
-                ) : (
-                  <Suspense
-                    fallback={<div className="text-xs text-muted-foreground">Loading JSON...</div>}
-                  >
-                    <LazyJsonViewer data={safeJsonValue(parsed)} defaultExpandDepth={0} />
-                  </Suspense>
-                )}
-              </ScrollArea>
-            </div>
-          )}
-        </CollapsibleContent>
-      </div>
-    </Collapsible>
-  );
-}
-
-type ResponsesFunctionCall = {
-  id: string | null;
-  callId: string | null;
-  name: string;
-  argumentsText: string;
-  status: string | null;
-};
-
-function extractResponsesOutputText(response: OpenAIResponsesResponse): string {
-  if (response.output_text !== undefined && response.output_text.length > 0) {
-    return response.output_text;
-  }
-  const parts: string[] = [];
-  for (const outputItem of response.output ?? []) {
-    if (safeGetOwnProperty(outputItem, "type") !== "message") continue;
-    const content = safeGetOwnProperty(outputItem, "content");
-    if (!Array.isArray(content)) continue;
-    for (const contentPart of content) {
-      const type = safeGetOwnProperty(contentPart, "type");
-      const text = safeGetOwnProperty(contentPart, "text");
-      if ((type === "output_text" || type === "text") && typeof text === "string") {
-        parts.push(text);
-      }
-    }
-  }
-  return parts.join("\n");
-}
-
-function extractResponsesFunctionCalls(response: OpenAIResponsesResponse): ResponsesFunctionCall[] {
-  const calls: ResponsesFunctionCall[] = [];
-  for (const outputItem of response.output ?? []) {
-    if (safeGetOwnProperty(outputItem, "type") !== "function_call") continue;
-    const name = safeGetOwnProperty(outputItem, "name");
-    if (typeof name !== "string" || name.length === 0) continue;
-    const id = safeGetOwnProperty(outputItem, "id");
-    const callId = safeGetOwnProperty(outputItem, "call_id");
-    const args = safeGetOwnProperty(outputItem, "arguments");
-    const status = safeGetOwnProperty(outputItem, "status");
-    calls.push({
-      id: typeof id === "string" && id.length > 0 ? id : null,
-      callId: typeof callId === "string" && callId.length > 0 ? callId : null,
-      name,
-      argumentsText: typeof args === "string" ? args : "",
-      status: typeof status === "string" && status.length > 0 ? status : null,
-    });
-  }
-  return calls;
-}
-
-function ResponsesFunctionCallBlock({
-  call,
-  toolIndex,
-  toolFocus,
-}: {
-  call: ResponsesFunctionCall;
-  toolIndex: number;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  const [open, setOpen] = useState(false);
-  const parsed = open ? parseToolArguments(call.argumentsText) : {};
-  const identity = call.callId ?? call.id;
-  const triggerRef = useToolFocus({ toolIndex, toolFocus, setOpen });
-
-  return (
-    <Collapsible open={open} onOpenChange={setOpen}>
-      <div className="border-l-2 border-sky-400/25 my-1" data-response-tool-index={toolIndex}>
-        <CollapsibleTrigger
-          ref={triggerRef}
-          className="flex items-center gap-1.5 px-3 py-1 w-full text-left cursor-pointer hover:bg-sky-400/[0.04] transition-colors rounded-r-sm group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-        >
-          <Terminal className="size-3.5 text-sky-400/70 shrink-0" />
-          <Badge variant="outline" className="text-[10px] font-mono px-1.5 py-0 h-4">
-            {call.name}
-          </Badge>
-          {identity !== null && (
-            <span className="text-[10px] font-mono text-muted-foreground/60 truncate">
-              {identity}
-            </span>
-          )}
-          {call.status !== null && (
-            <Badge variant="secondary" className="text-[10px] px-1.5 py-0 h-4 font-mono">
-              {call.status}
-            </Badge>
-          )}
-          <span className="flex-1" />
-          {open ? (
-            <ChevronDown className="size-3 text-muted-foreground" />
-          ) : (
-            <ChevronRight className="size-3 text-muted-foreground" />
-          )}
-        </CollapsibleTrigger>
-        <CollapsibleContent>
-          {open && (
-            <div className="px-3 pb-2">
-              <ScrollArea className="max-h-[60vh]">
-                {parsed === null ? (
-                  <pre className="font-mono text-xs whitespace-pre-wrap break-words text-rose-300/90">
-                    {call.argumentsText}
-                  </pre>
-                ) : (
-                  <Suspense
-                    fallback={<div className="text-xs text-muted-foreground">Loading JSON...</div>}
-                  >
-                    <LazyJsonViewer data={safeJsonValue(parsed)} defaultExpandDepth={0} />
-                  </Suspense>
-                )}
-              </ScrollArea>
-            </div>
-          )}
-        </CollapsibleContent>
-      </div>
-    </Collapsible>
-  );
-}
-
-// eslint-disable-next-line @typescript-eslint/no-shadow -- named function gives React DevTools a readable displayName
-export const OpenAIResponseView = memo(function OpenAIResponseView({
-  response,
-  toolFocus,
-}: {
-  response: OpenAIResponse;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  const choice = response.choices[0];
-  const message = choice?.message;
-  const toolCalls = message?.tool_calls ?? [];
-
-  return (
-    <div className="space-y-3">
-      <div className="flex items-center gap-2 flex-wrap">
-        <Badge variant="secondary" className="text-[10px] px-1.5 py-0 h-5 font-mono">
-          {response.model}
-        </Badge>
-
-        {choice?.finish_reason !== null && choice?.finish_reason !== undefined && (
-          <Badge
-            variant="outline"
-            className="text-[10px] px-1.5 py-0 h-5 font-mono flex items-center gap-1"
-          >
-            <StopCircle className="size-2.5" />
-            {choice.finish_reason}
-          </Badge>
-        )}
-
-        <span className="flex items-center gap-1 text-muted-foreground text-xs">
-          <Zap className="size-3" />
-          <span className="font-mono tabular-nums">
-            {formatTokens(response.usage.prompt_tokens ?? 0)} in /{" "}
-            {formatTokens(response.usage.completion_tokens ?? 0)} out
-          </span>
-        </span>
-      </div>
-
-      <Separator className="opacity-50" />
-
-      <div className="space-y-2">
-        {message?.reasoning_content !== null &&
-          message?.reasoning_content !== undefined &&
-          message.reasoning_content.length > 0 && (
-            <ThinkingBlock thinking={message.reasoning_content} />
-          )}
-        {message?.content !== null &&
-          message?.content !== undefined &&
-          message.content.length > 0 &&
-          (() => {
-            // Extract thinking content from tag-wrapped content if no reasoning_content field
-            const hasReasoningField =
-              message.reasoning_content !== null &&
-              message.reasoning_content !== undefined &&
-              message.reasoning_content.length > 0;
-            const { thinking, remainingText } = extractThinkingFromContent(message.content);
-            return (
-              <div className="space-y-2">
-                {/* Show thinking from tags only if no reasoning_content field */}
-                {thinking !== null && !hasReasoningField && <ThinkingBlock thinking={thinking} />}
-                {remainingText.length > 0 && <AnswerMarkdown text={remainingText} />}
-              </div>
-            );
-          })()}
-        {toolCalls.map((call, i) => (
-          // biome-ignore lint/suspicious/noArrayIndexKey: tool_calls is the positionally stable list from the response
-          <OpenAIToolCallBlock
-            key={call.id ?? `tc-${i}`}
-            call={call}
-            toolIndex={i}
-            toolFocus={toolFocus}
-          />
-        ))}
-        {message?.function_call !== null && message?.function_call !== undefined && (
-          <OpenAIFunctionCallBlock
-            name={message.function_call.name}
-            argumentsText={message.function_call.arguments}
-            toolIndex={toolCalls.length}
-            toolFocus={toolFocus}
-          />
-        )}
-        {(message?.content === null ||
-          message?.content === undefined ||
-          message.content.length === 0) &&
-          (message?.reasoning_content === null ||
-            message?.reasoning_content === undefined ||
-            message.reasoning_content.length === 0) &&
-          (message?.function_call === null || message?.function_call === undefined) &&
-          toolCalls.length === 0 && (
-            <p className="text-xs text-muted-foreground italic">Empty response content</p>
-          )}
-      </div>
-    </div>
-  );
-});
-
-// eslint-disable-next-line @typescript-eslint/no-shadow -- named function gives React DevTools a readable displayName
-export const OpenAIResponsesResponseView = memo(function OpenAIResponsesResponseView({
-  response,
-  toolFocus,
-}: {
-  response: OpenAIResponsesResponse;
-  toolFocus?: ResponseToolFocus;
-}): JSX.Element {
-  const text = extractResponsesOutputText(response);
-  const calls = extractResponsesFunctionCalls(response);
-  const status = response.status ?? null;
-  const inputTokens = response.usage?.input_tokens ?? 0;
-  const outputTokens = response.usage?.output_tokens ?? 0;
-
-  return (
-    <div className="space-y-3">
-      <div className="flex items-center gap-2 flex-wrap">
-        {response.model !== undefined && response.model.length > 0 && (
-          <Badge variant="secondary" className="text-[10px] px-1.5 py-0 h-5 font-mono">
-            {response.model}
-          </Badge>
-        )}
-
-        {status !== null && (
-          <Badge
-            variant="outline"
-            className="text-[10px] px-1.5 py-0 h-5 font-mono flex items-center gap-1"
-          >
-            <StopCircle className="size-2.5" />
-            {status}
-          </Badge>
-        )}
-
-        <span className="flex items-center gap-1 text-muted-foreground text-xs">
-          <Zap className="size-3" />
-          <span className="font-mono tabular-nums">
-            {formatTokens(inputTokens)} in / {formatTokens(outputTokens)} out
-          </span>
-        </span>
-      </div>
-
-      <Separator className="opacity-50" />
-
-      <div className="space-y-2">
-        {text.length > 0 && <AnswerMarkdown text={text} />}
-        {calls.map((call, i) => (
-          // biome-ignore lint/suspicious/noArrayIndexKey: response output order is stable
-          <ResponsesFunctionCallBlock
-            key={call.callId ?? call.id ?? `call-${i}`}
-            call={call}
-            toolIndex={i}
-            toolFocus={toolFocus}
-          />
-        ))}
-        {text.length === 0 && calls.length === 0 && (
-          <p className="text-xs text-muted-foreground italic">Empty response content</p>
-        )}
-      </div>
-    </div>
-  );
-});

package/src/components/proxy-viewer/index.ts

@@ -1,9 +0,0 @@
-export { ConversationGroup } from "./ConversationGroup";
-export {
-  ConversationHeader,
-  getConversationId,
-  groupLogsByConversation,
-} from "./ConversationHeader";
-export type { ConversationGroupData } from "./ConversationHeader";
-export { LogEntry } from "./LogEntry";
-export { ThreadConnector } from "./ThreadConnector";

package/src/components/proxy-viewer/lazy.ts

@@ -1,41 +0,0 @@
-import { lazy } from "react";
-
-/**
- * Lazy-loaded heavy leaf components. Each is split into its own chunk by Vite
- * (named after the source file) so the main bundle stays small. Imports use
- * the `.then(m => ({ default: m.X }))` adapter so the original modules can
- * keep their named exports without needing a default export.
- */
-export const LazyCompareDrawer = lazy(() =>
-  import("./CompareDrawer").then((m) => ({ default: m.CompareDrawer })),
-);
-
-export const LazyInspectorPet = lazy(() =>
-  import("../inspector-pet/InspectorPet").then((m) => ({ default: m.InspectorPet })),
-);
-
-export const LazyReplayDialog = lazy(() =>
-  import("./ReplayDialog").then((m) => ({ default: m.ReplayDialog })),
-);
-
-export const LazyRequestAnatomy = lazy(() =>
-  import("./anatomy/RequestAnatomy").then((m) => ({ default: m.RequestAnatomy })),
-);
-
-export const LazyResponseView = lazy(() =>
-  import("./ResponseView").then((m) => ({ default: m.ResponseView })),
-);
-
-export const LazyStreamingChunkSequence = lazy(() =>
-  import("./StreamingChunkSequence").then((m) => ({
-    default: m.StreamingChunkSequence,
-  })),
-);
-
-export const LazyJsonViewer = lazy(() =>
-  import("../ui/json-viewer").then((m) => ({ default: m.JsonViewer })),
-);
-
-export const LazyJsonViewerFromString = lazy(() =>
-  import("../ui/json-viewer").then((m) => ({ default: m.JsonViewerFromString })),
-);