pi-weave 0.2.4 → 0.3.1

package/src/web/server/workspace-state.ts

@@ -0,0 +1,121 @@
+import { createHash, randomUUID } from "node:crypto";
+import { promises as fs } from "node:fs";
+import { homedir } from "node:os";
+import { join, resolve } from "node:path";
+import { findGitRoot } from "../../core/git";
+import { withMutationQueue } from "../../core/mutex";
+import { parseWorkspaceLayout, type WorkspaceLayout } from "../shared/workspace";
+
+const MAX_SNAPSHOTS = 8;
+const UUID = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
+
+export function isWorkspaceViewId(value: unknown): value is string {
+  return typeof value === "string" && UUID.test(value);
+}
+
+interface Snapshot {
+  viewId: string;
+  savedAt: number;
+  layout: WorkspaceLayout;
+}
+
+interface SnapshotFile {
+  version: 1;
+  viewId: string;
+  layout: WorkspaceLayout;
+}
+
+export interface WorkspaceStateStore {
+  readLatest(): Promise<WorkspaceLayout | null>;
+  write(viewId: string, layout: WorkspaceLayout): Promise<void>;
+}
+
+export function defaultWorkspaceStateDir(): string {
+  return join(process.env.XDG_CONFIG_HOME || join(homedir(), ".config"), "pi-weave", "presentation");
+}
+
+export function createWorkspaceStateStore(
+  cwd: string,
+  vaultRoot: string,
+  stateDir = defaultWorkspaceStateDir(),
+): WorkspaceStateStore {
+  let directoryPromise: Promise<string> | null = null;
+  const directory = (): Promise<string> => {
+    directoryPromise ??= (async () => {
+      const [vault, repo] = await Promise.all([canonical(vaultRoot), findGitRoot(cwd)]);
+      const workspaceRoot = await canonical(repo ?? cwd);
+      const id = createHash("sha256").update(JSON.stringify([vault, workspaceRoot])).digest("hex");
+      return join(stateDir, id);
+    })();
+    return directoryPromise;
+  };
+
+  return {
+    async readLatest() {
+      return (await readSnapshots(await directory()))[0]?.layout ?? null;
+    },
+    async write(viewId, layout) {
+      if (!isWorkspaceViewId(viewId)) throw new Error("viewId must be a UUID");
+      const dir = await directory();
+      const file = join(dir, `${viewId}.json`);
+      await withMutationQueue(file, async () => {
+        await writeSnapshot(dir, file, { version: 1, viewId, layout });
+      });
+    },
+  };
+}
+
+async function canonical(path: string): Promise<string> {
+  const absolute = resolve(path);
+  try {
+    return await fs.realpath(absolute);
+  } catch {
+    return absolute;
+  }
+}
+
+async function readSnapshots(directory: string): Promise<Snapshot[]> {
+  let names: string[];
+  try {
+    names = await fs.readdir(directory);
+  } catch (error) {
+    if ((error as NodeJS.ErrnoException).code === "ENOENT") return [];
+    throw error;
+  }
+  const snapshots = await Promise.all(names.filter((name) => UUID.test(name.slice(0, -5)) && name.endsWith(".json")).map(async (name) => {
+    const file = join(directory, name);
+    try {
+      const [text, info] = await Promise.all([fs.readFile(file, "utf8"), fs.stat(file)]);
+      const raw = JSON.parse(text) as SnapshotFile;
+      const layout = raw.version === 1 && raw.viewId === name.slice(0, -5) ? parseWorkspaceLayout(raw.layout) : null;
+      return layout ? { viewId: raw.viewId, savedAt: info.mtimeMs, layout } : null;
+    } catch {
+      return null;
+    }
+  }));
+  return snapshots.filter((item): item is Snapshot => item !== null).sort((a, b) => b.savedAt - a.savedAt).slice(0, MAX_SNAPSHOTS);
+}
+
+async function writeSnapshot(directory: string, file: string, state: SnapshotFile): Promise<void> {
+  await fs.mkdir(directory, { recursive: true, mode: 0o700 });
+  const temporary = `${file}.${randomUUID()}.tmp`;
+  try {
+    await fs.writeFile(temporary, JSON.stringify(state), { encoding: "utf8", flag: "wx", mode: 0o600 });
+    await fs.rename(temporary, file);
+    const entries = await Promise.all((await fs.readdir(directory)).filter((name) => name.endsWith(".json")).map(async (name) => {
+      const path = join(directory, name);
+      try {
+        return { path, mtime: (await fs.stat(path)).mtimeMs };
+      } catch (error) {
+        if ((error as NodeJS.ErrnoException).code === "ENOENT") return null;
+        throw error;
+      }
+    }));
+    const existing = entries.filter((entry): entry is NonNullable<typeof entry> => entry !== null);
+    existing.sort((a, b) => b.mtime - a.mtime);
+    await Promise.all(existing.slice(MAX_SNAPSHOTS).map(({ path }) => fs.rm(path, { force: true })));
+  } catch (error) {
+    await fs.rm(temporary, { force: true });
+    throw error;
+  }
+}

package/src/web/shared/workspace.ts

@@ -0,0 +1,270 @@
+/** Serializable tab and pane state shared by the browser and persistence API. */
+
+export interface WorkspaceTab {
+  readonly id: string;
+  readonly kind: "document" | "graph";
+  readonly history: readonly (string | null)[];
+  readonly cursor: number;
+  readonly scroll: number;
+}
+
+export interface Pane {
+  readonly id: string;
+  readonly tabs: readonly WorkspaceTab[];
+  readonly activeTab: string;
+  readonly lastDocumentTab?: string;
+}
+
+export interface WorkspaceLayout {
+  readonly version: 1;
+  readonly panes: readonly Pane[];
+  readonly activePane: string;
+  readonly split: "right" | "down";
+  readonly ratio: number;
+  readonly treeVisible: boolean;
+  readonly contextVisible: boolean;
+  readonly treeWidth: number;
+  readonly contextWidth: number;
+  readonly theme: "system" | "light" | "dark";
+}
+
+const MAX_TABS = 40;
+const MAX_HISTORY = 100;
+const MAX_SCROLL = 1_000_000_000;
+
+const emptyDocument = (id: string): WorkspaceTab => ({ id, kind: "document", history: [null], cursor: 0, scroll: 0 });
+
+export function initialLayout(): WorkspaceLayout {
+  return {
+    version: 1,
+    panes: [{ id: "pane-1", tabs: [emptyDocument("tab-1")], activeTab: "tab-1" }],
+    activePane: "pane-1",
+    split: "right",
+    ratio: 0.5,
+    treeVisible: true,
+    contextVisible: true,
+    treeWidth: 240,
+    contextWidth: 240,
+    theme: "system",
+  };
+}
+
+export function activePane(layout: WorkspaceLayout): Pane {
+  return layout.panes.find((pane) => pane.id === layout.activePane)!;
+}
+
+export function activeTab(layout: WorkspaceLayout): WorkspaceTab {
+  const pane = activePane(layout);
+  return pane.tabs.find((tab) => tab.id === pane.activeTab)!;
+}
+
+export function tabSelection(tab: WorkspaceTab): string | null {
+  return tab.kind === "document" ? tab.history[tab.cursor] ?? null : null;
+}
+
+function nextId(layout: WorkspaceLayout, prefix: "pane" | "tab"): string {
+  const ids = new Set(layout.panes.flatMap((pane) => [pane.id, ...pane.tabs.map((tab) => tab.id)]));
+  let n = 1;
+  while (ids.has(`${prefix}-${n}`)) n++;
+  return `${prefix}-${n}`;
+}
+
+function setActive(layout: WorkspaceLayout, pane: Pane, tab: WorkspaceTab): WorkspaceLayout {
+  return {
+    ...layout,
+    activePane: pane.id,
+    panes: layout.panes.map((item) => item.id === pane.id
+      ? rememberDocument({ ...pane, activeTab: tab.id, tabs: pane.tabs.map((current) => current.id === tab.id ? tab : current) })
+      : item),
+  };
+}
+
+function documentTab(pane: Pane): WorkspaceTab | undefined {
+  return pane.tabs.find((tab) => tab.id === pane.lastDocumentTab && tab.kind === "document")
+    ?? [...pane.tabs].reverse().find((tab) => tab.kind === "document");
+}
+
+function rememberDocument(pane: Pane): Pane {
+  const { lastDocumentTab: _previous, ...rest } = pane;
+  const tab = pane.tabs.find((tab) => tab.id === pane.activeTab && tab.kind === "document") ?? documentTab(pane);
+  return tab ? { ...rest, lastDocumentTab: tab.id } : rest;
+}
+
+/** Focus reading/editing without navigating away from the active document. */
+export function focusDocument(layout: WorkspaceLayout): WorkspaceLayout {
+  if (activeTab(layout).kind === "document") return layout;
+  const pane = activePane(layout);
+  const tab = documentTab(pane);
+  return tab ? setActive(layout, pane, tab) : openDocument(layout, null, { newTab: true });
+}
+
+function findTab(layout: WorkspaceLayout, paneId: string, tabId: string): { pane: Pane; tab: WorkspaceTab } | null {
+  const pane = layout.panes.find((item) => item.id === paneId);
+  const tab = pane?.tabs.find((item) => item.id === tabId);
+  return pane && tab ? { pane, tab } : null;
+}
+
+function appendTab(layout: WorkspaceLayout, pane: Pane, tab: WorkspaceTab): WorkspaceLayout {
+  if (layout.panes.reduce((count, item) => count + item.tabs.length, 0) >= MAX_TABS) return layout;
+  return setActive(layout, { ...pane, tabs: [...pane.tabs, tab] }, tab);
+}
+
+function navigate(tab: WorkspaceTab, id: string | null): WorkspaceTab {
+  const history = tab.history.slice(0, tab.cursor + 1);
+  if (history.at(-1) === id) return tab;
+  history.push(id);
+  if (history.length > MAX_HISTORY) history.shift();
+  return { ...tab, history, cursor: history.length - 1, scroll: 0 };
+}
+
+export function openDocument(layout: WorkspaceLayout, id: string | null, options: { newTab?: boolean; paneId?: string } = {}): WorkspaceLayout {
+  let pane = layout.panes.find((item) => item.id === (options.paneId ?? layout.activePane));
+  if (!pane) return layout;
+  const activeTabId = pane.activeTab;
+  let tab = pane.tabs.find((item) => item.id === activeTabId);
+  if (tab?.kind === "graph") {
+    tab = documentTab(pane);
+    if (tab) pane = { ...pane, activeTab: tab.id };
+    else if (!options.newTab) options = { ...options, newTab: true };
+  }
+  if (options.newTab) return appendTab(layout, pane, navigate(emptyDocument(nextId(layout, "tab")), id));
+  if (!tab) return appendTab(layout, pane, navigate(emptyDocument(nextId(layout, "tab")), id));
+  const next = navigate(tab, id);
+  if (next === tab && pane.id === layout.activePane && activeTabId === tab.id) return layout;
+  return setActive(layout, pane, next);
+}
+
+export function openGraph(layout: WorkspaceLayout): WorkspaceLayout {
+  const located = layout.panes.flatMap((pane) => pane.tabs.filter((tab) => tab.kind === "graph").map((tab) => ({ pane, tab })))[0];
+  if (located) return located.pane.id === layout.activePane && located.pane.activeTab === located.tab.id
+    ? layout
+    : setActive(layout, located.pane, located.tab);
+  const pane = activePane(layout);
+  return appendTab(layout, pane, { id: nextId(layout, "tab"), kind: "graph", history: [null], cursor: 0, scroll: 0 });
+}
+
+export function activateTab(layout: WorkspaceLayout, paneId: string, tabId: string): WorkspaceLayout {
+  const found = findTab(layout, paneId, tabId);
+  return !found || (layout.activePane === paneId && found.pane.activeTab === tabId)
+    ? layout
+    : setActive(layout, found.pane, found.tab);
+}
+
+export function closeTab(layout: WorkspaceLayout, paneId: string, tabId: string): WorkspaceLayout {
+  const found = findTab(layout, paneId, tabId);
+  if (!found) return layout;
+  const { pane } = found;
+  if (pane.tabs.length === 1) {
+    const kept = layout.panes.find((item) => item.id !== paneId);
+    if (kept) return { ...layout, panes: [kept], activePane: kept.id };
+    const tab = emptyDocument(nextId(layout, "tab"));
+    return setActive(layout, { ...pane, tabs: [tab] }, tab);
+  }
+  const tabs = pane.tabs.filter((tab) => tab.id !== tabId);
+  const wasActive = pane.activeTab === tabId;
+  const neighbor = tabs[Math.max(0, pane.tabs.findIndex((tab) => tab.id === tabId) - 1)]!;
+  const updated = rememberDocument({ ...pane, tabs, activeTab: wasActive ? neighbor.id : pane.activeTab });
+  return { ...layout, activePane: wasActive ? paneId : layout.activePane, panes: layout.panes.map((item) => item.id === paneId ? updated : item) };
+}
+
+export function navigateTab(layout: WorkspaceLayout, paneId: string, delta: -1 | 1): WorkspaceLayout {
+  const pane = layout.panes.find((item) => item.id === paneId);
+  const tab = pane?.tabs.find((item) => item.id === pane.activeTab);
+  if (!pane || !tab || tab.kind !== "document") return layout;
+  const cursor = tab.cursor + delta;
+  if (cursor < 0 || cursor >= tab.history.length) return layout;
+  return setActive(layout, pane, { ...tab, cursor, scroll: 0 });
+}
+
+export function splitPane(layout: WorkspaceLayout, direction: "right" | "down"): WorkspaceLayout {
+  if (layout.panes.length === 2) return layout.split === direction ? layout : { ...layout, split: direction };
+  if (layout.panes.reduce((count, pane) => count + pane.tabs.length, 0) >= MAX_TABS) return layout;
+  const current = activeTab(layout);
+  const id = nextId(layout, "pane");
+  let tab = emptyDocument(nextId(layout, "tab"));
+  if (current.kind === "document") tab = { ...current, id: tab.id, history: [...current.history], scroll: current.scroll };
+  return { ...layout, panes: [...layout.panes, { id, tabs: [tab], activeTab: tab.id }], activePane: id, split: direction };
+}
+
+export function closePane(layout: WorkspaceLayout, paneId: string): WorkspaceLayout {
+  if (layout.panes.length !== 2 || !layout.panes.some((pane) => pane.id === paneId)) return layout;
+  const closed = layout.panes.find((pane) => pane.id === paneId)!;
+  const kept = layout.panes.find((pane) => pane.id !== paneId)!;
+  return { ...layout, panes: [{ ...kept, tabs: [...kept.tabs, ...closed.tabs] }], activePane: kept.id };
+}
+
+/** Accept a tab drop only in another existing pane. */
+export function tabDropSource(layout: WorkspaceLayout, targetPane: string, tabId: string | null): string | null {
+  if (!layout.panes.some((pane) => pane.id === targetPane)) return null;
+  return layout.panes.find((pane) => pane.id !== targetPane && pane.tabs.some((tab) => tab.id === tabId))?.id ?? null;
+}
+
+export function moveTab(layout: WorkspaceLayout, paneId: string, tabId: string): WorkspaceLayout {
+  const found = findTab(layout, paneId, tabId);
+  if (!found) return layout;
+  const target = layout.panes.find((pane) => pane.id !== paneId) ?? { id: nextId(layout, "pane"), tabs: [], activeTab: "" };
+  const sourceTabs = found.pane.tabs.filter((tab) => tab.id !== tabId);
+  const destination = rememberDocument({ ...target, tabs: [...target.tabs, found.tab], activeTab: found.tab.id });
+  if (!sourceTabs.length && layout.panes.length === 2) return { ...layout, panes: [destination], activePane: target.id };
+  if (!sourceTabs.length && layout.panes.reduce((count, pane) => count + pane.tabs.length, 0) >= MAX_TABS) return layout;
+  const placeholder = sourceTabs.length ? null : emptyDocument(nextId(layout, "tab"));
+  const remaining = sourceTabs.length ? sourceTabs : [placeholder!];
+  const source = rememberDocument({ ...found.pane, tabs: remaining, activeTab: found.pane.activeTab === tabId ? remaining[Math.max(0, found.pane.tabs.findIndex((tab) => tab.id === tabId) - 1)]!.id : found.pane.activeTab });
+  return { ...layout, activePane: target.id, panes: layout.panes.length === 1
+    ? [source, destination]
+    : layout.panes.map((pane) => pane.id === source.id ? source : destination) };
+}
+
+function exactKeys(value: Record<string, unknown>, keys: readonly string[]): boolean {
+  return Object.keys(value).length === keys.length && keys.every((key) => Object.hasOwn(value, key));
+}
+
+function record(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function boundedId(value: unknown, prefix?: "pane" | "tab"): value is string {
+  return typeof value === "string" && value.length <= 2048 && (prefix === undefined
+    ? value.length > 0 && !/[\u0000-\u001f\u007f]/.test(value)
+    : new RegExp(`^${prefix}-[1-9][0-9]{0,8}$`).test(value));
+}
+
+export function parseWorkspaceLayout(value: unknown): WorkspaceLayout | null {
+  if (!record(value) || !exactKeys(value, ["version", "panes", "activePane", "split", "ratio", "treeVisible", "contextVisible", "treeWidth", "contextWidth", "theme"])) return null;
+  if (value["version"] !== 1 || !Array.isArray(value["panes"]) || value["panes"].length < 1 || value["panes"].length > 2 || !boundedId(value["activePane"], "pane")) return null;
+  if (value["split"] !== "right" && value["split"] !== "down") return null;
+  if (typeof value["ratio"] !== "number" || !Number.isFinite(value["ratio"]) || value["ratio"] < 0.1 || value["ratio"] > 0.9) return null;
+  if (typeof value["treeVisible"] !== "boolean" || typeof value["contextVisible"] !== "boolean") return null;
+  if (typeof value["treeWidth"] !== "number" || !Number.isFinite(value["treeWidth"]) || value["treeWidth"] < 120 || value["treeWidth"] > 800) return null;
+  if (typeof value["contextWidth"] !== "number" || !Number.isFinite(value["contextWidth"]) || value["contextWidth"] < 120 || value["contextWidth"] > 800) return null;
+  if (value["theme"] !== "system" && value["theme"] !== "light" && value["theme"] !== "dark") return null;
+  const ids = new Set<string>();
+  let count = 0;
+  let graphs = 0;
+  const panes: Pane[] = [];
+  for (const rawPane of value["panes"]) {
+    if (!record(rawPane) || !exactKeys(rawPane, Object.hasOwn(rawPane, "lastDocumentTab") ? ["id", "tabs", "activeTab", "lastDocumentTab"] : ["id", "tabs", "activeTab"]) || !boundedId(rawPane["id"], "pane") || !Array.isArray(rawPane["tabs"]) || rawPane["tabs"].length < 1 || !boundedId(rawPane["activeTab"], "tab") || ids.has(rawPane["id"])) return null;
+    ids.add(rawPane["id"]);
+    const tabs: WorkspaceTab[] = [];
+    let activeFound = false;
+    for (const rawTab of rawPane["tabs"]) {
+      if (!record(rawTab) || !exactKeys(rawTab, ["id", "kind", "history", "cursor", "scroll"]) || !boundedId(rawTab["id"], "tab") || ids.has(rawTab["id"])) return null;
+      ids.add(rawTab["id"]);
+      if (rawTab["kind"] !== "document" && rawTab["kind"] !== "graph") return null;
+      const kind = rawTab["kind"] as WorkspaceTab["kind"];
+      if (!Array.isArray(rawTab["history"]) || rawTab["history"].length < 1 || rawTab["history"].length > MAX_HISTORY || !Number.isInteger(rawTab["cursor"]) || (rawTab["cursor"] as number) < 0 || (rawTab["cursor"] as number) >= rawTab["history"].length) return null;
+      if (rawTab["history"].some((id) => id !== null && !boundedId(id))) return null;
+      if (typeof rawTab["scroll"] !== "number" || !Number.isFinite(rawTab["scroll"]) || rawTab["scroll"] < 0 || rawTab["scroll"] > MAX_SCROLL) return null;
+      if (kind === "graph") graphs++;
+      count++;
+      if (rawTab["id"] === rawPane["activeTab"]) activeFound = true;
+      tabs.push({ id: rawTab["id"], kind, history: rawTab["history"] as (string | null)[], cursor: rawTab["cursor"] as number, scroll: rawTab["scroll"] });
+    }
+    if (!activeFound) return null;
+    const lastDocumentTab = rawPane["lastDocumentTab"];
+    if (Object.hasOwn(rawPane, "lastDocumentTab") && (!boundedId(lastDocumentTab, "tab") || !tabs.some((tab) => tab.id === lastDocumentTab && tab.kind === "document"))) return null;
+    panes.push({ id: rawPane["id"], tabs, activeTab: rawPane["activeTab"], ...(typeof lastDocumentTab === "string" ? { lastDocumentTab } : {}) });
+  }
+  if (count > MAX_TABS || graphs > 1 || !panes.some((pane) => pane.id === value["activePane"])) return null;
+  return { version: 1, panes, activePane: value["activePane"], split: value["split"], ratio: value["ratio"], treeVisible: value["treeVisible"], contextVisible: value["contextVisible"], treeWidth: value["treeWidth"], contextWidth: value["contextWidth"], theme: value["theme"] };
+}

package/src/web/client/selection.storage.ts

@@ -1,69 +0,0 @@
-/**
- * selection.storage.ts — the §1.3 context bus's memory across reloads.
- *
- * A manual refresh used to drop the open note: `selectedId` is a Preact
- * signal, and signals do not survive a page load. The layout already
- * persists (`shell/layout.model.ts`), and this is the same trick for the
- * one piece of selection state the user actually misses: which note they
- * were reading.
- *
- * ## Restore needs the graph
- *
- * A saved id is only offered back if it still names a node of the freshly
- * loaded graph — a note deleted in another window must not resurrect as a
- * selection pointing at nothing. That check needs the graph, which arrives
- * after mount, so the restore is deliberately a pure function of
- * `(graph, storage)` the shell calls once the first graph lands, not
- * something this module schedules itself.
- *
- * ## Tier rules (§2)
- *
- * `src/web/client/**`: storage arrives as a two-method port (same shape as
- * `LayoutStorage`) rather than the global, because the real `localStorage`
- * throws in partitioned-storage contexts and a module this small should be
- * testable without a DOM.
- */
-
-import type { GraphPayload } from "../shared/wire";
-
-/** The slice of `Storage` this module needs. */
-export interface SelectionStorage {
-  getItem(key: string): string | null;
-  setItem(key: string, value: string): void;
-}
-
-/** Versioned like `pi-weave.layout.v1`: an id-shape change gets a new key. */
-export const SELECTION_STORAGE_KEY = "pi-weave.selection.v1";
-
-/**
- * Remember the selection; an empty string records "nothing open".
- * Reports failure as `false` instead of throwing — a quota or
- * partitioned-storage error must never break a selection.
- */
-export function saveSelection(storage: SelectionStorage, id: string | null): boolean {
-  try {
-    storage.setItem(SELECTION_STORAGE_KEY, id ?? "");
-    return true;
-  } catch {
-    return false;
-  }
-}
-
-/**
- * The saved selection to restore, or `null`.
- *
- * `graph` gates the offer: the id must still name a node of the current
- * payload, so a note deleted elsewhere is quietly not restored. Reads are
- * failure-absorbing for the same reason writes are.
- */
-export function restoreSelection(graph: GraphPayload | null, storage: SelectionStorage): string | null {
-  if (graph === null) return null;
-  let raw: string | null;
-  try {
-    raw = storage.getItem(SELECTION_STORAGE_KEY);
-  } catch {
-    return null;
-  }
-  if (raw === null || raw === "") return null;
-  return graph.model.nodes.some((node) => node.id === raw) ? raw : null;
-}

package/src/web/client/shell/Columns.tsx

@@ -1,139 +0,0 @@
-/**
- * The resizable column grid and context rail. The shell supplies resolved
- * widths and only the columns allowed by the current responsive breakpoint.
- */
-
-import { useLayoutEffect, useRef } from "preact/hooks";
-import { Graph } from "../graph/Graph";
-import type { ColorScheme } from "../graph/graph.model";
-import type { PositionStorage } from "../graph/positions";
-import type { RendererFactory } from "../graph/renderer";
-import type { SchemeHost } from "../graph/scheme";
-import { Note } from "../note/Note";
-import { Tree } from "../tree/Tree";
-import type { GraphPayload, NotePayload } from "../../shared/wire";
-import type { ColumnId, DividerId, ResolvedColumn } from "./layout.model";
-import { ContextRail } from "./ContextRail";
-import { emptyStateFor } from "./shell.model";
-import { Divider } from "./Divider";
-
-export interface ColumnsProps {
-  resolved: readonly ResolvedColumn[];
-  onDown: (divider: DividerId, clientX: number) => void;
-  onMove: (clientX: number) => void;
-  onUp: () => void;
-  onKey: (divider: DividerId, key: string) => void;
-  /** The §1.3 context bus, as the columns see it. */
-  graph: GraphPayload | null;
-  note: NotePayload | null;
-  noteFailed: boolean;
-  selectedId: string | null;
-  recentIds: ReadonlySet<string>;
-  /**
-   * The §1.3 context bus.
-   *
-   * Takes `string | null` because the graph can *clear* the selection — a
-   * click on empty stage — and no other column can. `workspace.ts`'s `select`
-   * has always accepted `null`; this prop was merely narrower than the thing
-   * behind it. The tree, the note column and the rail pass a `string`, which
-   * a handler accepting the wider type takes without a cast.
-   */
-  onSelect: (id: string | null) => void;
-  onRefresh: () => void;
-  onOpen: (slug: string) => void;
-  /** Save a note's body. Resolves `true` when the write landed. */
-  onSave: (slug: string, body: string) => Promise<boolean>;
-  /**
-   * Ask before a mutation that would invalidate an open draft, closing it if
-   * the user agrees. `false` means keep editing: do not proceed.
-   */
-  onMutate: () => boolean;
-  /** Slot the note column fills with its editor handle, for the shell's guards. */
-  editor: { current: { dirty(): boolean; discard(): void } | null };
-  /** Epoch ms for relative times, read once per render by the shell. */
-  now: number;
-  /**
-   * The graph column's three injected ports (§7.5, §10).
-   *
-   * Threaded through rather than imported by `Graph.tsx` for the reason
-   * `api.dom.ts` exists: `createSigmaRenderer` imports sigma, which is a
-   * `ReferenceError` outside a browser, so the module that names it must stay
-   * reachable only from a `.tsx` entry point.
-   */
-  renderer: RendererFactory;
-  storage: PositionStorage;
-  host: SchemeHost;
-  /**
-   * The scheme the shell resolved from the user's theme choice
-   * (`shell/theme.model.ts`'s `effectiveScheme`), or `null` to let the column
-   * read the OS (`graph/scheme.ts`'s `schemeOf`). The stylesheet carries the
-   * choice to everything CSS paints; WebGL cannot read custom properties, so
-   * the graph needs the decision handed to it as a value.
-   */
-  scheme: ColorScheme | null;
-  /** The boot graph fetch failed — see `state.ts`'s `graphFailed`. */
-  bootFailed: boolean;
-  /** Slot the graph column fills with its `fit`, for the global `g` key. */
-  fit: { current: (() => void) | null };
-  /** `?sliders=1` — the hidden force tuner (docs/weave-workspace.md §15.7). */
-  tuner: boolean;
-}
-
-/** One column: a titled region and whichever surface fills it. */
-function Column({ id, props }: { id: ColumnId; props: ColumnsProps }) {
-  const copy = emptyStateFor(id);
-  return (
-    <section class={`weave-col weave-col-${id}`} aria-label={copy.title}>
-      <h2 class="weave-col-title">{copy.title}</h2>
-      {id === "tree" ? <Tree graph={props.graph} selectedId={props.selectedId} recentIds={props.recentIds} onSelect={props.onSelect} onMutate={props.onMutate} onRefresh={props.onRefresh} now={props.now} /> : null}
-      {id === "note" ? (
-        <Note
-          note={props.note}
-          loadFailed={props.noteFailed}
-          graph={props.graph}
-          selectedId={props.selectedId}
-          onSelect={props.onSelect}
-          now={props.now}
-          onOpen={props.onOpen}
-          onSave={props.onSave}
-          editor={props.editor}
-        />
-      ) : null}
-      {id === "graph" ? (
-        <Graph
-          graph={props.graph}
-          selectedId={props.selectedId}
-          onSelect={props.onSelect}
-          renderer={props.renderer}
-          storage={props.storage}
-          host={props.host}
-          scheme={props.scheme}
-          bootFailed={props.bootFailed}
-          fit={props.fit}
-          tuner={props.tuner}
-        />
-      ) : null}
-      {id === "graph" ? <ContextRail graph={props.graph} selectedId={props.selectedId} onSelect={props.onSelect} /> : null}
-    </section>
-  );
-}
-
-export function Columns(props: ColumnsProps) {
-  const grid = useRef<HTMLDivElement | null>(null);
-  useLayoutEffect(() => {
-    const element = grid.current;
-    if (element === null) return;
-    for (const { id, width } of props.resolved) element.style.setProperty(`--weave-col-${id}`, `${Math.round(width)}px`);
-  }, [props.resolved]);
-  return <div class="weave-grid" ref={grid} data-columns={props.resolved.length}>
-    {props.resolved.map((column, index) => {
-      const divider: DividerId | null = index < props.resolved.length - 1 && column.id !== "graph" ? column.id : null;
-      return [
-        <Column key={`${column.id}-column`} id={column.id} props={props} />,
-        divider === null ? null : <Divider key={`${column.id}-divider`} label={`Resize ${column.id} column`}
-          onDown={(x) => props.onDown(divider, x)} onMove={props.onMove} onUp={props.onUp}
-          onKey={(key) => props.onKey(divider, key)} />,
-      ];
-    })}
-  </div>;
-}

package/src/web/client/shell/Divider.tsx

@@ -1,15 +0,0 @@
-export interface DividerProps {
-  label: string;
-  onDown: (clientX: number) => void;
-  onMove: (clientX: number) => void;
-  onUp: () => void;
-  onKey: (key: string) => void;
-}
-
-export function Divider(props: DividerProps) {
-  return <div class="weave-divider" role="separator" aria-orientation="vertical" aria-label={props.label} tabIndex={0}
-    onPointerDown={(event) => { event.currentTarget.setPointerCapture(event.pointerId); props.onDown(event.clientX); }}
-    onPointerMove={(event) => props.onMove(event.clientX)}
-    onPointerUp={(event) => { event.currentTarget.releasePointerCapture(event.pointerId); props.onUp(); }}
-    onKeyDown={(event) => props.onKey(event.key)} />;
-}