@xenosystem/blocks 0.13.17 → 0.13.19

package/dist/ops/index.js

@@ -8,7 +8,7 @@ import {
 } from "../chunk-WE6A2DTY.js";
 import {
   ICONS
-} from "../chunk-PI5WOATA.js";
+} from "../chunk-7S2RKUAM.js";
 import "../chunk-2KG3PWR4.js";
 
 // src/ops/console/panel.ts
@@ -60,10 +60,10 @@ function spliceRedactedAppend(existing, addition, redact, carry = REDACTION_CARR
   const tail = existing.slice(cut);
   return head + redact(tail + addition);
 }
-function truncateLogMessage(text3, max) {
-  if (max <= 0 || text3.length <= max) return text3;
-  if (max <= MESSAGE_ELISION.length) return text3.slice(text3.length - max);
-  return MESSAGE_ELISION + text3.slice(text3.length - (max - MESSAGE_ELISION.length));
+function truncateLogMessage(text4, max) {
+  if (max <= 0 || text4.length <= max) return text4;
+  if (max <= MESSAGE_ELISION.length) return text4.slice(text4.length - max);
+  return MESSAGE_ELISION + text4.slice(text4.length - (max - MESSAGE_ELISION.length));
 }
 function formatRecord(record) {
   const time = new Date(record.ts).toISOString();
@@ -240,7 +240,7 @@ var ConsoleController = class {
    */
   merge(existing, patch) {
     const secrets = [...this.host.getSecrets?.() ?? []];
-    const redact = (text3) => redactForLog(text3, secrets);
+    const redact = (text4) => redactForLog(text4, secrets);
     let message = existing.message;
     if (typeof patch.message === "string") message = redact(patch.message);
     if (typeof patch.appendMessage === "string" && patch.appendMessage.length > 0) {
@@ -870,24 +870,24 @@ function consoleRuntimeComponents(controller, rowHeight) {
 function ConsolePanelView({ controller, ...options }) {
   useSyncExternalStore(controller.subscribe, controller.getState, controller.getState);
   const view = consoleViewState(controller, options);
-  const ui3 = (intent) => applyConsoleUi(controller, intent);
+  const ui4 = (intent) => applyConsoleUi(controller, intent);
   return /* @__PURE__ */ jsxs(Column, { children: [
     /* @__PURE__ */ jsx(
       Toolbar,
       {
         left: /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(SearchField, { value: view.search, placeholder: "Filter\u2026", onChange: (value) => ui3({ kind: "search", value }) }),
-          /* @__PURE__ */ jsx(SegmentedControl, { size: "sm", label: "Minimum level", options: view.levels, value: view.level, onChange: (level) => ui3({ kind: "level", level }) })
+          /* @__PURE__ */ jsx(SearchField, { value: view.search, placeholder: "Filter\u2026", onChange: (value) => ui4({ kind: "search", value }) }),
+          /* @__PURE__ */ jsx(SegmentedControl, { size: "sm", label: "Minimum level", options: view.levels, value: view.level, onChange: (level) => ui4({ kind: "level", level }) })
         ] }),
         right: /* @__PURE__ */ jsxs(ToolbarGroup, { end: true, children: [
           view.errors ? /* @__PURE__ */ jsx(Badge, { tone: "error", children: view.errors }) : null,
           view.warns ? /* @__PURE__ */ jsx(Badge, { tone: "warning", children: view.warns }) : null,
-          /* @__PURE__ */ jsx(IconButton, { icon: /* @__PURE__ */ jsx(CopyGlyph, {}), label: "Copy visible", onClick: () => ui3({ kind: "copyVisible" }) }),
-          /* @__PURE__ */ jsx(IconButton, { icon: /* @__PURE__ */ jsx(ClearGlyph, {}), label: "Clear", onClick: () => ui3({ kind: "clear" }) })
+          /* @__PURE__ */ jsx(IconButton, { icon: /* @__PURE__ */ jsx(CopyGlyph, {}), label: "Copy visible", onClick: () => ui4({ kind: "copyVisible" }) }),
+          /* @__PURE__ */ jsx(IconButton, { icon: /* @__PURE__ */ jsx(ClearGlyph, {}), label: "Clear", onClick: () => ui4({ kind: "clear" }) })
         ] })
       }
     ),
-    view.multiSource ? /* @__PURE__ */ jsx(Stack, { direction: "row", gap: 4, pad: "inset", children: view.sources.map((source) => /* @__PURE__ */ jsx(FilterChip, { on: source.on, title: source.title, onChange: (on) => ui3({ kind: "source", id: source.id, on }), children: source.label }, source.id)) }) : null,
+    view.multiSource ? /* @__PURE__ */ jsx(Stack, { direction: "row", gap: 4, pad: "inset", children: view.sources.map((source) => /* @__PURE__ */ jsx(FilterChip, { on: source.on, title: source.title, onChange: (on) => ui4({ kind: "source", id: source.id, on }), children: source.label }, source.id)) }) : null,
     view.empty ? /* @__PURE__ */ jsx(EmptyState, { title: view.emptyTitle, hint: view.emptyHint }) : null,
     view.listed ? /* @__PURE__ */ jsx(ConsoleScroller, { controller, rowHeight: view.rowHeight, children: /* @__PURE__ */ jsx(VirtualWindow, { totalHeight: view.totalHeight, offsetTop: view.offsetTop, children: /* @__PURE__ */ jsx(RowList, { role: "log", children: view.rows.map((row) => /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
@@ -902,8 +902,8 @@ function ConsolePanelView({ controller, ...options }) {
             /* @__PURE__ */ jsx(Text, { children: row.message })
           ] }),
           trailing: row.repeat ? /* @__PURE__ */ jsx(Badge, { title: "Repeated consecutively", children: row.repeat }) : null,
-          onClick: () => ui3({ kind: "row", id: row.id }),
-          onContextMenuAt: (x, y) => ui3({ kind: "contextMenu", id: row.id, x, y })
+          onClick: () => ui4({ kind: "row", id: row.id }),
+          onContextMenuAt: (x, y) => ui4({ kind: "contextMenu", id: row.id, x, y })
         },
         row.id
       ),
@@ -2085,19 +2085,19 @@ var RetryGlyph = ICONS["icons/Retry"];
 function RunsPanelView({ controller, ...options }) {
   useSyncExternalStore2(controller.subscribe, controller.getState, controller.getState);
   const view = runsViewState(controller, options);
-  const ui3 = (intent) => applyRunsUi(controller, intent);
+  const ui4 = (intent) => applyRunsUi(controller, intent);
   const chip2 = (c, onChange) => /* @__PURE__ */ jsx2(FilterChip2, { on: c.on, title: c.title, onChange, children: /* @__PURE__ */ jsx2(Badge2, { tone: c.tone, children: c.label }) }, c.id);
   return /* @__PURE__ */ jsxs2(Column2, { children: [
     /* @__PURE__ */ jsx2(
       Toolbar2,
       {
-        left: /* @__PURE__ */ jsx2(SearchField2, { value: view.search, placeholder: "Filter runs\u2026", onChange: (value) => ui3({ kind: "search", value }) }),
-        right: /* @__PURE__ */ jsx2(ToolbarGroup2, { end: true, children: /* @__PURE__ */ jsx2(TextButton, { onClick: () => ui3({ kind: "clearTerminal" }), children: "Clear finished" }) })
+        left: /* @__PURE__ */ jsx2(SearchField2, { value: view.search, placeholder: "Filter runs\u2026", onChange: (value) => ui4({ kind: "search", value }) }),
+        right: /* @__PURE__ */ jsx2(ToolbarGroup2, { end: true, children: /* @__PURE__ */ jsx2(TextButton, { onClick: () => ui4({ kind: "clearTerminal" }), children: "Clear finished" }) })
       }
     ),
     view.hasChips ? /* @__PURE__ */ jsxs2(Stack2, { direction: "row", gap: 4, pad: "inset", children: [
-      view.statuses.map((c) => chip2(c, (on) => ui3({ kind: "status", status: c.id, on }))),
-      view.sources.map((c) => chip2(c, (on) => ui3({ kind: "source", id: c.id, on })))
+      view.statuses.map((c) => chip2(c, (on) => ui4({ kind: "status", status: c.id, on }))),
+      view.sources.map((c) => chip2(c, (on) => ui4({ kind: "source", id: c.id, on })))
     ] }) : null,
     view.empty ? /* @__PURE__ */ jsx2(EmptyState2, { title: view.emptyTitle, hint: view.emptyHint }) : null,
     view.listed ? /* @__PURE__ */ jsx2(ScrollArea2, { children: /* @__PURE__ */ jsx2(RowList2, { children: view.rows.map((row) => /* @__PURE__ */ jsxs2(Fragment2, { children: [
@@ -2119,11 +2119,11 @@ function RunsPanelView({ controller, ...options }) {
             row.duration ? /* @__PURE__ */ jsx2(Text2, { role: "number", children: row.duration }) : null
           ] }),
           trailing: /* @__PURE__ */ jsxs2(Fragment2, { children: [
-            row.canCancel ? /* @__PURE__ */ jsx2(IconButton2, { size: "sm", icon: /* @__PURE__ */ jsx2(CancelGlyph, {}), label: row.cancelLabel, onClick: () => ui3({ kind: "cancel", runId: row.runId }) }) : null,
-            row.canRetry ? /* @__PURE__ */ jsx2(IconButton2, { size: "sm", icon: /* @__PURE__ */ jsx2(RetryGlyph, {}), label: row.retryLabel, onClick: () => ui3({ kind: "retry", runId: row.runId }) }) : null
+            row.canCancel ? /* @__PURE__ */ jsx2(IconButton2, { size: "sm", icon: /* @__PURE__ */ jsx2(CancelGlyph, {}), label: row.cancelLabel, onClick: () => ui4({ kind: "cancel", runId: row.runId }) }) : null,
+            row.canRetry ? /* @__PURE__ */ jsx2(IconButton2, { size: "sm", icon: /* @__PURE__ */ jsx2(RetryGlyph, {}), label: row.retryLabel, onClick: () => ui4({ kind: "retry", runId: row.runId }) }) : null
           ] }),
-          onClick: () => ui3({ kind: "row", runId: row.runId, stepPath: row.stepPath }),
-          onContextMenuAt: (x, y) => ui3({ kind: "contextMenu", runId: row.runId, x, y })
+          onClick: () => ui4({ kind: "row", runId: row.runId, stepPath: row.stepPath }),
+          onContextMenuAt: (x, y) => ui4({ kind: "contextMenu", runId: row.runId, x, y })
         },
         row.key
       ),
@@ -3433,291 +3433,361 @@ var diffManifest = {
 import { useSyncExternalStore as useSyncExternalStore4 } from "react";
 import {
   Badge as Badge4,
+  Column as Column3,
+  DiffLine,
+  DiffSplitRow,
   EmptyState as EmptyState4,
+  Hunk,
+  Note as Note2,
   ScrollArea as ScrollArea3,
+  Section,
   SegmentedControl as SegmentedControl2,
   StatusBar as StatusBar4,
+  Text as Text3,
   TextButton as TextButton3,
   Toolbar as Toolbar4,
   ToolbarGroup as ToolbarGroup4
 } from "@xenosystem/components/chrome";
-import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var MARK = {
-  added: { background: "var(--xeno-hover)" },
-  removed: { background: "var(--xeno-border-subtle)" },
-  context: {}
-};
-var SIGIL = { added: "+", removed: "-", context: " " };
-function visible(text3, show) {
-  return show ? text3.replace(/\t/g, "\u2192   ").replace(/ /g, "\xB7") : text3;
-}
-function LineText({
-  line,
-  language,
-  highlighter,
-  showWhitespace
-}) {
+
+// src/ops/diff/declaration.ts
+var visible = (text4, show) => show ? text4.replace(/\t/g, "\u2192   ").replace(/ /g, "\xB7") : text4;
+var runsOf = (line, language, highlighter, showWhitespace) => {
   if (line.segments?.length) {
-    return /* @__PURE__ */ jsx4(Fragment3, { children: line.segments.map((segment, i) => /* @__PURE__ */ jsx4(
-      "span",
-      {
-        style: segment.kind === "equal" ? void 0 : {
-          background: "var(--xeno-border)",
-          borderRadius: 2,
-          textDecoration: segment.kind === "delete" ? "line-through" : void 0
-        },
-        children: visible(segment.text, showWhitespace)
-      },
-      i
-    )) });
+    return line.segments.map((s) => s.kind === "equal" ? { text: visible(s.text, showWhitespace) } : { text: visible(s.text, showWhitespace), mark: s.kind });
   }
   const tokens = highlighter?.highlight(line.text, language) ?? null;
-  if (tokens) {
-    return /* @__PURE__ */ jsx4(Fragment3, { children: tokens.map((token, i) => /* @__PURE__ */ jsx4("span", { className: token.token ? `xeno-tok-${token.token}` : void 0, children: visible(token.text, showWhitespace) }, i)) });
-  }
-  return /* @__PURE__ */ jsx4(Fragment3, { children: visible(line.text, showWhitespace) });
-}
-var GUTTER = {
-  display: "inline-block",
-  width: 40,
-  textAlign: "right",
-  paddingRight: 6,
-  opacity: 0.35,
-  fontVariantNumeric: "tabular-nums",
-  userSelect: "none"
+  if (tokens) return tokens.map((t) => t.token ? { text: visible(t.text, showWhitespace), token: t.token } : { text: visible(t.text, showWhitespace) });
+  return [{ text: visible(line.text, showWhitespace) }];
 };
-function DecisionChip({ decision }) {
-  if (!decision) return null;
-  if (decision.state === "pending") return /* @__PURE__ */ jsx4(Badge4, { children: "deciding\u2026" });
-  if (decision.state === "conflict") {
-    return /* @__PURE__ */ jsx4(Badge4, { tone: "error", title: decision.message ?? "The file changed since this was reviewed.", children: "conflict \u2014 re-review" });
-  }
-  if (decision.state === "failed") {
-    return /* @__PURE__ */ jsx4(Badge4, { tone: "error", title: decision.message ?? void 0, children: "failed" });
-  }
-  if (isSettled(decision.state)) {
-    return /* @__PURE__ */ jsx4(Badge4, { tone: "success", children: decision.action === "accept" ? "accepted" : "rejected" });
-  }
-  return null;
+var SIGIL = { added: "+", removed: "-", context: " " };
+function diffViewState(c, options = {}) {
+  const { highlighter, review = false } = options;
+  const state = c.getState();
+  const idle = state.status === "idle";
+  const computing = state.status === "computing";
+  const failed = state.status === "failed";
+  const identical = !idle && !computing && !failed && state.identical;
+  const active = !idle && !computing && !failed && !identical;
+  const unified = state.view === "unified";
+  const cell = (line, side, language, key) => line ? { key, kind: line.kind, gutter: [(side === "l" ? line.oldLineNumber : line.newLineNumber) ?? ""], runs: runsOf(line, language, highlighter, state.showWhitespace) } : { key, kind: "blank", gutter: [""], runs: [] };
+  const files = active ? state.files.map((f) => ({
+    key: f.file.path,
+    path: f.file.path,
+    title: f.file.oldPath && f.file.oldPath !== f.file.path ? `${f.file.oldPath} \u2192 ${f.file.path}` : f.file.path,
+    status: f.file.status,
+    counts: `+${f.additions} \u2212${f.deletions}`,
+    collapsed: f.collapsed,
+    omitted: !f.collapsed && f.file.omitted !== void 0,
+    omission: f.file.omitted ? omissionLabel(f.file.omitted) : "",
+    hunks: f.collapsed || f.file.omitted ? [] : f.file.hunks.map((h) => {
+      const decision = f.decisions[h.id];
+      const ds = decision?.state ?? "undecided";
+      const attention = needsAttention(ds);
+      return {
+        key: h.id,
+        path: f.file.path,
+        id: h.id,
+        header: h.header ?? `@@ -${h.oldStart},${h.oldLines} +${h.newStart},${h.newLines} @@`,
+        focused: state.cursor?.path === f.file.path && state.cursor.hunkId === h.id,
+        settled: isSettled(ds),
+        chipPending: ds === "pending",
+        chipConflict: ds === "conflict",
+        conflictTitle: decision?.message ?? "The file changed since this was reviewed.",
+        chipFailed: ds === "failed",
+        failedTitle: decision?.message ?? void 0,
+        chipApplied: isSettled(ds),
+        appliedText: decision?.action === "accept" ? "accepted" : "rejected",
+        review,
+        attention,
+        deciding: ds === "pending",
+        unified,
+        split: !unified,
+        lines: unified ? h.lines.map((line, i) => ({
+          key: `${h.id}-${i}`,
+          kind: line.kind,
+          gutter: [line.oldLineNumber ?? "", line.newLineNumber ?? ""],
+          sigil: SIGIL[line.kind],
+          runs: runsOf(line, f.file.language, highlighter, state.showWhitespace)
+        })) : [],
+        rows: unified ? [] : splitRows(h).map((row, i) => ({
+          key: `${h.id}-s${i}`,
+          left: cell(row.left, "l", f.file.language, `${h.id}-s${i}-l`),
+          right: cell(row.right, "r", f.file.language, `${h.id}-s${i}-r`)
+        }))
+      };
+    })
+  })) : [];
+  const conflicts = state.review?.conflicts ?? 0;
+  return {
+    idle,
+    computing,
+    failed,
+    // NOT "no changes". A comparison that could not run has established nothing about the content.
+    failedHint: state.message ?? "The host could not compute the differences.",
+    identical,
+    active,
+    view: state.view,
+    views: [{ label: "Unified", value: "unified" }, { label: "Split", value: "split" }],
+    wrap: state.wrap,
+    wrapLabel: state.wrap ? "No wrap" : "Wrap",
+    whitespaceLabel: state.showWhitespace ? "Hide \u2423" : "Show \u2423",
+    conflictNotice: conflicts > 0 ? `${conflicts} conflict${conflicts === 1 ? "" : "s"} \u2014 the file changed since review` : void 0,
+    files,
+    countLabel: `${state.totals.files} file${state.totals.files === 1 ? "" : "s"} \xB7 +${state.totals.additions} \u2212${state.totals.deletions}`,
+    rightLabel: state.review ? `${state.review.decided}/${state.review.total} reviewed` : `${state.oldLabel} \u2192 ${state.newLabel}`
+  };
 }
-function DiffPanelView({ controller, highlighter, review = false }) {
-  const state = useSyncExternalStore4(controller.subscribe, controller.getState, controller.getState);
-  if (state.status === "idle") {
-    return /* @__PURE__ */ jsx4(EmptyState4, { title: "Diff", hint: "Nothing to compare yet." });
-  }
-  if (state.status === "computing") {
-    return /* @__PURE__ */ jsx4(EmptyState4, { title: "Comparing\u2026", hint: "The host is computing the differences." });
-  }
-  if (state.status === "failed") {
-    return /* @__PURE__ */ jsx4(
-      EmptyState4,
-      {
-        title: "Comparison failed",
-        hint: state.message ?? "The host could not compute the differences."
-      }
-    );
-  }
-  if (state.identical) {
-    return /* @__PURE__ */ jsx4(EmptyState4, { title: "No changes", hint: "The two sides are identical." });
+function applyDiffUi(c, intent) {
+  switch (intent.kind) {
+    case "view":
+      c.setView(intent.view);
+      break;
+    case "toggleWrap":
+      c.setWrap(!c.getState().wrap);
+      break;
+    case "toggleWhitespace":
+      c.setShowWhitespace(!c.getState().showWhitespace);
+      break;
+    case "prev":
+      c.previousHunk();
+      break;
+    case "next":
+      c.nextHunk();
+      break;
+    case "collapse":
+      c.setCollapsed(intent.path, intent.collapsed);
+      break;
+    case "contextMenu":
+      c.requestContextMenu(intent.path, intent.id, intent.x, intent.y);
+      break;
+    case "decide":
+      c.decide(intent.path, intent.id, intent.action);
+      break;
+    case "reReview":
+      c.clearDecision(intent.path, intent.id);
+      break;
   }
-  const mono = "var(--xeno-font-mono)";
-  const renderLine = (line, file, key) => /* @__PURE__ */ jsxs4(
-    "div",
-    {
-      style: {
-        ...MARK[line.kind],
-        whiteSpace: state.wrap ? "pre-wrap" : "pre",
-        fontFamily: mono,
-        fontSize: 11,
-        lineHeight: "16px"
-      },
-      children: [
-        /* @__PURE__ */ jsx4("span", { style: GUTTER, children: line.oldLineNumber ?? "" }),
-        /* @__PURE__ */ jsx4("span", { style: GUTTER, children: line.newLineNumber ?? "" }),
-        /* @__PURE__ */ jsxs4("span", { style: { opacity: 0.45, userSelect: "none" }, children: [
-          SIGIL[line.kind],
-          " "
-        ] }),
-        /* @__PURE__ */ jsx4(
-          LineText,
-          {
-            line,
-            language: file.file.language,
-            highlighter,
-            showWhitespace: state.showWhitespace
-          }
-        )
-      ]
-    },
-    key
-  );
-  const renderSplitCell = (line, file, side) => /* @__PURE__ */ jsxs4(
-    "div",
-    {
-      style: {
-        flex: 1,
-        minWidth: 0,
-        ...line ? MARK[line.kind] : { opacity: 0.25 },
-        whiteSpace: state.wrap ? "pre-wrap" : "pre",
-        overflow: "hidden",
-        fontFamily: mono,
-        fontSize: 11,
-        lineHeight: "16px"
-      },
-      children: [
-        /* @__PURE__ */ jsx4("span", { style: GUTTER, children: (side === "l" ? line?.oldLineNumber : line?.newLineNumber) ?? "" }),
-        line ? /* @__PURE__ */ jsx4(
-          LineText,
-          {
-            line,
-            language: file.file.language,
-            highlighter,
-            showWhitespace: state.showWhitespace
-          }
-        ) : null
-      ]
-    }
-  );
-  return /* @__PURE__ */ jsxs4("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-    /* @__PURE__ */ jsx4(
-      Toolbar4,
+}
+var diffViewManifest = {
+  id: diffManifest.id,
+  version: "1.0.0",
+  title: "Diff",
+  category: "ops",
+  layout: { slot: "center" },
+  inputs: [{ id: "view", type: "object", label: "View state", description: "The DiffViewModel the runtime derives from the controller on every draw." }],
+  outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind, view?, path?, id?, collapsed?, action?, x?, y? } \u2014 applied by the runtime to the controller." }],
+  commands: []
+};
+var EMPTY4 = {
+  idle: true,
+  computing: false,
+  failed: false,
+  failedHint: "",
+  identical: false,
+  active: false,
+  view: "unified",
+  views: [{ label: "Unified", value: "unified" }, { label: "Split", value: "split" }],
+  wrap: false,
+  wrapLabel: "Wrap",
+  whitespaceLabel: "Show \u2423",
+  files: [],
+  countLabel: "0 files \xB7 +0 \u22120",
+  rightLabel: ""
+};
+var BEHAVIOURS3 = {
+  "ops/diffPanelView": (inputs) => inputs.view ?? EMPTY4
+};
+var text3 = (b) => ({ component: "text", props: { text: b } });
+var ui3 = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+var LINE = (kindKey) => ({
+  component: "chrome/DiffLine",
+  each: { item: kindKey, key: "key" },
+  props: { kind: { item: "kind" }, gutter: { item: "gutter" }, sigil: { item: "sigil" }, wrap: { input: "view.wrap" }, runs: { item: "runs" } }
+});
+var DIFF_DECLARATION = {
+  format: "xeno.block@1",
+  manifest: diffViewManifest,
+  behaviour: "ops/diffPanelView",
+  composition: {
+    component: "fragment",
+    children: [
+      { component: "chrome/EmptyState", when: { input: "view.idle" }, props: { title: { value: "Diff" }, hint: { value: "Nothing to compare yet." } } },
+      { component: "chrome/EmptyState", when: { input: "view.computing" }, props: { title: { value: "Comparing\u2026" }, hint: { value: "The host is computing the differences." } } },
+      { component: "chrome/EmptyState", when: { input: "view.failed" }, props: { title: { value: "Comparison failed" }, hint: { input: "view.failedHint" } } },
+      { component: "chrome/EmptyState", when: { input: "view.identical" }, props: { title: { value: "No changes" }, hint: { value: "The two sides are identical." } } },
       {
-        left: /* @__PURE__ */ jsx4(
-          SegmentedControl2,
+        component: "chrome/Column",
+        when: { input: "view.active" },
+        children: [
           {
-            label: "View",
-            value: state.view,
-            onChange: (value) => controller.setView(value),
-            options: [
-              { label: "Unified", value: "unified" },
-              { label: "Split", value: "split" }
-            ]
-          }
-        ),
-        right: /* @__PURE__ */ jsxs4(ToolbarGroup4, { end: true, children: [
-          /* @__PURE__ */ jsx4(TextButton3, { onClick: () => controller.setWrap(!state.wrap), children: state.wrap ? "No wrap" : "Wrap" }),
-          /* @__PURE__ */ jsx4(TextButton3, { onClick: () => controller.setShowWhitespace(!state.showWhitespace), children: state.showWhitespace ? "Hide \u2423" : "Show \u2423" }),
-          /* @__PURE__ */ jsx4(TextButton3, { onClick: () => controller.previousHunk(), children: "Prev" }),
-          /* @__PURE__ */ jsx4(TextButton3, { onClick: () => controller.nextHunk(), children: "Next" })
-        ] })
-      }
-    ),
-    state.review && state.review.conflicts > 0 ? /* @__PURE__ */ jsx4("div", { style: { padding: "2px 8px", fontSize: 9 }, children: /* @__PURE__ */ jsxs4(Badge4, { tone: "error", children: [
-      state.review.conflicts,
-      " conflict",
-      state.review.conflicts === 1 ? "" : "s",
-      " \u2014 the file changed since review"
-    ] }) }) : null,
-    /* @__PURE__ */ jsx4(ScrollArea3, { children: state.files.map((file) => /* @__PURE__ */ jsxs4("div", { style: { borderBottom: "1px solid var(--xeno-border-subtle)" }, children: [
-      /* @__PURE__ */ jsxs4(
-        "div",
-        {
-          style: {
-            display: "flex",
-            alignItems: "center",
-            gap: 6,
-            padding: "3px 8px",
-            position: "sticky",
-            top: 0,
-            background: "var(--xeno-surface)",
-            zIndex: 1
+            component: "chrome/Toolbar",
+            props: {
+              left: { node: { component: "chrome/SegmentedControl", props: { label: { value: "View" }, value: { input: "view.view" }, options: { input: "view.views" } }, on: { onChange: ui3("view", { view: { arg: "" } }) } } },
+              right: {
+                node: {
+                  component: "chrome/ToolbarGroup",
+                  props: { end: { value: true } },
+                  children: [
+                    { component: "chrome/TextButton", children: [text3({ input: "view.wrapLabel" })], on: { onClick: ui3("toggleWrap") } },
+                    { component: "chrome/TextButton", children: [text3({ input: "view.whitespaceLabel" })], on: { onClick: ui3("toggleWhitespace") } },
+                    { component: "chrome/TextButton", children: [text3({ value: "Prev" })], on: { onClick: ui3("prev") } },
+                    { component: "chrome/TextButton", children: [text3({ value: "Next" })], on: { onClick: ui3("next") } }
+                  ]
+                }
+              }
+            }
           },
-          children: [
-            /* @__PURE__ */ jsx4(TextButton3, { onClick: () => controller.setCollapsed(file.file.path, !file.collapsed), children: file.collapsed ? "\u25B8" : "\u25BE" }),
-            /* @__PURE__ */ jsx4("span", { style: { fontSize: 11, fontWeight: 600 }, children: file.file.oldPath && file.file.oldPath !== file.file.path ? `${file.file.oldPath} \u2192 ${file.file.path}` : file.file.path }),
-            /* @__PURE__ */ jsx4(Badge4, { children: file.file.status }),
-            /* @__PURE__ */ jsxs4("span", { style: { fontSize: 10, fontVariantNumeric: "tabular-nums", opacity: 0.6 }, children: [
-              "+",
-              file.additions,
-              " \u2212",
-              file.deletions
-            ] })
-          ]
-        }
-      ),
-      file.collapsed ? null : file.file.omitted ? (
-        // 🔴 Never an empty body. "Binary — not compared" and "no changes" are different
-        // facts, and a reviewer who reads the first as the second approves something nobody
-        // looked at.
-        /* @__PURE__ */ jsx4("div", { style: { padding: "6px 12px", fontSize: 10, opacity: 0.6 }, children: omissionLabel(file.file.omitted) })
-      ) : file.file.hunks.map((hunk) => {
-        const decision = file.decisions[hunk.id];
-        const focused = state.cursor?.path === file.file.path && state.cursor.hunkId === hunk.id;
-        return /* @__PURE__ */ jsxs4(
-          "div",
+          { component: "chrome/Note", when: { input: "view.conflictNotice" }, children: [{ component: "chrome/Badge", props: { tone: { value: "error" } }, children: [text3({ input: "view.conflictNotice" })] }] },
           {
-            onContextMenu: (event) => {
-              event.preventDefault();
-              controller.requestContextMenu(
-                file.file.path,
-                hunk.id,
-                event.clientX,
-                event.clientY
-              );
-            },
-            style: {
-              borderLeft: focused ? "2px solid var(--xeno-active)" : "2px solid transparent",
-              opacity: isSettled(decision?.state ?? "undecided") ? 0.55 : 1
-            },
+            component: "chrome/ScrollArea",
             children: [
-              /* @__PURE__ */ jsxs4(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: 6,
-                    padding: "1px 8px",
-                    fontSize: 9,
-                    opacity: 0.55
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx4("span", { style: { fontFamily: mono }, children: hunk.header ?? `@@ -${hunk.oldStart},${hunk.oldLines} +${hunk.newStart},${hunk.newLines} @@` }),
-                    /* @__PURE__ */ jsx4(DecisionChip, { decision }),
-                    review ? /* @__PURE__ */ jsx4("span", { style: { marginLeft: "auto", display: "flex", gap: 4 }, children: needsAttention(decision?.state ?? "undecided") ? /* @__PURE__ */ jsx4(
-                      TextButton3,
-                      {
-                        onClick: () => controller.clearDecision(file.file.path, hunk.id),
-                        children: "Re-review"
-                      }
-                    ) : /* @__PURE__ */ jsxs4(Fragment3, { children: [
-                      /* @__PURE__ */ jsx4(
-                        TextButton3,
-                        {
-                          disabled: decision?.state === "pending",
-                          onClick: () => controller.decide(file.file.path, hunk.id, "accept"),
-                          children: "Accept"
+              {
+                component: "chrome/Section",
+                each: { input: "view.files", key: "key" },
+                props: {
+                  title: { item: "title" },
+                  badge: { node: { component: "chrome/Badge", children: [text3({ item: "status" })] } },
+                  actions: { node: { component: "chrome/Text", props: { role: { value: "number" } }, children: [text3({ item: "counts" })] } },
+                  collapsible: { value: true },
+                  collapsed: { item: "collapsed" },
+                  flush: { value: true }
+                },
+                on: { onCollapsedChange: ui3("collapse", { path: { item: "path" }, collapsed: { arg: "" } }) },
+                children: [
+                  // 🔴 Never an empty body. "Binary — not compared" and "no changes" are different facts.
+                  { component: "chrome/Text", when: { item: "omitted" }, props: { role: { value: "meta" } }, children: [text3({ item: "omission" })] },
+                  {
+                    component: "chrome/Hunk",
+                    each: { item: "hunks", key: "key" },
+                    props: {
+                      focused: { item: "focused" },
+                      settled: { item: "settled" },
+                      header: {
+                        node: {
+                          component: "fragment",
+                          children: [
+                            text3({ item: "header" }),
+                            { component: "chrome/Badge", when: { item: "chipPending" }, children: [text3({ value: "deciding\u2026" })] },
+                            { component: "chrome/Badge", when: { item: "chipConflict" }, props: { tone: { value: "error" }, title: { item: "conflictTitle" } }, children: [text3({ value: "conflict \u2014 re-review" })] },
+                            { component: "chrome/Badge", when: { item: "chipFailed" }, props: { tone: { value: "error" }, title: { item: "failedTitle" } }, children: [text3({ value: "failed" })] },
+                            { component: "chrome/Badge", when: { item: "chipApplied" }, props: { tone: { value: "success" } }, children: [text3({ item: "appliedText" })] }
+                          ]
                         }
-                      ),
-                      /* @__PURE__ */ jsx4(
-                        TextButton3,
-                        {
-                          disabled: decision?.state === "pending",
-                          onClick: () => controller.decide(file.file.path, hunk.id, "reject"),
-                          children: "Reject"
+                      },
+                      actions: {
+                        node: {
+                          component: "fragment",
+                          when: { item: "review" },
+                          children: [
+                            { component: "chrome/TextButton", when: { item: "attention" }, children: [text3({ value: "Re-review" })], on: { onClick: ui3("reReview", { path: { item: "path" }, id: { item: "id" } }) } },
+                            { component: "chrome/TextButton", when: { not: { item: "attention" } }, props: { disabled: { item: "deciding" } }, children: [text3({ value: "Accept" })], on: { onClick: ui3("decide", { path: { item: "path" }, id: { item: "id" }, action: { value: "accept" } }) } },
+                            { component: "chrome/TextButton", when: { not: { item: "attention" } }, props: { disabled: { item: "deciding" } }, children: [text3({ value: "Reject" })], on: { onClick: ui3("decide", { path: { item: "path" }, id: { item: "id" }, action: { value: "reject" } }) } }
+                          ]
                         }
-                      )
-                    ] }) }) : null
-                  ]
-                }
-              ),
-              state.view === "unified" ? hunk.lines.map((line, i) => renderLine(line, file, `${hunk.id}-${i}`)) : splitRows(hunk).map((row, i) => /* @__PURE__ */ jsxs4("div", { style: { display: "flex", gap: 1 }, children: [
-                renderSplitCell(row.left, file, "l"),
-                renderSplitCell(row.right, file, "r")
-              ] }, `${hunk.id}-s${i}`))
+                      }
+                    },
+                    on: { onContextMenuAt: ui3("contextMenu", { path: { item: "path" }, id: { item: "id" }, x: { arg: "" }, y: { arg: "", index: 1 } }) },
+                    children: [
+                      LINE("lines"),
+                      {
+                        component: "chrome/DiffSplitRow",
+                        each: { item: "rows", key: "key" },
+                        children: [
+                          { component: "chrome/DiffLine", props: { kind: { item: "left.kind" }, gutter: { item: "left.gutter" }, wrap: { input: "view.wrap" }, runs: { item: "left.runs" } } },
+                          { component: "chrome/DiffLine", props: { kind: { item: "right.kind" }, gutter: { item: "right.gutter" }, wrap: { input: "view.wrap" }, runs: { item: "right.runs" } } }
+                        ]
+                      }
+                    ]
+                  }
+                ]
+              }
             ]
           },
-          hunk.id
-        );
-      })
-    ] }, file.file.path)) }),
-    /* @__PURE__ */ jsx4(
-      StatusBar4,
-      {
-        left: `${state.totals.files} file${state.totals.files === 1 ? "" : "s"} \xB7 +${state.totals.additions} \u2212${state.totals.deletions}`,
-        right: state.review ? `${state.review.decided}/${state.review.total} reviewed` : `${state.oldLabel} \u2192 ${state.newLabel}`
+          {
+            component: "chrome/StatusBar",
+            props: {
+              left: { node: { component: "chrome/Text", props: { role: { value: "number" } }, children: [text3({ input: "view.countLabel" })] } },
+              right: { node: { component: "chrome/Text", props: { role: { value: "meta" } }, children: [text3({ input: "view.rightLabel" })] } }
+            }
+          }
+        ]
       }
-    )
+    ]
+  }
+};
+
+// src/ops/diff/react/DiffPanelView.tsx
+import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function DiffPanelView({ controller, ...options }) {
+  useSyncExternalStore4(controller.subscribe, controller.getState, controller.getState);
+  const view = diffViewState(controller, options);
+  const ui4 = (intent) => applyDiffUi(controller, intent);
+  const hunk = (h) => /* @__PURE__ */ jsxs4(
+    Hunk,
+    {
+      focused: h.focused,
+      settled: h.settled,
+      header: /* @__PURE__ */ jsxs4(Fragment3, { children: [
+        h.header,
+        h.chipPending ? /* @__PURE__ */ jsx4(Badge4, { children: "deciding\u2026" }) : null,
+        h.chipConflict ? /* @__PURE__ */ jsx4(Badge4, { tone: "error", title: h.conflictTitle, children: "conflict \u2014 re-review" }) : null,
+        h.chipFailed ? /* @__PURE__ */ jsx4(Badge4, { tone: "error", title: h.failedTitle, children: "failed" }) : null,
+        h.chipApplied ? /* @__PURE__ */ jsx4(Badge4, { tone: "success", children: h.appliedText }) : null
+      ] }),
+      actions: h.review ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+        h.attention ? /* @__PURE__ */ jsx4(TextButton3, { onClick: () => ui4({ kind: "reReview", path: h.path, id: h.id }), children: "Re-review" }) : null,
+        !h.attention ? /* @__PURE__ */ jsx4(TextButton3, { disabled: h.deciding, onClick: () => ui4({ kind: "decide", path: h.path, id: h.id, action: "accept" }), children: "Accept" }) : null,
+        !h.attention ? /* @__PURE__ */ jsx4(TextButton3, { disabled: h.deciding, onClick: () => ui4({ kind: "decide", path: h.path, id: h.id, action: "reject" }), children: "Reject" }) : null
+      ] }) : null,
+      onContextMenuAt: (x, y) => ui4({ kind: "contextMenu", path: h.path, id: h.id, x, y }),
+      children: [
+        h.lines.map((l) => /* @__PURE__ */ jsx4(DiffLine, { kind: l.kind, gutter: l.gutter, sigil: l.sigil, wrap: view.wrap, runs: l.runs }, l.key)),
+        h.rows.map((r) => /* @__PURE__ */ jsxs4(DiffSplitRow, { children: [
+          /* @__PURE__ */ jsx4(DiffLine, { kind: r.left.kind, gutter: r.left.gutter, wrap: view.wrap, runs: r.left.runs }),
+          /* @__PURE__ */ jsx4(DiffLine, { kind: r.right.kind, gutter: r.right.gutter, wrap: view.wrap, runs: r.right.runs })
+        ] }, r.key))
+      ]
+    },
+    h.key
+  );
+  return /* @__PURE__ */ jsxs4(Fragment3, { children: [
+    view.idle ? /* @__PURE__ */ jsx4(EmptyState4, { title: "Diff", hint: "Nothing to compare yet." }) : null,
+    view.computing ? /* @__PURE__ */ jsx4(EmptyState4, { title: "Comparing\u2026", hint: "The host is computing the differences." }) : null,
+    view.failed ? /* @__PURE__ */ jsx4(EmptyState4, { title: "Comparison failed", hint: view.failedHint }) : null,
+    view.identical ? /* @__PURE__ */ jsx4(EmptyState4, { title: "No changes", hint: "The two sides are identical." }) : null,
+    view.active ? /* @__PURE__ */ jsxs4(Column3, { children: [
+      /* @__PURE__ */ jsx4(
+        Toolbar4,
+        {
+          left: /* @__PURE__ */ jsx4(SegmentedControl2, { label: "View", value: view.view, options: view.views, onChange: (value) => ui4({ kind: "view", view: value }) }),
+          right: /* @__PURE__ */ jsxs4(ToolbarGroup4, { end: true, children: [
+            /* @__PURE__ */ jsx4(TextButton3, { onClick: () => ui4({ kind: "toggleWrap" }), children: view.wrapLabel }),
+            /* @__PURE__ */ jsx4(TextButton3, { onClick: () => ui4({ kind: "toggleWhitespace" }), children: view.whitespaceLabel }),
+            /* @__PURE__ */ jsx4(TextButton3, { onClick: () => ui4({ kind: "prev" }), children: "Prev" }),
+            /* @__PURE__ */ jsx4(TextButton3, { onClick: () => ui4({ kind: "next" }), children: "Next" })
+          ] })
+        }
+      ),
+      view.conflictNotice ? /* @__PURE__ */ jsx4(Note2, { children: /* @__PURE__ */ jsx4(Badge4, { tone: "error", children: view.conflictNotice }) }) : null,
+      /* @__PURE__ */ jsx4(ScrollArea3, { children: view.files.map((f) => /* @__PURE__ */ jsxs4(
+        Section,
+        {
+          title: f.title,
+          badge: /* @__PURE__ */ jsx4(Badge4, { children: f.status }),
+          actions: /* @__PURE__ */ jsx4(Text3, { role: "number", children: f.counts }),
+          collapsible: true,
+          collapsed: f.collapsed,
+          flush: true,
+          onCollapsedChange: (collapsed) => ui4({ kind: "collapse", path: f.path, collapsed }),
+          children: [
+            f.omitted ? /* @__PURE__ */ jsx4(Text3, { role: "meta", children: f.omission }) : null,
+            f.hunks.map(hunk)
+          ]
+        },
+        f.key
+      )) }),
+      /* @__PURE__ */ jsx4(StatusBar4, { left: /* @__PURE__ */ jsx4(Text3, { role: "number", children: view.countLabel }), right: /* @__PURE__ */ jsx4(Text3, { role: "meta", children: view.rightLabel }) })
+    ] }) : null
   ] });
 }
 
@@ -3830,6 +3900,9 @@ function createDiffPanel(options = {}) {
   };
 }
 var diffPanel = createDiffPanel();
+
+// src/ops/diff/index.ts
+var DIFF_RUNTIME_UNITS = [];
 export {
   ALL_STATUSES,
   BEHAVIOURS as CONSOLE_BEHAVIOURS,
@@ -3840,7 +3913,10 @@ export {
   ConsolePanelView,
   ConsoleScroller,
   DEFAULT_MAX_STEP_DEPTH,
+  BEHAVIOURS3 as DIFF_BEHAVIOURS,
+  DIFF_DECLARATION,
   DIFF_PANEL_ID,
+  DIFF_RUNTIME_UNITS,
   DiffController,
   DiffPanelView,
   LEVEL_ORDER,
@@ -3861,6 +3937,7 @@ export {
   XENO_TERMINAL_THEME_KEYS,
   appendStepsAtPath,
   applyConsoleUi,
+  applyDiffUi,
   applyRunsUi,
   canCancel,
   canRetry,
@@ -3879,6 +3956,8 @@ export {
   decodeRunPath,
   diffManifest,
   diffPanel,
+  diffViewManifest,
+  diffViewState,
   durationOf,
   encodeRunPath,
   flattenHunks,