@youtyan/code-viewer 0.9.2 → 0.10.0

package/README.md

@@ -39,9 +39,19 @@ Requires Node.js 20 or newer when installed from npm. Development uses
   too, without needing a `docker-compose.yml`.
   Table descriptions appear inside expanded table entries and in the Schema
   tab header when the database provides them.
-- Read the built-in Help page for getting started, the `.code-viewer/`
-  project files, AI annotations, datastores, the agent skill, and
-  keybindings.
+- Read the built-in Help page (last item in the header menu) for getting
+  started, the `.code-viewer/` project files, AI annotations, datastores,
+  the agent skill, and keybindings.
+- Scratch on pasted text without leaving the current screen with the Tools
+  drawer (the `Tools` item in the header menu, or `?tools=<tool>` on any
+  URL): Markdown
+  preview (same renderer as file preview, so table of contents, task lists,
+  frontmatter, code highlighting and ` ```mermaid ` fences all work),
+  Mermaid preview with zoom and drag-pan, and a JSON / YAML tool that
+  auto-detects the input and re-emits it as formatted JSON or YAML (also a
+  validator and a JSON⇄YAML converter). Each tool keeps its own draft in
+  `.code-viewer/tools.json`, and the drawer width is draggable from its left
+  edge.
 - Inspect the runtime with the Environment Doctor (right-side sheet,
   toggled by the 🩺 icon in the header): runtime (Node / Bun / ABI),
   `@youtyan/code-viewer` version and execution origin (npx cache vs

package/dist/code-viewer.js

@@ -129,6 +129,19 @@ function makeTimedId(prefix) {
 }
 var BASE36_ALPHABET = "0123456789abcdefghijklmnopqrstuvwxyz";
 
+// web-src/core/tools.ts
+function isToolId(value) {
+  return TOOL_IDS.includes(value);
+}
+var TOOL_IDS, MIN_TOOLS_SHEET_WIDTH = 480, MAX_TOOLS_SHEET_WIDTH = 4000;
+var init_tools = __esm(() => {
+  TOOL_IDS = [
+    "markdown",
+    "mermaid",
+    "json"
+  ];
+});
+
 // web-src/core/routes.ts
 function assertNever(value) {
   throw new Error(`unhandled route: ${JSON.stringify(value)}`);
@@ -232,6 +245,7 @@ function buildRoute(route) {
 }
 var SPA_PATHS, APP_ENTRY_PATHS;
 var init_routes = __esm(() => {
+  init_tools();
   SPA_PATHS = [
     "/todif",
     "/todiff",
@@ -16021,35 +16035,105 @@ function mergeDbUiState(current, patch) {
     version: 1
   });
 }
+function emptyToolsState() {
+  return { version: 1 };
+}
+function sanitizeToolsState(raw) {
+  if (!isRecord(raw))
+    return emptyToolsState();
+  const out = { version: 1 };
+  if (isToolId(raw.activeTool))
+    out.activeTool = raw.activeTool;
+  const width = optionalNumber(raw.width, MIN_TOOLS_SHEET_WIDTH, MAX_TOOLS_SHEET_WIDTH);
+  if (width !== undefined)
+    out.width = width;
+  if (isRecord(raw.drafts)) {
+    const drafts = {};
+    for (const id of TOOL_IDS) {
+      const draft = raw.drafts[id];
+      if (typeof draft !== "string")
+        continue;
+      if (draft.length === 0 || draft.length > MAX_TOOL_DRAFT_LEN)
+        continue;
+      drafts[id] = draft;
+    }
+    if (Object.keys(drafts).length > 0)
+      out.drafts = drafts;
+  }
+  return out;
+}
+function mergeToolsState(current, patch) {
+  if (!isRecord(patch))
+    return current;
+  const next = { ...current, version: 1 };
+  if ("activeTool" in patch) {
+    if (patch.activeTool === null)
+      delete next.activeTool;
+    else if (isToolId(patch.activeTool))
+      next.activeTool = patch.activeTool;
+  }
+  if ("width" in patch) {
+    if (patch.width === null)
+      delete next.width;
+    else {
+      const width = optionalNumber(patch.width, MIN_TOOLS_SHEET_WIDTH, MAX_TOOLS_SHEET_WIDTH);
+      if (width !== undefined)
+        next.width = width;
+    }
+  }
+  if (isRecord(patch.drafts)) {
+    const drafts = { ...next.drafts ?? {} };
+    for (const id of TOOL_IDS) {
+      if (!(id in patch.drafts))
+        continue;
+      const value = patch.drafts[id];
+      if (value === null || value === "") {
+        delete drafts[id];
+        continue;
+      }
+      if (typeof value !== "string")
+        continue;
+      if (value.length > MAX_TOOL_DRAFT_LEN)
+        throw new Error("tools state too large");
+      drafts[id] = value;
+    }
+    next.drafts = drafts;
+  }
+  return sanitizeToolsState(next);
+}
+function patchJsonState(store, root, patch, merge) {
+  return store.update(root, (state) => {
+    const next = merge(state, patch);
+    return { state: next, result: next };
+  });
+}
 async function loadAppSettingsState(root) {
   return settingsStore.load(root);
 }
 async function patchAppSettingsState(root, patch) {
-  return settingsStore.update(root, (state) => {
-    const next = mergeSettings(state, patch);
-    return { state: next, result: next };
-  });
+  return patchJsonState(settingsStore, root, patch, mergeSettings);
 }
 async function loadViewState(root) {
   return viewStateStore.load(root);
 }
 async function patchViewState(root, patch) {
-  return viewStateStore.update(root, (state) => {
-    const next = mergeViewState(state, patch);
-    return { state: next, result: next };
-  });
+  return patchJsonState(viewStateStore, root, patch, mergeViewState);
 }
 async function loadDbUiState(root) {
   return dbUiStore.load(root);
 }
 async function patchDbUiState(root, patch) {
-  return dbUiStore.update(root, (state) => {
-    const next = mergeDbUiState(state, patch);
-    return { state: next, result: next };
-  });
+  return patchJsonState(dbUiStore, root, patch, mergeDbUiState);
+}
+async function loadToolsState(root) {
+  return toolsStore.load(root);
 }
-var CODE_VIEWER_DIR2 = ".code-viewer", SETTINGS_FILE_NAME = "settings.json", VIEW_STATE_FILE_NAME = "view-state.json", DB_UI_FILE_NAME = "db-ui.json", MAX_SETTINGS_BYTES = 200000, MAX_VIEW_STATE_BYTES = 1e6, MAX_DB_UI_BYTES = 1e6, MAX_REF_LEN = 1024, MAX_KEY_LEN = 2048, MAX_VIEW_ITEMS = 20000, MAX_DB_UI_DBS = 200, MAX_DB_UI_TABLES = 500, MAX_DB_UI_COLUMNS = 1000, MAX_DB_UI_EXPANDED_SCOPES = 500, DB_UI_BOOL_PREF_KEYS, settingsStore, viewStateStore, dbUiStore;
+async function patchToolsState(root, patch) {
+  return patchJsonState(toolsStore, root, patch, mergeToolsState);
+}
+var CODE_VIEWER_DIR2 = ".code-viewer", SETTINGS_FILE_NAME = "settings.json", VIEW_STATE_FILE_NAME = "view-state.json", DB_UI_FILE_NAME = "db-ui.json", TOOLS_FILE_NAME = "tools.json", MAX_SETTINGS_BYTES = 200000, MAX_VIEW_STATE_BYTES = 1e6, MAX_DB_UI_BYTES = 1e6, MAX_TOOL_DRAFT_LEN = 200000, MAX_TOOLS_BYTES = 4000000, MAX_REF_LEN = 1024, MAX_KEY_LEN = 2048, MAX_VIEW_ITEMS = 20000, MAX_DB_UI_DBS = 200, MAX_DB_UI_TABLES = 500, MAX_DB_UI_COLUMNS = 1000, MAX_DB_UI_EXPANDED_SCOPES = 500, DB_UI_BOOL_PREF_KEYS, settingsStore, viewStateStore, dbUiStore, toolsStore;
 var init_state_store = __esm(() => {
+  init_tools();
   init_json_store();
   init_worktree_watcher();
   DB_UI_BOOL_PREF_KEYS = ["s3TooltipEnabled", "inferFkRails"];
@@ -16077,6 +16161,14 @@ var init_state_store = __esm(() => {
     backupSuffix: "corrupt",
     sizeErrorMessage: "db UI state too large"
   });
+  toolsStore = createJsonFileStore({
+    filePath: (root) => codeViewerPath(root, TOOLS_FILE_NAME),
+    empty: emptyToolsState,
+    sanitize: sanitizeToolsState,
+    maxBytes: MAX_TOOLS_BYTES,
+    backupSuffix: "corrupt",
+    sizeErrorMessage: "tools state too large"
+  });
 });
 
 // web-src/server/database/adapters/async-facade.ts
@@ -25433,50 +25525,48 @@ var exports_state_route = {};
 __export(exports_state_route, {
   handleStateRoute: () => handleStateRoute
 });
-async function parseJsonBody(req) {
-  return parseBoundedJsonBody(req, MAX_STATE_PATCH_BODY_BYTES, "state body too large");
+async function parseJsonBody(req, maxBytes) {
+  return parseBoundedJsonBody(req, maxBytes, "state body too large");
 }
-async function handleSettingsGet(cwd) {
-  return jsonLoadResponse(() => loadAppSettingsState(cwd), "state", "failed to load settings state");
-}
-async function handleSettingsPatch(cwd, req, onChange) {
-  const body = await parseJsonBody(req);
+async function handleStatePatch(cwd, req, patchState, tooLargeMessage, saveFailedMessage, maxBodyBytes, onChange) {
+  const body = await parseJsonBody(req, maxBodyBytes);
   if (body instanceof Response)
     return body;
   try {
-    const next = await patchAppSettingsState(cwd, body);
+    const next = await patchState(cwd, body);
     if (onChange) {
       try {
         onChange(next);
       } catch (notifyErr) {
-        console.warn("[code-viewer] settings change notify failed:", notifyErr);
+        console.warn("[code-viewer] state change notify failed:", notifyErr);
       }
     }
     return json(next);
   } catch (err) {
     const message = err instanceof Error ? err.message : String(err);
-    if (message === "settings state too large")
+    if (message === tooLargeMessage)
       return textError(message, 413);
     console.error("[code-viewer] state error:", err);
-    return textError("failed to save settings state", 500);
+    return textError(saveFailedMessage, 500);
   }
 }
+async function handleSettingsGet(cwd) {
+  return jsonLoadResponse(() => loadAppSettingsState(cwd), "state", "failed to load settings state");
+}
+async function handleSettingsPatch(cwd, req, onChange) {
+  return handleStatePatch(cwd, req, patchAppSettingsState, "settings state too large", "failed to save settings state", MAX_STATE_PATCH_BODY_BYTES, onChange);
+}
 async function handleViewGet(cwd) {
   return jsonLoadResponse(() => loadViewState(cwd), "state", "failed to load view state");
 }
 async function handleViewPatch(cwd, req) {
-  const body = await parseJsonBody(req);
-  if (body instanceof Response)
-    return body;
-  try {
-    return json(await patchViewState(cwd, body));
-  } catch (err) {
-    const message = err instanceof Error ? err.message : String(err);
-    if (message === "view state too large")
-      return textError(message, 413);
-    console.error("[code-viewer] state error:", err);
-    return textError("failed to save view state", 500);
-  }
+  return handleStatePatch(cwd, req, patchViewState, "view state too large", "failed to save view state", MAX_STATE_PATCH_BODY_BYTES);
+}
+async function handleToolsGet(cwd) {
+  return jsonLoadResponse(() => loadToolsState(cwd), "state", "failed to load tools state");
+}
+async function handleToolsPatch(cwd, req) {
+  return handleStatePatch(cwd, req, patchToolsState, "tools state too large", "failed to save tools state", MAX_TOOLS_PATCH_BODY_BYTES);
 }
 async function handleStateRoute(req, url, cwd, sideEffectAllowed, options = {}) {
   return dispatchRoutes(req, url, {
@@ -25489,10 +25579,15 @@ async function handleStateRoute(req, url, cwd, sideEffectAllowed, options = {})
       methods: ["GET", "PATCH"],
       sideEffect: (method) => method !== "GET",
       handler: () => req.method === "GET" ? handleViewGet(cwd) : handleViewPatch(cwd, req)
+    },
+    "/_state/tools": {
+      methods: ["GET", "PATCH"],
+      sideEffect: (method) => method !== "GET",
+      handler: () => req.method === "GET" ? handleToolsGet(cwd) : handleToolsPatch(cwd, req)
     }
   }, sideEffectAllowed, (res) => res, (err) => handleError("state", "handle state request", err));
 }
-var MAX_STATE_PATCH_BODY_BYTES = 1e6;
+var MAX_STATE_PATCH_BODY_BYTES = 1e6, MAX_TOOLS_PATCH_BODY_BYTES = 4000000;
 var init_state_route = __esm(() => {
   init_handle_shared();
   init_state_store();
@@ -25718,6 +25813,7 @@ function staticFile(pathname) {
     "/app.js": ["app.js", "application/javascript; charset=utf-8"],
     "/mermaid.js": ["mermaid.js", "application/javascript; charset=utf-8"],
     "/shiki.js": ["shiki.js", "application/javascript; charset=utf-8"],
+    "/yaml.js": ["yaml.js", "application/javascript; charset=utf-8"],
     "/vendor/diff2html/diff2html.min.css": [
       "vendor/diff2html/diff2html.min.css",
       "text/css; charset=utf-8"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@youtyan/code-viewer",
-  "version": "0.9.2",
+  "version": "0.10.0",
   "description": "Local browser-based code and git diff viewer",
   "type": "module",
   "bin": {
@@ -28,7 +28,7 @@
   ],
   "scripts": {
     "build": "bun run build:web && bun run build:server",
-    "build:web": "bun build --target=browser --format=iife --outfile=web/app.js web-src/app.ts && bun build --target=browser --format=esm --outfile=web/mermaid.js web-src/mermaid-entry.ts && bun build --target=browser --format=esm --outfile=web/shiki.js web-src/shiki-entry.ts && bun build --target=browser --format=iife --outfile=web/vendor/highlight.js/highlight.min.js web-src/highlight-entry.ts && node scripts/generate-third-party-notices.mjs",
+    "build:web": "bun build --target=browser --format=iife --outfile=web/app.js web-src/app.ts && bun build --target=browser --format=esm --outfile=web/mermaid.js web-src/mermaid-entry.ts && bun build --target=browser --format=esm --outfile=web/shiki.js web-src/shiki-entry.ts && bun build --target=browser --format=esm --outfile=web/yaml.js web-src/yaml-entry.ts && bun build --target=browser --format=iife --outfile=web/vendor/highlight.js/highlight.min.js web-src/highlight-entry.ts && node scripts/generate-third-party-notices.mjs",
     "build:server": "bun build --target=node --format=esm --outfile=dist/code-viewer.js --external pg --external mysql2/promise --external @redis/client web-src/server/cli.ts",
     "check": "bun run typecheck",
     "typecheck": "tsc --noEmit",
@@ -49,7 +49,7 @@
     "test:postgres:down": "docker compose -f data/test/postgresql/docker-compose.yml down -v",
     "test": "bun test",
     "lint": "biome lint web-src package.json biome.jsonc",
-    "verify": "bun run check && bun run lint && bun run check:format && bun run build && bun run check:bundle && bun run test && node --check web/app.js && node --check web/mermaid.js && node --check web/shiki.js && node --check web/vendor/highlight.js/highlight.min.js && node --check dist/code-viewer.js && node dist/code-viewer.js --help && node scripts/node-smoke.mjs",
+    "verify": "bun run check && bun run lint && bun run check:format && bun run build && bun run check:bundle && bun run test && node --check web/app.js && node --check web/mermaid.js && node --check web/shiki.js && node --check web/yaml.js && node --check web/vendor/highlight.js/highlight.min.js && node --check dist/code-viewer.js && node dist/code-viewer.js --help && node scripts/node-smoke.mjs",
     "pack:dry": "npm pack --dry-run",
     "prepack": "bun run build",
     "prepublishOnly": "bun run verify"
@@ -75,7 +75,8 @@
     "markdown-it-footnote": "4.0.0",
     "mermaid": "11.14.0",
     "shiki": "4.0.2",
-    "typescript": "5.9.3"
+    "typescript": "5.9.3",
+    "yaml": "2.9.0"
   },
   "optionalDependencies": {
     "better-sqlite3": "12.9.0"