@echothink-ui/developer 0.1.0

package/src/components/devUtils.ts

@@ -0,0 +1,81 @@
+export interface DiffLine {
+  type: "equal" | "add" | "remove";
+  beforeLine?: number;
+  afterLine?: number;
+  text: string;
+}
+
+export function splitLines(value: string) {
+  return value.length ? value.replace(/\r\n/g, "\n").split("\n") : [""];
+}
+
+export function buildLineDiff(before: string, after: string): DiffLine[] {
+  const a = splitDiffLines(before);
+  const b = splitDiffLines(after);
+  const table = Array.from({ length: a.length + 1 }, () => Array<number>(b.length + 1).fill(0));
+
+  for (let i = a.length - 1; i >= 0; i -= 1) {
+    for (let j = b.length - 1; j >= 0; j -= 1) {
+      table[i][j] =
+        a[i] === b[j]
+          ? (table[i + 1]?.[j + 1] ?? 0) + 1
+          : Math.max(table[i + 1]?.[j] ?? 0, table[i]?.[j + 1] ?? 0);
+    }
+  }
+
+  const lines: DiffLine[] = [];
+  let i = 0;
+  let j = 0;
+  let beforeLine = 1;
+  let afterLine = 1;
+
+  while (i < a.length && j < b.length) {
+    if (a[i] === b[j]) {
+      lines.push({ type: "equal", beforeLine, afterLine, text: a[i] ?? "" });
+      i += 1;
+      j += 1;
+      beforeLine += 1;
+      afterLine += 1;
+    } else if ((table[i + 1]?.[j] ?? 0) >= (table[i]?.[j + 1] ?? 0)) {
+      lines.push({ type: "remove", beforeLine, text: a[i] ?? "" });
+      i += 1;
+      beforeLine += 1;
+    } else {
+      lines.push({ type: "add", afterLine, text: b[j] ?? "" });
+      j += 1;
+      afterLine += 1;
+    }
+  }
+
+  while (i < a.length) {
+    lines.push({ type: "remove", beforeLine, text: a[i] ?? "" });
+    i += 1;
+    beforeLine += 1;
+  }
+  while (j < b.length) {
+    lines.push({ type: "add", afterLine, text: b[j] ?? "" });
+    j += 1;
+    afterLine += 1;
+  }
+
+  return lines;
+}
+
+function splitDiffLines(value: string) {
+  const lines = value.length ? value.replace(/\r\n/g, "\n").split("\n") : [];
+  return lines.length > 1 && lines[lines.length - 1] === "" ? lines.slice(0, -1) : lines;
+}
+
+export function formatUnknown(value: unknown) {
+  if (typeof value === "string") return value;
+  if (value == null) return "";
+  try {
+    return JSON.stringify(value, null, 2);
+  } catch {
+    return String(value);
+  }
+}
+
+export function compactSha(sha: string) {
+  return sha.length > 10 ? sha.slice(0, 10) : sha;
+}

package/src/components/types.ts

@@ -0,0 +1,230 @@
+import type * as React from "react";
+import type { EthOperationalStatus, SelectProps } from "@echothink-ui/core";
+
+export interface CodeBlockProps extends React.HTMLAttributes<HTMLElement> {
+  code: string;
+  language?: string;
+  showLineNumbers?: boolean;
+}
+
+export interface CodeEditorProps extends Omit<
+  React.TextareaHTMLAttributes<HTMLTextAreaElement>,
+  "onChange" | "value" | "readOnly"
+> {
+  value: string;
+  onChange?: (value: string) => void;
+  language?: string;
+  readonly?: boolean;
+  readOnly?: boolean;
+  schemaRef?: string;
+}
+
+export interface DiffViewerProps extends React.HTMLAttributes<HTMLElement> {
+  before: string;
+  after: string;
+  mode?: "inline" | "side-by-side";
+  language?: string;
+}
+
+export type DiffTableChangeType =
+  | "added"
+  | "modified"
+  | "removed"
+  | "renamed"
+  | "unchanged"
+  | "conflict";
+
+export interface DiffTableRow extends Record<string, unknown> {
+  id: string;
+  file?: string;
+  path?: string;
+  beforePath?: string;
+  afterPath?: string;
+  changeType?: DiffTableChangeType;
+  added?: number;
+  additions?: number;
+  removed?: number;
+  deletions?: number;
+  hunks?: number;
+  summary?: React.ReactNode;
+}
+
+export interface DiffTableProps extends Omit<
+  React.HTMLAttributes<HTMLElement>,
+  "children" | "title"
+> {
+  rows: DiffTableRow[];
+  mode?: "inline" | "side-by-side";
+  title?: React.ReactNode;
+  subtitle?: React.ReactNode;
+  showSummary?: boolean;
+  emptyState?: React.ReactNode;
+}
+
+export interface JSONViewerProps extends React.HTMLAttributes<HTMLElement> {
+  value: unknown;
+  defaultExpandedDepth?: number;
+}
+
+export interface YAMLViewerProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
+  value: string;
+  editable?: boolean;
+  onChange?: (value: string) => void;
+}
+
+export interface SchemaViewerProps extends React.HTMLAttributes<HTMLElement> {
+  schema: object;
+  validationState?: "valid" | "invalid" | "warning";
+}
+
+export interface APIEndpoint extends Record<string, unknown> {
+  id: string;
+  method: string;
+  path: string;
+  summary?: string;
+  headers?: Record<string, string> | string;
+  body?: unknown;
+}
+
+export interface APIRequest {
+  endpointId?: string;
+  method: string;
+  path: string;
+  headers: string;
+  body: string;
+}
+
+export interface APIExplorerProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> {
+  endpoints: APIEndpoint[];
+  selectedId?: string;
+  onSelect?: (id: string) => void;
+  onSend?: (request: APIRequest) => unknown | Promise<unknown>;
+}
+
+export interface EventPayloadViewerProps extends React.HTMLAttributes<HTMLElement> {
+  eventId?: string;
+  payload: unknown;
+}
+
+export interface LogEntry extends Record<string, unknown> {
+  id: string;
+  timestamp?: string;
+  level?: "debug" | "info" | "warn" | "error" | string;
+  message?: string;
+  text?: string;
+  source?: string;
+  stream?: "stdout" | "stderr";
+}
+
+export interface LogConsoleProps extends React.HTMLAttributes<HTMLElement> {
+  entries: LogEntry[];
+  onPause?: () => void;
+  streaming?: boolean;
+  filters?: React.ReactNode;
+}
+
+export interface TerminalLine extends Record<string, unknown> {
+  id: string;
+  stream: "stdout" | "stderr";
+  text: string;
+}
+
+export interface TerminalPanelProps extends React.HTMLAttributes<HTMLElement> {
+  lines: TerminalLine[];
+  prompt?: string;
+  onCommand?: (cmd: string) => void;
+  disabled?: boolean;
+}
+
+export interface TraceSpan extends Record<string, unknown> {
+  id: string;
+  name: string;
+  startMs: number;
+  durationMs: number;
+  status?: EthOperationalStatus;
+  parentId?: string;
+  service?: string;
+}
+
+export interface TraceTimelineProps extends React.HTMLAttributes<HTMLElement> {
+  spans: TraceSpan[];
+}
+
+export interface HTTPMessage {
+  method?: string;
+  url?: string;
+  status?: number;
+  headers?: Record<string, string>;
+  body?: unknown;
+  durationMs?: number;
+}
+
+export interface RequestResponseViewerProps extends React.HTMLAttributes<HTMLElement> {
+  request: { method: string; url: string; headers?: Record<string, string>; body?: unknown };
+  response: {
+    status: number;
+    headers?: Record<string, string>;
+    body?: unknown;
+    durationMs?: number;
+  };
+}
+
+export interface WebhookEvent extends Record<string, unknown> {
+  id: string;
+  url: string;
+  status: string;
+  retries: number;
+  deliveredAt?: string;
+  payload: unknown;
+}
+
+export interface WebhookEventViewerProps extends React.HTMLAttributes<HTMLElement> {
+  events: WebhookEvent[];
+  onRetry?: (id: string) => void;
+}
+
+export interface GitRepositoryPanelProps extends React.HTMLAttributes<HTMLElement> {
+  repo: {
+    name: string;
+    url: string;
+    defaultBranch: string;
+    openPrCount?: number;
+    commitCount?: number;
+    lastCommitAt?: string;
+  };
+}
+
+export interface PullRequestPanelProps extends React.HTMLAttributes<HTMLElement> {
+  pr: {
+    id: string;
+    title: string;
+    body?: string;
+    state: string;
+    author: string;
+    reviewers?: string[];
+    commits?: number;
+    files?: Array<{ path: string; additions: number; deletions: number }>;
+  };
+  onApprove?: () => void;
+  onComment?: (comment: string) => void;
+}
+
+export interface CommitRow extends Record<string, unknown> {
+  sha: string;
+  message: string;
+  author: string;
+  date: string;
+}
+
+export interface CommitListProps extends React.HTMLAttributes<HTMLElement> {
+  commits: CommitRow[];
+}
+
+export interface BranchSelectorProps extends Omit<
+  SelectProps,
+  "children" | "onChange" | "options" | "value"
+> {
+  branches: string[];
+  value?: string;
+  onChange?: (branch: string) => void;
+}

package/src/index.tsx

@@ -0,0 +1,72 @@
+import "./styles.css";
+
+export type {
+  APIEndpoint,
+  APIExplorerProps,
+  APIRequest,
+  BranchSelectorProps,
+  CodeBlockProps,
+  CodeEditorProps,
+  CommitListProps,
+  CommitRow,
+  DiffTableChangeType,
+  DiffTableProps,
+  DiffTableRow,
+  DiffViewerProps,
+  EventPayloadViewerProps,
+  GitRepositoryPanelProps,
+  HTTPMessage,
+  JSONViewerProps,
+  LogConsoleProps,
+  LogEntry,
+  PullRequestPanelProps,
+  RequestResponseViewerProps,
+  SchemaViewerProps,
+  TerminalLine,
+  TerminalPanelProps,
+  TraceSpan,
+  TraceTimelineProps,
+  WebhookEvent,
+  WebhookEventViewerProps,
+  YAMLViewerProps
+} from "./components/types";
+export { APIExplorer } from "./components/APIExplorer";
+export { BranchSelector } from "./components/BranchSelector";
+export { CodeBlock } from "./components/CodeBlock";
+export { CodeEditor } from "./components/CodeEditor";
+export { CommitList } from "./components/CommitList";
+export { DiffTable } from "./components/DiffTable";
+export { DiffViewer } from "./components/DiffViewer";
+export { EventPayloadViewer } from "./components/EventPayloadViewer";
+export { GitRepositoryPanel } from "./components/GitRepositoryPanel";
+export { JSONViewer } from "./components/JSONViewer";
+export { LogConsole } from "./components/LogConsole";
+export { PullRequestPanel } from "./components/PullRequestPanel";
+export { RequestResponseViewer } from "./components/RequestResponseViewer";
+export { SchemaViewer } from "./components/SchemaViewer";
+export { TerminalPanel } from "./components/TerminalPanel";
+export { TraceTimeline } from "./components/TraceTimeline";
+export { WebhookEventViewer } from "./components/WebhookEventViewer";
+export { YAMLViewer } from "./components/YAMLViewer";
+
+export const DeveloperComponentNames = [
+  "CodeBlock",
+  "CodeEditor",
+  "DiffTable",
+  "DiffViewer",
+  "JSONViewer",
+  "YAMLViewer",
+  "SchemaViewer",
+  "APIExplorer",
+  "EventPayloadViewer",
+  "LogConsole",
+  "TerminalPanel",
+  "TraceTimeline",
+  "RequestResponseViewer",
+  "WebhookEventViewer",
+  "GitRepositoryPanel",
+  "PullRequestPanel",
+  "CommitList",
+  "BranchSelector"
+] as const;
+export type DeveloperComponentName = (typeof DeveloperComponentNames)[number];