@echothink-ui/developer 0.1.0

package/dist/index.js

@@ -0,0 +1,2572 @@
+// src/components/APIExplorer.tsx
+import * as React from "react";
+import { Button, FormField, Select, TextInput, Textarea } from "@echothink-ui/core";
+
+// src/components/devUtils.ts
+function splitLines(value) {
+  return value.length ? value.replace(/\r\n/g, "\n").split("\n") : [""];
+}
+function buildLineDiff(before, after) {
+  const a = splitDiffLines(before);
+  const b = splitDiffLines(after);
+  const table = Array.from({ length: a.length + 1 }, () => Array(b.length + 1).fill(0));
+  for (let i2 = a.length - 1; i2 >= 0; i2 -= 1) {
+    for (let j2 = b.length - 1; j2 >= 0; j2 -= 1) {
+      table[i2][j2] = a[i2] === b[j2] ? (table[i2 + 1]?.[j2 + 1] ?? 0) + 1 : Math.max(table[i2 + 1]?.[j2] ?? 0, table[i2]?.[j2 + 1] ?? 0);
+    }
+  }
+  const lines = [];
+  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) {
+  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;
+}
+function formatUnknown(value) {
+  if (typeof value === "string") return value;
+  if (value == null) return "";
+  try {
+    return JSON.stringify(value, null, 2);
+  } catch {
+    return String(value);
+  }
+}
+function compactSha(sha) {
+  return sha.length > 10 ? sha.slice(0, 10) : sha;
+}
+
+// src/components/APIExplorer.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function APIExplorer({
+  endpoints,
+  selectedId,
+  onSelect,
+  onSend,
+  className,
+  ...props
+}) {
+  const [internalId, setInternalId] = React.useState(selectedId ?? endpoints[0]?.id);
+  const selected = endpoints.find((endpoint) => endpoint.id === (selectedId ?? internalId)) ?? endpoints[0];
+  const [method, setMethod] = React.useState(selected?.method ?? "GET");
+  const [path, setPath] = React.useState(selected?.path ?? "");
+  const [headers, setHeaders] = React.useState(() => formatEndpointValue(selected?.headers, "{}"));
+  const [body, setBody] = React.useState(() => formatEndpointValue(selected?.body, ""));
+  const [response, setResponse] = React.useState({ status: "idle" });
+  const headerError = validateHeaderJson(headers);
+  React.useEffect(() => {
+    if (!selected) return;
+    setMethod(selected.method);
+    setPath(selected.path);
+    setHeaders(formatEndpointValue(selected.headers, "{}"));
+    setBody(formatEndpointValue(selected.body, ""));
+  }, [selected?.id]);
+  const choose = (endpoint) => {
+    setInternalId(endpoint.id);
+    onSelect?.(endpoint.id);
+  };
+  const send = async () => {
+    if (headerError || !path.trim()) return;
+    const request = { endpointId: selected?.id, method, path, headers, body };
+    setResponse({ status: "loading" });
+    try {
+      const result = await onSend?.(request);
+      setResponse({ status: "success", value: result ?? { ok: true, request } });
+    } catch (error) {
+      setResponse({ status: "error", value: formatError(error) });
+    }
+  };
+  const isLoading = response.status === "loading";
+  const responseStateLabel = response.status === "idle" ? "Ready" : response.status;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-api-explorer ${className ?? ""}`,
+      "data-eth-component": "APIExplorer",
+      children: [
+        /* @__PURE__ */ jsxs("nav", { className: "eth-dev-api-explorer__nav", "aria-label": "Endpoints", children: [
+          /* @__PURE__ */ jsxs("div", { className: "eth-dev-api-explorer__nav-heading", children: [
+            /* @__PURE__ */ jsx("span", { children: "Endpoints" }),
+            /* @__PURE__ */ jsx("span", { children: endpoints.length })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "eth-dev-api-explorer__endpoint-list", children: endpoints.length ? endpoints.map((endpoint) => /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              "aria-current": selected?.id === endpoint.id,
+              onClick: () => choose(endpoint),
+              children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: `eth-dev-api-explorer__method eth-dev-api-explorer__method--${methodToken(endpoint.method)}`,
+                    children: endpoint.method
+                  }
+                ),
+                /* @__PURE__ */ jsxs("span", { className: "eth-dev-api-explorer__endpoint-copy", children: [
+                  /* @__PURE__ */ jsx("code", { children: endpoint.path }),
+                  endpoint.summary ? /* @__PURE__ */ jsx("small", { children: endpoint.summary }) : null
+                ] })
+              ]
+            },
+            endpoint.id
+          )) : /* @__PURE__ */ jsx("p", { className: "eth-dev-api-explorer__empty", children: "No endpoints configured." }) })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "form",
+          {
+            className: "eth-dev-api-explorer__request",
+            onSubmit: (event) => {
+              event.preventDefault();
+              void send();
+            },
+            children: [
+              /* @__PURE__ */ jsxs("header", { className: "eth-dev-api-explorer__request-header", children: [
+                /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx("p", { children: "Request" }),
+                  /* @__PURE__ */ jsx("h3", { children: selected?.summary ?? "Custom endpoint" })
+                ] }),
+                selected ? /* @__PURE__ */ jsx("code", { children: selected.id }) : null
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "eth-dev-api-explorer__method-path", children: [
+                /* @__PURE__ */ jsx(FormField, { label: "Method", children: /* @__PURE__ */ jsx(
+                  Select,
+                  {
+                    value: method,
+                    options: ["GET", "POST", "PUT", "PATCH", "DELETE"].map((item) => ({
+                      value: item,
+                      label: item
+                    })),
+                    onChange: (event) => setMethod(event.currentTarget.value)
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(FormField, { label: "Path", children: /* @__PURE__ */ jsx(TextInput, { value: path, onChange: (event) => setPath(event.currentTarget.value) }) })
+              ] }),
+              /* @__PURE__ */ jsx(FormField, { label: "Headers", error: headerError, children: /* @__PURE__ */ jsx(
+                Textarea,
+                {
+                  className: "eth-dev-api-explorer__code-field",
+                  value: headers,
+                  onChange: (event) => setHeaders(event.currentTarget.value),
+                  rows: 5
+                }
+              ) }),
+              /* @__PURE__ */ jsx(FormField, { label: "Body", children: /* @__PURE__ */ jsx(
+                Textarea,
+                {
+                  className: "eth-dev-api-explorer__code-field",
+                  value: body,
+                  onChange: (event) => setBody(event.currentTarget.value),
+                  rows: 8
+                }
+              ) }),
+              /* @__PURE__ */ jsxs("div", { className: "eth-dev-api-explorer__actions", children: [
+                /* @__PURE__ */ jsxs("span", { children: [
+                  method,
+                  " ",
+                  path || "/"
+                ] }),
+                /* @__PURE__ */ jsx(Button, { type: "submit", loading: isLoading, disabled: Boolean(headerError) || !path.trim(), children: "Send" })
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("section", { className: "eth-dev-api-explorer__response", "aria-live": "polite", "aria-busy": isLoading, children: [
+          /* @__PURE__ */ jsxs("header", { className: "eth-dev-api-explorer__response-header", children: [
+            /* @__PURE__ */ jsx("h3", { children: "Response" }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: `eth-dev-api-explorer__response-state eth-dev-api-explorer__response-state--${response.status}`,
+                children: responseStateLabel
+              }
+            )
+          ] }),
+          response.status === "idle" ? /* @__PURE__ */ jsx("div", { className: "eth-dev-api-explorer__response-empty", children: "No response yet." }) : response.status === "loading" ? /* @__PURE__ */ jsx("div", { className: "eth-dev-api-explorer__response-empty", children: "Waiting for response." }) : /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: formatUnknown(response.value) }) })
+        ] })
+      ]
+    }
+  );
+}
+function formatEndpointValue(value, fallback) {
+  if (value == null) return fallback;
+  if (typeof value === "string") return value;
+  return formatUnknown(value);
+}
+function validateHeaderJson(value) {
+  const trimmed = value.trim();
+  if (!trimmed) return null;
+  try {
+    const parsed = JSON.parse(trimmed);
+    if (!parsed || Array.isArray(parsed) || typeof parsed !== "object") {
+      return "Headers must be a JSON object.";
+    }
+  } catch {
+    return "Headers must be valid JSON.";
+  }
+  return null;
+}
+function formatError(error) {
+  if (error instanceof Error) {
+    return { error: error.message };
+  }
+  return error;
+}
+function methodToken(method) {
+  return method.toLowerCase().replace(/[^a-z0-9-]/g, "");
+}
+
+// src/components/BranchSelector.tsx
+import { Select as Select2 } from "@echothink-ui/core";
+import { jsx as jsx2 } from "react/jsx-runtime";
+function BranchSelector({
+  branches,
+  value,
+  onChange,
+  className,
+  disabled,
+  labelText = "Branch",
+  helperText,
+  density = "compact",
+  ...props
+}) {
+  const hasBranches = branches.length > 0;
+  const branchCountLabel = branches.length === 1 ? "1 branch available" : `${branches.length} branches available`;
+  const resolvedHelperText = helperText === void 0 ? hasBranches ? branchCountLabel : "No branches available" : helperText;
+  return /* @__PURE__ */ jsx2(
+    Select2,
+    {
+      ...props,
+      className: [
+        "eth-dev-branch-selector",
+        !hasBranches && "eth-dev-branch-selector--empty",
+        className
+      ].filter(Boolean).join(" "),
+      "data-eth-component": "BranchSelector",
+      density,
+      disabled: disabled || !hasBranches,
+      helperText: resolvedHelperText,
+      labelText,
+      value: hasBranches ? value : "",
+      options: hasBranches ? branches.map((branch) => ({ value: branch, label: branch })) : [{ value: "", label: "No branches available", disabled: true }],
+      onChange: (event) => {
+        if (hasBranches) {
+          onChange?.(event.currentTarget.value);
+        }
+      }
+    }
+  );
+}
+
+// src/components/CodeBlock.tsx
+import * as React2 from "react";
+import { Checkmark, Copy } from "@carbon/icons-react";
+import { IconButton } from "@echothink-ui/core";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var keywordPattern = /\b(?:async|await|break|case|catch|class|const|continue|default|else|export|extends|false|finally|for|from|function|if|import|interface|let|new|null|return|throw|true|try|type|undefined|var|while)\b/;
+var tokenPattern = /\/\/.*|\/\*.*?\*\/|"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|`(?:\\.|[^`\\])*`|\b\d+(?:\.\d+)?\b|\b(?:async|await|break|case|catch|class|const|continue|default|else|export|extends|false|finally|for|from|function|if|import|interface|let|new|null|return|throw|true|try|type|undefined|var|while)\b/g;
+function getTokenKind(token) {
+  if (token.startsWith("//") || token.startsWith("/*")) return "comment";
+  if (token.startsWith('"') || token.startsWith("'") || token.startsWith("`")) return "string";
+  if (/^\d/.test(token)) return "number";
+  if (keywordPattern.test(token)) return "keyword";
+  return "plain";
+}
+function renderCodeLine(line) {
+  const parts = [];
+  let lastIndex = 0;
+  tokenPattern.lastIndex = 0;
+  for (let match = tokenPattern.exec(line); match; match = tokenPattern.exec(line)) {
+    const token = match[0];
+    if (match.index > lastIndex) {
+      parts.push(line.slice(lastIndex, match.index));
+    }
+    const kind = getTokenKind(token);
+    parts.push(
+      /* @__PURE__ */ jsx3(
+        "span",
+        {
+          className: `eth-dev-code-block__token eth-dev-code-block__token--${kind}`,
+          children: token
+        },
+        `${match.index}-${token}`
+      )
+    );
+    lastIndex = match.index + token.length;
+  }
+  if (lastIndex < line.length) {
+    parts.push(line.slice(lastIndex));
+  }
+  return parts.length ? parts : line;
+}
+function CodeBlock({
+  code,
+  language = "text",
+  showLineNumbers = false,
+  className,
+  ...props
+}) {
+  const [copied, setCopied] = React2.useState(false);
+  const resetTimer = React2.useRef(void 0);
+  const lines = splitLines(code);
+  React2.useEffect(() => {
+    return () => {
+      if (resetTimer.current !== void 0 && typeof window !== "undefined") {
+        window.clearTimeout(resetTimer.current);
+      }
+    };
+  }, []);
+  const copy = React2.useCallback(() => {
+    if (typeof navigator === "undefined" || !navigator.clipboard) return;
+    void navigator.clipboard.writeText(code).then(() => {
+      if (typeof window !== "undefined") {
+        setCopied(true);
+        if (resetTimer.current !== void 0) {
+          window.clearTimeout(resetTimer.current);
+        }
+        resetTimer.current = window.setTimeout(() => setCopied(false), 1200);
+      }
+    }).catch(() => {
+      setCopied(false);
+    });
+  }, [code]);
+  const normalizedLanguage = language.trim() || "text";
+  const languageClass = normalizedLanguage.toLowerCase().replace(/[^a-z0-9_-]/g, "-");
+  return /* @__PURE__ */ jsxs2(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-code-block ${showLineNumbers ? "eth-dev-code-block--numbered" : ""} ${className ?? ""}`,
+      "data-eth-component": "CodeBlock",
+      "data-language": normalizedLanguage,
+      children: [
+        /* @__PURE__ */ jsxs2("header", { className: "eth-dev-code-block__header", children: [
+          /* @__PURE__ */ jsx3("span", { className: "eth-dev-code-block__language", children: normalizedLanguage }),
+          /* @__PURE__ */ jsx3(
+            IconButton,
+            {
+              className: "eth-dev-code-block__copy-button",
+              label: copied ? "Copied" : "Copy code",
+              intent: "ghost",
+              density: "compact",
+              icon: copied ? /* @__PURE__ */ jsx3(Checkmark, { size: 16 }) : /* @__PURE__ */ jsx3(Copy, { size: 16 }),
+              onClick: copy
+            }
+          ),
+          /* @__PURE__ */ jsx3("span", { className: "eth-dev-code-block__copy-status", "aria-live": "polite", children: copied ? "Code copied" : "" })
+        ] }),
+        /* @__PURE__ */ jsx3("pre", { className: `eth-dev-code-block__pre language-${languageClass}`, children: /* @__PURE__ */ jsx3("code", { className: "eth-dev-code-block__code", children: lines.map((line, index) => /* @__PURE__ */ jsxs2("span", { className: "eth-dev-code-block__line", children: [
+          showLineNumbers ? /* @__PURE__ */ jsx3("span", { className: "eth-dev-code-block__gutter", "aria-hidden": true, children: index + 1 }) : null,
+          /* @__PURE__ */ jsx3("span", { className: "eth-dev-code-block__line-code", children: renderCodeLine(line) })
+        ] }, index)) }) })
+      ]
+    }
+  );
+}
+
+// src/components/CodeEditor.tsx
+import * as React3 from "react";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function CodeEditor({
+  value,
+  onChange,
+  language = "text",
+  readonly,
+  readOnly,
+  schemaRef,
+  className,
+  disabled,
+  onScroll,
+  rows,
+  wrap,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const lines = splitLines(value);
+  const isReadonly = readonly ?? readOnly ?? false;
+  const isInvalid = ariaInvalid === true || ariaInvalid === "true" || ariaInvalid === "grammar" || ariaInvalid === "spelling";
+  const languageLabel = language || "text";
+  const lineCount = lines.length;
+  const visibleRows = rows ?? Math.min(Math.max(lineCount, 8), 16);
+  const statusId = React3.useId();
+  const gutterRef = React3.useRef(null);
+  const describedBy = [ariaDescribedBy, statusId].filter(Boolean).join(" ") || void 0;
+  const modeLabel = disabled ? "Disabled" : isReadonly ? "Read-only" : "Editable";
+  const handleScroll = (event) => {
+    if (gutterRef.current) {
+      gutterRef.current.scrollTop = event.currentTarget.scrollTop;
+    }
+    onScroll?.(event);
+  };
+  return /* @__PURE__ */ jsxs3(
+    "section",
+    {
+      className: `eth-dev-code-editor ${className ?? ""}`,
+      "data-eth-component": "CodeEditor",
+      "data-language": language,
+      "data-readonly": isReadonly ? "true" : void 0,
+      "data-disabled": disabled ? "true" : void 0,
+      "data-invalid": isInvalid ? "true" : void 0,
+      "data-schema-ref": schemaRef,
+      children: [
+        /* @__PURE__ */ jsxs3("header", { className: "eth-dev-code-editor__header", children: [
+          /* @__PURE__ */ jsxs3("div", { className: "eth-dev-code-editor__heading", children: [
+            /* @__PURE__ */ jsx4("span", { className: "eth-dev-code-editor__title", children: "Code editor" }),
+            /* @__PURE__ */ jsx4("span", { className: "eth-dev-code-editor__language", children: languageLabel })
+          ] }),
+          /* @__PURE__ */ jsxs3("div", { className: "eth-dev-code-editor__badges", "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx4("span", { className: "eth-dev-code-editor__badge", children: modeLabel }),
+            schemaRef ? /* @__PURE__ */ jsx4("span", { className: "eth-dev-code-editor__badge", children: schemaRef }) : null
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs3("div", { className: "eth-dev-code-editor__body", children: [
+          /* @__PURE__ */ jsx4("div", { ref: gutterRef, className: "eth-dev-code-editor__gutter", "aria-hidden": "true", children: lines.map((_, index) => /* @__PURE__ */ jsx4("span", { children: index + 1 }, index)) }),
+          /* @__PURE__ */ jsx4(
+            "textarea",
+            {
+              ...props,
+              "aria-describedby": describedBy,
+              "aria-invalid": ariaInvalid,
+              "aria-label": ariaLabel ?? `${languageLabel} code editor`,
+              value,
+              disabled,
+              readOnly: isReadonly,
+              rows: visibleRows,
+              spellCheck: false,
+              wrap: wrap ?? "off",
+              className: "eth-dev-code-editor__textarea",
+              onChange: (event) => onChange?.(event.currentTarget.value),
+              onScroll: handleScroll
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs3("footer", { id: statusId, className: "eth-dev-code-editor__footer", children: [
+          /* @__PURE__ */ jsx4("span", { children: modeLabel }),
+          /* @__PURE__ */ jsxs3("span", { children: [
+            lineCount,
+            " ",
+            lineCount === 1 ? "line" : "lines",
+            " / ",
+            value.length,
+            " chars"
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/CommitList.tsx
+import { EmptyState } from "@echothink-ui/core";
+import { DataTable } from "@echothink-ui/data";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function authorInitials(author) {
+  const parts = author.trim().split(/\s+/).filter(Boolean);
+  if (!parts.length) return "?";
+  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
+  return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
+}
+function CommitList({ commits, className, ...props }) {
+  const latestCommit = commits[0];
+  const authorCount = new Set(commits.map((commit) => commit.author)).size;
+  const columns = [
+    {
+      key: "sha",
+      header: "SHA",
+      width: "8.5rem",
+      render: (row) => /* @__PURE__ */ jsx5("code", { className: "eth-dev-commit-list__sha", title: row.sha, children: compactSha(row.sha) })
+    },
+    {
+      key: "message",
+      header: "Message",
+      render: (row) => /* @__PURE__ */ jsx5("span", { className: "eth-dev-commit-list__message", title: row.message, children: row.message })
+    },
+    {
+      key: "author",
+      header: "Author",
+      width: "12rem",
+      render: (row) => /* @__PURE__ */ jsxs4("span", { className: "eth-dev-commit-list__author", children: [
+        /* @__PURE__ */ jsx5("span", { className: "eth-dev-commit-list__avatar", "aria-hidden": "true", children: authorInitials(row.author) }),
+        /* @__PURE__ */ jsx5("span", { className: "eth-dev-commit-list__author-name", children: row.author })
+      ] })
+    },
+    {
+      key: "date",
+      header: "Date",
+      width: "10rem",
+      render: (row) => /* @__PURE__ */ jsx5("span", { className: "eth-dev-commit-list__date", children: row.date })
+    }
+  ];
+  return /* @__PURE__ */ jsxs4(
+    "section",
+    {
+      ...props,
+      "aria-label": props["aria-label"] ?? "Commit history",
+      className: `eth-dev-commit-list ${className ?? ""}`,
+      "data-eth-component": "CommitList",
+      children: [
+        /* @__PURE__ */ jsxs4("header", { className: "eth-dev-commit-list__header", children: [
+          /* @__PURE__ */ jsxs4("div", { className: "eth-dev-commit-list__heading", children: [
+            /* @__PURE__ */ jsx5("p", { children: "Source control" }),
+            /* @__PURE__ */ jsx5("h3", { children: "Commit history" })
+          ] }),
+          /* @__PURE__ */ jsxs4("dl", { className: "eth-dev-commit-list__summary", "aria-label": "Commit history summary", children: [
+            /* @__PURE__ */ jsxs4("div", { children: [
+              /* @__PURE__ */ jsx5("dt", { children: "Commits" }),
+              /* @__PURE__ */ jsx5("dd", { children: commits.length })
+            ] }),
+            /* @__PURE__ */ jsxs4("div", { children: [
+              /* @__PURE__ */ jsx5("dt", { children: "Authors" }),
+              /* @__PURE__ */ jsx5("dd", { children: authorCount })
+            ] }),
+            /* @__PURE__ */ jsxs4("div", { children: [
+              /* @__PURE__ */ jsx5("dt", { children: "Latest" }),
+              /* @__PURE__ */ jsx5("dd", { children: latestCommit ? compactSha(latestCommit.sha) : "None" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx5(
+          DataTable,
+          {
+            rows: commits,
+            columns,
+            rowKey: "sha",
+            density: "compact",
+            className: "eth-dev-commit-list__table",
+            emptyState: /* @__PURE__ */ jsx5(
+              EmptyState,
+              {
+                title: "No commits",
+                description: "Commit history will appear when this branch receives changes."
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/DiffTable.tsx
+import * as React4 from "react";
+import { EmptyState as EmptyState2 } from "@echothink-ui/core";
+import { Fragment, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+var changeTypes = /* @__PURE__ */ new Set([
+  "added",
+  "modified",
+  "removed",
+  "renamed",
+  "unchanged",
+  "conflict"
+]);
+function getNumeric(row, keys) {
+  for (const key of keys) {
+    const value = row[key];
+    if (typeof value === "number" && Number.isFinite(value)) return value;
+    if (typeof value === "string" && value.trim() !== "" && Number.isFinite(Number(value))) {
+      return Number(value);
+    }
+  }
+  return 0;
+}
+function getPath(row) {
+  const value = row.afterPath ?? row.path ?? row.file ?? row.name;
+  return typeof value === "string" && value.trim() ? value : "Unknown file";
+}
+function getPreviousPath(row) {
+  const value = row.beforePath ?? row.previousPath;
+  return typeof value === "string" && value.trim() ? value : void 0;
+}
+function normalizeChangeType(value) {
+  if (typeof value !== "string") return void 0;
+  const normalized = value.trim().toLowerCase().replace(/[_\s]+/g, "-");
+  if (normalized === "delete" || normalized === "deleted" || normalized === "deletion") {
+    return "removed";
+  }
+  if (normalized === "add" || normalized === "created" || normalized === "create") {
+    return "added";
+  }
+  if (normalized === "rename" || normalized === "moved") {
+    return "renamed";
+  }
+  return changeTypes.has(normalized) ? normalized : void 0;
+}
+function inferChangeType(row) {
+  const explicit = normalizeChangeType(row.changeType ?? row.status ?? row.kind ?? row.type);
+  if (explicit) return explicit;
+  if (getPreviousPath(row) && getPreviousPath(row) !== getPath(row)) return "renamed";
+  const added = getAdded(row);
+  const removed = getRemoved(row);
+  if (added > 0 && removed > 0) return "modified";
+  if (added > 0) return "added";
+  if (removed > 0) return "removed";
+  return "unchanged";
+}
+function getAdded(row) {
+  return getNumeric(row, ["added", "additions", "linesAdded", "insertions"]);
+}
+function getRemoved(row) {
+  return getNumeric(row, ["removed", "deletions", "deleted", "linesRemoved"]);
+}
+function changeLabel(type) {
+  if (type === "added") return "Added";
+  if (type === "removed") return "Removed";
+  if (type === "renamed") return "Renamed";
+  if (type === "unchanged") return "Unchanged";
+  if (type === "conflict") return "Conflict";
+  return "Modified";
+}
+function formatAdded(value) {
+  return value > 0 ? `+${value}` : "0";
+}
+function formatRemoved(value) {
+  return value > 0 ? `-${value}` : "0";
+}
+function formatNet(value) {
+  if (value > 0) return `+${value}`;
+  if (value < 0) return String(value);
+  return "0";
+}
+function defaultSummary(row, type) {
+  const hunks = getNumeric(row, ["hunks", "sections"]);
+  if (typeof row.summary !== "undefined") return row.summary;
+  if (type === "renamed") return "Path changed";
+  if (type === "unchanged") return "No line changes";
+  if (type === "conflict") return "Review required";
+  if (hunks > 0) return `${hunks} ${hunks === 1 ? "hunk" : "hunks"}`;
+  return "Line changes";
+}
+function DiffTable({
+  rows,
+  mode = "side-by-side",
+  title = "Diff summary",
+  subtitle,
+  showSummary = true,
+  emptyState,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const totals = React4.useMemo(
+    () => rows.reduce(
+      (acc, row) => {
+        const type = inferChangeType(row);
+        acc.added += getAdded(row);
+        acc.removed += getRemoved(row);
+        if (type !== "unchanged") acc.changed += 1;
+        return acc;
+      },
+      { added: 0, removed: 0, changed: 0 }
+    ),
+    [rows]
+  );
+  const effectiveSubtitle = subtitle ?? `${totals.changed} of ${rows.length} files changed, ${totals.added} additions, ${totals.removed} deletions`;
+  const label = ariaLabel ?? (typeof title === "string" ? title : "Diff summary");
+  return /* @__PURE__ */ jsxs5(
+    "section",
+    {
+      ...props,
+      className: [
+        "eth-dev-diff-table",
+        `eth-dev-diff-table--${mode}`,
+        rows.length ? void 0 : "eth-dev-diff-table--empty",
+        className
+      ].filter(Boolean).join(" "),
+      "data-eth-component": "DiffTable",
+      "aria-label": label,
+      children: [
+        /* @__PURE__ */ jsxs5("header", { className: "eth-dev-diff-table__header", children: [
+          /* @__PURE__ */ jsxs5("div", { className: "eth-dev-diff-table__heading", children: [
+            /* @__PURE__ */ jsx6("h3", { children: title }),
+            effectiveSubtitle ? /* @__PURE__ */ jsx6("p", { children: effectiveSubtitle }) : null
+          ] }),
+          showSummary ? /* @__PURE__ */ jsxs5("dl", { className: "eth-dev-diff-table__summary", "aria-label": "Diff totals", children: [
+            /* @__PURE__ */ jsxs5("div", { children: [
+              /* @__PURE__ */ jsx6("dt", { children: "Files" }),
+              /* @__PURE__ */ jsx6("dd", { children: totals.changed })
+            ] }),
+            /* @__PURE__ */ jsxs5("div", { children: [
+              /* @__PURE__ */ jsx6("dt", { children: "Added" }),
+              /* @__PURE__ */ jsx6("dd", { className: "eth-dev-diff-table__summary-value--added", children: formatAdded(totals.added) })
+            ] }),
+            /* @__PURE__ */ jsxs5("div", { children: [
+              /* @__PURE__ */ jsx6("dt", { children: "Removed" }),
+              /* @__PURE__ */ jsx6("dd", { className: "eth-dev-diff-table__summary-value--removed", children: formatRemoved(totals.removed) })
+            ] })
+          ] }) : null
+        ] }),
+        rows.length ? /* @__PURE__ */ jsx6("div", { className: "eth-dev-diff-table__viewport", children: /* @__PURE__ */ jsxs5("table", { className: "eth-dev-diff-table__table", children: [
+          /* @__PURE__ */ jsx6("caption", { className: "eth-dev-diff-table__caption", children: label }),
+          /* @__PURE__ */ jsx6("thead", { children: /* @__PURE__ */ jsxs5("tr", { children: [
+            /* @__PURE__ */ jsx6("th", { scope: "col", children: "File" }),
+            /* @__PURE__ */ jsx6("th", { scope: "col", children: "State" }),
+            mode === "inline" ? /* @__PURE__ */ jsx6("th", { scope: "col", children: "Changes" }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
+              /* @__PURE__ */ jsx6("th", { scope: "col", children: "Added" }),
+              /* @__PURE__ */ jsx6("th", { scope: "col", children: "Removed" }),
+              /* @__PURE__ */ jsx6("th", { scope: "col", children: "Net" })
+            ] }),
+            /* @__PURE__ */ jsx6("th", { scope: "col", children: "Summary" })
+          ] }) }),
+          /* @__PURE__ */ jsx6("tbody", { children: rows.map((row, index) => {
+            const added = getAdded(row);
+            const removed = getRemoved(row);
+            const type = inferChangeType(row);
+            const path = getPath(row);
+            const previousPath = getPreviousPath(row);
+            const key = row.id ?? `${path}-${index}`;
+            return /* @__PURE__ */ jsxs5("tr", { className: `eth-dev-diff-table__row--${type}`, children: [
+              /* @__PURE__ */ jsx6("th", { scope: "row", children: /* @__PURE__ */ jsxs5("span", { className: "eth-dev-diff-table__file", children: [
+                /* @__PURE__ */ jsx6("code", { children: path }),
+                previousPath && previousPath !== path ? /* @__PURE__ */ jsxs5("span", { children: [
+                  "was ",
+                  previousPath
+                ] }) : null
+              ] }) }),
+              /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6(
+                "span",
+                {
+                  className: `eth-dev-diff-table__state eth-dev-diff-table__state--${type}`,
+                  children: changeLabel(type)
+                }
+              ) }),
+              mode === "inline" ? /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsxs5("span", { className: "eth-dev-diff-table__inline-delta", children: [
+                /* @__PURE__ */ jsx6(
+                  "span",
+                  {
+                    className: "eth-dev-diff-table__count eth-dev-diff-table__count--added",
+                    "aria-label": `${added} added lines`,
+                    children: formatAdded(added)
+                  }
+                ),
+                /* @__PURE__ */ jsx6(
+                  "span",
+                  {
+                    className: "eth-dev-diff-table__count eth-dev-diff-table__count--removed",
+                    "aria-label": `${removed} removed lines`,
+                    children: formatRemoved(removed)
+                  }
+                )
+              ] }) }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
+                /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6(
+                  "span",
+                  {
+                    className: "eth-dev-diff-table__count eth-dev-diff-table__count--added",
+                    "aria-label": `${added} added lines`,
+                    children: formatAdded(added)
+                  }
+                ) }),
+                /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6(
+                  "span",
+                  {
+                    className: "eth-dev-diff-table__count eth-dev-diff-table__count--removed",
+                    "aria-label": `${removed} removed lines`,
+                    children: formatRemoved(removed)
+                  }
+                ) }),
+                /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6("span", { className: "eth-dev-diff-table__count", children: formatNet(added - removed) }) })
+              ] }),
+              /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6("span", { className: "eth-dev-diff-table__row-summary", children: defaultSummary(row, type) }) })
+            ] }, key);
+          }) })
+        ] }) }) : emptyState ?? /* @__PURE__ */ jsx6(
+          EmptyState2,
+          {
+            title: "No diff rows",
+            description: "No files have line-level changes in this comparison."
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/DiffViewer.tsx
+import * as React5 from "react";
+import { Button as Button2 } from "@echothink-ui/core";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function DiffViewer({
+  before,
+  after,
+  mode = "inline",
+  language,
+  className,
+  ...props
+}) {
+  const [viewMode, setViewMode] = React5.useState(mode);
+  const diff = React5.useMemo(() => buildLineDiff(before, after), [before, after]);
+  const counts = React5.useMemo(
+    () => ({
+      additions: diff.filter((line) => line.type === "add").length,
+      deletions: diff.filter((line) => line.type === "remove").length
+    }),
+    [diff]
+  );
+  const languageLabel = language?.trim() || "diff";
+  React5.useEffect(() => setViewMode(mode), [mode]);
+  return /* @__PURE__ */ jsxs6(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-diff-viewer eth-dev-diff-viewer--${viewMode} ${className ?? ""}`.trim(),
+      "aria-label": props["aria-label"] ?? `${languageLabel} diff viewer`,
+      "data-eth-component": "DiffViewer",
+      "data-language": languageLabel,
+      children: [
+        /* @__PURE__ */ jsxs6("header", { className: "eth-dev-diff-viewer__header", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "eth-dev-diff-viewer__heading", children: [
+            /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__language", children: languageLabel }),
+            /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__mode", children: viewMode === "inline" ? "Inline" : "Side by side" })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "eth-dev-diff-viewer__summary", "aria-label": "Diff summary", children: [
+            /* @__PURE__ */ jsxs6("span", { className: "eth-dev-diff-viewer__stat eth-dev-diff-viewer__stat--add", children: [
+              /* @__PURE__ */ jsx7("strong", { children: counts.additions }),
+              " additions"
+            ] }),
+            /* @__PURE__ */ jsxs6("span", { className: "eth-dev-diff-viewer__stat eth-dev-diff-viewer__stat--remove", children: [
+              /* @__PURE__ */ jsx7("strong", { children: counts.deletions }),
+              " deletions"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "eth-dev-diff-viewer__view-switch", role: "group", "aria-label": "Diff view mode", children: [
+            /* @__PURE__ */ jsx7(
+              Button2,
+              {
+                intent: viewMode === "inline" ? "primary" : "secondary",
+                density: "compact",
+                "aria-pressed": viewMode === "inline",
+                onClick: () => setViewMode("inline"),
+                children: "Inline"
+              }
+            ),
+            /* @__PURE__ */ jsx7(
+              Button2,
+              {
+                intent: viewMode === "side-by-side" ? "primary" : "secondary",
+                density: "compact",
+                "aria-pressed": viewMode === "side-by-side",
+                onClick: () => setViewMode("side-by-side"),
+                children: "Side by side"
+              }
+            )
+          ] })
+        ] }),
+        viewMode === "inline" ? /* @__PURE__ */ jsx7(
+          "pre",
+          {
+            className: `eth-dev-diff-viewer__inline language-${toLanguageClass(languageLabel)}`,
+            "aria-label": "Inline diff",
+            children: /* @__PURE__ */ jsx7("code", { className: "eth-dev-diff-viewer__code", children: diff.map((line, index) => /* @__PURE__ */ jsx7(DiffLineView, { line }, index)) })
+          }
+        ) : /* @__PURE__ */ jsxs6("div", { className: "eth-dev-diff-viewer__split", role: "table", "aria-label": "Side-by-side diff", children: [
+          /* @__PURE__ */ jsx7("div", { role: "rowgroup", children: /* @__PURE__ */ jsxs6("div", { className: "eth-dev-diff-viewer__split-header", role: "row", children: [
+            /* @__PURE__ */ jsx7("div", { role: "columnheader", children: "Before" }),
+            /* @__PURE__ */ jsx7("div", { role: "columnheader", children: "After" })
+          ] }) }),
+          /* @__PURE__ */ jsx7("div", { className: "eth-dev-diff-viewer__split-body", role: "rowgroup", children: diff.map((line, index) => /* @__PURE__ */ jsxs6(
+            "div",
+            {
+              className: `eth-dev-diff-viewer__split-row eth-dev-diff-viewer__split-row--${line.type}`,
+              role: "row",
+              children: [
+                /* @__PURE__ */ jsx7(DiffCell, { side: "before", line }),
+                /* @__PURE__ */ jsx7(DiffCell, { side: "after", line })
+              ]
+            },
+            index
+          )) })
+        ] })
+      ]
+    }
+  );
+}
+function DiffLineView({ line }) {
+  return /* @__PURE__ */ jsxs6("span", { className: `eth-dev-diff-viewer__line eth-dev-diff-viewer__line--${line.type}`, children: [
+    /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__gutter", children: line.beforeLine ?? line.afterLine ?? "" }),
+    /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__marker", children: lineMarker(line.type) }),
+    /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__content", children: line.text || " " })
+  ] });
+}
+function DiffCell({ side, line }) {
+  const empty = side === "before" && line.type === "add" || side === "after" && line.type === "remove";
+  const lineNumber = side === "before" ? line.beforeLine : line.afterLine;
+  return /* @__PURE__ */ jsx7(
+    "pre",
+    {
+      className: `eth-dev-diff-viewer__cell eth-dev-diff-viewer__cell--${empty ? "empty" : line.type}`,
+      role: "cell",
+      children: /* @__PURE__ */ jsxs6("code", { className: "eth-dev-diff-viewer__cell-code", children: [
+        /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__gutter", children: empty ? "" : lineNumber ?? "" }),
+        /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__marker", children: empty ? " " : lineMarker(line.type) }),
+        /* @__PURE__ */ jsx7("span", { className: "eth-dev-diff-viewer__content", children: empty ? " " : line.text || " " })
+      ] })
+    }
+  );
+}
+function lineMarker(type) {
+  if (type === "add") return "+";
+  if (type === "remove") return "-";
+  return " ";
+}
+function toLanguageClass(language) {
+  return language.toLowerCase().replace(/[^a-z0-9_-]/g, "-");
+}
+
+// src/components/JSONViewer.tsx
+import * as React6 from "react";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function JSONViewer({
+  value,
+  defaultExpandedDepth = 2,
+  className,
+  ...props
+}) {
+  const [view, setView] = React6.useState("tree");
+  const treeTabRef = React6.useRef(null);
+  const rawTabRef = React6.useRef(null);
+  const treeTabId = React6.useId();
+  const rawTabId = React6.useId();
+  const treePanelId = React6.useId();
+  const rawPanelId = React6.useId();
+  const selectView = (nextView, shouldFocus = false) => {
+    setView(nextView);
+    if (shouldFocus) {
+      window.requestAnimationFrame(() => {
+        (nextView === "tree" ? treeTabRef : rawTabRef).current?.focus();
+      });
+    }
+  };
+  const onTabKeyDown = (event) => {
+    if (event.key === "ArrowLeft" || event.key === "Home") {
+      event.preventDefault();
+      selectView("tree", true);
+    } else if (event.key === "ArrowRight" || event.key === "End") {
+      event.preventDefault();
+      selectView("raw", true);
+    }
+  };
+  return /* @__PURE__ */ jsxs7(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-json-viewer ${className ?? ""}`,
+      "data-eth-component": "JSONViewer",
+      children: [
+        /* @__PURE__ */ jsxs7("header", { className: "eth-dev-json-viewer__tabs", role: "tablist", "aria-label": "JSON view mode", children: [
+          /* @__PURE__ */ jsx8(
+            "button",
+            {
+              "aria-controls": treePanelId,
+              "aria-selected": view === "tree",
+              className: "eth-dev-json-viewer__tab",
+              id: treeTabId,
+              ref: treeTabRef,
+              role: "tab",
+              tabIndex: view === "tree" ? 0 : -1,
+              type: "button",
+              onClick: () => selectView("tree"),
+              onKeyDown: onTabKeyDown,
+              children: "Tree"
+            }
+          ),
+          /* @__PURE__ */ jsx8(
+            "button",
+            {
+              "aria-controls": rawPanelId,
+              "aria-selected": view === "raw",
+              className: "eth-dev-json-viewer__tab",
+              id: rawTabId,
+              ref: rawTabRef,
+              role: "tab",
+              tabIndex: view === "raw" ? 0 : -1,
+              type: "button",
+              onClick: () => selectView("raw"),
+              onKeyDown: onTabKeyDown,
+              children: "Raw"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx8(
+          "div",
+          {
+            "aria-labelledby": treeTabId,
+            className: "eth-dev-json-viewer__tree",
+            hidden: view !== "tree",
+            id: treePanelId,
+            role: "tabpanel",
+            tabIndex: 0,
+            children: /* @__PURE__ */ jsx8("div", { className: "eth-dev-json-viewer__tree-body", children: /* @__PURE__ */ jsx8(JSONNode, { name: "root", value, depth: 0, expandedDepth: defaultExpandedDepth }) })
+          }
+        ),
+        /* @__PURE__ */ jsx8(
+          "pre",
+          {
+            "aria-labelledby": rawTabId,
+            className: "eth-dev-json-viewer__raw",
+            hidden: view !== "raw",
+            id: rawPanelId,
+            role: "tabpanel",
+            tabIndex: 0,
+            children: /* @__PURE__ */ jsx8("code", { children: formatRawValue(value) })
+          }
+        )
+      ]
+    }
+  );
+}
+function JSONNode({
+  name,
+  value,
+  depth,
+  expandedDepth
+}) {
+  if (value === null || typeof value !== "object") {
+    const type = leafType(value);
+    return /* @__PURE__ */ jsxs7("div", { className: "eth-dev-json-viewer__leaf", children: [
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__key", children: name }),
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__punctuation", children: ":" }),
+      /* @__PURE__ */ jsx8("span", { className: `eth-dev-json-viewer__value eth-dev-json-viewer__value--${type}`, children: formatLeafValue(value) })
+    ] });
+  }
+  const entries = Array.isArray(value) ? value.map((item, index) => [String(index), item]) : Object.entries(value);
+  const isArray = Array.isArray(value);
+  const collectionMeta = isArray ? `[${entries.length}]` : `{${entries.length}}`;
+  if (entries.length === 0) {
+    return /* @__PURE__ */ jsxs7("div", { className: "eth-dev-json-viewer__leaf eth-dev-json-viewer__leaf--empty", children: [
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__key", children: name }),
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__node-meta", children: isArray ? "[]" : "{}" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs7("details", { open: depth < expandedDepth, className: "eth-dev-json-viewer__branch", children: [
+    /* @__PURE__ */ jsxs7("summary", { children: [
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__disclosure", "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__summary-label", children: name }),
+      /* @__PURE__ */ jsx8("span", { className: "eth-dev-json-viewer__node-meta", children: collectionMeta })
+    ] }),
+    /* @__PURE__ */ jsx8("div", { className: "eth-dev-json-viewer__children", children: entries.map(([key, child]) => /* @__PURE__ */ jsx8(
+      JSONNode,
+      {
+        name: key,
+        value: child,
+        depth: depth + 1,
+        expandedDepth
+      },
+      key
+    )) })
+  ] });
+}
+function leafType(value) {
+  if (value === null) return "null";
+  return typeof value;
+}
+function formatRawValue(value) {
+  try {
+    const formatted = JSON.stringify(value, null, 2);
+    if (typeof formatted === "string") return formatted;
+  } catch {
+  }
+  return formatLeafValue(value);
+}
+function formatLeafValue(value) {
+  if (typeof value === "string") return JSON.stringify(value);
+  if (typeof value === "undefined") return "undefined";
+  if (typeof value === "symbol") return value.toString();
+  if (typeof value === "function") return "[Function]";
+  if (value === null) return "null";
+  try {
+    return JSON.stringify(value);
+  } catch {
+    return String(value);
+  }
+}
+
+// src/components/EventPayloadViewer.tsx
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function EventPayloadViewer({
+  eventId,
+  payload,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const summary = describePayload(payload);
+  return /* @__PURE__ */ jsxs8(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-event-payload-viewer ${className ?? ""}`,
+      "aria-label": ariaLabel ?? (eventId ? `Event payload ${eventId}` : "Event payload"),
+      "data-eth-component": "EventPayloadViewer",
+      children: [
+        /* @__PURE__ */ jsxs8("header", { className: "eth-dev-event-payload-viewer__header", children: [
+          /* @__PURE__ */ jsxs8("div", { className: "eth-dev-event-payload-viewer__heading", children: [
+            /* @__PURE__ */ jsx9("span", { children: "Event payload" }),
+            /* @__PURE__ */ jsx9("h3", { children: eventId ? /* @__PURE__ */ jsx9("code", { children: eventId }) : "Payload" })
+          ] }),
+          /* @__PURE__ */ jsxs8("dl", { className: "eth-dev-event-payload-viewer__summary", "aria-label": "Payload summary", children: [
+            /* @__PURE__ */ jsxs8("div", { children: [
+              /* @__PURE__ */ jsx9("dt", { children: "Root" }),
+              /* @__PURE__ */ jsx9("dd", { children: summary.root })
+            ] }),
+            /* @__PURE__ */ jsxs8("div", { children: [
+              /* @__PURE__ */ jsx9("dt", { children: summary.countLabel }),
+              /* @__PURE__ */ jsx9("dd", { children: summary.countValue })
+            ] }),
+            /* @__PURE__ */ jsxs8("div", { children: [
+              /* @__PURE__ */ jsx9("dt", { children: "Size" }),
+              /* @__PURE__ */ jsx9("dd", { children: summary.size })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx9(JSONViewer, { className: "eth-dev-event-payload-viewer__json", value: payload, defaultExpandedDepth: 3 })
+      ]
+    }
+  );
+}
+function describePayload(value) {
+  const text = serializePayload(value);
+  if (Array.isArray(value)) {
+    return {
+      root: "array",
+      countLabel: "Items",
+      countValue: String(value.length),
+      size: formatPayloadSize(text.length)
+    };
+  }
+  if (value !== null && typeof value === "object") {
+    return {
+      root: "object",
+      countLabel: "Fields",
+      countValue: String(Object.keys(value).length),
+      size: formatPayloadSize(text.length)
+    };
+  }
+  return {
+    root: value === null ? "null" : typeof value,
+    countLabel: "Shape",
+    countValue: "scalar",
+    size: formatPayloadSize(text.length)
+  };
+}
+function serializePayload(value) {
+  if (typeof value === "string") return value;
+  if (typeof value === "undefined") return "";
+  try {
+    return JSON.stringify(value, null, 2) ?? "";
+  } catch {
+    return String(value);
+  }
+}
+function formatPayloadSize(size) {
+  if (size < 1e3) return `${size} B`;
+  if (size < 1e3 * 1e3) return `${(size / 1e3).toFixed(1)} KB`;
+  return `${(size / (1e3 * 1e3)).toFixed(1)} MB`;
+}
+
+// src/components/GitRepositoryPanel.tsx
+import { Branch, Commit, GitRepo, Launch, PullRequest, Time } from "@carbon/icons-react";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function GitRepositoryPanel({ repo, className, ...props }) {
+  const summaryItems = [
+    {
+      label: "Default branch",
+      value: repo.defaultBranch,
+      icon: /* @__PURE__ */ jsx10(Branch, { size: 16 }),
+      valueClassName: "eth-dev-git-repository-panel__metric-value--code"
+    },
+    {
+      label: "Open PRs",
+      value: String(repo.openPrCount ?? 0),
+      icon: /* @__PURE__ */ jsx10(PullRequest, { size: 16 })
+    },
+    {
+      label: "Commits",
+      value: String(repo.commitCount ?? 0),
+      icon: /* @__PURE__ */ jsx10(Commit, { size: 16 })
+    },
+    {
+      label: "Last commit",
+      value: repo.lastCommitAt ?? "No activity",
+      icon: /* @__PURE__ */ jsx10(Time, { size: 16 }),
+      valueClassName: "eth-dev-git-repository-panel__metric-value--code"
+    }
+  ];
+  return /* @__PURE__ */ jsxs9(
+    "section",
+    {
+      ...props,
+      "aria-label": props["aria-label"] ?? `${repo.name} repository summary`,
+      className: `eth-dev-git-repository-panel ${className ?? ""}`,
+      "data-eth-component": "GitRepositoryPanel",
+      children: [
+        /* @__PURE__ */ jsxs9("header", { className: "eth-dev-git-repository-panel__header", children: [
+          /* @__PURE__ */ jsxs9("div", { className: "eth-dev-git-repository-panel__identity", children: [
+            /* @__PURE__ */ jsx10("span", { className: "eth-dev-git-repository-panel__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx10(GitRepo, { size: 20 }) }),
+            /* @__PURE__ */ jsxs9("div", { className: "eth-dev-git-repository-panel__heading", children: [
+              /* @__PURE__ */ jsx10("p", { children: "Repository" }),
+              /* @__PURE__ */ jsx10("h3", { children: repo.name }),
+              /* @__PURE__ */ jsx10("a", { className: "eth-dev-git-repository-panel__url", href: repo.url, title: repo.url, children: repo.url })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs9(
+            "a",
+            {
+              className: "eth-dev-git-repository-panel__action",
+              href: repo.url,
+              "aria-label": `Open ${repo.name} repository`,
+              children: [
+                /* @__PURE__ */ jsx10("span", { children: "Open repository" }),
+                /* @__PURE__ */ jsx10(Launch, { size: 16, "aria-hidden": "true" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx10("dl", { className: "eth-dev-git-repository-panel__metrics", "aria-label": "Repository metrics", children: summaryItems.map((item) => /* @__PURE__ */ jsxs9("div", { className: "eth-dev-git-repository-panel__metric", children: [
+          /* @__PURE__ */ jsxs9("dt", { children: [
+            /* @__PURE__ */ jsx10("span", { "aria-hidden": "true", children: item.icon }),
+            item.label
+          ] }),
+          /* @__PURE__ */ jsx10("dd", { className: item.valueClassName, children: item.value })
+        ] }, item.label)) })
+      ]
+    }
+  );
+}
+
+// src/components/LogConsole.tsx
+import { Pause, Play } from "@carbon/icons-react";
+import { Badge, Button as Button3 } from "@echothink-ui/core";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+var levelAliases = {
+  debug: "debug",
+  error: "error",
+  err: "error",
+  fatal: "error",
+  info: "info",
+  notice: "info",
+  stderr: "stderr",
+  stdout: "stdout",
+  trace: "debug",
+  warn: "warn",
+  warning: "warn"
+};
+function getEntryLevel(entry) {
+  return (entry.level ?? entry.stream ?? "info").toString();
+}
+function getEntryTone(entry) {
+  return levelAliases[getEntryLevel(entry).toLowerCase()] ?? "info";
+}
+function isWarning(entry) {
+  return getEntryTone(entry) === "warn";
+}
+function isError(entry) {
+  const tone = getEntryTone(entry);
+  return tone === "error" || tone === "stderr";
+}
+function formatLevel(entry) {
+  return getEntryLevel(entry).toUpperCase();
+}
+function formatMessage(entry) {
+  return entry.message ?? entry.text ?? "";
+}
+function LogConsole({
+  entries,
+  onPause,
+  streaming = false,
+  filters,
+  className,
+  role = "region",
+  "aria-label": ariaLabel = "Streaming log console",
+  "aria-labelledby": ariaLabelledBy,
+  ...props
+}) {
+  const warningCount = entries.filter(isWarning).length;
+  const errorCount = entries.filter(isError).length;
+  const latestEntry = entries[entries.length - 1];
+  const latestTimestamp = latestEntry?.timestamp ?? "No activity";
+  const hasToolbar = Boolean(filters || onPause);
+  return /* @__PURE__ */ jsxs10(
+    "section",
+    {
+      ...props,
+      role,
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      className: `eth-dev-log-console ${streaming ? "eth-dev-log-console--streaming" : "eth-dev-log-console--paused"} ${className ?? ""}`,
+      "data-eth-component": "LogConsole",
+      children: [
+        /* @__PURE__ */ jsxs10("header", { className: "eth-dev-log-console__header", children: [
+          /* @__PURE__ */ jsxs10("div", { className: "eth-dev-log-console__heading", children: [
+            /* @__PURE__ */ jsx11("p", { className: "eth-dev-log-console__eyebrow", children: "Developer console" }),
+            /* @__PURE__ */ jsx11("h3", { children: "Streaming logs" }),
+            /* @__PURE__ */ jsxs10("p", { children: [
+              entries.length,
+              " ",
+              entries.length === 1 ? "entry" : "entries",
+              " buffered from the active stream."
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs10("div", { className: "eth-dev-log-console__status", "aria-live": "polite", children: [
+            /* @__PURE__ */ jsx11(Badge, { severity: streaming ? "success" : "neutral", children: streaming ? "Streaming" : "Paused" }),
+            /* @__PURE__ */ jsx11("span", { children: errorCount ? `${errorCount} errors` : "No errors" })
+          ] })
+        ] }),
+        hasToolbar ? /* @__PURE__ */ jsxs10("div", { className: "eth-dev-log-console__toolbar", role: "toolbar", "aria-label": "Log controls", children: [
+          filters ? /* @__PURE__ */ jsx11("div", { className: "eth-dev-log-console__filters", children: filters }) : null,
+          onPause ? /* @__PURE__ */ jsx11(
+            Button3,
+            {
+              intent: streaming ? "secondary" : "primary",
+              density: "compact",
+              icon: streaming ? /* @__PURE__ */ jsx11(Pause, { size: 16 }) : /* @__PURE__ */ jsx11(Play, { size: 16 }),
+              onClick: onPause,
+              children: streaming ? "Pause stream" : "Resume stream"
+            }
+          ) : null
+        ] }) : null,
+        /* @__PURE__ */ jsxs10("dl", { className: "eth-dev-log-console__summary", "aria-label": "Log summary", children: [
+          /* @__PURE__ */ jsxs10("div", { children: [
+            /* @__PURE__ */ jsx11("dt", { children: "Entries" }),
+            /* @__PURE__ */ jsx11("dd", { children: entries.length })
+          ] }),
+          /* @__PURE__ */ jsxs10("div", { children: [
+            /* @__PURE__ */ jsx11("dt", { children: "Warnings" }),
+            /* @__PURE__ */ jsx11("dd", { children: warningCount })
+          ] }),
+          /* @__PURE__ */ jsxs10("div", { children: [
+            /* @__PURE__ */ jsx11("dt", { children: "Errors" }),
+            /* @__PURE__ */ jsx11("dd", { children: errorCount })
+          ] }),
+          /* @__PURE__ */ jsxs10("div", { children: [
+            /* @__PURE__ */ jsx11("dt", { children: "Latest" }),
+            /* @__PURE__ */ jsx11("dd", { children: latestTimestamp })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx11("div", { className: "eth-dev-log-console__viewport", children: entries.length ? /* @__PURE__ */ jsx11(
+          "div",
+          {
+            className: "eth-dev-log-console__entries",
+            role: "log",
+            "aria-live": streaming ? "polite" : "off",
+            "aria-relevant": "additions text",
+            "aria-atomic": "false",
+            children: entries.map((entry) => {
+              const tone = getEntryTone(entry);
+              return /* @__PURE__ */ jsxs10(
+                "div",
+                {
+                  className: `eth-dev-log-console__entry eth-dev-log-console__entry--${tone}`,
+                  children: [
+                    /* @__PURE__ */ jsx11("time", { className: "eth-dev-log-console__timestamp", children: entry.timestamp ?? "--:--:--" }),
+                    /* @__PURE__ */ jsx11("span", { className: "eth-dev-log-console__level", children: formatLevel(entry) }),
+                    /* @__PURE__ */ jsx11("span", { className: "eth-dev-log-console__source", children: entry.source ?? entry.stream ?? "system" }),
+                    /* @__PURE__ */ jsx11("code", { className: "eth-dev-log-console__message", children: formatMessage(entry) })
+                  ]
+                },
+                entry.id
+              );
+            })
+          }
+        ) : /* @__PURE__ */ jsxs10("div", { className: "eth-dev-log-console__empty", role: "status", children: [
+          /* @__PURE__ */ jsx11("h4", { children: "No log entries" }),
+          /* @__PURE__ */ jsx11("p", { children: "Events will appear here when the stream receives output." })
+        ] }) })
+      ]
+    }
+  );
+}
+
+// src/components/PullRequestPanel.tsx
+import * as React7 from "react";
+import { Checkmark as Checkmark2, PullRequest as PullRequest2 } from "@carbon/icons-react";
+import { Button as Button4, EmptyState as EmptyState3, Textarea as Textarea2 } from "@echothink-ui/core";
+import { DataTable as DataTable2 } from "@echothink-ui/data";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+function formatState(state) {
+  const normalized = state.trim();
+  if (!normalized) return "Unknown";
+  return normalized.split(/[\s_-]+/).map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1).toLowerCase()}`).join(" ");
+}
+function stateClassName(state) {
+  const normalized = state.trim().toLowerCase();
+  if (["open", "opened", "ready"].includes(normalized)) {
+    return "eth-dev-pull-request-panel__state--open";
+  }
+  if (["merged", "approved"].includes(normalized)) {
+    return "eth-dev-pull-request-panel__state--merged";
+  }
+  if (["closed", "rejected", "blocked"].includes(normalized)) {
+    return "eth-dev-pull-request-panel__state--closed";
+  }
+  if (["draft", "pending"].includes(normalized)) {
+    return "eth-dev-pull-request-panel__state--draft";
+  }
+  return "eth-dev-pull-request-panel__state--unknown";
+}
+function PullRequestPanel({
+  pr,
+  onApprove,
+  onComment,
+  className,
+  ...props
+}) {
+  const [comment, setComment] = React7.useState("");
+  const titleId = React7.useId().replace(/:/g, "");
+  const filesTitleId = React7.useId().replace(/:/g, "");
+  const files = pr.files ?? [];
+  const reviewers = pr.reviewers?.length ? pr.reviewers.join(", ") : "No reviewers";
+  const additions = files.reduce((sum, file) => sum + file.additions, 0);
+  const deletions = files.reduce((sum, file) => sum + file.deletions, 0);
+  const formattedState = formatState(pr.state);
+  const ariaLabel = props["aria-label"] ?? (props["aria-labelledby"] ? void 0 : `Pull request ${pr.title}`);
+  const columns = [
+    {
+      key: "path",
+      header: "File",
+      render: (row) => /* @__PURE__ */ jsx12("code", { className: "eth-dev-pull-request-panel__file-path", title: row.path, children: row.path })
+    },
+    {
+      key: "additions",
+      header: "Additions",
+      align: "end",
+      width: "7rem",
+      render: (row) => /* @__PURE__ */ jsxs11("span", { className: "eth-dev-pull-request-panel__count eth-dev-pull-request-panel__count--added", children: [
+        "+",
+        row.additions
+      ] })
+    },
+    {
+      key: "deletions",
+      header: "Deletions",
+      align: "end",
+      width: "7rem",
+      render: (row) => /* @__PURE__ */ jsxs11("span", { className: "eth-dev-pull-request-panel__count eth-dev-pull-request-panel__count--removed", children: [
+        "-",
+        row.deletions
+      ] })
+    }
+  ];
+  const submitComment = (event) => {
+    event.preventDefault();
+    const nextComment = comment.trim();
+    if (!nextComment) return;
+    onComment?.(nextComment);
+    setComment("");
+  };
+  return /* @__PURE__ */ jsxs11(
+    "section",
+    {
+      ...props,
+      "aria-label": ariaLabel,
+      className: `eth-dev-pull-request-panel ${className ?? ""}`,
+      "data-eth-component": "PullRequestPanel",
+      role: "region",
+      children: [
+        /* @__PURE__ */ jsxs11("header", { className: "eth-dev-pull-request-panel__header", children: [
+          /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__identity", children: [
+            /* @__PURE__ */ jsx12("span", { className: "eth-dev-pull-request-panel__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx12(PullRequest2, { size: 20 }) }),
+            /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__heading", children: [
+              /* @__PURE__ */ jsxs11("p", { children: [
+                "Pull request ",
+                /* @__PURE__ */ jsxs11("span", { children: [
+                  "#",
+                  pr.id
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx12("h3", { id: titleId, children: pr.title }),
+              /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__meta", children: [
+                /* @__PURE__ */ jsx12(
+                  "span",
+                  {
+                    className: `eth-dev-pull-request-panel__state ${stateClassName(pr.state)}`,
+                    children: formattedState
+                  }
+                ),
+                /* @__PURE__ */ jsxs11("span", { children: [
+                  "by ",
+                  pr.author
+                ] })
+              ] })
+            ] })
+          ] }),
+          onApprove ? /* @__PURE__ */ jsx12(
+            Button4,
+            {
+              "aria-label": "Approve pull request",
+              className: "eth-dev-pull-request-panel__approve",
+              density: "compact",
+              icon: /* @__PURE__ */ jsx12(Checkmark2, { size: 16 }),
+              intent: "success",
+              onClick: onApprove,
+              children: "Approve"
+            }
+          ) : null
+        ] }),
+        /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__body", children: [
+          pr.body ? /* @__PURE__ */ jsx12("p", { className: "eth-dev-pull-request-panel__description", children: pr.body }) : null,
+          /* @__PURE__ */ jsxs11("dl", { className: "eth-dev-pull-request-panel__metrics", "aria-label": "Pull request summary", children: [
+            /* @__PURE__ */ jsxs11("div", { children: [
+              /* @__PURE__ */ jsx12("dt", { children: "Reviewers" }),
+              /* @__PURE__ */ jsx12("dd", { title: reviewers, children: reviewers })
+            ] }),
+            /* @__PURE__ */ jsxs11("div", { children: [
+              /* @__PURE__ */ jsx12("dt", { children: "Commits" }),
+              /* @__PURE__ */ jsx12("dd", { children: pr.commits ?? 0 })
+            ] }),
+            /* @__PURE__ */ jsxs11("div", { children: [
+              /* @__PURE__ */ jsx12("dt", { children: "Files changed" }),
+              /* @__PURE__ */ jsx12("dd", { children: files.length })
+            ] }),
+            /* @__PURE__ */ jsxs11("div", { children: [
+              /* @__PURE__ */ jsx12("dt", { children: "Line delta" }),
+              /* @__PURE__ */ jsxs11("dd", { children: [
+                /* @__PURE__ */ jsxs11("span", { className: "eth-dev-pull-request-panel__count eth-dev-pull-request-panel__count--added", children: [
+                  "+",
+                  additions
+                ] }),
+                /* @__PURE__ */ jsx12("span", { "aria-hidden": "true", children: " / " }),
+                /* @__PURE__ */ jsxs11("span", { className: "eth-dev-pull-request-panel__count eth-dev-pull-request-panel__count--removed", children: [
+                  "-",
+                  deletions
+                ] })
+              ] })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs11("section", { className: "eth-dev-pull-request-panel__files", "aria-labelledby": filesTitleId, children: [
+          /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__files-header", children: [
+            /* @__PURE__ */ jsx12("h4", { id: filesTitleId, children: "Changed files" }),
+            /* @__PURE__ */ jsxs11("span", { children: [
+              files.length,
+              " files"
+            ] })
+          ] }),
+          files.length ? /* @__PURE__ */ jsx12(
+            DataTable2,
+            {
+              "aria-label": "Changed files",
+              className: "eth-dev-pull-request-panel__table",
+              columns,
+              density: "compact",
+              rowKey: "path",
+              rows: files
+            }
+          ) : /* @__PURE__ */ jsx12(
+            EmptyState3,
+            {
+              title: "No file changes",
+              description: "Changed files will appear when this pull request has a diff."
+            }
+          )
+        ] }),
+        onComment ? /* @__PURE__ */ jsxs11(
+          "form",
+          {
+            "aria-label": "Review comment form",
+            className: "eth-dev-pull-request-panel__comment",
+            onSubmit: submitComment,
+            children: [
+              /* @__PURE__ */ jsx12(
+                Textarea2,
+                {
+                  helperText: "Add a blocking question, approval note, or evidence reference.",
+                  labelText: "Review comment",
+                  onChange: (event) => setComment(event.currentTarget.value),
+                  placeholder: "Reference tests, policy checks, or follow-up questions.",
+                  rows: 4,
+                  value: comment
+                }
+              ),
+              /* @__PURE__ */ jsxs11("div", { className: "eth-dev-pull-request-panel__comment-footer", children: [
+                /* @__PURE__ */ jsx12("span", { children: "Comment will be attached to this pull request." }),
+                /* @__PURE__ */ jsx12(
+                  Button4,
+                  {
+                    "aria-label": "Submit review comment",
+                    density: "compact",
+                    disabled: !comment.trim(),
+                    intent: "secondary",
+                    type: "submit",
+                    children: "Comment"
+                  }
+                )
+              ] })
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+// src/components/RequestResponseViewer.tsx
+import * as React8 from "react";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+var tabs = [
+  { id: "request-headers", label: "Request headers", emptyLabel: "No request headers." },
+  { id: "request-body", label: "Request body", emptyLabel: "No request body." },
+  { id: "response-headers", label: "Response headers", emptyLabel: "No response headers." },
+  { id: "response-body", label: "Response body", emptyLabel: "No response body." }
+];
+function RequestResponseViewer({
+  request,
+  response,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [tab, setTab] = React8.useState("request-headers");
+  const tabRefs = React8.useRef([]);
+  const generatedId = React8.useId().replace(/:/g, "");
+  const activeIndex = Math.max(
+    tabs.findIndex((item) => item.id === tab),
+    0
+  );
+  const regionLabel = `${request.method} ${request.url} ${response.status}`;
+  const durationLabel = typeof response.durationMs === "number" ? `${response.durationMs} ms` : "Duration unavailable";
+  const selectTab = (nextIndex, shouldFocus = false) => {
+    const nextTab = tabs[nextIndex] ?? tabs[0];
+    setTab(nextTab.id);
+    if (shouldFocus) {
+      window.requestAnimationFrame(() => tabRefs.current[nextIndex]?.focus());
+    }
+  };
+  const onTabKeyDown = (event) => {
+    if (event.key === "ArrowLeft") {
+      event.preventDefault();
+      selectTab((activeIndex - 1 + tabs.length) % tabs.length, true);
+    } else if (event.key === "ArrowRight") {
+      event.preventDefault();
+      selectTab((activeIndex + 1) % tabs.length, true);
+    } else if (event.key === "Home") {
+      event.preventDefault();
+      selectTab(0, true);
+    } else if (event.key === "End") {
+      event.preventDefault();
+      selectTab(tabs.length - 1, true);
+    }
+  };
+  return /* @__PURE__ */ jsxs12(
+    "section",
+    {
+      ...props,
+      "aria-label": ariaLabel ?? regionLabel,
+      className: `eth-dev-request-response-viewer ${className ?? ""}`.trim(),
+      "data-eth-component": "RequestResponseViewer",
+      children: [
+        /* @__PURE__ */ jsxs12("header", { className: "eth-dev-request-response-viewer__header", children: [
+          /* @__PURE__ */ jsxs12("div", { className: "eth-dev-request-response-viewer__request", children: [
+            /* @__PURE__ */ jsx13(
+              "span",
+              {
+                className: `eth-dev-request-response-viewer__method eth-dev-request-response-viewer__method--${tokenize(request.method)}`,
+                children: request.method
+              }
+            ),
+            /* @__PURE__ */ jsx13("code", { title: request.url, children: request.url })
+          ] }),
+          /* @__PURE__ */ jsxs12("dl", { className: "eth-dev-request-response-viewer__meta", "aria-label": "HTTP response summary", children: [
+            /* @__PURE__ */ jsxs12("div", { children: [
+              /* @__PURE__ */ jsx13("dt", { children: "Status" }),
+              /* @__PURE__ */ jsx13(
+                "dd",
+                {
+                  className: `eth-dev-request-response-viewer__status eth-dev-request-response-viewer__status--${statusTone(response.status)}`,
+                  children: response.status
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs12("div", { children: [
+              /* @__PURE__ */ jsx13("dt", { children: "Time" }),
+              /* @__PURE__ */ jsx13("dd", { children: durationLabel })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx13(
+          "div",
+          {
+            className: "eth-dev-request-response-viewer__tabs",
+            role: "tablist",
+            "aria-label": "HTTP message sections",
+            children: tabs.map((item, index) => /* @__PURE__ */ jsx13(
+              "button",
+              {
+                "aria-controls": `${generatedId}-${item.id}-panel`,
+                "aria-selected": tab === item.id,
+                className: "eth-dev-request-response-viewer__tab",
+                id: `${generatedId}-${item.id}-tab`,
+                ref: (node) => {
+                  tabRefs.current[index] = node;
+                },
+                role: "tab",
+                tabIndex: tab === item.id ? 0 : -1,
+                type: "button",
+                onClick: () => selectTab(index),
+                onKeyDown: onTabKeyDown,
+                children: item.label
+              },
+              item.id
+            ))
+          }
+        ),
+        tabs.map((item) => {
+          const content = contentFor(item.id, request, response);
+          return /* @__PURE__ */ jsx13(
+            "pre",
+            {
+              "aria-labelledby": `${generatedId}-${item.id}-tab`,
+              className: `eth-dev-request-response-viewer__panel ${content ? "" : "eth-dev-request-response-viewer__panel--empty"}`.trim(),
+              hidden: tab !== item.id,
+              id: `${generatedId}-${item.id}-panel`,
+              role: "tabpanel",
+              tabIndex: tab === item.id ? 0 : -1,
+              children: /* @__PURE__ */ jsx13("code", { children: content || item.emptyLabel })
+            },
+            item.id
+          );
+        })
+      ]
+    }
+  );
+}
+function contentFor(tab, request, response) {
+  switch (tab) {
+    case "request-headers":
+      return formatHeaders(request.headers);
+    case "request-body":
+      return formatUnknown(request.body);
+    case "response-headers":
+      return formatHeaders(response.headers);
+    case "response-body":
+      return formatUnknown(response.body);
+  }
+}
+function formatHeaders(headers) {
+  if (!headers || Object.keys(headers).length === 0) return "";
+  return formatUnknown(headers);
+}
+function statusTone(status) {
+  if (status >= 200 && status < 300) return "success";
+  if (status >= 300 && status < 400) return "redirect";
+  if (status >= 400 && status < 500) return "warning";
+  if (status >= 500) return "error";
+  return "neutral";
+}
+function tokenize(value) {
+  return value.toLowerCase().replace(/[^a-z0-9-]/g, "");
+}
+
+// src/components/SchemaViewer.tsx
+import * as React9 from "react";
+import { CheckmarkFilled, ErrorFilled, WarningFilled } from "@carbon/icons-react";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+function SchemaViewer({
+  schema,
+  validationState,
+  className,
+  ...props
+}) {
+  const stats = React9.useMemo(() => collectSchemaStats(schema), [schema]);
+  const tone = normalizeValidationState(validationState);
+  const status = getStatusConfig(tone, stats);
+  return /* @__PURE__ */ jsxs13(
+    "section",
+    {
+      ...props,
+      className: `eth-dev-schema-viewer ${className ?? ""}`,
+      "data-eth-component": "SchemaViewer",
+      "data-validation-state": tone,
+      children: [
+        /* @__PURE__ */ jsxs13("header", { className: "eth-dev-schema-viewer__status", children: [
+          /* @__PURE__ */ jsx14("span", { className: "eth-dev-schema-viewer__status-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(StatusIcon, { tone }) }),
+          /* @__PURE__ */ jsxs13("div", { className: "eth-dev-schema-viewer__status-copy", children: [
+            /* @__PURE__ */ jsx14("p", { className: "eth-dev-schema-viewer__status-title", children: status.title }),
+            /* @__PURE__ */ jsx14("p", { className: "eth-dev-schema-viewer__status-description", children: status.description })
+          ] }),
+          /* @__PURE__ */ jsxs13("dl", { className: "eth-dev-schema-viewer__stats", "aria-label": "Schema summary", children: [
+            /* @__PURE__ */ jsxs13("div", { children: [
+              /* @__PURE__ */ jsx14("dt", { children: "Keys" }),
+              /* @__PURE__ */ jsx14("dd", { children: stats.topLevelKeys })
+            ] }),
+            /* @__PURE__ */ jsxs13("div", { children: [
+              /* @__PURE__ */ jsx14("dt", { children: "Properties" }),
+              /* @__PURE__ */ jsx14("dd", { children: stats.properties })
+            ] }),
+            /* @__PURE__ */ jsxs13("div", { children: [
+              /* @__PURE__ */ jsx14("dt", { children: "Required" }),
+              /* @__PURE__ */ jsx14("dd", { children: stats.required })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx14(JSONViewer, { className: "eth-dev-schema-viewer__json", value: schema, defaultExpandedDepth: 2 })
+      ]
+    }
+  );
+}
+function normalizeValidationState(validationState) {
+  if (validationState === "valid" || validationState === "invalid" || validationState === "warning") {
+    return validationState;
+  }
+  return "unknown";
+}
+function getStatusConfig(tone, stats) {
+  const summary = `${stats.nodes} nodes inspected across ${stats.properties} properties`;
+  switch (tone) {
+    case "valid":
+      return {
+        title: "Schema valid",
+        description: summary
+      };
+    case "invalid":
+      return {
+        title: "Schema invalid",
+        description: "Review schema structure and validation rules before publishing."
+      };
+    case "warning":
+      return {
+        title: "Schema warning",
+        description: "Schema is readable, but validation reported conditions that need review."
+      };
+    default:
+      return {
+        title: "Schema status unknown",
+        description: summary
+      };
+  }
+}
+function collectSchemaStats(schema) {
+  const stats = {
+    nodes: 0,
+    topLevelKeys: isPlainObject(schema) ? Object.keys(schema).length : Array.isArray(schema) ? schema.length : 1,
+    properties: 0,
+    required: 0
+  };
+  const seen = /* @__PURE__ */ new WeakSet();
+  const visit = (node, key) => {
+    stats.nodes += 1;
+    if (Array.isArray(node)) {
+      if (seen.has(node)) {
+        return;
+      }
+      seen.add(node);
+      if (key === "required" && node.every((item) => typeof item === "string")) {
+        stats.required += node.length;
+      }
+      node.forEach((item) => visit(item));
+      return;
+    }
+    if (!isPlainObject(node) || seen.has(node)) {
+      return;
+    }
+    seen.add(node);
+    if (isPlainObject(node.properties)) {
+      stats.properties += Object.keys(node.properties).length;
+    }
+    Object.entries(node).forEach(([entryKey, entryValue]) => visit(entryValue, entryKey));
+  };
+  visit(schema);
+  return stats;
+}
+function isPlainObject(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function StatusIcon({ tone }) {
+  if (tone === "valid") {
+    return /* @__PURE__ */ jsx14(CheckmarkFilled, { size: 20 });
+  }
+  if (tone === "invalid") {
+    return /* @__PURE__ */ jsx14(ErrorFilled, { size: 20 });
+  }
+  return /* @__PURE__ */ jsx14(WarningFilled, { size: 20 });
+}
+
+// src/components/TerminalPanel.tsx
+import * as React10 from "react";
+import { Play as Play2 } from "@carbon/icons-react";
+import { Button as Button5 } from "@echothink-ui/core";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+function TerminalPanel({
+  lines,
+  prompt = "$",
+  onCommand,
+  disabled,
+  className,
+  role = "region",
+  "aria-label": ariaLabel = "Sandbox terminal",
+  "aria-labelledby": ariaLabelledBy,
+  ...props
+}) {
+  const [command, setCommand] = React10.useState("");
+  const inputId = React10.useId();
+  const errorCount = lines.filter((line) => line.stream === "stderr").length;
+  const canSubmit = !disabled && command.trim().length > 0;
+  const statusLabel2 = disabled ? "Input disabled" : "Sandboxed";
+  const panelClassName = [
+    "eth-dev-terminal-panel",
+    disabled ? "eth-dev-terminal-panel--disabled" : "",
+    className ?? ""
+  ].filter(Boolean).join(" ");
+  const submit = (event) => {
+    event.preventDefault();
+    if (!canSubmit) return;
+    onCommand?.(command);
+    setCommand("");
+  };
+  return /* @__PURE__ */ jsxs14(
+    "section",
+    {
+      ...props,
+      className: panelClassName,
+      "data-eth-component": "TerminalPanel",
+      role,
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      children: [
+        /* @__PURE__ */ jsxs14("header", { className: "eth-dev-terminal-panel__header", children: [
+          /* @__PURE__ */ jsxs14("div", { className: "eth-dev-terminal-panel__heading", children: [
+            /* @__PURE__ */ jsx15("p", { className: "eth-dev-terminal-panel__eyebrow", children: "Developer terminal" }),
+            /* @__PURE__ */ jsx15("h3", { children: "Sandbox terminal" }),
+            /* @__PURE__ */ jsx15("p", { children: "Review command output and send scoped commands into the configured sandbox." })
+          ] }),
+          /* @__PURE__ */ jsxs14("div", { className: "eth-dev-terminal-panel__status", "aria-live": "polite", children: [
+            /* @__PURE__ */ jsx15("span", { className: "eth-dev-terminal-panel__status-indicator", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx15("span", { children: statusLabel2 })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs14("dl", { className: "eth-dev-terminal-panel__summary", "aria-label": "Terminal summary", children: [
+          /* @__PURE__ */ jsxs14("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Lines" }),
+            /* @__PURE__ */ jsx15("dd", { children: lines.length })
+          ] }),
+          /* @__PURE__ */ jsxs14("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Stderr" }),
+            /* @__PURE__ */ jsx15("dd", { children: errorCount })
+          ] }),
+          /* @__PURE__ */ jsxs14("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Prompt" }),
+            /* @__PURE__ */ jsx15("dd", { children: prompt })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx15("div", { className: "eth-dev-terminal-panel__viewport", children: lines.length ? /* @__PURE__ */ jsx15(
+          "pre",
+          {
+            className: "eth-dev-terminal-panel__output",
+            role: "log",
+            "aria-label": "Terminal output",
+            "aria-live": "polite",
+            "aria-relevant": "additions text",
+            "aria-atomic": "false",
+            children: /* @__PURE__ */ jsx15("code", { className: "eth-dev-terminal-panel__output-code", children: lines.map((line) => /* @__PURE__ */ jsxs14(
+              "span",
+              {
+                className: `eth-dev-terminal-panel__line eth-dev-terminal-panel__line--${line.stream}`,
+                children: [
+                  /* @__PURE__ */ jsx15(
+                    "span",
+                    {
+                      className: "eth-dev-terminal-panel__stream",
+                      "aria-label": line.stream === "stderr" ? "Standard error" : "Standard output",
+                      children: line.stream === "stderr" ? "ERR" : "OUT"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx15("span", { className: "eth-dev-terminal-panel__line-text", children: line.text })
+                ]
+              },
+              line.id
+            )) })
+          }
+        ) : /* @__PURE__ */ jsxs14("div", { className: "eth-dev-terminal-panel__empty", role: "status", children: [
+          /* @__PURE__ */ jsx15("h4", { children: "No terminal output" }),
+          /* @__PURE__ */ jsx15("p", { children: "Command output will appear here when the sandbox emits data." })
+        ] }) }),
+        /* @__PURE__ */ jsxs14("form", { className: "eth-dev-terminal-panel__input", onSubmit: submit, children: [
+          /* @__PURE__ */ jsx15("label", { className: "eth-dev-terminal-panel__visually-hidden", htmlFor: inputId, children: "Terminal command" }),
+          /* @__PURE__ */ jsx15("span", { className: "eth-dev-terminal-panel__prompt", "aria-hidden": "true", children: prompt }),
+          /* @__PURE__ */ jsx15(
+            "input",
+            {
+              id: inputId,
+              value: command,
+              disabled,
+              onChange: (event) => setCommand(event.currentTarget.value),
+              autoComplete: "off",
+              spellCheck: false,
+              placeholder: disabled ? "Input disabled" : "Type a command"
+            }
+          ),
+          /* @__PURE__ */ jsx15(
+            Button5,
+            {
+              type: "submit",
+              density: "compact",
+              intent: "primary",
+              icon: /* @__PURE__ */ jsx15(Play2, { size: 16 }),
+              disabled: !canSubmit,
+              "aria-label": "Run command",
+              children: "Run"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/TraceTimeline.tsx
+import * as React11 from "react";
+import { Badge as Badge2, StatusDot, statusLabel } from "@echothink-ui/core";
+import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
+function TraceTimeline({
+  spans,
+  className,
+  role = "region",
+  "aria-label": ariaLabel = "Trace timeline",
+  "aria-labelledby": ariaLabelledBy,
+  ...props
+}) {
+  const timeline = React11.useMemo(() => buildTimeline(spans), [spans]);
+  const issueCount = spans.filter((span) => isIssueStatus(getSpanStatus(span))).length;
+  const activeCount = spans.filter((span) => isActiveStatus(getSpanStatus(span))).length;
+  const services = new Set(spans.flatMap((span) => span.service ? [span.service] : []));
+  const serviceCount = services.size;
+  const describedServiceCount = spans.length ? serviceCount || 1 : 0;
+  const traceDescription = spans.length ? `${spans.length} spans across ${describedServiceCount} service${describedServiceCount === 1 ? "" : "s"}.` : "No spans have been recorded for this trace window.";
+  const healthLabel = issueCount ? `${issueCount} ${issueCount === 1 ? "issue" : "issues"}` : activeCount ? `${activeCount} active` : "All complete";
+  const healthSeverity = issueCount ? "danger" : activeCount ? "info" : "success";
+  const rootClassName = ["eth-dev-trace-timeline", className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs15(
+    "section",
+    {
+      ...props,
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      className: rootClassName,
+      "data-eth-component": "TraceTimeline",
+      role,
+      children: [
+        /* @__PURE__ */ jsxs15("header", { className: "eth-dev-trace-timeline__header", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__heading", children: [
+            /* @__PURE__ */ jsx16("p", { className: "eth-dev-trace-timeline__eyebrow", children: "Distributed trace" }),
+            /* @__PURE__ */ jsx16("h3", { children: "Trace timeline" }),
+            /* @__PURE__ */ jsx16("p", { children: traceDescription })
+          ] }),
+          /* @__PURE__ */ jsx16(Badge2, { severity: healthSeverity, children: healthLabel })
+        ] }),
+        /* @__PURE__ */ jsxs15("dl", { className: "eth-dev-trace-timeline__summary", "aria-label": "Trace summary", children: [
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx16("dt", { children: "Spans" }),
+            /* @__PURE__ */ jsx16("dd", { children: spans.length })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx16("dt", { children: "Window" }),
+            /* @__PURE__ */ jsx16("dd", { children: formatDuration(timeline.total) })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx16("dt", { children: "Issues" }),
+            /* @__PURE__ */ jsx16("dd", { children: issueCount ? `${issueCount} ${issueCount === 1 ? "issue" : "issues"}` : "0" })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx16("dt", { children: "Services" }),
+            /* @__PURE__ */ jsx16("dd", { children: serviceCount })
+          ] })
+        ] }),
+        spans.length ? /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__viewport", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__axis", "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx16("span", { children: "Span" }),
+            /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__axis-scale", children: [
+              /* @__PURE__ */ jsx16("span", { children: "0 ms" }),
+              /* @__PURE__ */ jsx16("span", { children: formatDuration(timeline.total / 2) }),
+              /* @__PURE__ */ jsx16("span", { children: formatDuration(timeline.total) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx16("div", { className: "eth-dev-trace-timeline__rows", role: "list", "aria-label": "Trace spans", children: timeline.items.map(({ span, start, end, depth }) => {
+            const status = getSpanStatus(span);
+            const startOffset = start - timeline.min;
+            const duration = end - start;
+            const left = startOffset / timeline.total * 100;
+            const width = Math.max(1, duration / timeline.total * 100);
+            const spanLabel = formatSpanLabel(span, status, startOffset, duration);
+            return /* @__PURE__ */ jsxs15(
+              "article",
+              {
+                className: `eth-dev-trace-timeline__row eth-dev-trace-timeline__row--${status}`,
+                role: "listitem",
+                style: {
+                  "--eth-dev-trace-indent": `${depth}rem`,
+                  "--eth-dev-trace-left": `${left}%`,
+                  "--eth-dev-trace-width": `${width}%`
+                },
+                children: [
+                  /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__label", children: [
+                    /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__span-title", children: [
+                      /* @__PURE__ */ jsx16(StatusDot, { status, label: statusLabel(status) }),
+                      /* @__PURE__ */ jsx16("strong", { children: span.name })
+                    ] }),
+                    /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__span-meta", children: [
+                      span.service ? /* @__PURE__ */ jsx16("span", { children: span.service }) : null,
+                      span.parentId ? /* @__PURE__ */ jsxs15("span", { children: [
+                        "Parent ",
+                        span.parentId
+                      ] }) : null,
+                      /* @__PURE__ */ jsx16("span", { children: formatDuration(duration) })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx16("div", { className: "eth-dev-trace-timeline__track", role: "img", "aria-label": spanLabel, children: /* @__PURE__ */ jsx16(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: `eth-dev-trace-timeline__bar eth-dev-trace-timeline__bar--${status}`,
+                      title: spanLabel
+                    }
+                  ) })
+                ]
+              },
+              span.id
+            );
+          }) })
+        ] }) : /* @__PURE__ */ jsxs15("div", { className: "eth-dev-trace-timeline__empty", role: "status", children: [
+          /* @__PURE__ */ jsx16("h4", { children: "No spans recorded" }),
+          /* @__PURE__ */ jsx16("p", { children: "Trace spans will appear here when instrumentation emits timing data." })
+        ] })
+      ]
+    }
+  );
+}
+function buildTimeline(spans) {
+  if (!spans.length) return { items: [], min: 0, total: 0 };
+  const spansById = new Map(spans.map((span) => [span.id, span]));
+  const depthById = /* @__PURE__ */ new Map();
+  const depthFor = (span, seen = /* @__PURE__ */ new Set()) => {
+    if (depthById.has(span.id)) return depthById.get(span.id) ?? 0;
+    if (!span.parentId || seen.has(span.id)) {
+      depthById.set(span.id, 0);
+      return 0;
+    }
+    const parent = spansById.get(span.parentId);
+    const depth = parent ? depthFor(parent, new Set(seen).add(span.id)) + 1 : 0;
+    depthById.set(span.id, depth);
+    return depth;
+  };
+  const items = spans.map((span, index) => {
+    const start = Number.isFinite(span.startMs) ? span.startMs : index * 10;
+    const duration = Number.isFinite(span.durationMs) ? Math.max(span.durationMs, 1) : 1;
+    return { span, start, end: start + duration, depth: depthFor(span) };
+  }).sort((a, b) => a.start - b.start || a.span.name.localeCompare(b.span.name));
+  const min = Math.min(...items.map((item) => item.start));
+  const max = Math.max(...items.map((item) => item.end));
+  return { items, min, total: Math.max(max - min, 1) };
+}
+function getSpanStatus(span) {
+  return span.status ?? "running";
+}
+function isActiveStatus(status) {
+  return status === "running" || status === "in-progress";
+}
+function isIssueStatus(status) {
+  return status === "failed" || status === "blocked" || status === "warning" || status === "stale";
+}
+function formatSpanLabel(span, status, startOffset, duration) {
+  return `${span.name}${span.service ? ` in ${span.service}` : ""}, ${statusLabel(
+    status
+  )}, starts at ${formatDuration(startOffset)}, duration ${formatDuration(duration)}`;
+}
+function formatDuration(ms) {
+  if (!Number.isFinite(ms) || ms <= 0) return "0 ms";
+  if (ms < 1e3) return `${Math.round(ms)} ms`;
+  const seconds = ms / 1e3;
+  const precision = seconds < 10 ? 2 : 1;
+  return `${seconds.toFixed(precision).replace(/\.?0+$/, "")} s`;
+}
+
+// src/components/WebhookEventViewer.tsx
+import { Badge as Badge3, EmptyState as EmptyState4 } from "@echothink-ui/core";
+import { DataTable as DataTable3 } from "@echothink-ui/data";
+import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
+function WebhookEventViewer({
+  events,
+  onRetry,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const failedCount = events.filter(
+    (event) => webhookStatusTone(event.status) === "danger"
+  ).length;
+  const retryCount = events.reduce((total, event) => total + event.retries, 0);
+  const columns = [
+    {
+      key: "id",
+      header: "Event",
+      width: "16rem",
+      render: (row) => /* @__PURE__ */ jsxs16("span", { className: "eth-dev-webhook-event-viewer__event", children: [
+        /* @__PURE__ */ jsx17("code", { title: row.id, children: row.id }),
+        /* @__PURE__ */ jsx17("span", { children: payloadEventLabel(row.payload) })
+      ] })
+    },
+    {
+      key: "url",
+      header: "Endpoint",
+      render: (row) => /* @__PURE__ */ jsx17("code", { className: "eth-dev-webhook-event-viewer__url", title: row.url, children: row.url })
+    },
+    {
+      key: "status",
+      header: "Status",
+      width: "9rem",
+      render: (row) => /* @__PURE__ */ jsx17(Badge3, { severity: webhookStatusTone(row.status), children: formatWebhookStatus(row.status) })
+    },
+    {
+      key: "retries",
+      header: "Retries",
+      align: "end",
+      width: "6.5rem",
+      render: (row) => /* @__PURE__ */ jsx17("span", { className: "eth-dev-webhook-event-viewer__count", children: row.retries })
+    },
+    {
+      key: "deliveredAt",
+      header: "Delivered",
+      width: "10rem",
+      render: (row) => row.deliveredAt ? /* @__PURE__ */ jsx17("time", { className: "eth-dev-webhook-event-viewer__time", children: row.deliveredAt }) : /* @__PURE__ */ jsx17("span", { className: "eth-dev-webhook-event-viewer__missing", children: "Not delivered" })
+    }
+  ];
+  return /* @__PURE__ */ jsxs16(
+    "section",
+    {
+      ...props,
+      "aria-label": ariaLabel ?? "Webhook deliveries",
+      className: `eth-dev-webhook-event-viewer ${className ?? ""}`.trim(),
+      "data-eth-component": "WebhookEventViewer",
+      children: [
+        /* @__PURE__ */ jsxs16("header", { className: "eth-dev-webhook-event-viewer__header", children: [
+          /* @__PURE__ */ jsxs16("div", { className: "eth-dev-webhook-event-viewer__heading", children: [
+            /* @__PURE__ */ jsx17("p", { children: "Webhook events" }),
+            /* @__PURE__ */ jsx17("h3", { children: "Webhook deliveries" })
+          ] }),
+          /* @__PURE__ */ jsxs16(
+            "dl",
+            {
+              className: "eth-dev-webhook-event-viewer__summary",
+              "aria-label": "Webhook delivery summary",
+              children: [
+                /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx17("dt", { children: "Events" }),
+                  /* @__PURE__ */ jsx17("dd", { children: pluralize(events.length, "event") })
+                ] }),
+                /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx17("dt", { children: "Failed" }),
+                  /* @__PURE__ */ jsx17("dd", { children: pluralize(failedCount, "failed", "failed") })
+                ] }),
+                /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx17("dt", { children: "Retries" }),
+                  /* @__PURE__ */ jsx17("dd", { children: pluralize(retryCount, "retry", "retries") })
+                ] })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx17(
+          DataTable3,
+          {
+            rows: events,
+            columns,
+            rowKey: "id",
+            density: "compact",
+            className: "eth-dev-webhook-event-viewer__table",
+            "aria-label": "Webhook delivery events",
+            rowActions: onRetry ? (row) => isRetryableWebhookStatus(row.status) ? [
+              {
+                id: `retry-${row.id}`,
+                label: "Retry",
+                onSelect: () => onRetry(row.id)
+              }
+            ] : [] : void 0,
+            emptyState: /* @__PURE__ */ jsx17(
+              EmptyState4,
+              {
+                title: "No webhook events",
+                description: "Delivery attempts and retry outcomes will appear here when webhooks fire."
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function webhookStatusTone(status) {
+  const token = normalizeWebhookStatus(status);
+  if (["delivered", "success", "succeeded", "completed", "ok"].includes(token)) {
+    return "success";
+  }
+  if (isRetryableWebhookStatus(token)) return "danger";
+  if (["retrying", "queued", "pending", "running", "in-progress"].includes(token)) {
+    return "info";
+  }
+  if (["warning", "throttled", "rate-limited"].includes(token)) {
+    return "warning";
+  }
+  return "neutral";
+}
+function isRetryableWebhookStatus(status) {
+  return ["failed", "error", "timeout", "timed-out", "undelivered"].includes(
+    normalizeWebhookStatus(status)
+  );
+}
+function normalizeWebhookStatus(status) {
+  return status.trim().toLowerCase().replace(/_/g, "-");
+}
+function formatWebhookStatus(status) {
+  const normalized = normalizeWebhookStatus(status);
+  if (!normalized) return "Unknown";
+  if (normalized === "ok") return "OK";
+  return normalized.split("-").filter(Boolean).map((part) => part[0].toUpperCase() + part.slice(1)).join(" ");
+}
+function payloadEventLabel(payload) {
+  if (payload && typeof payload === "object") {
+    const record = payload;
+    const eventName = record.event ?? record.type ?? record.name;
+    if (typeof eventName === "string" && eventName.trim()) return eventName;
+  }
+  return "Webhook event";
+}
+function pluralize(count, singular, plural = `${singular}s`) {
+  return `${count} ${count === 1 ? singular : plural}`;
+}
+
+// src/components/YAMLViewer.tsx
+import * as React12 from "react";
+import { Checkmark as Checkmark3, Copy as Copy2 } from "@carbon/icons-react";
+import { IconButton as IconButton2 } from "@echothink-ui/core";
+import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
+function countYamlEntries(lines) {
+  return lines.filter(
+    (line) => /^\s*(?:-\s+)?[\w.-]+\s*:/.test(line) || /^\s*-\s+\S/.test(line)
+  ).length;
+}
+function getScalarClass(value) {
+  if (/^["'].*["']$/.test(value)) return "string";
+  if (/^(?:true|false)$/i.test(value)) return "boolean";
+  if (/^(?:null|~)$/i.test(value)) return "null";
+  if (/^-?\d+(?:\.\d+)?$/.test(value)) return "number";
+  return "plain";
+}
+function renderScalar(value) {
+  if (!value) return null;
+  const commentIndex = value.search(/(^|\s)#/);
+  const scalar = commentIndex >= 0 ? value.slice(0, commentIndex) : value;
+  const comment = commentIndex >= 0 ? value.slice(commentIndex) : "";
+  const scalarClass = getScalarClass(scalar.trim());
+  return /* @__PURE__ */ jsxs17(Fragment2, { children: [
+    scalar ? /* @__PURE__ */ jsx18(
+      "span",
+      {
+        className: `eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--${scalarClass}`,
+        children: scalar
+      }
+    ) : null,
+    comment ? /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--comment", children: comment }) : null
+  ] });
+}
+function renderYamlLine(line) {
+  if (!line.trim()) return line;
+  if (/^\s*#/.test(line)) {
+    return /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--comment", children: line });
+  }
+  const keyMatch = line.match(/^(\s*)(-\s+)?([\w.-]+)(\s*:)(.*)$/);
+  if (keyMatch) {
+    const [, indent, listMarker = "", key, separator, rest] = keyMatch;
+    return /* @__PURE__ */ jsxs17(Fragment2, { children: [
+      indent,
+      listMarker ? /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--marker", children: listMarker }) : null,
+      /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--key", children: key }),
+      /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--punctuation", children: separator }),
+      renderScalar(rest)
+    ] });
+  }
+  const listMatch = line.match(/^(\s*)(-\s+)(.*)$/);
+  if (listMatch) {
+    const [, indent, marker, rest] = listMatch;
+    return /* @__PURE__ */ jsxs17(Fragment2, { children: [
+      indent,
+      /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__token eth-dev-yaml-viewer__token--marker", children: marker }),
+      renderScalar(rest)
+    ] });
+  }
+  return renderScalar(line) ?? line;
+}
+function YAMLViewer({
+  value,
+  editable = false,
+  onChange,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [copied, setCopied] = React12.useState(false);
+  const resetTimer = React12.useRef(void 0);
+  const lines = splitLines(value);
+  const lineCount = lines.length;
+  const entryCount = countYamlEntries(lines);
+  const modeLabel = editable ? "Editable" : "Read-only";
+  const viewerLabel = ariaLabel ?? (editable ? "YAML editor" : "YAML document");
+  React12.useEffect(() => {
+    return () => {
+      if (resetTimer.current !== void 0 && typeof window !== "undefined") {
+        window.clearTimeout(resetTimer.current);
+      }
+    };
+  }, []);
+  const copy = React12.useCallback(() => {
+    if (typeof navigator === "undefined" || !navigator.clipboard) return;
+    void navigator.clipboard.writeText(value).then(() => {
+      if (typeof window !== "undefined") {
+        setCopied(true);
+        if (resetTimer.current !== void 0) {
+          window.clearTimeout(resetTimer.current);
+        }
+        resetTimer.current = window.setTimeout(() => setCopied(false), 1200);
+      }
+    }).catch(() => {
+      setCopied(false);
+    });
+  }, [value]);
+  return /* @__PURE__ */ jsxs17(
+    "section",
+    {
+      ...props,
+      "aria-label": viewerLabel,
+      className: `eth-dev-yaml-viewer ${className ?? ""}`.trim(),
+      "data-eth-component": "YAMLViewer",
+      "data-editable": editable ? "true" : void 0,
+      children: [
+        /* @__PURE__ */ jsxs17("header", { className: "eth-dev-yaml-viewer__header", children: [
+          /* @__PURE__ */ jsxs17("div", { className: "eth-dev-yaml-viewer__heading", children: [
+            /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__eyebrow", children: "YAML" }),
+            /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__title", children: editable ? "YAML editor" : "YAML document" })
+          ] }),
+          /* @__PURE__ */ jsxs17(
+            "div",
+            {
+              className: "eth-dev-yaml-viewer__meta",
+              role: "group",
+              "aria-label": "YAML document metadata",
+              children: [
+                /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__badge", children: modeLabel }),
+                /* @__PURE__ */ jsxs17("span", { className: "eth-dev-yaml-viewer__badge", children: [
+                  lineCount,
+                  " ",
+                  lineCount === 1 ? "line" : "lines"
+                ] }),
+                /* @__PURE__ */ jsxs17("span", { className: "eth-dev-yaml-viewer__badge", children: [
+                  entryCount,
+                  " ",
+                  entryCount === 1 ? "entry" : "entries"
+                ] }),
+                /* @__PURE__ */ jsx18(
+                  IconButton2,
+                  {
+                    className: "eth-dev-yaml-viewer__copy-button",
+                    label: copied ? "Copied YAML" : "Copy YAML",
+                    intent: "ghost",
+                    density: "compact",
+                    icon: copied ? /* @__PURE__ */ jsx18(Checkmark3, { size: 16 }) : /* @__PURE__ */ jsx18(Copy2, { size: 16 }),
+                    onClick: copy
+                  }
+                ),
+                /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__copy-status", "aria-live": "polite", children: copied ? "YAML copied" : "" })
+              ]
+            }
+          )
+        ] }),
+        editable ? /* @__PURE__ */ jsx18(
+          CodeEditor,
+          {
+            value,
+            onChange,
+            language: "yaml",
+            className: "eth-dev-yaml-viewer__editor",
+            "aria-label": viewerLabel
+          }
+        ) : /* @__PURE__ */ jsx18("pre", { className: "eth-dev-yaml-viewer__pre", "aria-label": viewerLabel, tabIndex: 0, children: /* @__PURE__ */ jsx18("code", { className: "eth-dev-yaml-viewer__code", children: lines.map((line, index) => /* @__PURE__ */ jsxs17("span", { className: "eth-dev-yaml-viewer__line", children: [
+          /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__gutter", "aria-hidden": "true", children: index + 1 }),
+          /* @__PURE__ */ jsx18("span", { className: "eth-dev-yaml-viewer__line-code", children: renderYamlLine(line) })
+        ] }, index)) }) })
+      ]
+    }
+  );
+}
+
+// src/index.tsx
+var DeveloperComponentNames = [
+  "CodeBlock",
+  "CodeEditor",
+  "DiffTable",
+  "DiffViewer",
+  "JSONViewer",
+  "YAMLViewer",
+  "SchemaViewer",
+  "APIExplorer",
+  "EventPayloadViewer",
+  "LogConsole",
+  "TerminalPanel",
+  "TraceTimeline",
+  "RequestResponseViewer",
+  "WebhookEventViewer",
+  "GitRepositoryPanel",
+  "PullRequestPanel",
+  "CommitList",
+  "BranchSelector"
+];
+export {
+  APIExplorer,
+  BranchSelector,
+  CodeBlock,
+  CodeEditor,
+  CommitList,
+  DeveloperComponentNames,
+  DiffTable,
+  DiffViewer,
+  EventPayloadViewer,
+  GitRepositoryPanel,
+  JSONViewer,
+  LogConsole,
+  PullRequestPanel,
+  RequestResponseViewer,
+  SchemaViewer,
+  TerminalPanel,
+  TraceTimeline,
+  WebhookEventViewer,
+  YAMLViewer
+};
+//# sourceMappingURL=index.js.map