@zq-silk/yui 2.3.0 → 2.5.0

package/dist/web/assets/client/index.js

@@ -0,0 +1,114 @@
+// Client module registry. Each module is an ES module served at
+// /assets/js/<path>.js; the entry script is served at /assets/app.js.
+// Layers import only downward:
+//   lib/     browser utilities (DOM, formatting, preferences, i18n, theme, API)
+//   ui/      domain-free components (primitives, containers, controls, forms)
+//   domain/  Yui vocabulary and record rendering (Context reads, work, runs)
+//   views/   page regions (sidebar, overview, Task page, dock, dialogs)
+//   layout/  workspace columns, sizing, URL state, keyboard shortcuts
+//   app/     the composition root (main) and the controllers that own view
+//            state; each controller takes one explicit deps object and only
+//            main wires controllers to each other
+// See ../README.md for the module map.
+// In-module imports are single-line `import { … } from "/assets/js/…"`.
+import { API_SCRIPT } from "./lib/api.js";
+import { DOM_SCRIPT } from "./lib/dom.js";
+import { FORMAT_SCRIPT } from "./lib/format.js";
+import { I18N_SCRIPT } from "./lib/i18n.js";
+import { MARKDOWN_SCRIPT } from "./lib/markdown.js";
+import { PREFS_SCRIPT } from "./lib/prefs.js";
+import { THEME_SCRIPT } from "./lib/theme.js";
+import { CONTAINERS_SCRIPT } from "./ui/containers.js";
+import { CONTROLS_SCRIPT } from "./ui/controls.js";
+import { FORMS_SCRIPT } from "./ui/forms.js";
+import { METRICS_SCRIPT } from "./ui/metrics.js";
+import { PRIMITIVES_SCRIPT } from "./ui/primitives.js";
+import { TEXT_SCRIPT } from "./ui/text.js";
+import { TOAST_SCRIPT } from "./ui/toast.js";
+import { CONTEXT_SCRIPT } from "./domain/context.js";
+import { RECORDS_SCRIPT } from "./domain/records.js";
+import { RUNS_SCRIPT } from "./domain/runs.js";
+import { TASK_FORMS_SCRIPT } from "./domain/taskForms.js";
+import { VOCAB_SCRIPT } from "./domain/vocab.js";
+import { WORK_SCRIPT } from "./domain/work.js";
+import { DISCUSSION_SCRIPT } from "./views/dock/discussion.js";
+import { CONVERSATION_SCRIPT } from "./views/dock/conversation.js";
+import { TERMINAL_SCRIPT } from "./views/dock/terminal.js";
+import { PREVIEW_SCRIPT } from "./views/dock/preview.js";
+import { GLOBAL_INPUT_SCRIPT } from "./views/globalInput.js";
+import { CREATE_TASK_SCRIPT } from "./views/createTask.js";
+import { BODY_SEARCH_SCRIPT } from "./views/bodySearch.js";
+import { OVERVIEW_SCRIPT } from "./views/overview.js";
+import { SIDEBAR_SCRIPT } from "./views/sidebar.js";
+import { TASK_DELIVERY_SCRIPT } from "./views/task/delivery.js";
+import { TASK_DELIVERY_RESULTS_SCRIPT } from "./views/task/deliveryResults.js";
+import { TASK_FILES_SCRIPT } from "./views/task/files.js";
+import { TASK_OBSERVATION_SCRIPT } from "./views/task/observation.js";
+import { TASK_OVERVIEW_SCRIPT } from "./views/task/overview.js";
+import { TASK_PAGE_SCRIPT } from "./views/task/page.js";
+import { TASK_ACTIONS_SCRIPT } from "./views/task/actions.js";
+import { TASK_RECORDS_SCRIPT } from "./views/task/records.js";
+import { TASK_RUNTIME_SCRIPT } from "./views/task/runtime.js";
+import { TASK_TIMELINE_SCRIPT } from "./views/task/timeline.js";
+import { RESIZER_SCRIPT } from "./layout/resizer.js";
+import { ROUTER_SCRIPT } from "./layout/router.js";
+import { SHORTCUTS_SCRIPT } from "./layout/shortcuts.js";
+import { SIZING_SCRIPT } from "./layout/sizing.js";
+import { WORKSPACE_SCRIPT } from "./layout/workspace.js";
+import { CATALOG_SCRIPT } from "./app/catalog.js";
+import { SELECTION_SCRIPT } from "./app/selection.js";
+import { TASK_VIEW_SCRIPT } from "./app/taskView.js";
+import { SETTINGS_SCRIPT } from "./app/settings.js";
+import { SKILLS_SCRIPT } from "./views/skills.js";
+export { APP_SCRIPT } from "./app/main.js";
+export const CLIENT_MODULES = Object.freeze({
+    "views/skills": SKILLS_SCRIPT,
+    "lib/dom": DOM_SCRIPT,
+    "lib/format": FORMAT_SCRIPT,
+    "lib/prefs": PREFS_SCRIPT,
+    "lib/i18n": I18N_SCRIPT,
+    "lib/theme": THEME_SCRIPT,
+    "lib/api": API_SCRIPT,
+    "lib/markdown": MARKDOWN_SCRIPT,
+    "ui/primitives": PRIMITIVES_SCRIPT,
+    "ui/containers": CONTAINERS_SCRIPT,
+    "ui/text": TEXT_SCRIPT,
+    "ui/controls": CONTROLS_SCRIPT,
+    "ui/forms": FORMS_SCRIPT,
+    "ui/metrics": METRICS_SCRIPT,
+    "ui/toast": TOAST_SCRIPT,
+    "domain/vocab": VOCAB_SCRIPT,
+    "domain/context": CONTEXT_SCRIPT,
+    "domain/records": RECORDS_SCRIPT,
+    "domain/work": WORK_SCRIPT,
+    "domain/runs": RUNS_SCRIPT,
+    "domain/taskForms": TASK_FORMS_SCRIPT,
+    "views/sidebar": SIDEBAR_SCRIPT,
+    "views/overview": OVERVIEW_SCRIPT,
+    "views/globalInput": GLOBAL_INPUT_SCRIPT,
+    "views/createTask": CREATE_TASK_SCRIPT,
+    "views/bodySearch": BODY_SEARCH_SCRIPT,
+    "views/dock/discussion": DISCUSSION_SCRIPT,
+    "views/dock/conversation": CONVERSATION_SCRIPT,
+    "views/dock/terminal": TERMINAL_SCRIPT,
+    "views/dock/preview": PREVIEW_SCRIPT,
+    "views/task/page": TASK_PAGE_SCRIPT,
+    "views/task/actions": TASK_ACTIONS_SCRIPT,
+    "views/task/overview": TASK_OVERVIEW_SCRIPT,
+    "views/task/observation": TASK_OBSERVATION_SCRIPT,
+    "views/task/runtime": TASK_RUNTIME_SCRIPT,
+    "views/task/timeline": TASK_TIMELINE_SCRIPT,
+    "views/task/records": TASK_RECORDS_SCRIPT,
+    "views/task/delivery": TASK_DELIVERY_SCRIPT,
+    "views/task/deliveryResults": TASK_DELIVERY_RESULTS_SCRIPT,
+    "views/task/files": TASK_FILES_SCRIPT,
+    "layout/resizer": RESIZER_SCRIPT,
+    "layout/sizing": SIZING_SCRIPT,
+    "layout/workspace": WORKSPACE_SCRIPT,
+    "layout/router": ROUTER_SCRIPT,
+    "layout/shortcuts": SHORTCUTS_SCRIPT,
+    "app/catalog": CATALOG_SCRIPT,
+    "app/taskView": TASK_VIEW_SCRIPT,
+    "app/settings": SETTINGS_SCRIPT,
+    "app/selection": SELECTION_SCRIPT
+});

package/dist/web/assets/client/layout/resizer.js

@@ -0,0 +1,37 @@
+export const RESIZER_SCRIPT = String.raw `
+// A column divider (role="separator") that resizes by pointer drag, arrow /
+// Home / End keys and an optional double-click reset. Dragging is a desktop
+// gesture: below the narrow breakpoint the columns stack and nothing resizes.
+//
+// options: narrow (breakpoint px), bodyClass (set on <body> while dragging),
+// drag(event), release() after a drag, keyWidth(event) → width or null,
+// setWidth(width) for keyboard changes, reset() on double-click.
+export function bindResizeHandle(handle, options) {
+  let dragging = false;
+  handle.addEventListener("pointerdown", function (event) {
+    if (event.button !== 0 || window.innerWidth <= options.narrow) return;
+    dragging = true;
+    handle.setPointerCapture(event.pointerId);
+    document.body.classList.add(options.bodyClass);
+    event.preventDefault();
+  });
+  handle.addEventListener("pointermove", function (event) {
+    if (dragging) options.drag(event);
+  });
+  function finish() {
+    if (!dragging) return;
+    dragging = false;
+    document.body.classList.remove(options.bodyClass);
+    options.release();
+  }
+  handle.addEventListener("pointerup", finish);
+  handle.addEventListener("pointercancel", finish);
+  handle.addEventListener("keydown", function (event) {
+    const width = options.keyWidth(event);
+    if (width === null) return;
+    event.preventDefault();
+    options.setWidth(width);
+  });
+  if (options.reset) handle.addEventListener("dblclick", options.reset);
+}
+`;

package/dist/web/assets/client/layout/router.js

@@ -0,0 +1,35 @@
+export const ROUTER_SCRIPT = String.raw `
+// URL state. The selected Task, section, status filter, search, attention
+// filter and archive scope live in the query string so back/forward, refresh
+// and deep links keep context. Empty parameters are dropped.
+export function readQuery() { return new URLSearchParams(window.location.search); }
+
+export function applyUrl(params, replace) {
+  const entries = Array.from(params.entries()).filter(function (entry) { return entry[1] !== ""; });
+  const search = entries.length ? "?" + entries.map(function (entry) {
+    return encodeURIComponent(entry[0]) + "=" + encodeURIComponent(entry[1]);
+  }).join("&") : "";
+  const url = window.location.pathname + search + window.location.hash;
+  history[replace ? "replaceState" : "pushState"]({ task: params.get("task") || null }, "", url);
+}
+
+export function urlTaskId() { return readQuery().get("task") || null; }
+
+export function syncUrl(state, replace) {
+  const params = readQuery();
+  if (state.selected) params.set("task", state.selected);
+  else { params.delete("task"); params.delete("section"); }
+  if (state.filter !== "all") params.set("filter", state.filter); else params.delete("filter");
+  if (state.query) params.set("q", state.query); else params.delete("q");
+  if (state.attentionFilter) params.set("attention", state.attentionFilter); else params.delete("attention");
+  if (state.catalogAll) params.set("all", "true"); else params.delete("all");
+  applyUrl(params, replace);
+}
+
+export function setSectionParam(state, section) {
+  const params = readQuery();
+  if (!state.selected || params.get("section") === section) return;
+  if (section === "overview") params.delete("section"); else params.set("section", section);
+  applyUrl(params, true);
+}
+`;

package/dist/web/assets/client/layout/shortcuts.js

@@ -0,0 +1,45 @@
+import { TASK_TABS } from "../../shared/taskTabs.js";
+export const SHORTCUTS_SCRIPT = String.raw `
+// Keyboard shortcuts (listed in the settings dialog). They yield to open
+// dialogs, to typing and to a focused native Session, which needs its own keys.
+import { isEditing } from "/assets/js/lib/dom.js";
+
+const TABS = ${JSON.stringify(TASK_TABS)};
+
+// deps: { el, state, globalInput, workspace, selection, catalog, taskView }
+//   el           #search, #settings-dialog and #terminal-host
+//   state        read-only here: state.selected, state.detail
+//   globalInput  views/globalInput (its dialog blocks shortcuts while open)
+//   workspace    layout/workspace: the dock and the operator Session
+//   selection    app/selection: Escape leaves the Task
+//   catalog      app/catalog: "r" refreshes
+//   taskView     app/taskView: 1–4 switch tabs
+export function bindShortcuts(deps) {
+  document.addEventListener("keydown", function (event) {
+    if (document.querySelector("dialog[open]")) return;
+    const active = document.activeElement;
+    const typing = isEditing(active);
+    const inTerminal = deps.el.terminalHost.contains(active);
+    if (event.key === "Escape") { escape(deps, active, typing, inTerminal); return; }
+    if (typing || inTerminal || event.metaKey || event.ctrlKey || event.altKey) return;
+    shortcut(deps, event);
+  });
+}
+
+// Escape unwinds one level: leave a field, close the dock, leave the Task.
+function escape(deps, active, typing, inTerminal) {
+  if (inTerminal) return;
+  if (typing) { active.blur(); return; }
+  if (deps.workspace.dockVisible()) { deps.workspace.setDockOpen(false); return; }
+  if (deps.state.selected) deps.selection.clearSelection();
+}
+
+function shortcut(deps, event) {
+  const key = event.key.toLowerCase();
+  if (key === "/") { event.preventDefault(); deps.el.search.focus(); deps.el.search.select(); }
+  else if (key === "r") deps.catalog.refresh();
+  else if (key === "o") deps.workspace.openOperator();
+  else if (key === "d") deps.workspace.toggleDock();
+  else if (/^[1-9]$/.test(key) && Number(key) <= TABS.length && deps.state.detail) deps.taskView.switchTab(TABS[Number(key) - 1]);
+}
+`;

package/dist/web/assets/client/layout/sizing.js

@@ -0,0 +1,95 @@
+import { LAYOUT_GEOMETRY } from "../../shared/geometry.js";
+export const SIZING_SCRIPT = String.raw `
+// Column widths. The task list and the dock are user-sized preferences; the
+// width actually applied is clamped so the task column keeps its minimum in
+// the current window. Geometry comes from shared/geometry.ts.
+import { writePreference, clearPreference } from "/assets/js/lib/prefs.js";
+import { bindResizeHandle } from "/assets/js/layout/resizer.js";
+
+const G = ${JSON.stringify(LAYOUT_GEOMETRY)};
+
+function clamp(value, min, max) {
+  return Math.max(min, Math.min(max, value));
+}
+
+// el: { sidebar, sidebarDivider, dock, divider }; dock: the dock view state
+// (width, center); sidebar: { width } where null keeps the CSS default.
+export function createSizing(el, dock, sidebar, dockVisible) {
+  const root = document.documentElement.style;
+
+  function maxDockWidth() {
+    const aside = window.innerWidth > G.narrow ? el.sidebar.offsetWidth : 0;
+    return Math.max(G.dock.min, Math.min(G.dock.max, window.innerWidth - aside - G.centerMin));
+  }
+  function setDockWidth(width, persist) {
+    const effective = clamp(width, G.dock.min, maxDockWidth());
+    root.setProperty("--dock-w", effective + "px");
+    el.divider.setAttribute("aria-valuemax", String(maxDockWidth()));
+    el.divider.setAttribute("aria-valuenow", String(effective));
+    if (persist) { dock.width = effective; writePreference("yui.dock.width", String(effective)); }
+  }
+  function maxSidebarWidth() {
+    // An open dock can shrink to its minimum, so it reserves only that much.
+    const reserve = dockVisible() ? G.dock.min + G.divider : 0;
+    return Math.max(G.sidebar.min, Math.min(G.sidebar.max, window.innerWidth - reserve - G.centerMin));
+  }
+  function applySidebarWidth() {
+    if (sidebar.width === null) root.removeProperty("--sidebar-w");
+    else root.setProperty("--sidebar-w", clamp(sidebar.width, G.sidebar.min, maxSidebarWidth()) + "px");
+    // A wider task list leaves the dock less room; the dock keeps its stored width.
+    setDockWidth(dock.width, false);
+    el.sidebarDivider.setAttribute("aria-valuemax", String(maxSidebarWidth()));
+    el.sidebarDivider.setAttribute("aria-valuenow", String(el.sidebar.offsetWidth));
+  }
+  function setSidebarWidth(width, persist) {
+    sidebar.width = width === null ? null : clamp(Math.round(width), G.sidebar.min, maxSidebarWidth());
+    if (persist) {
+      if (sidebar.width === null) clearPreference("yui.sidebar.width");
+      else writePreference("yui.sidebar.width", String(sidebar.width));
+    }
+    applySidebarWidth();
+  }
+
+  const sizing = { maxDockWidth, setDockWidth, maxSidebarWidth, applySidebarWidth, setSidebarWidth };
+  bindDockDivider(el, dock, sizing);
+  bindSidebarDivider(el, sidebar, sizing);
+  window.addEventListener("resize", applySidebarWidth);
+  return sizing;
+}
+
+function bindDockDivider(el, dock, sizing) {
+  bindResizeHandle(el.divider, {
+    narrow: G.narrow, bodyClass: "dock-resizing",
+    drag: function (event) {
+      const rect = el.dock.getBoundingClientRect();
+      const width = dock.center ? event.clientX - rect.left : rect.right - event.clientX;
+      sizing.setDockWidth(width, false);
+      dock.width = clamp(width, G.dock.min, sizing.maxDockWidth());
+    },
+    release: function () { writePreference("yui.dock.width", String(dock.width)); },
+    keyWidth: function (event) {
+      // The dock grows away from the divider: leftwards at the end, rightwards in the center.
+      const grow = dock.center ? "ArrowRight" : "ArrowLeft";
+      const shrink = dock.center ? "ArrowLeft" : "ArrowRight";
+      return event.key === grow ? dock.width + G.dock.step : event.key === shrink ? dock.width - G.dock.step
+        : event.key === "Home" ? G.dock.min : event.key === "End" ? sizing.maxDockWidth() : null;
+    },
+    setWidth: function (width) { sizing.setDockWidth(width, true); }
+  });
+}
+
+function bindSidebarDivider(el, sidebar, sizing) {
+  bindResizeHandle(el.sidebarDivider, {
+    narrow: G.narrow, bodyClass: "sidebar-resizing",
+    drag: function (event) { sizing.setSidebarWidth(event.clientX - el.sidebar.getBoundingClientRect().left, false); },
+    release: function () { if (sidebar.width !== null) writePreference("yui.sidebar.width", String(sidebar.width)); },
+    keyWidth: function (event) {
+      const current = el.sidebar.offsetWidth;
+      return event.key === "ArrowRight" ? current + G.sidebar.step : event.key === "ArrowLeft" ? current - G.sidebar.step
+        : event.key === "Home" ? G.sidebar.min : event.key === "End" ? sizing.maxSidebarWidth() : null;
+    },
+    setWidth: function (width) { sizing.setSidebarWidth(width, true); },
+    reset: function () { sizing.setSidebarWidth(null, true); }
+  });
+}
+`;

package/dist/web/assets/client/layout/workspace.js

@@ -0,0 +1,247 @@
+import { BREAKPOINTS, DOCK } from "../../shared/geometry.js";
+export const WORKSPACE_SCRIPT = String.raw `
+// The sidebar | center | dock workspace. The dock holds the Task discussion
+// or a live native Session; on desktop it is a resizable column (at the end or
+// in the center), below the narrow breakpoint a full-screen sheet opened
+// explicitly per Task. Everything here is view state and browser preference.
+import { readPreference, writePreference, readSessionAccessMode } from "/assets/js/lib/prefs.js";
+import { markSelected } from "/assets/js/lib/dom.js";
+import { createSizing } from "/assets/js/layout/sizing.js";
+
+const NARROW_QUERY = "(max-width: ${BREAKPOINTS.narrow}px)";
+const DOCK_INITIAL = ${DOCK.initial};
+
+// deps: { el, state, terminal, sessionOpened }
+//   el        the shell elements (dock, dividers, sidebar, operator button,
+//             and the Task page's [data-dock-toggle] buttons inside el.detail)
+//   state     read-only here: state.selected
+//   terminal  the dock's native Session (views/dock/terminal)
+//   sessionOpened()  a Session was just opened in the dock; the caller
+//             refreshes the Session target chips (app/taskView).
+// The dock state (open, mode, side, width, sheet) is private to this module.
+export function createWorkspace(deps) {
+  const ws = {
+    deps: deps,
+    dock: readDockState(),
+    // Task list width: null keeps the CSS default (--sidebar-w); otherwise
+    // the width the user dragged to.
+    sidebar: { width: Number(readPreference("yui.sidebar.width", "")) || null },
+    narrow: window.matchMedia(NARROW_QUERY),
+    sizing: null
+  };
+  ws.sizing = createSizing(deps.el, ws.dock, ws.sidebar, function () { return dockVisible(ws); });
+  bindDockControls(ws);
+  ws.narrow.addEventListener("change", function () { updateLayout(ws); });
+  return {
+    dockVisible: function () { return dockVisible(ws); },
+    updateLayout: function () { updateLayout(ws); },
+    syncDockButtons: function () { syncDockButtons(ws); },
+    setDockOpen: function (open) { setDockOpen(ws, open); },
+    toggleDock: function (mode) { toggleDock(ws, mode); },
+    openSession: function (target) { openSession(ws, target); },
+    openConversation: function (target, materials) {
+      ws.deps.terminal.close();
+      showDock(ws, true);
+      ws.dock.mode = "conversation";
+      updateLayout(ws);
+      ws.deps.conversation.open(target, { current: true, materials: materials });
+      syncDockButtons(ws);
+    },
+    openOperator: function () { openOperator(ws); },
+    restoreDefaultMode: function () {
+      if (!ws.deps.state.selected && ws.dock.open && !ws.narrow.matches && preferredMode() === "session") {
+        openSession(ws, { scope: "global", roleName: "operator" });
+      }
+    },
+    // A newly selected Task starts with the narrow-screen sheet closed.
+    enterTask: function () {
+      ws.deps.terminal.close();
+      ws.terminalTarget = { scope: "task", taskId: ws.deps.state.selected, roleName: "leader" };
+      ws.dock.sheet = false;
+      ws.dock.mode = preferredMode();
+      ws.deps.conversation.open({ scope: "task", taskId: ws.deps.state.selected, roleName: "leader" });
+      if (ws.dock.mode === "session" && !ws.narrow.matches && ws.dock.open) {
+        ws.deps.terminal.open({ scope: "task", taskId: ws.deps.state.selected, roleName: "leader" });
+      }
+    },
+    leaveTask: function () { leaveTask(ws); }
+  };
+}
+
+function readDockState() {
+  return {
+    open: readPreference("yui.dock.open", "true") !== "false",
+    mode: "conversation",
+    center: readPreference("yui.dock.side", "end") === "center",
+    width: Number(readPreference("yui.dock.width", String(DOCK_INITIAL))) || DOCK_INITIAL,
+    // On narrow screens the dock is a full-screen sheet opened explicitly per
+    // Task, never restored from the desktop preference.
+    sheet: false
+  };
+}
+
+function preferredMode() {
+  return readSessionAccessMode() === "native" ? "session" : "conversation";
+}
+
+function dockVisible(ws) {
+  const dock = ws.dock;
+  if (ws.narrow.matches ? !dock.sheet : !dock.open) return false;
+  if (ws.deps.state.selected) return true;
+  if (dock.mode === "conversation") return true;
+  return dock.mode === "session" && !!ws.deps.terminal.current();
+}
+
+function updateLayout(ws) {
+  const el = ws.deps.el;
+  const dock = ws.dock;
+  const selected = !!ws.deps.state.selected;
+  const visible = dockVisible(ws);
+  document.body.classList.toggle("task-open", selected);
+  document.body.classList.toggle("dock-open", visible);
+  document.body.classList.toggle("dock-center", dock.center);
+  el.dock.hidden = !visible;
+  el.divider.hidden = !visible;
+  el.discussion.hidden = dock.mode !== "discussion";
+  el.session.hidden = dock.mode !== "session";
+  el.conversation.hidden = dock.mode !== "conversation";
+  el.preview.hidden = dock.mode !== "preview";
+  el.dockTabPreview.setAttribute("aria-selected", String(dock.mode === "preview"));
+  el.dockTabPreview.disabled = !selected;
+  if (visible && dock.mode === "preview" && selected) ws.deps.preview.open(ws.deps.state.selected);
+  else ws.deps.preview.close();
+  el.dockTabConversation.setAttribute("aria-selected", String(dock.mode === "conversation"));
+  el.dockTabDiscussion.setAttribute("aria-selected", String(dock.mode === "discussion"));
+  el.dockTabSession.setAttribute("aria-selected", String(dock.mode === "session"));
+  el.dockTabDiscussion.disabled = !selected;
+  el.dockSwap.setAttribute("aria-pressed", String(dock.center));
+  ws.sizing.applySidebarWidth();
+  syncDockButtons(ws);
+}
+
+function syncDockButtons(ws) {
+  const el = ws.deps.el;
+  const visible = dockVisible(ws);
+  markSelected(el.detail.querySelectorAll("[data-dock-toggle]"), "aria-pressed", function (button) {
+    return visible && ws.dock.mode === button.dataset.dockToggle;
+  });
+  el.operator.setAttribute("aria-pressed", String(operatorShown(ws)));
+}
+
+// The dock currently shows the global operator Session.
+function operatorShown(ws) {
+  if (ws.dock.mode === "conversation") return dockVisible(ws) && ws.deps.conversation.current()?.scope === "global";
+  const current = ws.deps.terminal.current();
+  return dockVisible(ws) && ws.dock.mode === "session" && !!current && current.scope === "global";
+}
+
+function showDock(ws, open) {
+  if (ws.narrow.matches) ws.dock.sheet = open;
+  else {
+    ws.dock.open = open;
+    writePreference("yui.dock.open", String(open));
+  }
+}
+
+function setDockOpen(ws, open) {
+  showDock(ws, open);
+  if (!open) {
+    ws.terminalTarget = ws.deps.terminal.current() || ws.terminalTarget;
+    ws.deps.terminal.close();
+  }
+  if (!open) ws.deps.conversation.close();
+  if (open && ws.dock.mode === "conversation") ws.deps.conversation.reconnect();
+  if (open && ws.dock.mode === "session") {
+    // Keep the selected owner, not a Session identity cached before hiding.
+    const target = ws.terminalTarget || { scope: "global", roleName: "operator" };
+    ws.deps.terminal.open({ scope: target.scope, roleName: target.roleName,
+      ...(target.scope === "task" ? { taskId: target.taskId } : {}) });
+  }
+  updateLayout(ws);
+}
+
+function setDockMode(ws, mode) {
+  if (mode === "preview" && ws.deps.state.selected) {
+    ws.deps.terminal.close();
+    ws.deps.conversation.close();
+    ws.dock.mode = "preview";
+    updateLayout(ws);
+    return;
+  }
+  if (mode === "conversation") {
+    const target = ws.deps.terminal.current() || ws.deps.conversation.current();
+    ws.deps.terminal.close();
+    ws.dock.mode = mode;
+    updateLayout(ws);
+    ws.deps.conversation.open(target ? { scope: target.scope, ...(target.scope === "task" ? { taskId: target.taskId } : {}), roleName: target.roleName } : ws.deps.state.selected
+      ? { scope: "task", taskId: ws.deps.state.selected, roleName: "leader" }
+      : { scope: "global", roleName: "operator" });
+    return;
+  }
+  if (mode === "session") {
+    const target = ws.deps.conversation.selection();
+    if (!target) return;
+    openSession(ws, target);
+    return;
+  }
+  ws.deps.terminal.close();
+  ws.deps.conversation.close();
+  ws.dock.mode = mode === "session" || !ws.deps.state.selected ? "session" : "discussion";
+  updateLayout(ws);
+}
+
+function toggleDock(ws, mode) {
+  const dock = ws.dock;
+  const selected = ws.deps.state.selected;
+  if (dockVisible(ws) && (!mode || dock.mode === mode)) { setDockOpen(ws, false); return; }
+  if (mode) dock.mode = mode === "session" || !selected ? mode : "discussion";
+  if (!selected && dock.mode === "discussion") dock.mode = "session";
+  setDockOpen(ws, true);
+}
+
+function openSession(ws, target) {
+  ws.terminalTarget = target;
+  ws.deps.conversation.close();
+  ws.dock.mode = "session";
+  showDock(ws, true);
+  ws.deps.terminal.open(target);
+  updateLayout(ws);
+  ws.deps.sessionOpened();
+}
+
+function openOperator(ws) {
+  ws.deps.terminal.close();
+  showDock(ws, true);
+  setDockMode(ws, "conversation");
+  ws.deps.conversation.open({ scope: "global", roleName: "operator" });
+  if (preferredMode() === "session") openSession(ws, { scope: "global", roleName: "operator" });
+  syncDockButtons(ws);
+}
+
+// Leaving a Task: when the dock's last Session belonged to a Task and is no
+// longer connected, the dock returns to the discussion mode.
+function leaveTask(ws) {
+  ws.deps.terminal.close();
+  ws.dock.mode = "conversation";
+  ws.deps.conversation.open({ scope: "global", roleName: "operator" });
+}
+
+function bindDockControls(ws) {
+  const el = ws.deps.el;
+  const dock = ws.dock;
+  el.dockTabDiscussion.addEventListener("click", function () { setDockMode(ws, "discussion"); });
+  el.dockTabConversation.addEventListener("click", function () { setDockMode(ws, "conversation"); });
+  el.dockTabSession.addEventListener("click", function () { setDockMode(ws, "session"); });
+  el.dockTabPreview.addEventListener("click", function () { setDockMode(ws, "preview"); });
+  el.dockClose.addEventListener("click", function () { setDockOpen(ws, false); });
+  el.dockSwap.addEventListener("click", function () {
+    dock.center = !dock.center;
+    writePreference("yui.dock.side", dock.center ? "center" : "end");
+    updateLayout(ws);
+  });
+  el.operator.addEventListener("click", function () {
+    if (operatorShown(ws)) setDockOpen(ws, false);
+    else openOperator(ws);
+  });
+}
+`;

package/dist/web/assets/client/{api.js → lib/api.js}

@@ -57,12 +57,24 @@ export function releaseMutation(key) { unresolved.delete(key); }
 const task = function (taskId) { return "/api/tasks/" + encodeURIComponent(taskId); };
 
 export const api = {
+  searchBodies: function (query) { return requestJson("/api/search?" + query); },
+  searchSource: function (item, offset) {
+    return requestJson(task(item.taskId) + "/search-source?" + new URLSearchParams({
+      store: item.ref.store, ref: item.ref.refId, digest: item.ref.digest, field: item.field, offset: String(offset)
+    }));
+  },
   dashboard: function (query) { return requestJson("/api/dashboard?" + query); },
   pageSessions: function (query) {
     return requestJson("/api/dashboard/sessions?" + query, { signal: AbortSignal.timeout(5000) });
   },
   context: function (taskId) { return requestJson(task(taskId) + "/context"); },
-  observation: function (taskId) { return requestJson(task(taskId), { signal: AbortSignal.timeout(1500) }); },
+  workbench: function (taskId) { return requestJson(task(taskId) + "/workbench"); },
+  observation: function (taskId) { return requestJson(task(taskId) + "?compact=true", { signal: AbortSignal.timeout(1500) }); },
+  projects: function (after) { return requestJson("/api/projects" + (after ? "?after=" + encodeURIComponent(after) : "")); },
+  createTask: function (input) { return submitMutation("task/create", "/api/tasks", input); },
+  taskAction: function (taskId, action, requestId) {
+    return submitMutation(taskId + "/" + action, task(taskId) + "/" + action, { requestId });
+  },
   inspect: async function (taskId, ref) {
     const query = new URLSearchParams({ store: ref.store, ref: ref.refId });
     if (ref.digest) query.set("digest", ref.digest);
@@ -92,9 +104,13 @@ export const api = {
     });
     return requestJson(task(taskId) + "/list?" + query);
   },
-  artifacts: function (taskId) { return requestJson(task(taskId) + "/artifacts"); },
-  artifact: function (taskId, path, commit) {
-    return requestJson(task(taskId) + "/artifacts?" + new URLSearchParams({ path, commit }));
+  artifacts: function (taskId, commit, offset) {
+    return requestJson(task(taskId) + "/artifacts?" + new URLSearchParams(commit ? { commit, offset: offset || 0 } : {}));
+  },
+  artifact: function (taskId, path, commit, offset, before) {
+    return requestJson(task(taskId) + "/artifacts?" + new URLSearchParams({
+      path, commit, offset: offset || 0, ...(before ? { before } : {})
+    }));
   },
   evidence: function (taskId) { return requestJson(task(taskId) + "/evidence"); },
   panels: function (taskId) { return requestJson(task(taskId) + "/panels", { signal: AbortSignal.timeout(3000) }); },