@cueloop/client 0.1.0-alpha.9 → 0.1.0-alpha.90

package/src/theme.ts

@@ -1,12 +1,12 @@
 /**
- * Semantic theme tokens (#22). Values carry over from the design-system
+ * Semantic theme tokens. Values carry over from the design-system
  * prototypes (tokens.css). One built-in dark theme for now; the theme
  * registry (palette-derived themes, terminal theme, user overrides) layers
  * on top of these slots without touching consumers.
  */
 
 export interface Theme {
-  bg: string;
+  background: string;
   panel: string;
   elevated: string;
   border: string;
@@ -15,32 +15,101 @@ export interface Theme {
   textDim: string;
   accent: string;
   accentInk: string;
+  warning: string;
   green: string;
   red: string;
   blue: string;
-  cursorBg: string;
-  markCommentBg: string;
-  markSuggestionBg: string;
-  insFg: string;
-  delFg: string;
+  cursorBackground: string;
+  markCommentBackground: string;
+  insertedForeground: string;
+  deletedForeground: string;
+  /** The band behind a whole added line, and the stronger tint under its intra-line changed words. */
+  insertedBackground: string;
+  insertedEmphasisBackground: string;
+  /** The band behind a whole removed line, and the stronger tint under its intra-line changed words. */
+  deletedBackground: string;
+  deletedEmphasisBackground: string;
+  /** Layer behind centered dialogs; transparent keeps the session visible. */
+  backdrop: string;
+}
+
+/**
+ * The dimmed variant behind the walk wizard: every reading color drops to
+ * the dim token so the file list stays legible context, not competition.
+ * Layout tokens (backgrounds, cursor) keep their values.
+ */
+export function dimmedTheme(theme: Theme): Theme {
+  return {
+    ...theme,
+    text: theme.textDim,
+    textMuted: theme.textDim,
+    accent: theme.textDim,
+    warning: theme.textDim,
+    green: theme.textDim,
+    red: theme.textDim,
+    blue: theme.textDim,
+    insertedForeground: theme.textDim,
+    deletedForeground: theme.textDim,
+    insertedBackground: theme.panel,
+    insertedEmphasisBackground: theme.elevated,
+    deletedBackground: theme.panel,
+    deletedEmphasisBackground: theme.elevated,
+  };
 }
 
 export const DARK: Theme = {
-  bg: "#1f1f29",
-  panel: "#1a1a23",
+  /* Unpainted so the terminal background shows through; override in [theme]. */
+  background: "transparent",
+  panel: "transparent",
   elevated: "#23232f",
   border: "#3a3a4a",
   text: "#e4e6ec",
   textMuted: "#b1b6c4",
   textDim: "#6b7280",
-  accent: "#f5a3a3",
-  accentInk: "#2a1416",
+  accent: "#cba6f7",
+  accentInk: "#17171a",
+  warning: "#e5a45c",
   green: "#62d96b",
-  red: "#ff6b6b",
-  blue: "#84a6e8",
-  cursorBg: "#33262a",
-  markCommentBg: "#3d2a2e",
-  markSuggestionBg: "#20351f",
-  insFg: "#62d96b",
-  delFg: "#ff6b6b",
-}
+  red: "#f08080",
+  blue: "#a9c8f5",
+  cursorBackground: "#33262a",
+  markCommentBackground: "#3d2a2e",
+  insertedForeground: "#62d96b",
+  deletedForeground: "#ff6b6b",
+  insertedBackground: "#16321d",
+  insertedEmphasisBackground: "#245c30",
+  deletedBackground: "#341c1f",
+  deletedEmphasisBackground: "#5a2a2e",
+  backdrop: "transparent",
+};
+
+/**
+ * The branded transparent theme for a LIGHT terminal: same unpainted
+ * background, but every reading color darkens so text is legible on a white
+ * terminal instead of light-on-light. Chosen when the terminal reports a light
+ * background; the dark variant above is the default and the fallback.
+ */
+export const LIGHT: Theme = {
+  background: "transparent",
+  panel: "transparent",
+  elevated: "#ececf2",
+  border: "#c7c7d2",
+  text: "#1c1d24",
+  textMuted: "#4b5162",
+  textDim: "#868c9c",
+  accent: "#5b3ea6",
+  accentInk: "#fbfbfa",
+  warning: "#a45f12",
+  green: "#2f8a3e",
+  red: "#c0392b",
+  blue: "#2f6fb0",
+  cursorBackground: "#e6e2ea",
+  markCommentBackground: "#f2e2e8",
+  insertedForeground: "#2f8a3e",
+  deletedForeground: "#c0392b",
+  insertedBackground: "#d8f5dd",
+  insertedEmphasisBackground: "#a9e6b6",
+  deletedBackground: "#fbdcdc",
+  deletedEmphasisBackground: "#f5b7b7",
+  backdrop: "transparent",
+};

package/src/thread-chords.test.ts

@@ -0,0 +1,79 @@
+import { describe, expect, test } from "bun:test";
+import { resolveNavKey } from "./thread-chords";
+
+const owner = { isOwner: true, resolved: false, treeActive: false };
+const readOnly = { type: "status" as const, message: "observer - read-only" };
+const submitted = { type: "status" as const, message: "review submitted - read-only" };
+
+describe("resolveNavKey", () => {
+  test("the session commands: submit, edit, share", () => {
+    expect(resolveNavKey({ name: "return" }, owner)).toEqual({ type: "openSubmit" });
+    expect(resolveNavKey({ name: "enter" }, owner)).toEqual({ type: "openSubmit" });
+    expect(resolveNavKey({ name: "e" }, owner)).toEqual({ type: "edit" });
+    expect(resolveNavKey({ name: "s" }, owner)).toEqual({ type: "share" });
+  });
+
+  test("a diff row's keys win over the shared letters, then fall through to curation", () => {
+    const diff = { ...owner, isDiff: true };
+
+    expect(resolveNavKey({ name: "x" }, diff)).toEqual({ type: "rejectChange" });
+    expect(resolveNavKey({ name: "c" }, diff)).toEqual({ type: "foldFile" });
+    expect(resolveNavKey({ name: "d" }, diff)).toEqual({ type: "toggleDiffView" });
+    expect(resolveNavKey({ name: "k" }, diff)).toEqual({ type: "walkStart" });
+    // a letter with no diff meaning still reaches the curation commands
+    expect(resolveNavKey({ name: "n" }, diff)).toEqual({ type: "nextAnnotation" });
+  });
+
+  test("the discussion and curation commands", () => {
+    expect(resolveNavKey({ name: "n" }, owner)).toEqual({ type: "nextAnnotation" });
+    expect(resolveNavKey({ name: "p" }, owner)).toEqual({ type: "prevAnnotation" });
+    expect(resolveNavKey({ name: "backspace" }, owner)).toEqual({ type: "removeAnnotation" });
+    expect(resolveNavKey({ name: "r" }, owner)).toEqual({ type: "openRename" });
+    expect(resolveNavKey({ name: "x" }, owner)).toEqual({ type: "cut" });
+    expect(resolveNavKey({ name: "u" }, owner)).toEqual({ type: "restoreCuration" });
+  });
+
+  test("the tree commands: move on the Tree tab, go, branch, label, fork, hand off", () => {
+    const onTree = { ...owner, treeActive: true };
+
+    expect(resolveNavKey({ name: "n" }, onTree)).toEqual({ type: "treeMove", direction: 1 });
+    expect(resolveNavKey({ name: "p" }, onTree)).toEqual({ type: "treeMove", direction: -1 });
+    expect(resolveNavKey({ name: "g" }, owner)).toEqual({ type: "treeGo" });
+    expect(resolveNavKey({ name: "b" }, owner)).toEqual({ type: "treeBranch" });
+    expect(resolveNavKey({ name: "l" }, owner)).toEqual({ type: "treeLabel" });
+    expect(resolveNavKey({ name: "f" }, owner)).toEqual({ type: "treeFork" });
+    expect(resolveNavKey({ name: "h" }, owner)).toEqual({ type: "treeForkShare" });
+  });
+
+  test("a shift letter resolves as its uppercase, which no command claims, so it returns to typing", () => {
+    expect(resolveNavKey({ name: "x", shift: true }, { ...owner, isDiff: true })).toBeNull();
+  });
+
+  test("a collaborator is refused the owner's commands; renaming stays open", () => {
+    const collaborator = { ...owner, isOwner: false };
+
+    expect(resolveNavKey({ name: "return" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "e" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "s" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "x" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "g" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "f" }, collaborator)).toEqual(readOnly);
+    expect(resolveNavKey({ name: "r" }, collaborator)).toEqual({ type: "openRename" });
+  });
+
+  test("a resolved review refuses every change and says so; a fork stays open", () => {
+    const resolved = { ...owner, resolved: true };
+
+    expect(resolveNavKey({ name: "return" }, resolved)).toBeNull();
+    expect(resolveNavKey({ name: "e" }, resolved)).toEqual(submitted);
+    expect(resolveNavKey({ name: "x" }, resolved)).toEqual(submitted);
+    expect(resolveNavKey({ name: "b" }, resolved)).toEqual(submitted);
+    expect(resolveNavKey({ name: "f" }, resolved)).toEqual({ type: "treeFork" });
+    expect(resolveNavKey({ name: "s" }, resolved)).toEqual({ type: "share" });
+  });
+
+  test("an unmapped key returns null, so the surface returns to typing", () => {
+    expect(resolveNavKey({ name: "z" }, owner)).toBeNull();
+    expect(resolveNavKey({ name: "j" }, owner)).toBeNull();
+  });
+});

package/src/thread-chords.ts

@@ -0,0 +1,163 @@
+import type { Intent } from "./keymap";
+
+export interface NavKey {
+  name: string;
+  shift?: boolean;
+}
+
+export interface ThreadNavContext {
+  isOwner: boolean;
+  resolved: boolean;
+  treeActive: boolean;
+  isDiff?: boolean;
+}
+
+export interface ChordEntry {
+  keys: string;
+  label: string;
+}
+
+export function sessionCommandEntries(): ChordEntry[] {
+  return [
+    { keys: "⏎", label: "submit the review" },
+    { keys: "e", label: "edit in $EDITOR" },
+    { keys: "s", label: "share" },
+  ];
+}
+
+export function diffCommandEntries(): ChordEntry[] {
+  return [
+    { keys: "x", label: "reject the change under the caret" },
+    { keys: "u", label: "restore the last rejection" },
+    { keys: "c", label: "collapse the file to its band" },
+    { keys: "d", label: "split / stacked (when wide)" },
+    { keys: "k", label: "start the guided walk" },
+  ];
+}
+
+export function curationCommandEntries(): ChordEntry[] {
+  return [
+    { keys: "n / p", label: "next / previous card" },
+    { keys: "z", label: "fold / unfold the card" },
+    { keys: "⌫", label: "delete the card" },
+    { keys: "r", label: "rename the author" },
+    { keys: "x", label: "cut the block" },
+    { keys: "u", label: "restore the last cut" },
+  ];
+}
+
+export function treeCommandEntries(): ChordEntry[] {
+  return [
+    { keys: "g", label: "go to the entry" },
+    { keys: "b", label: "branch off the tip" },
+    { keys: "l", label: "label a checkpoint" },
+    { keys: "f", label: "fork the path" },
+    { keys: "h", label: "fork and hand off" },
+  ];
+}
+
+const READ_ONLY: Intent = { type: "status", message: "observer - read-only" };
+const RESOLVED: Intent = { type: "status", message: "review submitted - read-only" };
+
+function mutating(intent: Intent, context: ThreadNavContext): Intent {
+  if (!context.isOwner) return READ_ONLY;
+  if (context.resolved) return RESOLVED;
+
+  return intent;
+}
+
+function resolveDiffKey(name: string, context: ThreadNavContext): Intent | null {
+  switch (name) {
+    case "x":
+      return mutating({ type: "rejectChange" }, context);
+    case "c":
+      return { type: "foldFile" };
+    case "d":
+      return { type: "toggleDiffView" };
+    case "k":
+      return context.resolved ? RESOLVED : { type: "walkStart" };
+    default:
+      return null;
+  }
+}
+
+function resolveSessionKey(name: string, context: ThreadNavContext): Intent | null {
+  switch (name) {
+    case "e":
+      return mutating({ type: "edit" }, context);
+    case "s":
+      return context.isOwner ? { type: "share" } : READ_ONLY;
+    default:
+      return null;
+  }
+}
+
+function resolveCurationKey(name: string, context: ThreadNavContext): Intent | null {
+  switch (name) {
+    case "n":
+      return context.treeActive ? { type: "treeMove", direction: 1 } : { type: "nextAnnotation" };
+    case "p":
+      return context.treeActive ? { type: "treeMove", direction: -1 } : { type: "prevAnnotation" };
+    case "g":
+      return mutating({ type: "treeGo" }, context);
+    case "b":
+      return mutating({ type: "treeBranch" }, context);
+    case "l":
+      return mutating({ type: "treeLabel" }, context);
+    case "f":
+      return context.isOwner ? { type: "treeFork" } : READ_ONLY;
+    case "h":
+      return context.isOwner ? { type: "treeForkShare" } : READ_ONLY;
+    case "backspace":
+      return mutating({ type: "removeAnnotation" }, context);
+    case "r":
+      return { type: "openRename" };
+    case "x":
+      return mutating({ type: "cut" }, context);
+    case "u":
+      return mutating({ type: "restoreCuration" }, context);
+    default:
+      return null;
+  }
+}
+
+export interface SessionChordKey {
+  name: string;
+  ctrl?: boolean;
+  meta?: boolean;
+  super?: boolean;
+}
+
+export function resolveSessionChord(
+  key: SessionChordKey,
+  context: Pick<ThreadNavContext, "isOwner" | "resolved">,
+): Intent | null {
+  if (key.name === "return" || key.name === "enter") {
+    if (!(key.ctrl || key.meta || key.super)) return null;
+    if (!context.isOwner) return READ_ONLY;
+
+    return context.resolved ? null : { type: "openSubmit" };
+  }
+  if (!key.ctrl) return null;
+  if (key.name === "e")
+    return context.resolved ? RESOLVED : context.isOwner ? { type: "edit" } : READ_ONLY;
+  if (key.name === "s") return context.isOwner ? { type: "share" } : READ_ONLY;
+
+  return null;
+}
+
+export function resolveNavKey(key: NavKey, context: ThreadNavContext): Intent | null {
+  const name = key.shift ? key.name.toUpperCase() : key.name;
+
+  if (name === "return" || name === "enter") {
+    if (!context.isOwner) return READ_ONLY;
+
+    return context.resolved ? null : { type: "openSubmit" };
+  }
+
+  return (
+    (context.isDiff ? resolveDiffKey(name, context) : null) ??
+    resolveSessionKey(name, context) ??
+    resolveCurationKey(name, context)
+  );
+}

package/src/thread-code-syntax.ts

@@ -0,0 +1,45 @@
+/** Tree-sitter colors for fenced code blocks in a Thread, in rendered-text offsets. */
+
+import { getTreeSitterClient } from "@opentui/core";
+import type { DisplayBlock } from "./view-plan";
+import { renderedText } from "./view-plan";
+import { spansByLine, type SyntaxSpan } from "./diff-syntax";
+import { filetypeFor } from "./components/syntax-highlight";
+
+export type { SyntaxSpan } from "./diff-syntax";
+
+/** Highlight whole code blocks so multi-line syntax stays intact. */
+export async function highlightThreadCodeBlocks(
+  display: DisplayBlock[],
+): Promise<Map<number, SyntaxSpan[]>> {
+  const jobs = display.flatMap((block, blockIndex) => {
+    if (block.kind !== "code") return [];
+    const filetype = filetypeFor(block.work?.lang ?? block.base?.lang);
+
+    return filetype ? [{ blockIndex, filetype, source: renderedText(block) }] : [];
+  });
+  const byBlock = new Map<number, SyntaxSpan[]>();
+
+  if (jobs.length === 0) return byBlock;
+  const client = getTreeSitterClient();
+
+  await client.initialize();
+  for (const job of jobs) {
+    const result = await client.highlightOnce(job.source, job.filetype);
+
+    if (!result.highlights) continue;
+    const spans: SyntaxSpan[] = [];
+    let offset = 0;
+    const lines = job.source.split("\n");
+
+    spansByLine(job.source, result.highlights).forEach((lineSpans, lineIndex) => {
+      for (const span of lineSpans) {
+        spans.push({ start: offset + span.start, end: offset + span.end, group: span.group });
+      }
+      offset += lines[lineIndex]!.length + 1;
+    });
+    byBlock.set(job.blockIndex, spans);
+  }
+
+  return byBlock;
+}