@youtyan/code-viewer 0.3.0 → 0.4.0

package/web/app.js

@@ -6645,10 +6645,48 @@
     md.core.ruler.after("inline", "footnote_tail", footnote_tail);
   }
 
-  // web-src/core/markdown-preview.ts
+  // web-src/core/mermaid-loader.ts
+  var DEFAULT_CONFIG = {
+    startOnLoad: false,
+    securityLevel: "strict",
+    theme: "default",
+    er: { useMaxWidth: false }
+  };
   var mermaidPromise = null;
-  var mermaidInitialized = false;
-  var shikiPromise = null;
+  var initialized = false;
+  function loadMermaid() {
+    if (!mermaidPromise) {
+      mermaidPromise = import("/mermaid.js").then((mod) => {
+        const mermaid = mod.default;
+        if (!initialized) {
+          mermaid.initialize(DEFAULT_CONFIG);
+          initialized = true;
+        }
+        return mermaid;
+      }).catch(() => null);
+    }
+    return mermaidPromise;
+  }
+
+  // web-src/core/shiki-loader.ts
+  var cache = new Map;
+  function loadShikiHighlighter(options) {
+    const key = JSON.stringify({
+      themes: [...options.themes].sort(),
+      langs: [...options.langs].sort()
+    });
+    const cached = cache.get(key);
+    if (cached)
+      return cached;
+    const promise = import("/shiki.js").then((mod) => mod.createHighlighter({
+      themes: options.themes,
+      langs: options.langs
+    })).catch(() => null);
+    cache.set(key, promise);
+    return promise;
+  }
+
+  // web-src/core/markdown-preview.ts
   var MARKDOWN_FENCE_LANG_ALIASES = {
     sh: "bash",
     zsh: "bash",
@@ -6884,17 +6922,11 @@ ${frontmatter.yaml}
       body: textValue.slice(closing + newline2.length + 3 + newline2.length)
     };
   }
-  async function loadMarkdownHighlighter() {
-    if (!shikiPromise) {
-      shikiPromise = import("/shiki.js").then((mod) => {
-        const typed = mod;
-        return typed.createHighlighter({
-          themes: ["github-light", "github-dark"],
-          langs: MARKDOWN_SHIKI_LANGS
-        });
-      }).catch(() => null);
-    }
-    return shikiPromise;
+  function loadMarkdownHighlighter() {
+    return loadShikiHighlighter({
+      themes: ["github-light", "github-dark"],
+      langs: MARKDOWN_SHIKI_LANGS
+    });
   }
   function enhanceTaskLists(root) {
     root.querySelectorAll("[data-gdp-task]").forEach((inline2) => {
@@ -7091,24 +7123,6 @@ ${frontmatter.yaml}
       await renderMermaidError(node, mermaid);
     }
   }
-  async function loadMermaid() {
-    if (!mermaidPromise) {
-      mermaidPromise = import("/mermaid.js").then((mod) => {
-        const typed = mod;
-        const mermaid = typed.default;
-        if (!mermaidInitialized) {
-          mermaid.initialize({
-            startOnLoad: false,
-            securityLevel: "strict",
-            theme: "default"
-          });
-          mermaidInitialized = true;
-        }
-        return mermaid;
-      }).catch(() => null);
-    }
-    return mermaidPromise;
-  }
   function isMermaidErrorSvg(svg) {
     return !!svg && /Syntax error/i.test(svg.textContent || "");
   }
@@ -7210,12 +7224,12 @@ ${frontmatter.yaml}
       overlay.remove();
     };
     button("+", "zoom in", () => zoomCentered(1.25));
-    button("-", "zoom out", () => zoomCentered(0.8));
+    button("-", "zoom out", () => zoomCentered(1 / 1.25));
     button("fit", "fit", fit);
     button("x", "close", close);
     overlay.addEventListener("wheel", (e2) => {
       e2.preventDefault();
-      zoomAt(e2.clientX, e2.clientY, e2.deltaY < 0 ? 1.12 : 0.8928571428571428);
+      zoomAt(e2.clientX, e2.clientY, e2.deltaY < 0 ? 1.12 : 1 / 1.12);
     }, { passive: false });
     let dragging = false;
     let lastX = 0;
@@ -7251,7 +7265,7 @@ ${frontmatter.yaml}
       else if (e2.key === "+" || e2.key === "=")
         zoomCentered(1.25);
       else if (e2.key === "-")
-        zoomCentered(0.8);
+        zoomCentered(1 / 1.25);
     };
     window.addEventListener("mousemove", onMove);
     window.addEventListener("mouseup", onUp);
@@ -7281,6 +7295,235 @@ ${frontmatter.yaml}
     return { width: rect.width || 800, height: rect.height || 600 };
   }
 
+  // web-src/views/ui-dialog.ts
+  var BACKDROP_CLASS = "gdp-dialog-backdrop";
+  var DIALOG_CLASS = "gdp-dialog";
+  function closeOpenDialog() {
+    document.querySelector(`.${BACKDROP_CLASS}`)?.remove();
+  }
+  function createDialogShell(titleText, bodyText, actions) {
+    closeOpenDialog();
+    const backdrop = document.createElement("div");
+    backdrop.className = BACKDROP_CLASS;
+    const dialog = document.createElement("div");
+    dialog.className = DIALOG_CLASS;
+    dialog.setAttribute("role", "dialog");
+    dialog.setAttribute("aria-modal", "true");
+    if (titleText) {
+      const titleId = "gdp-dialog-title";
+      dialog.setAttribute("aria-labelledby", titleId);
+      const heading2 = document.createElement("div");
+      heading2.id = titleId;
+      heading2.className = "gdp-dialog-title";
+      heading2.textContent = titleText;
+      dialog.appendChild(heading2);
+    }
+    const bodyId = "gdp-dialog-body";
+    dialog.setAttribute("aria-describedby", bodyId);
+    const body = document.createElement("div");
+    body.id = bodyId;
+    body.className = "gdp-dialog-body";
+    if (bodyText)
+      body.textContent = bodyText;
+    dialog.appendChild(body);
+    const actionRow = document.createElement("div");
+    actionRow.className = "gdp-dialog-actions";
+    actionRow.append(...actions);
+    dialog.appendChild(actionRow);
+    backdrop.appendChild(dialog);
+    document.body.appendChild(backdrop);
+    return { backdrop, body };
+  }
+  function trapTabKey(event, focusables) {
+    if (event.key !== "Tab")
+      return false;
+    const index = focusables.indexOf(document.activeElement);
+    if (index < 0) {
+      event.preventDefault();
+      focusables[0]?.focus();
+      return true;
+    }
+    if (event.shiftKey && index <= 0) {
+      event.preventDefault();
+      focusables[focusables.length - 1]?.focus();
+      return true;
+    }
+    if (!event.shiftKey && index === focusables.length - 1) {
+      event.preventDefault();
+      focusables[0]?.focus();
+      return true;
+    }
+    return false;
+  }
+  function showConfirmDialog(opts) {
+    return new Promise((resolve) => {
+      const previousFocus = opts.focusReturnTarget ?? document.activeElement;
+      const cancel = document.createElement("button");
+      cancel.type = "button";
+      cancel.className = "gdp-btn gdp-btn-sm";
+      cancel.textContent = opts.cancelLabel ?? "Cancel";
+      const confirm = document.createElement("button");
+      confirm.type = "button";
+      confirm.className = "gdp-btn gdp-btn-sm";
+      if (opts.danger)
+        confirm.classList.add("gdp-dialog-danger");
+      confirm.textContent = opts.confirmLabel ?? "OK";
+      const done = (ok) => {
+        document.removeEventListener("keydown", onKeydown);
+        closeOpenDialog();
+        previousFocus?.focus?.();
+        resolve(ok);
+      };
+      const onKeydown = (event) => {
+        if (isImeComposing(event))
+          return;
+        if (event.key === "Escape") {
+          event.preventDefault();
+          event.stopPropagation();
+          done(false);
+          return;
+        }
+        if (event.key === "Enter" && document.activeElement !== cancel) {
+          event.preventDefault();
+          done(true);
+          return;
+        }
+        trapTabKey(event, [cancel, confirm]);
+      };
+      cancel.addEventListener("click", () => done(false));
+      confirm.addEventListener("click", () => done(true));
+      const { backdrop } = createDialogShell(opts.title, opts.body, [
+        cancel,
+        confirm
+      ]);
+      backdrop.addEventListener("pointerdown", (event) => {
+        if (event.target === backdrop)
+          done(false);
+      });
+      document.addEventListener("keydown", onKeydown);
+      confirm.focus();
+    });
+  }
+  function showAlertDialog(opts) {
+    return new Promise((resolve) => {
+      const previousFocus = opts.focusReturnTarget ?? document.activeElement;
+      const ok = document.createElement("button");
+      ok.type = "button";
+      ok.className = "gdp-btn gdp-btn-sm";
+      if (opts.danger)
+        ok.classList.add("gdp-dialog-danger");
+      ok.textContent = opts.confirmLabel ?? "OK";
+      const done = () => {
+        document.removeEventListener("keydown", onKeydown);
+        closeOpenDialog();
+        previousFocus?.focus?.();
+        resolve();
+      };
+      const onKeydown = (event) => {
+        if (isImeComposing(event))
+          return;
+        if (event.key === "Escape" || event.key === "Enter") {
+          event.preventDefault();
+          event.stopPropagation();
+          done();
+          return;
+        }
+        trapTabKey(event, [ok]);
+      };
+      ok.addEventListener("click", done);
+      const { backdrop } = createDialogShell(opts.title, opts.body, [ok]);
+      backdrop.addEventListener("pointerdown", (event) => {
+        if (event.target === backdrop)
+          done();
+      });
+      document.addEventListener("keydown", onKeydown);
+      ok.focus();
+    });
+  }
+  function showPromptDialog(opts) {
+    return new Promise((resolve) => {
+      const previousFocus = opts.focusReturnTarget ?? document.activeElement;
+      const cancel = document.createElement("button");
+      cancel.type = "button";
+      cancel.className = "gdp-btn gdp-btn-sm";
+      cancel.textContent = opts.cancelLabel ?? "Cancel";
+      const submit = document.createElement("button");
+      submit.type = "button";
+      submit.className = "gdp-btn gdp-btn-sm";
+      submit.textContent = opts.confirmLabel ?? "OK";
+      const input = document.createElement("input");
+      input.className = "gdp-dialog-input";
+      input.type = "text";
+      input.autocomplete = "off";
+      if (opts.placeholder)
+        input.placeholder = opts.placeholder;
+      if (opts.ariaLabel)
+        input.setAttribute("aria-label", opts.ariaLabel);
+      input.value = opts.defaultValue ?? "";
+      const error2 = document.createElement("div");
+      error2.className = "gdp-dialog-error";
+      error2.setAttribute("role", "alert");
+      const computeValid = () => {
+        if (opts.validate)
+          return opts.validate(input.value);
+        return input.value;
+      };
+      const syncValidity = () => {
+        const normalized = computeValid();
+        const valid = normalized !== null && normalized !== "";
+        submit.disabled = !valid;
+        error2.textContent = !valid && input.value && opts.invalidMessage ? opts.invalidMessage : "";
+        return valid;
+      };
+      const done = (value) => {
+        document.removeEventListener("keydown", onKeydown);
+        closeOpenDialog();
+        previousFocus?.focus?.();
+        resolve(value);
+      };
+      const trySubmit = () => {
+        const normalized = computeValid();
+        if (normalized === null || normalized === "") {
+          syncValidity();
+          input.focus();
+          return;
+        }
+        done(normalized);
+      };
+      const onKeydown = (event) => {
+        if (isImeComposing(event))
+          return;
+        if (event.key === "Escape") {
+          event.preventDefault();
+          event.stopPropagation();
+          done(null);
+          return;
+        }
+        if (event.key === "Enter") {
+          event.preventDefault();
+          trySubmit();
+          return;
+        }
+        trapTabKey(event, [input, cancel, submit]);
+      };
+      cancel.addEventListener("click", () => done(null));
+      submit.addEventListener("click", trySubmit);
+      input.addEventListener("input", syncValidity);
+      const { body } = createDialogShell(opts.title, opts.body, [cancel, submit]);
+      body.append(input, error2);
+      body.parentElement?.parentElement?.addEventListener("pointerdown", (event) => {
+        const target = event.target;
+        if (target?.classList.contains(BACKDROP_CLASS))
+          done(null);
+      });
+      document.addEventListener("keydown", onKeydown);
+      syncValidity();
+      input.focus();
+      if (input.value)
+        input.select();
+    });
+  }
+
   // web-src/views/annotations-ui.ts
   var ANNOTATION_SESSION_PARAM = "annotationSession";
   function createAnnotationsUi(deps) {
@@ -7830,9 +8073,18 @@ ${frontmatter.yaml}
           setActiveSession(session.id === activeSessionId ? null : session.id);
         });
         const rename = annotationIconButton("octicon-pencil", PENCIL_16_PATH, `rename session ${session.title}`);
-        rename.addEventListener("click", () => {
-          const next = window.prompt("Rename session", session.title);
-          if (next === null || !next.trim())
+        rename.addEventListener("click", async () => {
+          const next = await showPromptDialog({
+            title: "Rename session",
+            defaultValue: session.title,
+            ariaLabel: "Session name",
+            confirmLabel: "Rename",
+            validate: (v) => {
+              const trimmed = v.trim();
+              return trimmed ? trimmed : null;
+            }
+          });
+          if (next === null)
             return;
           postAnnotationAction({
             action: "rename",
@@ -7841,8 +8093,14 @@ ${frontmatter.yaml}
           });
         });
         const del = annotationIconButton("octicon-trash", TRASH_16_PATH, `delete session ${session.title}`);
-        del.addEventListener("click", () => {
-          if (!window.confirm(`Delete annotation session "${session.title}"?`))
+        del.addEventListener("click", async () => {
+          const ok = await showConfirmDialog({
+            title: "Delete session?",
+            body: `Delete annotation session "${session.title}"?`,
+            confirmLabel: "Delete",
+            danger: true
+          });
+          if (!ok)
             return;
           postAnnotationAction({ action: "delete", id: session.id });
         });
@@ -7868,8 +8126,14 @@ ${frontmatter.yaml}
             openAnnotationEntry(entry.id);
           });
           const remove = annotationIconButton("octicon-trash", TRASH_16_PATH, `delete annotation for ${annotationLocationLabel(entry)}`);
-          remove.addEventListener("click", () => {
-            if (!window.confirm(`Delete annotation for ${annotationLocationLabel(entry)}?`))
+          remove.addEventListener("click", async () => {
+            const ok = await showConfirmDialog({
+              title: "Delete annotation?",
+              body: `Delete annotation for ${annotationLocationLabel(entry)}?`,
+              confirmLabel: "Delete",
+              danger: true
+            });
+            if (!ok)
               return;
             postAnnotationAction({ action: "delete", id: entry.id });
           });
@@ -8131,8 +8395,14 @@ ${frontmatter.yaml}
       annotationFollow = followCheckbox.checked;
       deps.setAnnotationFollow(annotationFollow);
     });
-    $("#annotation-clear").addEventListener("click", () => {
-      if (!window.confirm("Delete all annotations?"))
+    $("#annotation-clear").addEventListener("click", async () => {
+      const ok = await showConfirmDialog({
+        title: "Delete all annotations?",
+        body: "Delete all annotations?",
+        confirmLabel: "Delete all",
+        danger: true
+      });
+      if (!ok)
         return;
       hideAnnotationDetail();
       postAnnotationAction({ action: "clear" });
@@ -9171,13 +9441,17 @@ ${frontmatter.yaml}
       searchTitle: "Search across tables",
       snapshot: "Snapshot",
       snapshotTitle: "Snapshot & Diff",
-      queryHistory: "Query History",
-      queryHistoryTitle: "Toggle query history panel",
+      queryHistory: "Close",
+      queryHistoryTitle: "Close panel",
       newTab: "New tab",
       closeTab: (label) => `Close ${label}`,
       loadingSchema: "Loading schema…",
       noDatastores: "No datastores found",
-      dockerLimitReached: "Docker discovery reached the service limit; some compose services may be hidden."
+      dockerLimitReached: "Docker discovery reached the service limit; some compose services may be hidden.",
+      inferFkLabel: "Rails FK inference",
+      inferFkTitle: "Infer FK from Rails-style <name>_id → <names>.id",
+      inferredBadge: "inferred",
+      inferredBadgeTitle: "Inferred from Rails-style naming, not declared in DB"
     },
     grid: {
       searchPlaceholder: "Search all columns…",
@@ -9189,6 +9463,22 @@ ${frontmatter.yaml}
       statusSort: (column, dir) => `Sort: ${column} ${dir}`,
       statusFilters: (n2) => `${n2} filter(s)`
     },
+    edit: {
+      editMode: "Edit",
+      editModeTitle: "Toggle edit mode",
+      newRow: "New row",
+      commit: "Commit",
+      discard: "Discard",
+      deleteRow: "Mark row for deletion",
+      undoDelete: "Undo deletion",
+      setNull: "Set NULL",
+      dblclickToEdit: "Double-click to edit",
+      pending: (n2) => `${n2} change(s)`,
+      committing: "Saving…",
+      commitError: (message) => `Save failed: ${message}`,
+      confirmDiscard: "Discard all pending changes?",
+      noPrimaryKey: "This table has no primary key. Existing rows cannot be edited or deleted (you can still add new rows)."
+    },
     schema: {
       columns: "Columns",
       foreignKeys: "Foreign Keys",
@@ -9246,6 +9536,24 @@ ${frontmatter.yaml}
       confirmClear: "Confirm clear",
       truncatedRows: (saved, total) => `Showing ${saved} of ${total} rows`
     },
+    sessionLog: {
+      tabLabel: "Log",
+      historyTabLabel: "Query history",
+      clear: "Clear",
+      clearTitle: "Clear the session log",
+      empty: "No entries yet. SQL executions and commits will appear here.",
+      selectPlaceholder: "Select an entry to view details.",
+      statusOk: "ok",
+      statusError: "error",
+      kindQuery: "query",
+      kindMutate: "commit",
+      useInEditor: "Open in editor",
+      copy: "Copy",
+      copied: "Copied",
+      autoFollow: "Auto-follow",
+      autoFollowTitle: "Automatically scroll to the newest entry. Scroll up to pause.",
+      commitLabel: (changes) => `Commit (${changes} ${changes === 1 ? "change" : "changes"})`
+    },
     er: {
       zoomIn: "Zoom in",
       zoomOut: "Zoom out",
@@ -9310,7 +9618,16 @@ ${frontmatter.yaml}
       label: (date, tables, note) => `${date} (${tables} tables)${note}`
     },
     explorer: {
-      common: { loadMore: "Load more", search: "Search" },
+      common: {
+        loadMore: "Load more",
+        search: "Search",
+        edit: "Edit",
+        save: "Save",
+        cancel: "Cancel",
+        delete: "Delete",
+        saving: "Saving…",
+        saveError: (message) => `Save failed: ${message}`
+      },
       redis: {
         databases: "Databases",
         keys: "Keys",
@@ -9322,7 +9639,12 @@ ${frontmatter.yaml}
         emptyHash: "(empty hash)",
         emptyList: "(empty list)",
         noKeys: "(no keys)",
-        keyCount: (n2) => `${n2} keys`
+        keyCount: (n2) => `${n2} keys`,
+        newKey: "New key",
+        newKeyNamePlaceholder: "key name",
+        newKeyValuePlaceholder: "value",
+        confirmDeleteKey: (key) => `Delete key "${key}"?`,
+        create: "Create"
       },
       es: {
         indices: "Indices",
@@ -9338,7 +9660,15 @@ ${frontmatter.yaml}
         noMappedFields: "(no mapped fields)",
         noDocs: "(no docs)",
         docNotFound: "(doc not found)",
-        loadingIndices: "Loading indices..."
+        loadingIndices: "Loading indices...",
+        newDoc: "New document",
+        newDocIdPlaceholder: "document id (optional — auto-generated if blank)",
+        sourceJsonPlaceholder: `{
+  "field": "value"
+}`,
+        confirmDeleteDoc: (id) => `Delete document "${id}"?`,
+        invalidJson: "Invalid JSON",
+        create: "Create"
       },
       s3: {
         bucket: "Bucket",
@@ -9358,7 +9688,13 @@ ${frontmatter.yaml}
         copied: "Copied",
         copyFailed: "Copy failed",
         unsupported: "This object type cannot be previewed safely in the browser.",
-        truncatedNotice: (size) => `Showing first ${size}.`
+        truncatedNotice: (size) => `Showing first ${size}.`,
+        newObject: "New object",
+        newObjectKeyPlaceholder: "object key, e.g. folder/file.txt",
+        contentPlaceholder: "object content (text)",
+        confirmDeleteObject: (key) => `Delete object "${key}"?`,
+        editTextHint: "Only text objects can be edited in the browser.",
+        create: "Create"
       }
     }
   };
@@ -9377,13 +9713,17 @@ ${frontmatter.yaml}
       searchTitle: "テーブル横断検索",
       snapshot: "スナップショット",
       snapshotTitle: "スナップショットと差分",
-      queryHistory: "クエリ履歴",
-      queryHistoryTitle: "クエリ履歴パネルの表示切替",
+      queryHistory: "閉じる",
+      queryHistoryTitle: "パネルを閉じる",
       newTab: "新しいタブ",
       closeTab: (label) => `${label} を閉じる`,
       loadingSchema: "スキーマを読み込み中…",
       noDatastores: "データストアが見つかりません",
-      dockerLimitReached: "Docker のサービス数が上限に達しました。一部の compose サービスは表示されていない可能性があります。"
+      dockerLimitReached: "Docker のサービス数が上限に達しました。一部の compose サービスは表示されていない可能性があります。",
+      inferFkLabel: "Rails FK 推測",
+      inferFkTitle: "Rails 命名規約 (<name>_id → <names>.id) から FK を推測",
+      inferredBadge: "推測",
+      inferredBadgeTitle: "Rails 命名規約から推測した FK (DB の宣言ではありません)"
     },
     grid: {
       searchPlaceholder: "全カラムを検索…",
@@ -9395,6 +9735,22 @@ ${frontmatter.yaml}
       statusSort: (column, dir) => `並び替え: ${column} ${dir}`,
       statusFilters: (n2) => `フィルタ ${n2} 件`
     },
+    edit: {
+      editMode: "編集",
+      editModeTitle: "編集モードの切り替え",
+      newRow: "新規行",
+      commit: "コミット",
+      discard: "破棄",
+      deleteRow: "行を削除対象にする",
+      undoDelete: "削除を取り消す",
+      setNull: "NULL にする",
+      dblclickToEdit: "ダブルクリックで編集",
+      pending: (n2) => `変更 ${n2} 件`,
+      committing: "保存中…",
+      commitError: (message) => `保存に失敗しました: ${message}`,
+      confirmDiscard: "保留中の変更をすべて破棄しますか?",
+      noPrimaryKey: "このテーブルには主キーがありません。既存行の編集・削除はできません(新規行の追加は可能です)。"
+    },
     schema: {
       columns: "カラム",
       foreignKeys: "外部キー",
@@ -9452,6 +9808,24 @@ ${frontmatter.yaml}
       confirmClear: "全削除を確認",
       truncatedRows: (saved, total) => `全 ${total} 行中 ${saved} 行を表示`
     },
+    sessionLog: {
+      tabLabel: "ログ",
+      historyTabLabel: "クエリ履歴",
+      clear: "クリア",
+      clearTitle: "セッションログを消去",
+      empty: "まだログはありません。SQL の実行や編集コミットがここに出ます。",
+      selectPlaceholder: "エントリを選ぶと詳細を表示します。",
+      statusOk: "成功",
+      statusError: "エラー",
+      kindQuery: "クエリ",
+      kindMutate: "コミット",
+      useInEditor: "エディタに開く",
+      copy: "コピー",
+      copied: "コピーしました",
+      autoFollow: "自動追従",
+      autoFollowTitle: "新しいエントリを常に表示。下に手動スクロールすると自動解除されます。",
+      commitLabel: (changes) => `コミット (${changes} 件)`
+    },
     er: {
       zoomIn: "拡大",
       zoomOut: "縮小",
@@ -9516,7 +9890,16 @@ ${frontmatter.yaml}
       label: (date, tables, note) => `${date} (${tables}テーブル)${note}`
     },
     explorer: {
-      common: { loadMore: "さらに読み込む", search: "検索" },
+      common: {
+        loadMore: "さらに読み込む",
+        search: "検索",
+        edit: "編集",
+        save: "保存",
+        cancel: "キャンセル",
+        delete: "削除",
+        saving: "保存中…",
+        saveError: (message) => `保存に失敗しました: ${message}`
+      },
       redis: {
         databases: "データベース",
         keys: "キー",
@@ -9528,7 +9911,12 @@ ${frontmatter.yaml}
         emptyHash: "(空のハッシュ)",
         emptyList: "(空のリスト)",
         noKeys: "(キーがありません)",
-        keyCount: (n2) => `${n2} キー`
+        keyCount: (n2) => `${n2} キー`,
+        newKey: "新規キー",
+        newKeyNamePlaceholder: "キー名",
+        newKeyValuePlaceholder: "値",
+        confirmDeleteKey: (key) => `キー "${key}" を削除しますか?`,
+        create: "作成"
       },
       es: {
         indices: "インデックス",
@@ -9544,7 +9932,15 @@ ${frontmatter.yaml}
         noMappedFields: "(マッピング済みフィールドがありません)",
         noDocs: "(ドキュメントがありません)",
         docNotFound: "(ドキュメントが見つかりません)",
-        loadingIndices: "インデックスを読み込み中..."
+        loadingIndices: "インデックスを読み込み中...",
+        newDoc: "新規ドキュメント",
+        newDocIdPlaceholder: "ドキュメント ID (省略時は自動採番)",
+        sourceJsonPlaceholder: `{
+  "field": "value"
+}`,
+        confirmDeleteDoc: (id) => `ドキュメント "${id}" を削除しますか?`,
+        invalidJson: "JSON が不正です",
+        create: "作成"
       },
       s3: {
         bucket: "バケット",
@@ -9564,7 +9960,13 @@ ${frontmatter.yaml}
         copied: "コピーしました",
         copyFailed: "コピーに失敗しました",
         unsupported: "この種類のオブジェクトはブラウザで安全にプレビューできません。",
-        truncatedNotice: (size) => `先頭 ${size} を表示中。`
+        truncatedNotice: (size) => `先頭 ${size} を表示中。`,
+        newObject: "新規オブジェクト",
+        newObjectKeyPlaceholder: "オブジェクトキー 例: folder/file.txt",
+        contentPlaceholder: "オブジェクトの内容 (テキスト)",
+        confirmDeleteObject: (key) => `オブジェクト "${key}" を削除しますか?`,
+        editTextHint: "ブラウザで編集できるのはテキストオブジェクトのみです。",
+        create: "作成"
       }
     }
   };
@@ -9619,8 +10021,16 @@ ${frontmatter.yaml}
     const docListPane = document.createElement("div");
     docListPane.className = "es-doc-list-pane";
     const docListHeader = document.createElement("div");
-    docListHeader.className = "db-explorer-pane-header";
-    docListHeader.textContent = text2().es.docs;
+    docListHeader.className = "db-explorer-pane-header es-doc-list-header";
+    const docListTitle = document.createElement("span");
+    docListTitle.textContent = text2().es.docs;
+    const newDocBtn = document.createElement("button");
+    newDocBtn.type = "button";
+    newDocBtn.className = "db-btn db-btn-sm es-new-doc-btn";
+    newDocBtn.textContent = `＋ ${text2().es.newDoc}`;
+    newDocBtn.title = text2().es.newDoc;
+    newDocBtn.hidden = true;
+    docListHeader.append(docListTitle, newDocBtn);
     docListPane.appendChild(docListHeader);
     const searchBar = document.createElement("div");
     searchBar.className = "es-search-bar";
@@ -9839,12 +10249,176 @@ ${frontmatter.yaml}
       table2.appendChild(tbody);
       mappingBody.appendChild(table2);
     }
+    function mkBtn(label, cls) {
+      const b2 = document.createElement("button");
+      b2.type = "button";
+      b2.className = cls;
+      b2.textContent = label;
+      return b2;
+    }
+    async function postEsWrite(body) {
+      const doFetch = fetch("/_db/elasticsearch/write", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-Code-Viewer-Action": "1"
+        },
+        body: JSON.stringify(body)
+      });
+      const res = await (callbacks.trackLoad ? callbacks.trackLoad(doFetch) : doFetch);
+      if (!res.ok)
+        throw new Error(await res.text() || res.statusText);
+    }
+    function startDocEdit(resp) {
+      docBody.innerHTML = "";
+      const bar = document.createElement("div");
+      bar.className = "es-doc-edit-bar";
+      const save = mkBtn(text2().common.save, "db-btn db-btn-primary db-btn-sm");
+      const cancel = mkBtn(text2().common.cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "es-doc-edit-status";
+      bar.append(save, cancel, status);
+      const ta = document.createElement("textarea");
+      ta.className = "es-doc-edit-textarea";
+      ta.value = JSON.stringify(resp.source, null, 2);
+      docBody.append(bar, ta);
+      cancel.addEventListener("click", () => renderDoc(resp));
+      save.addEventListener("click", async () => {
+        let parsed;
+        try {
+          parsed = JSON.parse(ta.value);
+        } catch {
+          status.textContent = text2().es.invalidJson;
+          return;
+        }
+        if (!currentDbId || !currentIndex)
+          return;
+        save.disabled = true;
+        cancel.disabled = true;
+        status.textContent = text2().common.saving;
+        try {
+          await postEsWrite({
+            db: currentDbId,
+            index: currentIndex,
+            id: resp.id,
+            source: parsed,
+            seqNo: resp.seqNo,
+            primaryTerm: resp.primaryTerm
+          });
+          await selectDoc(resp.id);
+        } catch (err) {
+          save.disabled = false;
+          cancel.disabled = false;
+          status.textContent = text2().common.saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+      ta.focus();
+    }
+    async function deleteDoc(resp) {
+      if (!currentDbId || !currentIndex)
+        return;
+      const ok = await showConfirmDialog({
+        body: text2().es.confirmDeleteDoc(resp.id),
+        confirmLabel: text2().common.delete,
+        danger: true
+      });
+      if (!ok)
+        return;
+      try {
+        await postEsWrite({
+          db: currentDbId,
+          index: currentIndex,
+          id: resp.id,
+          op: "delete"
+        });
+        setPaneEmpty(docBody, text2().es.selectDoc);
+        lastDoc = null;
+        loadDocs(false);
+      } catch (err) {
+        setPaneStatus(docBody, text2().common.saveError(err instanceof Error ? err.message : String(err)), { error: true });
+      }
+    }
+    function showNewDocForm() {
+      if (!currentIndex) {
+        setPaneStatus(docBody, text2().es.selectIndex);
+        return;
+      }
+      setDetailTab("doc");
+      docBody.innerHTML = "";
+      const form = document.createElement("form");
+      form.className = "es-new-doc-form";
+      const idInput = document.createElement("input");
+      idInput.type = "text";
+      idInput.className = "es-new-doc-id";
+      idInput.placeholder = text2().es.newDocIdPlaceholder;
+      idInput.autocomplete = "off";
+      const ta = document.createElement("textarea");
+      ta.className = "es-doc-edit-textarea";
+      ta.placeholder = text2().es.sourceJsonPlaceholder;
+      const bar = document.createElement("div");
+      bar.className = "es-doc-edit-bar";
+      const create = mkBtn(text2().es.create, "db-btn db-btn-primary db-btn-sm");
+      create.type = "submit";
+      const cancel = mkBtn(text2().common.cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "es-doc-edit-status";
+      bar.append(create, cancel, status);
+      form.append(bar, idInput, ta);
+      docBody.append(form);
+      idInput.focus();
+      cancel.addEventListener("click", () => setPaneEmpty(docBody, text2().es.selectDoc));
+      form.addEventListener("submit", async (e2) => {
+        e2.preventDefault();
+        if (!currentDbId || !currentIndex)
+          return;
+        let parsed;
+        try {
+          parsed = JSON.parse(ta.value);
+        } catch {
+          status.textContent = text2().es.invalidJson;
+          return;
+        }
+        const id = idInput.value.trim();
+        create.disabled = true;
+        status.textContent = text2().common.saving;
+        try {
+          await postEsWrite({
+            db: currentDbId,
+            index: currentIndex,
+            ...id ? { id } : {},
+            source: parsed,
+            op: "create"
+          });
+          loadDocs(false);
+          if (id)
+            await selectDoc(id);
+          else
+            setPaneEmpty(docBody, text2().es.selectDoc);
+        } catch (err) {
+          create.disabled = false;
+          status.textContent = text2().common.saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+    }
+    newDocBtn.addEventListener("click", () => showNewDocForm());
     function renderDoc(resp) {
       lastDoc = resp;
       docBody.innerHTML = "";
       const header = document.createElement("div");
       header.className = "es-doc-detail-header";
-      header.textContent = `${resp.index} / ${resp.id}`;
+      const title = document.createElement("span");
+      title.textContent = `${resp.index} / ${resp.id}`;
+      header.appendChild(title);
+      if (resp.found) {
+        const actions = document.createElement("div");
+        actions.className = "es-doc-actions";
+        const editBtn = mkBtn(text2().common.edit, "db-btn db-btn-sm");
+        editBtn.addEventListener("click", () => startDocEdit(resp));
+        const delBtn = mkBtn(text2().common.delete, "db-btn db-btn-sm");
+        delBtn.addEventListener("click", () => void deleteDoc(resp));
+        actions.append(editBtn, delBtn);
+        header.appendChild(actions);
+      }
       docBody.appendChild(header);
       if (!resp.found) {
         setPaneStatus(docBody, text2().es.docNotFound, {
@@ -9975,6 +10549,7 @@ ${frontmatter.yaml}
       docBody.innerHTML = "";
       setPaneEmpty(docBody, text2().es.selectDoc);
       setDetailTab("mapping");
+      newDocBtn.hidden = false;
       await Promise.all([fetchMapping(name), loadDocs(false)]);
     }
     async function selectDoc(id) {
@@ -10171,7 +10746,9 @@ ${frontmatter.yaml}
     function localize() {
       const t2 = text2();
       indexListHeader.textContent = t2.es.indices;
-      docListHeader.textContent = t2.es.docs;
+      docListTitle.textContent = t2.es.docs;
+      newDocBtn.textContent = `＋ ${t2.es.newDoc}`;
+      newDocBtn.title = t2.es.newDoc;
       searchInput.placeholder = t2.es.queryPlaceholder;
       searchBtn.textContent = t2.common.search;
       docMoreBtn.textContent = t2.common.loadMore;
@@ -10200,27 +10777,6 @@ ${frontmatter.yaml}
   }
 
   // web-src/views/database/er-diagram.ts
-  var mermaidPromise2 = null;
-  var mermaidInitialized2 = false;
-  async function loadMermaid2() {
-    if (!mermaidPromise2) {
-      mermaidPromise2 = import("/mermaid.js").then((mod) => {
-        const typed = mod;
-        const mermaid = typed.default;
-        if (!mermaidInitialized2) {
-          mermaid.initialize({
-            startOnLoad: false,
-            securityLevel: "strict",
-            theme: "default",
-            er: { useMaxWidth: false }
-          });
-          mermaidInitialized2 = true;
-        }
-        return mermaid;
-      }).catch(() => null);
-    }
-    return mermaidPromise2;
-  }
   function mermaidType(sqlType) {
     const upper = sqlType.toUpperCase();
     if (upper.includes("INT"))
@@ -10391,7 +10947,7 @@ ${frontmatter.yaml}
       }
       const markup = buildErMarkup(schema, columnsMap);
       lastMarkup = markup;
-      const mermaid = await loadMermaid2();
+      const mermaid = await loadMermaid();
       if (!mermaid) {
         svgWrap.textContent = text2().er.loadError;
         return;
@@ -10661,6 +11217,12 @@ ${frontmatter.yaml}
   }
 
   // web-src/views/database/pref-toggle.ts
+  function localizePrefToggle(btn, label, title) {
+    btn.title = title;
+    const labelEl = btn.querySelector(".db-pref-toggle-label");
+    if (labelEl)
+      labelEl.textContent = label;
+  }
   function makePrefToggle(opts) {
     const btn = document.createElement("button");
     btn.type = "button";
@@ -10683,20 +11245,22 @@ ${frontmatter.yaml}
     return btn;
   }
 
-  // web-src/views/database/query-editor.ts
-  var shikiPromise2 = null;
-  function loadShikiSql() {
-    if (!shikiPromise2) {
-      shikiPromise2 = import("/shiki.js").then((mod) => {
-        const typed = mod;
-        return typed.createHighlighter({
-          themes: ["github-light", "github-dark"],
-          langs: ["sql"]
-        });
-      }).catch(() => null);
-    }
-    return shikiPromise2;
+  // web-src/views/database/shiki-sql.ts
+  function highlightSqlToInnerHtml(code2, highlighter) {
+    if (!highlighter || !code2)
+      return "";
+    const html = highlighter.codeToHtml(code2, {
+      lang: "sql",
+      themes: { light: "github-light", dark: "github-dark" },
+      defaultColor: false
+    });
+    const template = document.createElement("template");
+    template.innerHTML = html;
+    const pre = template.content.querySelector("pre");
+    return pre ? pre.innerHTML : "";
   }
+
+  // web-src/views/database/query-editor.ts
   var MAX_HISTORY = 50;
   function createQueryEditor(callbacks) {
     const text2 = () => callbacks.getText?.() ?? dbText("en");
@@ -10716,7 +11280,10 @@ ${frontmatter.yaml}
     textarea.rows = 3;
     editorWrap.append(highlight, textarea);
     let shiki = null;
-    loadShikiSql().then((h) => {
+    loadShikiHighlighter({
+      themes: ["github-light", "github-dark"],
+      langs: ["sql"]
+    }).then((h) => {
       shiki = h;
       syncHighlight();
     });
@@ -10733,21 +11300,9 @@ ${frontmatter.yaml}
         syncEditorHeight();
         return;
       }
-      if (!shiki) {
-        highlight.textContent = code2;
-        syncEditorHeight();
-        return;
-      }
-      const html = shiki.codeToHtml(code2, {
-        lang: "sql",
-        themes: { light: "github-light", dark: "github-dark" },
-        defaultColor: false
-      });
-      const template = document.createElement("template");
-      template.innerHTML = html;
-      const pre = template.content.querySelector("pre");
-      if (pre) {
-        highlight.innerHTML = pre.innerHTML;
+      const inner = highlightSqlToInnerHtml(code2, shiki);
+      if (inner) {
+        highlight.innerHTML = inner;
       } else {
         highlight.textContent = code2;
       }
@@ -11462,8 +12017,15 @@ ${frontmatter.yaml}
     const keyListPane = document.createElement("div");
     keyListPane.className = "redis-key-list-pane";
     const keyListHeader = document.createElement("div");
-    keyListHeader.className = "db-explorer-pane-header";
-    keyListHeader.textContent = text2().redis.keys;
+    keyListHeader.className = "db-explorer-pane-header redis-key-list-header";
+    const keyListTitle = document.createElement("span");
+    keyListTitle.textContent = text2().redis.keys;
+    const newKeyBtn = document.createElement("button");
+    newKeyBtn.type = "button";
+    newKeyBtn.className = "db-btn db-btn-sm redis-new-key-btn";
+    newKeyBtn.textContent = `＋ ${text2().redis.newKey}`;
+    newKeyBtn.title = text2().redis.newKey;
+    keyListHeader.append(keyListTitle, newKeyBtn);
     keyListPane.appendChild(keyListHeader);
     const keyFilterForm = document.createElement("form");
     keyFilterForm.className = "redis-key-filter-form";
@@ -11586,6 +12148,152 @@ ${frontmatter.yaml}
       div.textContent = message;
       return div;
     }
+    function mkBtn(label, cls) {
+      const b2 = document.createElement("button");
+      b2.type = "button";
+      b2.className = cls;
+      b2.textContent = label;
+      return b2;
+    }
+    function writeBase() {
+      if (currentDbId === null || currentDbIndex === null)
+        return null;
+      return { db: currentDbId, dbIndex: currentDbIndex };
+    }
+    async function postRedisWrite(body) {
+      const doFetch = fetch("/_db/redis/write", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-Code-Viewer-Action": "1"
+        },
+        body: JSON.stringify(body)
+      });
+      const res = await (callbacks.trackLoad ? callbacks.trackLoad(doFetch) : doFetch);
+      if (!res.ok)
+        throw new Error(await res.text() || res.statusText);
+    }
+    async function deleteCurrentKey(key) {
+      const base2 = writeBase();
+      if (!base2)
+        return;
+      const ok = await showConfirmDialog({
+        body: text2().redis.confirmDeleteKey(key),
+        confirmLabel: text2().common.delete,
+        danger: true
+      });
+      if (!ok)
+        return;
+      try {
+        await postRedisWrite({ ...base2, key, op: "delete" });
+        currentKey = null;
+        setPaneEmpty(mainPane, text2().redis.selectKey);
+        await loadKeys(false);
+      } catch (err) {
+        setPaneStatus(mainPane, text2().common.saveError(err instanceof Error ? err.message : String(err)), { error: true });
+      }
+    }
+    function startStringEdit(key, current) {
+      const body = mainPane.querySelector(".redis-value-body");
+      if (!body)
+        return;
+      body.innerHTML = "";
+      const bar = document.createElement("div");
+      bar.className = "redis-value-edit-bar";
+      const save = mkBtn(text2().common.save, "db-btn db-btn-primary db-btn-sm");
+      const cancel = mkBtn(text2().common.cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "redis-value-edit-status";
+      bar.append(save, cancel, status);
+      const ta = document.createElement("textarea");
+      ta.className = "redis-value-edit-textarea";
+      ta.value = current;
+      body.append(bar, ta);
+      cancel.addEventListener("click", () => void selectKey(key));
+      save.addEventListener("click", async () => {
+        const base2 = writeBase();
+        if (!base2)
+          return;
+        save.disabled = true;
+        cancel.disabled = true;
+        status.textContent = text2().common.saving;
+        try {
+          await postRedisWrite({
+            ...base2,
+            key,
+            op: "setString",
+            value: ta.value
+          });
+          await selectKey(key);
+        } catch (err) {
+          save.disabled = false;
+          cancel.disabled = false;
+          status.textContent = text2().common.saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+      ta.focus();
+    }
+    function showNewKeyForm() {
+      if (currentDbIndex === null) {
+        setPaneStatus(mainPane, text2().redis.selectDatabase);
+        return;
+      }
+      mainPane.innerHTML = "";
+      const form = document.createElement("form");
+      form.className = "redis-new-key-form";
+      const nameInput = document.createElement("input");
+      nameInput.type = "text";
+      nameInput.className = "redis-new-key-name";
+      nameInput.placeholder = text2().redis.newKeyNamePlaceholder;
+      nameInput.autocomplete = "off";
+      const valueInput = document.createElement("textarea");
+      valueInput.className = "redis-new-key-value";
+      valueInput.placeholder = text2().redis.newKeyValuePlaceholder;
+      const bar = document.createElement("div");
+      bar.className = "redis-value-edit-bar";
+      const create = mkBtn(text2().redis.create, "db-btn db-btn-primary db-btn-sm");
+      create.type = "submit";
+      const cancel = mkBtn(text2().common.cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "redis-value-edit-status";
+      bar.append(create, cancel, status);
+      form.append(bar, nameInput, valueInput);
+      mainPane.append(form);
+      nameInput.focus();
+      cancel.addEventListener("click", () => {
+        if (currentKey)
+          selectKey(currentKey);
+        else
+          setPaneEmpty(mainPane, text2().redis.selectKey);
+      });
+      form.addEventListener("submit", async (e2) => {
+        e2.preventDefault();
+        const base2 = writeBase();
+        if (!base2)
+          return;
+        const name = nameInput.value.trim();
+        if (!name) {
+          nameInput.focus();
+          return;
+        }
+        create.disabled = true;
+        status.textContent = text2().common.saving;
+        try {
+          await postRedisWrite({
+            ...base2,
+            key: name,
+            op: "createString",
+            value: valueInput.value
+          });
+          await loadKeys(false);
+          await selectKey(name);
+        } catch (err) {
+          create.disabled = false;
+          status.textContent = text2().common.saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+    }
+    newKeyBtn.addEventListener("click", () => showNewKeyForm());
     function renderValue(key, value) {
       mainPane.innerHTML = "";
       const header = document.createElement("div");
@@ -11597,6 +12305,20 @@ ${frontmatter.yaml}
       keyEl.className = "redis-value-key-name";
       keyEl.textContent = key;
       header.append(typeBadge, keyEl);
+      const actions = document.createElement("div");
+      actions.className = "redis-value-actions";
+      if (value.type === "string" && value.binaryBase64 === undefined && !value.truncated) {
+        const editBtn = mkBtn(text2().common.edit, "db-btn db-btn-sm");
+        const stringValue = value.value;
+        editBtn.addEventListener("click", () => startStringEdit(key, stringValue));
+        actions.appendChild(editBtn);
+      }
+      if (value.type !== "none") {
+        const delBtn = mkBtn(text2().common.delete, "db-btn db-btn-sm");
+        delBtn.addEventListener("click", () => void deleteCurrentKey(key));
+        actions.appendChild(delBtn);
+      }
+      header.appendChild(actions);
       mainPane.appendChild(header);
       const body = document.createElement("div");
       body.className = "redis-value-body";
@@ -11935,7 +12657,9 @@ ${frontmatter.yaml}
     function localize() {
       const t2 = text2();
       dbListHeader.textContent = t2.redis.databases;
-      keyListHeader.textContent = t2.redis.keys;
+      keyListTitle.textContent = t2.redis.keys;
+      newKeyBtn.textContent = `＋ ${t2.redis.newKey}`;
+      newKeyBtn.title = t2.redis.newKey;
       keyFilterInput.placeholder = t2.redis.keyFilterPlaceholder;
       keyFilterBtn.textContent = t2.common.search;
       keyMoreBtn.textContent = t2.common.loadMore;
@@ -12085,13 +12809,6 @@ ${frontmatter.yaml}
     explorerViewBtn.textContent = "Explorer";
     viewSeg.append(listViewBtn, explorerViewBtn);
     bucketRow.appendChild(viewSeg);
-    const tooltipToggle = makePrefToggle({
-      title: "Toggle hover preview tooltip",
-      label: "Hover preview",
-      pathD: "M8 3.5C4.5 3.5 1.7 5.7 0 8c1.7 2.3 4.5 4.5 8 4.5s6.3-2.2 8-4.5C14.3 5.7 11.5 3.5 8 3.5Zm0 7.5a3 3 0 1 1 0-6 3 3 0 0 1 0 6Zm0-4.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z",
-      extraClass: "s3-tooltip-toggle"
-    });
-    bucketRow.appendChild(tooltipToggle);
     sidebarSlot.appendChild(bucketRow);
     const searchRow = document.createElement("form");
     searchRow.className = "s3-search-row";
@@ -12126,7 +12843,13 @@ ${frontmatter.yaml}
     sortKey.value = "key-asc";
     sortKey.textContent = text2().sortKey;
     sortSelect.append(sortUpdated, sortKey);
-    optionRow.append(modeSeg, sortSelect);
+    const newObjectBtn = document.createElement("button");
+    newObjectBtn.type = "button";
+    newObjectBtn.className = "db-btn db-btn-sm s3-new-object-btn";
+    newObjectBtn.textContent = `＋ ${text2().newObject}`;
+    newObjectBtn.title = text2().newObject;
+    newObjectBtn.hidden = true;
+    optionRow.append(modeSeg, sortSelect, newObjectBtn);
     sidebarSlot.appendChild(optionRow);
     const objectStatus = document.createElement("div");
     objectStatus.className = "s3-object-status";
@@ -12179,19 +12902,9 @@ ${frontmatter.yaml}
         return;
       callbacks.onSelectionChange?.(getSelection());
     }
-    let tooltipEnabled = callbacks.getTooltipEnabled?.() ?? true;
-    function applyTooltipToggleState() {
-      tooltipToggle.classList.toggle("active", tooltipEnabled);
-      tooltipToggle.setAttribute("aria-pressed", String(tooltipEnabled));
-    }
-    applyTooltipToggleState();
-    tooltipToggle.addEventListener("click", () => {
-      tooltipEnabled = !tooltipEnabled;
-      callbacks.setTooltipEnabled?.(tooltipEnabled);
-      applyTooltipToggleState();
-      if (!tooltipEnabled)
-        hideKeyTooltip();
-    });
+    function tooltipEnabled() {
+      return callbacks.getTooltipEnabled?.() ?? true;
+    }
     const keyTooltip = document.createElement("div");
     keyTooltip.className = "s3-key-tooltip";
     keyTooltip.hidden = true;
@@ -12208,7 +12921,7 @@ ${frontmatter.yaml}
       keyTooltip.style.top = `${top}px`;
     }
     function showKeyTooltip(row, object) {
-      if (!tooltipEnabled)
+      if (!tooltipEnabled())
         return;
       keyTooltip.innerHTML = "";
       if (currentDbId && currentBucket) {
@@ -12440,6 +13153,171 @@ ${frontmatter.yaml}
           moreBtn.disabled = false;
       }
     }
+    function mkBtn(label, cls) {
+      const b2 = document.createElement("button");
+      b2.type = "button";
+      b2.className = cls;
+      b2.textContent = label;
+      return b2;
+    }
+    async function postS3Write(body) {
+      const doFetch = fetch("/_db/s3/write", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-Code-Viewer-Action": "1"
+        },
+        body: JSON.stringify(body)
+      });
+      const res = await (callbacks.trackLoad ? callbacks.trackLoad(doFetch) : doFetch);
+      if (!res.ok)
+        throw new Error(await res.text() || res.statusText);
+    }
+    function refreshObjectList() {
+      if (currentView === "explorer")
+        loadExplorerRoot();
+      else
+        loadObjects(false);
+    }
+    async function startObjectEdit(object) {
+      if (!currentDbId || !currentBucket)
+        return;
+      const bodyEl = previewPane.querySelector(".s3-preview-body");
+      if (!bodyEl)
+        return;
+      setPaneStatus(bodyEl, tCommon().saving);
+      let current = "";
+      try {
+        const params = new URLSearchParams({
+          db: currentDbId,
+          bucket: currentBucket,
+          key: object.key
+        });
+        const res = await fetch(`/_db/s3/text?${params}`);
+        if (!res.ok)
+          throw new Error(await res.text() || res.statusText);
+        current = (await res.json()).text;
+      } catch (err) {
+        setPaneStatus(bodyEl, tCommon().saveError(err instanceof Error ? err.message : String(err)), { error: true });
+        return;
+      }
+      bodyEl.innerHTML = "";
+      const bar = document.createElement("div");
+      bar.className = "s3-edit-bar";
+      const save = mkBtn(tCommon().save, "db-btn db-btn-primary db-btn-sm");
+      const cancel = mkBtn(tCommon().cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "s3-edit-status";
+      bar.append(save, cancel, status);
+      const ta = document.createElement("textarea");
+      ta.className = "s3-edit-textarea";
+      ta.value = current;
+      bodyEl.append(bar, ta);
+      cancel.addEventListener("click", () => void selectObject(object));
+      save.addEventListener("click", async () => {
+        if (!currentDbId || !currentBucket)
+          return;
+        save.disabled = true;
+        cancel.disabled = true;
+        status.textContent = tCommon().saving;
+        try {
+          await postS3Write({
+            db: currentDbId,
+            bucket: currentBucket,
+            key: object.key,
+            content: ta.value,
+            contentType: object.contentType || "text/plain"
+          });
+          await selectObject(object);
+        } catch (err) {
+          save.disabled = false;
+          cancel.disabled = false;
+          status.textContent = tCommon().saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+      ta.focus();
+    }
+    async function deleteObject(object) {
+      if (!currentDbId || !currentBucket)
+        return;
+      const ok = await showConfirmDialog({
+        body: text2().confirmDeleteObject(object.key),
+        confirmLabel: tCommon().delete,
+        danger: true
+      });
+      if (!ok)
+        return;
+      try {
+        await postS3Write({
+          db: currentDbId,
+          bucket: currentBucket,
+          key: object.key,
+          op: "delete"
+        });
+        currentKey = null;
+        setPaneEmpty(previewPane, text2().selectObject);
+        refreshObjectList();
+      } catch (err) {
+        setPaneStatus(previewPane, tCommon().saveError(err instanceof Error ? err.message : String(err)), { error: true });
+      }
+    }
+    function showNewObjectForm() {
+      if (!currentBucket) {
+        setPaneStatus(previewPane, text2().selectObject);
+        return;
+      }
+      previewPane.innerHTML = "";
+      const form = document.createElement("form");
+      form.className = "s3-new-object-form";
+      const keyInput = document.createElement("input");
+      keyInput.type = "text";
+      keyInput.className = "s3-new-object-key";
+      keyInput.placeholder = text2().newObjectKeyPlaceholder;
+      keyInput.autocomplete = "off";
+      const ta = document.createElement("textarea");
+      ta.className = "s3-edit-textarea";
+      ta.placeholder = text2().contentPlaceholder;
+      const bar = document.createElement("div");
+      bar.className = "s3-edit-bar";
+      const create = mkBtn(text2().create, "db-btn db-btn-primary db-btn-sm");
+      create.type = "submit";
+      const cancel = mkBtn(tCommon().cancel, "db-btn db-btn-sm");
+      const status = document.createElement("span");
+      status.className = "s3-edit-status";
+      bar.append(create, cancel, status);
+      form.append(bar, keyInput, ta);
+      previewPane.appendChild(form);
+      keyInput.focus();
+      cancel.addEventListener("click", () => setPaneEmpty(previewPane, text2().selectObject));
+      form.addEventListener("submit", async (e2) => {
+        e2.preventDefault();
+        if (!currentDbId || !currentBucket)
+          return;
+        const key = keyInput.value.trim();
+        if (!key) {
+          keyInput.focus();
+          return;
+        }
+        create.disabled = true;
+        status.textContent = tCommon().saving;
+        try {
+          await postS3Write({
+            db: currentDbId,
+            bucket: currentBucket,
+            key,
+            content: ta.value,
+            contentType: "text/plain",
+            op: "create"
+          });
+          refreshObjectList();
+          setPaneEmpty(previewPane, text2().selectObject);
+        } catch (err) {
+          create.disabled = false;
+          status.textContent = tCommon().saveError(err instanceof Error ? err.message : String(err));
+        }
+      });
+    }
+    newObjectBtn.addEventListener("click", () => showNewObjectForm());
     function renderPreviewHeader(object) {
       const header = document.createElement("div");
       header.className = "s3-preview-header";
@@ -12485,6 +13363,14 @@ ${frontmatter.yaml}
           }
         });
         actions.append(open, download, copy);
+        if (sourceDisplayKind(object.key) === "text") {
+          const editBtn = mkBtn(tCommon().edit, "db-btn db-btn-sm");
+          editBtn.addEventListener("click", () => void startObjectEdit(object));
+          actions.appendChild(editBtn);
+        }
+        const delBtn = mkBtn(tCommon().delete, "db-btn db-btn-sm");
+        delBtn.addEventListener("click", () => void deleteObject(object));
+        actions.appendChild(delBtn);
       }
       header.append(title, meta, actions);
       return header;
@@ -12876,6 +13762,7 @@ ${frontmatter.yaml}
       currentNextToken = undefined;
       listLoaded = false;
       resetExplorer();
+      newObjectBtn.hidden = false;
       notifySelectionChange();
       if (currentView === "explorer")
         await loadExplorerRoot();
@@ -12994,6 +13881,7 @@ ${frontmatter.yaml}
           return;
         }
         bucketSelect.value = selected;
+        newObjectBtn.hidden = false;
         suppressNotify = true;
         try {
           currentBucket = selected;
@@ -13090,6 +13978,8 @@ ${frontmatter.yaml}
       containsModeBtn.textContent = t2.containsMode;
       sortUpdated.textContent = t2.sortUpdated;
       sortKey.textContent = t2.sortKey;
+      newObjectBtn.textContent = `＋ ${t2.newObject}`;
+      newObjectBtn.title = t2.newObject;
       moreBtn.textContent = tCommon().loadMore;
       searchInput.placeholder = currentMode === "prefix" ? t2.prefixPlaceholder : t2.containsPlaceholder;
       if (!currentKey)
@@ -13292,6 +14182,276 @@ ${frontmatter.yaml}
     return { el, render, clear, localize };
   }
 
+  // web-src/views/database/session-log.ts
+  var DEFAULT_MAX_ENTRIES = 500;
+  function createSessionLog(options = {}) {
+    const max = options.maxEntries ?? DEFAULT_MAX_ENTRIES;
+    const entries = [];
+    const listeners = new Set;
+    let seq = 0;
+    function emit() {
+      for (const fn of listeners)
+        fn();
+    }
+    function add2(entry) {
+      seq += 1;
+      const next = {
+        ...entry,
+        id: `sl-${seq}`,
+        timestamp: Date.now()
+      };
+      entries.push(next);
+      while (entries.length > max)
+        entries.shift();
+      emit();
+      return next;
+    }
+    return {
+      add: add2,
+      list: () => entries,
+      clear() {
+        if (entries.length === 0)
+          return;
+        entries.length = 0;
+        emit();
+      },
+      subscribe(listener) {
+        listeners.add(listener);
+        return () => listeners.delete(listener);
+      }
+    };
+  }
+
+  // web-src/views/database/session-log-view.ts
+  function createSessionLogView(callbacks) {
+    const text2 = () => callbacks.getText?.() ?? dbText("en");
+    const el = document.createElement("div");
+    el.className = "db-session-log";
+    const toolbar = document.createElement("div");
+    toolbar.className = "db-session-log-toolbar";
+    const followBtn = document.createElement("button");
+    followBtn.className = "db-session-log-action active";
+    followBtn.type = "button";
+    followBtn.textContent = text2().sessionLog.autoFollow;
+    followBtn.title = text2().sessionLog.autoFollowTitle;
+    followBtn.setAttribute("aria-pressed", "true");
+    const clearBtn = document.createElement("button");
+    clearBtn.className = "db-session-log-action db-session-log-danger";
+    clearBtn.type = "button";
+    clearBtn.textContent = text2().sessionLog.clear;
+    clearBtn.title = text2().sessionLog.clearTitle;
+    toolbar.append(followBtn, clearBtn);
+    const body = document.createElement("div");
+    body.className = "db-session-log-body-split";
+    const listCol = document.createElement("div");
+    listCol.className = "db-session-log-list-col";
+    const listEl = document.createElement("div");
+    listEl.className = "db-session-log-list";
+    listCol.appendChild(listEl);
+    const detailCol = document.createElement("div");
+    detailCol.className = "db-session-log-detail-col";
+    const placeholder = document.createElement("div");
+    placeholder.className = "db-session-log-detail-placeholder";
+    placeholder.textContent = text2().sessionLog.selectPlaceholder;
+    detailCol.appendChild(placeholder);
+    body.append(listCol, detailCol);
+    el.append(toolbar, body);
+    let selectedId = null;
+    const rowById = new Map;
+    let autoFollow = true;
+    let suppressScrollEvent = false;
+    const AUTO_FOLLOW_THRESHOLD_PX = 4;
+    function refreshFollowBtn() {
+      followBtn.classList.toggle("active", autoFollow);
+      followBtn.setAttribute("aria-pressed", String(autoFollow));
+    }
+    followBtn.addEventListener("click", () => {
+      autoFollow = !autoFollow;
+      refreshFollowBtn();
+      if (autoFollow) {
+        suppressScrollEvent = true;
+        listEl.scrollTop = 0;
+      }
+    });
+    listEl.addEventListener("scroll", () => {
+      if (suppressScrollEvent) {
+        suppressScrollEvent = false;
+        return;
+      }
+      if (autoFollow && listEl.scrollTop > AUTO_FOLLOW_THRESHOLD_PX) {
+        autoFollow = false;
+        refreshFollowBtn();
+      }
+    });
+    let shiki = null;
+    loadShikiHighlighter({
+      themes: ["github-light", "github-dark"],
+      langs: ["sql"]
+    }).then((h) => {
+      shiki = h;
+      if (selectedId) {
+        const cur = callbacks.store.list().find((e2) => e2.id === selectedId);
+        if (cur)
+          renderDetail(cur);
+      }
+    });
+    function render() {
+      listEl.innerHTML = "";
+      rowById.clear();
+      const entries = callbacks.store.list();
+      if (entries.length === 0) {
+        const empty = document.createElement("div");
+        empty.className = "db-session-log-empty";
+        empty.textContent = text2().sessionLog.empty;
+        listEl.appendChild(empty);
+        detailCol.innerHTML = "";
+        detailCol.appendChild(placeholder);
+        selectedId = null;
+        return;
+      }
+      const fragment = document.createDocumentFragment();
+      for (let i2 = entries.length - 1;i2 >= 0; i2--) {
+        fragment.appendChild(renderEntry(entries[i2]));
+      }
+      listEl.appendChild(fragment);
+      if (autoFollow) {
+        suppressScrollEvent = true;
+        listEl.scrollTop = 0;
+        const latest = entries[entries.length - 1];
+        selectedId = latest.id;
+        renderDetail(latest);
+        rowById.get(latest.id)?.classList.add("selected");
+      } else if (selectedId) {
+        const cur = entries.find((e2) => e2.id === selectedId);
+        if (cur) {
+          renderDetail(cur);
+          rowById.get(cur.id)?.classList.add("selected");
+        } else {
+          detailCol.innerHTML = "";
+          detailCol.appendChild(placeholder);
+          selectedId = null;
+        }
+      }
+    }
+    function renderEntry(entry) {
+      const row = document.createElement("div");
+      row.className = "db-session-log-entry";
+      row.dataset.id = entry.id;
+      row.dataset.status = entry.status;
+      row.dataset.kind = entry.kind;
+      rowById.set(entry.id, row);
+      const meta = document.createElement("div");
+      meta.className = "db-session-log-entry-meta";
+      const badge = document.createElement("span");
+      badge.className = `db-session-log-badge db-session-log-badge-${entry.status}`;
+      badge.textContent = entry.status === "error" ? text2().sessionLog.statusError : text2().sessionLog.statusOk;
+      const kind = document.createElement("span");
+      kind.className = "db-session-log-kind";
+      kind.textContent = entry.kind === "query" ? text2().sessionLog.kindQuery : text2().sessionLog.kindMutate;
+      const time = document.createElement("span");
+      time.className = "db-session-log-time";
+      time.textContent = formatTime2(entry.timestamp);
+      const stats = document.createElement("span");
+      stats.className = "db-session-log-stats";
+      const parts = [];
+      if (entry.rowCount !== undefined)
+        parts.push(`${entry.rowCount} rows`);
+      if (entry.elapsedMs !== undefined)
+        parts.push(`${entry.elapsedMs}ms`);
+      stats.textContent = parts.join(", ");
+      meta.append(badge, kind, time, stats);
+      const title = document.createElement("div");
+      title.className = "db-session-log-entry-title";
+      title.textContent = entry.label.length > 100 ? `${entry.label.slice(0, 100)}...` : entry.label;
+      row.append(meta, title);
+      row.addEventListener("click", () => selectEntry(entry));
+      return row;
+    }
+    function selectEntry(entry) {
+      selectedId = entry.id;
+      for (const r2 of rowById.values())
+        r2.classList.remove("selected");
+      rowById.get(entry.id)?.classList.add("selected");
+      renderDetail(entry);
+      const entries = callbacks.store.list();
+      const isLatest = entries[entries.length - 1]?.id === entry.id;
+      if (autoFollow && !isLatest) {
+        autoFollow = false;
+        refreshFollowBtn();
+      }
+    }
+    function renderDetail(entry) {
+      detailCol.innerHTML = "";
+      if (callbacks.copySqlToQuery && entry.detail) {
+        const actions = document.createElement("div");
+        actions.className = "db-session-log-detail-actions";
+        const useBtn = document.createElement("button");
+        useBtn.className = "db-btn db-btn-primary";
+        useBtn.type = "button";
+        useBtn.textContent = text2().sessionLog.useInEditor;
+        useBtn.addEventListener("click", () => {
+          callbacks.copySqlToQuery?.(entry.detail ?? "");
+        });
+        const copyBtn = document.createElement("button");
+        copyBtn.className = "db-btn";
+        copyBtn.type = "button";
+        copyBtn.textContent = text2().sessionLog.copy;
+        copyBtn.addEventListener("click", () => {
+          const txt = entry.message && entry.detail ? `${entry.detail}
+
+${entry.message}` : entry.detail ?? entry.message ?? "";
+          navigator.clipboard.writeText(txt).then(() => {
+            copyBtn.textContent = text2().sessionLog.copied;
+            setTimeout(() => {
+              copyBtn.textContent = text2().sessionLog.copy;
+            }, 1200);
+          }, () => {});
+        });
+        actions.append(useBtn, copyBtn);
+        detailCol.appendChild(actions);
+      }
+      if (entry.detail) {
+        const sql = document.createElement("pre");
+        sql.className = "db-session-log-sql";
+        const inner = highlightSqlToInnerHtml(entry.detail, shiki);
+        if (inner) {
+          sql.innerHTML = inner;
+        } else {
+          sql.textContent = entry.detail;
+        }
+        detailCol.appendChild(sql);
+      }
+      if (entry.message) {
+        const msg = document.createElement("pre");
+        msg.className = `db-session-log-message db-session-log-message-${entry.status}`;
+        msg.textContent = entry.message;
+        detailCol.appendChild(msg);
+      }
+    }
+    clearBtn.addEventListener("click", () => {
+      callbacks.store.clear();
+    });
+    callbacks.store.subscribe(render);
+    render();
+    function clear() {
+      callbacks.store.clear();
+    }
+    function localize() {
+      clearBtn.textContent = text2().sessionLog.clear;
+      clearBtn.title = text2().sessionLog.clearTitle;
+      followBtn.textContent = text2().sessionLog.autoFollow;
+      followBtn.title = text2().sessionLog.autoFollowTitle;
+      placeholder.textContent = text2().sessionLog.selectPlaceholder;
+      render();
+    }
+    return { el, clear, localize };
+  }
+  function formatTime2(timestamp) {
+    const d2 = new Date(timestamp);
+    const pad = (n2) => String(n2).padStart(2, "0");
+    return `${pad(d2.getHours())}:${pad(d2.getMinutes())}:${pad(d2.getSeconds())}`;
+  }
+
   // web-src/views/database/snapshot-view.ts
   function arraysEqual(a2, b2) {
     if (a2.length !== b2.length)
@@ -14022,7 +15182,28 @@ ${frontmatter.yaml}
       closeExportMenu();
       triggerExport("json");
     });
-    filterBar.append(filterIcon, filterInput, filterClear, exportWrap);
+    const editWrap = document.createElement("div");
+    editWrap.className = "db-grid-edit-controls";
+    editWrap.hidden = true;
+    const newRowBtn = document.createElement("button");
+    newRowBtn.type = "button";
+    newRowBtn.className = "db-btn db-grid-edit-newrow";
+    newRowBtn.textContent = text2().edit.newRow;
+    newRowBtn.style.visibility = "hidden";
+    const commitBtn = document.createElement("button");
+    commitBtn.type = "button";
+    commitBtn.className = "db-btn db-btn-primary db-grid-edit-commit";
+    commitBtn.textContent = text2().edit.commit;
+    commitBtn.style.visibility = "hidden";
+    const discardBtn = document.createElement("button");
+    discardBtn.type = "button";
+    discardBtn.className = "db-btn db-grid-edit-discard";
+    discardBtn.textContent = text2().edit.discard;
+    discardBtn.style.visibility = "hidden";
+    const editStatus = document.createElement("span");
+    editStatus.className = "db-grid-edit-status";
+    editWrap.append(newRowBtn, commitBtn, discardBtn, editStatus);
+    filterBar.append(filterIcon, filterInput, filterClear, editWrap, exportWrap);
     const headerWrap = document.createElement("div");
     headerWrap.className = "db-grid-header-wrap";
     const headerRow = document.createElement("div");
@@ -14130,6 +15311,13 @@ ${frontmatter.yaml}
     let activeCellColIndex = -1;
     let renderStartRow = 0;
     const fkColumns = new Set;
+    let editMode = false;
+    let isComposing = false;
+    const pendingEdits = new Map;
+    const pendingDeletes = new Map;
+    let draftRows = [];
+    let editingCellRow = -1;
+    let editingCellCol = -1;
     let relatedPanel = null;
     let relatedListEl = null;
     let relatedGridHost = null;
@@ -14275,6 +15463,9 @@ ${frontmatter.yaml}
       detailPanel.hidden = true;
       clearDetailContent();
       colWidths.clear();
+      clearPending();
+      setEditStatus("");
+      refreshEditButtons();
     }
     let relatedFirstPageController = null;
     function relatedLookupValue(value) {
@@ -14524,8 +15715,8 @@ ${frontmatter.yaml}
         if (target.fk.inferred) {
           const badge = document.createElement("span");
           badge.className = "db-related-list-inferred-badge";
-          badge.textContent = "inferred";
-          badge.title = "Inferred from Rails-style naming, not declared in DB";
+          badge.textContent = text2().nav.inferredBadge;
+          badge.title = text2().nav.inferredBadgeTitle;
           name.appendChild(badge);
         }
         const via = document.createElement("span");
@@ -14795,7 +15986,7 @@ ${frontmatter.yaml}
           return;
         pageCache.set(pageStart, data.rows);
         totalRows = data.totalRows;
-        spacer.style.height = `${totalRows * ROW_HEIGHT}px`;
+        syncSpacer();
         updateStatus();
         renderViewport();
       }).catch((err) => {
@@ -14813,98 +16004,334 @@ ${frontmatter.yaml}
       pendingPages.set(pageStart, tracked);
       return tracked;
     }
+    function buildEditableCell(colIndex, value, opts) {
+      const cell = document.createElement("div");
+      cell.className = "db-grid-cell db-grid-cell-edit";
+      cell.style.width = `${getColWidth(columnNames[colIndex])}px`;
+      if (!opts.editing) {
+        cell.classList.add("db-grid-cell-display");
+        cell.textContent = value === null ? "NULL" : value === "" ? "" : value;
+        if (value === null)
+          cell.classList.add("null");
+        else if (value === "")
+          cell.classList.add("empty");
+        if (opts.readonly) {
+          cell.classList.add("readonly");
+        }
+        cell.style.cursor = "pointer";
+        cell.addEventListener("click", (e2) => {
+          e2.stopPropagation();
+          opts.onActivate?.();
+        });
+        if (!opts.readonly) {
+          cell.title = text2().edit.dblclickToEdit;
+          cell.addEventListener("dblclick", (e2) => {
+            e2.stopPropagation();
+            opts.onEnterEdit?.();
+          });
+        }
+        return cell;
+      }
+      const input = document.createElement("input");
+      input.type = "text";
+      input.className = "db-grid-cell-input";
+      input.dataset.editRow = String(opts.rowIndex);
+      input.dataset.editCol = String(colIndex);
+      const applyNullVisual = (isNull) => {
+        input.classList.toggle("is-null", isNull);
+        input.placeholder = isNull ? "NULL" : "";
+      };
+      input.value = value === null ? "" : value;
+      applyNullVisual(value === null);
+      if (opts.readonly) {
+        input.readOnly = true;
+        input.classList.add("readonly");
+      }
+      input.addEventListener("input", () => {
+        applyNullVisual(false);
+        opts.onChange(input.value);
+      });
+      input.addEventListener("click", (e2) => e2.stopPropagation());
+      input.addEventListener("blur", (e2) => {
+        const next = e2.relatedTarget;
+        if (next && cell.contains(next))
+          return;
+        opts.onExitEdit?.();
+      });
+      input.addEventListener("keydown", (e2) => {
+        if (e2.key === "Enter" || e2.key === "Escape") {
+          e2.preventDefault();
+          opts.onExitEdit?.();
+        }
+      });
+      cell.appendChild(input);
+      if (opts.nullable && !opts.readonly) {
+        const nullBtn = document.createElement("button");
+        nullBtn.type = "button";
+        nullBtn.className = "db-grid-cell-null-btn";
+        nullBtn.textContent = "∅";
+        nullBtn.title = text2().edit.setNull;
+        nullBtn.addEventListener("mousedown", (e2) => e2.preventDefault());
+        nullBtn.addEventListener("click", (e2) => {
+          e2.stopPropagation();
+          input.value = "";
+          applyNullVisual(true);
+          opts.onChange(null);
+          input.focus();
+        });
+        cell.appendChild(nullBtn);
+      }
+      return cell;
+    }
+    function buildDataRow(i2) {
+      const pageStart = Math.floor(i2 / PAGE_SIZE) * PAGE_SIZE;
+      const pageRows = pageCache.get(pageStart);
+      const rowData = pageRows ? pageRows[i2 - pageStart] : null;
+      const row = document.createElement("div");
+      row.className = "db-grid-row";
+      if (i2 % 2 === 1)
+        row.classList.add("alt");
+      if (i2 === selectedRowIndex)
+        row.classList.add("selected");
+      const rowIndex = i2;
+      const rowNum = document.createElement("div");
+      rowNum.className = "db-grid-cell db-grid-rownum";
+      rowNum.textContent = String(i2 + 1);
+      row.appendChild(rowNum);
+      if (!rowData) {
+        for (let c2 = 0;c2 < columnNames.length; c2++) {
+          const cell = document.createElement("div");
+          cell.className = "db-grid-cell loading";
+          cell.style.width = `${getColWidth(columnNames[c2])}px`;
+          cell.textContent = "…";
+          row.appendChild(cell);
+        }
+        return row;
+      }
+      if (editMode) {
+        const key = rowKeyFor(rowData);
+        const editableRow = key !== null;
+        if (key !== null && pendingDeletes.has(key)) {
+          row.classList.add("db-grid-row-deleted");
+        }
+        if (editableRow) {
+          rowNum.classList.add("db-grid-rownum-deletable");
+          rowNum.title = text2().edit.deleteRow;
+          rowNum.style.cursor = "pointer";
+          rowNum.addEventListener("click", (e2) => {
+            e2.stopPropagation();
+            const deleted = toggleDelete(rowData);
+            row.classList.toggle("db-grid-row-deleted", deleted);
+          });
+        }
+        const pendingForRow = key !== null ? pendingEdits.get(key) : undefined;
+        if ((pendingForRow?.edits.size ?? 0) > 0) {
+          row.classList.add("db-grid-row-edited");
+        }
+        for (let c2 = 0;c2 < columnNames.length; c2++) {
+          const original = rowData[c2];
+          const originalShown = original === null ? null : original instanceof Uint8Array ? formatValue3(original) : String(original);
+          const hasOverride = pendingForRow?.edits.has(c2) ?? false;
+          const shown = hasOverride ? pendingForRow?.edits.get(c2) ?? null : originalShown;
+          const ro = !editableRow || columns[c2]?.primaryKey === true || original instanceof Uint8Array;
+          const cellColIndex = c2;
+          const cellColName = columnNames[c2];
+          const cellValue = original;
+          const rowValues = rowData;
+          const fkClickable = fkColumns.has(cellColName) && (!embedded || !!callbacks.onForeignKeyCellClick);
+          const isEditingThisCell = !ro && i2 === editingCellRow && c2 === editingCellCol;
+          const activate = () => {
+            selectedRowIndex = rowIndex;
+            body.querySelectorAll(".db-grid-row.selected").forEach((r2) => {
+              r2.classList.remove("selected");
+            });
+            row.classList.add("selected");
+            setActiveCell(rowIndex, cellColIndex);
+            if (fkClickable) {
+              if (embedded) {
+                callbacks.onForeignKeyCellClick?.(currentTable, columnNames, rowValues, cellColName);
+              } else {
+                openRelatedForRow(currentTable, columnNames, rowValues, cellColName);
+              }
+            } else {
+              showCellDetail(cellColIndex, cellValue);
+            }
+          };
+          const enterEdit = () => {
+            editingCellRow = i2;
+            editingCellCol = cellColIndex;
+            renderViewport();
+            requestAnimationFrame(() => {
+              const inp = body.querySelector(`.db-grid-cell-input[data-edit-row="${i2}"][data-edit-col="${cellColIndex}"]`);
+              if (!inp)
+                return;
+              inp.focus?.();
+              try {
+                inp.setSelectionRange?.(inp.value.length, inp.value.length);
+              } catch {}
+            });
+          };
+          const exitEdit = () => {
+            if (editingCellRow === i2 && editingCellCol === cellColIndex) {
+              editingCellRow = -1;
+              editingCellCol = -1;
+              renderViewport();
+            }
+          };
+          const cellEl = buildEditableCell(c2, shown, {
+            readonly: ro,
+            nullable: columns[c2]?.nullable === true,
+            editing: isEditingThisCell,
+            rowIndex: i2,
+            onChange: (v) => recordEdit(rowData, c2, v),
+            onActivate: activate,
+            onEnterEdit: enterEdit,
+            onExitEdit: exitEdit
+          });
+          if (fkClickable) {
+            cellEl.classList.add("db-grid-cell-fk");
+          }
+          if (hasOverride) {
+            cellEl.classList.add("db-grid-cell-edited");
+          }
+          if (!isEditingThisCell && i2 === activeCellRowIndex && c2 === activeCellColIndex) {
+            cellEl.classList.add("db-grid-cell-active");
+          }
+          row.appendChild(cellEl);
+        }
+        return row;
+      }
+      row.addEventListener("click", () => {
+        selectedRowIndex = rowIndex;
+        body.querySelectorAll(".db-grid-row.selected").forEach((r2) => {
+          r2.classList.remove("selected");
+        });
+        row.classList.add("selected");
+      });
+      for (let c2 = 0;c2 < columnNames.length; c2++) {
+        const cell = document.createElement("div");
+        cell.className = "db-grid-cell";
+        cell.style.width = `${getColWidth(columnNames[c2])}px`;
+        const val = rowData[c2];
+        cell.textContent = formatValue3(val);
+        if (val === null)
+          cell.classList.add("null");
+        else if (val instanceof Uint8Array)
+          cell.classList.add("blob");
+        else if (typeof val === "string" && val === "")
+          cell.classList.add("empty");
+        cell.style.cursor = "pointer";
+        const cellValue = val;
+        const cellColIndex = c2;
+        const cellColName = columnNames[c2];
+        const rowValues = rowData;
+        const fkClickable = fkColumns.has(cellColName) && (!embedded || !!callbacks.onForeignKeyCellClick);
+        if (fkClickable) {
+          cell.classList.add("db-grid-cell-fk");
+        }
+        cell.addEventListener("click", (e2) => {
+          e2.stopPropagation();
+          selectedRowIndex = rowIndex;
+          body.querySelectorAll(".db-grid-row.selected").forEach((r2) => {
+            r2.classList.remove("selected");
+          });
+          row.classList.add("selected");
+          setActiveCell(rowIndex, cellColIndex);
+          if (fkClickable) {
+            if (embedded) {
+              callbacks.onForeignKeyCellClick?.(currentTable, columnNames, rowValues, cellColName);
+            } else {
+              openRelatedForRow(currentTable, columnNames, rowValues, cellColName);
+            }
+          } else {
+            showCellDetail(cellColIndex, cellValue);
+          }
+        });
+        if (i2 === activeCellRowIndex && c2 === activeCellColIndex) {
+          cell.classList.add("db-grid-cell-active");
+        }
+        row.appendChild(cell);
+      }
+      return row;
+    }
+    function buildDraftRow(draftIndex) {
+      const draft = draftRows[draftIndex];
+      const row = document.createElement("div");
+      row.className = "db-grid-row db-grid-row-draft";
+      const rowNum = document.createElement("div");
+      rowNum.className = "db-grid-cell db-grid-rownum db-grid-rownum-draft";
+      rowNum.textContent = "＋";
+      rowNum.title = text2().edit.newRow;
+      rowNum.style.cursor = "pointer";
+      rowNum.addEventListener("click", (e2) => {
+        e2.stopPropagation();
+        draftRows.splice(draftIndex, 1);
+        syncSpacer();
+        refreshEditButtons();
+        showPendingStatus();
+        renderViewport();
+      });
+      row.appendChild(rowNum);
+      for (let c2 = 0;c2 < columnNames.length; c2++) {
+        const dv = draft.has(c2) ? draft.get(c2) : "";
+        row.appendChild(buildEditableCell(c2, dv, {
+          readonly: false,
+          nullable: columns[c2]?.nullable === true,
+          editing: true,
+          rowIndex: totalRows + draftIndex,
+          onChange: (v) => {
+            if (v === "")
+              draft.delete(c2);
+            else
+              draft.set(c2, v);
+            refreshEditButtons();
+            showPendingStatus();
+          }
+        }));
+      }
+      return row;
+    }
     function renderViewport() {
       cancelAnimationFrame(rafId);
       rafId = requestAnimationFrame(() => {
+        if (isComposing)
+          return;
         const scrollTop = viewport.scrollTop;
         const viewHeight = viewport.clientHeight;
         const startRow = Math.max(0, Math.floor(scrollTop / ROW_HEIGHT) - OVERSCAN);
         renderStartRow = startRow;
-        const endRow = Math.min(totalRows, Math.ceil((scrollTop + viewHeight) / ROW_HEIGHT) + OVERSCAN);
-        const neededPageStart = Math.floor(startRow / PAGE_SIZE) * PAGE_SIZE;
-        const neededPageEnd = Math.floor(endRow / PAGE_SIZE) * PAGE_SIZE;
-        for (let p2 = neededPageStart;p2 <= neededPageEnd; p2 += PAGE_SIZE) {
-          ensurePage(p2);
+        const endRow = Math.min(displayRowCount(), Math.ceil((scrollTop + viewHeight) / ROW_HEIGHT) + OVERSCAN);
+        const dataEnd = Math.min(endRow, totalRows);
+        if (startRow < totalRows && dataEnd > startRow) {
+          const neededPageStart = Math.floor(startRow / PAGE_SIZE) * PAGE_SIZE;
+          const neededPageEnd = Math.floor((dataEnd - 1) / PAGE_SIZE) * PAGE_SIZE;
+          for (let p2 = neededPageStart;p2 <= neededPageEnd; p2 += PAGE_SIZE) {
+            ensurePage(p2);
+          }
+        }
+        const active = document.activeElement;
+        let focusRestore = null;
+        if (active?.classList?.contains("db-grid-cell-input") && body.contains(active)) {
+          focusRestore = {
+            row: active.dataset?.editRow ?? "",
+            col: active.dataset?.editCol ?? "",
+            start: active.selectionStart ?? null,
+            end: active.selectionEnd ?? null
+          };
         }
         body.innerHTML = "";
         body.style.transform = `translateY(${startRow * ROW_HEIGHT}px)`;
         for (let i2 = startRow;i2 < endRow; i2++) {
-          const pageStart = Math.floor(i2 / PAGE_SIZE) * PAGE_SIZE;
-          const pageRows = pageCache.get(pageStart);
-          const rowData = pageRows ? pageRows[i2 - pageStart] : null;
-          const row = document.createElement("div");
-          row.className = "db-grid-row";
-          if (i2 % 2 === 1)
-            row.classList.add("alt");
-          if (i2 === selectedRowIndex)
-            row.classList.add("selected");
-          const rowIndex = i2;
-          row.addEventListener("click", () => {
-            selectedRowIndex = rowIndex;
-            body.querySelectorAll(".db-grid-row.selected").forEach((r2) => {
-              r2.classList.remove("selected");
-            });
-            row.classList.add("selected");
-          });
-          const rowNum = document.createElement("div");
-          rowNum.className = "db-grid-cell db-grid-rownum";
-          rowNum.textContent = String(i2 + 1);
-          row.appendChild(rowNum);
-          if (rowData) {
-            for (let c2 = 0;c2 < columnNames.length; c2++) {
-              const cell = document.createElement("div");
-              cell.className = "db-grid-cell";
-              cell.style.width = `${getColWidth(columnNames[c2])}px`;
-              const val = rowData[c2];
-              cell.textContent = formatValue3(val);
-              if (val === null)
-                cell.classList.add("null");
-              else if (val instanceof Uint8Array)
-                cell.classList.add("blob");
-              else if (typeof val === "string" && val === "")
-                cell.classList.add("empty");
-              cell.style.cursor = "pointer";
-              const cellValue = val;
-              const cellColIndex = c2;
-              const cellColName = columnNames[c2];
-              const rowValues = rowData;
-              const fkClickable = fkColumns.has(cellColName) && (!embedded || !!callbacks.onForeignKeyCellClick);
-              if (fkClickable) {
-                cell.classList.add("db-grid-cell-fk");
-              }
-              cell.addEventListener("click", (e2) => {
-                e2.stopPropagation();
-                selectedRowIndex = rowIndex;
-                body.querySelectorAll(".db-grid-row.selected").forEach((r2) => {
-                  r2.classList.remove("selected");
-                });
-                row.classList.add("selected");
-                setActiveCell(rowIndex, cellColIndex);
-                if (fkClickable) {
-                  if (embedded) {
-                    callbacks.onForeignKeyCellClick?.(currentTable, columnNames, rowValues, cellColName);
-                  } else {
-                    openRelatedForRow(currentTable, columnNames, rowValues, cellColName);
-                  }
-                } else {
-                  showCellDetail(cellColIndex, cellValue);
-                }
-              });
-              if (i2 === activeCellRowIndex && c2 === activeCellColIndex) {
-                cell.classList.add("db-grid-cell-active");
-              }
-              row.appendChild(cell);
-            }
-          } else {
-            for (let c2 = 0;c2 < columnNames.length; c2++) {
-              const cell = document.createElement("div");
-              cell.className = "db-grid-cell loading";
-              cell.style.width = `${getColWidth(columnNames[c2])}px`;
-              cell.textContent = "…";
-              row.appendChild(cell);
-            }
+          body.appendChild(i2 < totalRows ? buildDataRow(i2) : buildDraftRow(i2 - totalRows));
+        }
+        if (focusRestore) {
+          const next = body.querySelector(`.db-grid-cell-input[data-edit-row="${focusRestore.row}"][data-edit-col="${focusRestore.col}"]`);
+          if (next) {
+            next.focus?.();
+            try {
+              next.setSelectionRange?.(focusRestore.start ?? next.value.length, focusRestore.end ?? next.value.length);
+            } catch {}
           }
-          body.appendChild(row);
         }
       });
     }
@@ -14978,9 +16405,11 @@ ${frontmatter.yaml}
       }
       rebuildFkColumnsForCurrentTable();
       loadColWidths();
-      spacer.style.height = `${totalRows * ROW_HEIGHT}px`;
+      syncSpacer();
       renderHeader();
       updateStatus();
+      refreshEditButtons();
+      showPendingStatus();
       if (!initialData) {
         ensurePage(0);
       } else {
@@ -15045,11 +16474,22 @@ ${frontmatter.yaml}
       renderViewport();
     };
     viewport.addEventListener("scroll", onViewportScroll, { passive: true });
+    const onCompositionStart = () => {
+      isComposing = true;
+    };
+    const onCompositionEnd = () => {
+      isComposing = false;
+      renderViewport();
+    };
+    body.addEventListener("compositionstart", onCompositionStart);
+    body.addEventListener("compositionend", onCompositionEnd);
     function destroy() {
       clear();
       embeddedGrid?.destroy();
       embeddedGrid = null;
       viewport.removeEventListener("scroll", onViewportScroll);
+      body.removeEventListener("compositionstart", onCompositionStart);
+      body.removeEventListener("compositionend", onCompositionEnd);
       detailResizeCleanup?.();
     }
     function localize() {
@@ -15057,6 +16497,10 @@ ${frontmatter.yaml}
       filterInput.placeholder = t2.grid.searchPlaceholder;
       exportBtn.title = t2.grid.exportAction;
       exportBtn.setAttribute("aria-label", t2.grid.exportAction);
+      newRowBtn.textContent = t2.edit.newRow;
+      commitBtn.textContent = t2.edit.commit;
+      discardBtn.textContent = t2.edit.discard;
+      showPendingStatus();
       if (relatedEmptyEl)
         relatedEmptyEl.textContent = t2.grid.relatedEmpty;
       if (currentTable) {
@@ -15077,6 +16521,250 @@ ${frontmatter.yaml}
           fkColumns.add(fk.toColumn);
       }
     }
+    function isEditable() {
+      return !embedded && callbacks.getEditable?.() === true && typeof callbacks.applyMutations === "function";
+    }
+    function pkColumnIndices() {
+      const idx = [];
+      for (let i2 = 0;i2 < columns.length; i2++) {
+        if (columns[i2].primaryKey)
+          idx.push(i2);
+      }
+      return idx;
+    }
+    function hasPrimaryKey() {
+      return columns.some((c2) => c2.primaryKey);
+    }
+    function rowKeyFor(rowData) {
+      const idx = pkColumnIndices();
+      if (idx.length === 0)
+        return null;
+      const parts = [];
+      for (const i2 of idx) {
+        const v = rowData[i2];
+        if (v === null || v instanceof Uint8Array)
+          return null;
+        parts.push(String(v));
+      }
+      return JSON.stringify(parts);
+    }
+    function pkCellsFor(rowData) {
+      return pkColumnIndices().map((i2) => ({
+        column: columnNames[i2],
+        value: String(rowData[i2])
+      }));
+    }
+    function nonEmptyDraftCount() {
+      return draftRows.filter((d2) => Array.from(d2.values()).some((v) => v === null || v !== "")).length;
+    }
+    function pendingCount() {
+      let updates = 0;
+      for (const [key, entry] of pendingEdits) {
+        if (pendingDeletes.has(key))
+          continue;
+        if (entry.edits.size > 0)
+          updates++;
+      }
+      return updates + pendingDeletes.size + nonEmptyDraftCount();
+    }
+    function hasPending() {
+      return pendingCount() > 0;
+    }
+    function clearPending() {
+      pendingEdits.clear();
+      pendingDeletes.clear();
+      draftRows = [];
+    }
+    function displayRowCount() {
+      return totalRows + (editMode ? draftRows.length : 0);
+    }
+    function syncSpacer() {
+      spacer.style.height = `${displayRowCount() * ROW_HEIGHT}px`;
+    }
+    function setEditStatus(message) {
+      editStatus.textContent = message;
+    }
+    function refreshEditButtons() {
+      const editable = isEditable();
+      editWrap.hidden = !editable;
+      if (!editable) {
+        notifyEditableIfChanged();
+        return;
+      }
+      const inert = !editMode;
+      setControlVisibility(newRowBtn, !inert);
+      setControlVisibility(commitBtn, !inert);
+      setControlVisibility(discardBtn, !inert);
+      setControlVisibility(editStatus, !inert);
+      const count = pendingCount();
+      commitBtn.disabled = count === 0;
+      discardBtn.disabled = count === 0;
+      notifyEditableIfChanged();
+    }
+    function setControlVisibility(el2, visible) {
+      el2.style.visibility = visible ? "" : "hidden";
+      if ("tabIndex" in el2) {
+        el2.tabIndex = visible ? 0 : -1;
+      }
+      el2.setAttribute("aria-hidden", visible ? "false" : "true");
+    }
+    const editableListeners = new Set;
+    const editModeListeners = new Set;
+    let lastEditableNotified = null;
+    function notifyEditableIfChanged() {
+      const v = isEditable();
+      if (v === lastEditableNotified)
+        return;
+      lastEditableNotified = v;
+      for (const fn of editableListeners)
+        fn(v);
+    }
+    function notifyEditMode() {
+      for (const fn of editModeListeners)
+        fn(editMode);
+    }
+    function onEditableChange(listener) {
+      editableListeners.add(listener);
+      listener(isEditable());
+      return () => editableListeners.delete(listener);
+    }
+    function onEditModeChange(listener) {
+      editModeListeners.add(listener);
+      listener(editMode);
+      return () => editModeListeners.delete(listener);
+    }
+    function showPendingStatus() {
+      const count = pendingCount();
+      setEditStatus(editMode && count > 0 ? text2().edit.pending(count) : editMode && !hasPrimaryKey() ? text2().edit.noPrimaryKey : "");
+    }
+    function recordEdit(rowData, colIndex, value) {
+      const key = rowKeyFor(rowData);
+      if (key === null)
+        return;
+      let entry = pendingEdits.get(key);
+      if (!entry) {
+        entry = { pk: pkCellsFor(rowData), edits: new Map };
+        pendingEdits.set(key, entry);
+      }
+      const original = rowData[colIndex];
+      const originalStr = original === null || original instanceof Uint8Array ? null : String(original);
+      if (value === originalStr) {
+        entry.edits.delete(colIndex);
+        if (entry.edits.size === 0)
+          pendingEdits.delete(key);
+      } else {
+        entry.edits.set(colIndex, value);
+      }
+      refreshEditButtons();
+      showPendingStatus();
+    }
+    function toggleDelete(rowData) {
+      const key = rowKeyFor(rowData);
+      if (key === null)
+        return false;
+      if (pendingDeletes.has(key))
+        pendingDeletes.delete(key);
+      else
+        pendingDeletes.set(key, pkCellsFor(rowData));
+      refreshEditButtons();
+      showPendingStatus();
+      return pendingDeletes.has(key);
+    }
+    function buildMutations() {
+      const muts = [];
+      for (const pk of pendingDeletes.values()) {
+        muts.push({ kind: "delete", pk });
+      }
+      for (const [key, entry] of pendingEdits) {
+        if (pendingDeletes.has(key))
+          continue;
+        if (entry.edits.size === 0)
+          continue;
+        const values = Array.from(entry.edits).map(([c2, v]) => ({
+          column: columnNames[c2],
+          value: v
+        }));
+        muts.push({ kind: "update", pk: entry.pk, values });
+      }
+      for (const draft of draftRows) {
+        const values = Array.from(draft).filter(([, v]) => v === null || v !== "").map(([c2, v]) => ({ column: columnNames[c2], value: v }));
+        if (values.length > 0)
+          muts.push({ kind: "insert", values });
+      }
+      return muts;
+    }
+    async function setEditMode(on) {
+      if (on === editMode)
+        return true;
+      if (!on && hasPending()) {
+        const ok = await showConfirmDialog({
+          body: text2().edit.confirmDiscard,
+          confirmLabel: text2().edit.discard,
+          danger: true
+        });
+        if (!ok)
+          return false;
+      }
+      editMode = on;
+      if (!on)
+        clearPending();
+      notifyEditMode();
+      editingCellRow = -1;
+      editingCellCol = -1;
+      syncSpacer();
+      refreshEditButtons();
+      showPendingStatus();
+      renderViewport();
+    }
+    async function commitPending() {
+      if (!callbacks.applyMutations)
+        return;
+      const mutations = buildMutations();
+      if (mutations.length === 0)
+        return;
+      setEditStatus(text2().edit.committing);
+      commitBtn.disabled = true;
+      discardBtn.disabled = true;
+      try {
+        await callbacks.applyMutations(mutations);
+        clearPending();
+        await invalidateData();
+        syncSpacer();
+        setEditStatus("");
+      } catch (err) {
+        setEditStatus(text2().edit.commitError(err instanceof Error ? err.message : String(err)));
+      } finally {
+        refreshEditButtons();
+      }
+    }
+    newRowBtn.addEventListener("click", () => {
+      draftRows.push(new Map);
+      syncSpacer();
+      refreshEditButtons();
+      showPendingStatus();
+      renderViewport();
+      viewport.scrollTop = viewport.scrollHeight;
+      renderViewport();
+    });
+    discardBtn.addEventListener("click", async () => {
+      if (!hasPending())
+        return;
+      const ok = await showConfirmDialog({
+        body: text2().edit.confirmDiscard,
+        confirmLabel: text2().edit.discard,
+        danger: true
+      });
+      if (!ok)
+        return;
+      clearPending();
+      syncSpacer();
+      refreshEditButtons();
+      setEditStatus("");
+      renderViewport();
+    });
+    commitBtn.addEventListener("click", () => {
+      commitPending();
+    });
     function refreshForeignKeys() {
       rebuildFkColumnsForCurrentTable();
       if (currentTable) {
@@ -15094,7 +16782,12 @@ ${frontmatter.yaml}
       clear,
       destroy,
       localize,
-      refreshForeignKeys
+      refreshForeignKeys,
+      setEditMode,
+      getEditMode: () => editMode,
+      isEditable,
+      onEditableChange,
+      onEditModeChange
     };
   }
   function formatValue3(value) {
@@ -15476,7 +17169,7 @@ ${frontmatter.yaml}
     const historyVisible = sqlMode && userPrefersHistoryOpen;
     return {
       toolsHidden: !sqlMode,
-      historyToggleHidden: !sqlMode,
+      historyTabStripHidden: !sqlMode,
       historyPaneHidden: !historyVisible,
       historyResizerHidden: !historyVisible,
       tableListHidden: !sqlMode,
@@ -15651,25 +17344,7 @@ ${frontmatter.yaml}
         snapshotView.refresh();
       }
     });
-    const inferFkToggle = makePrefToggle({
-      title: "Infer FK from Rails-style <name>_id → <names>.id",
-      label: "Rails FK 推測",
-      pathD: ICON_PATH_INFER_FK
-    });
-    inferFkToggle.addEventListener("click", () => {
-      const next = !outerDeps.getDbUiPref("inferFkRails", false);
-      outerDeps.setDbUiPref("inferFkRails", next);
-      applyInferFkBtnState();
-      grid.refreshForeignKeys();
-    });
-    function applyInferFkBtnState() {
-      const on = outerDeps.getDbUiPref("inferFkRails", false);
-      inferFkToggle.classList.toggle("active", on);
-      inferFkToggle.setAttribute("aria-pressed", String(on));
-    }
-    applyInferFkBtnState();
     const disposeInferFkPrefSub = outerDeps.onDbUiPrefChange(() => {
-      applyInferFkBtnState();
       grid.refreshForeignKeys();
     });
     reloc(() => {
@@ -15682,7 +17357,6 @@ ${frontmatter.yaml}
     toolsSection.append(queryBtn, erBtn, searchBtn, snapshotBtn);
     const prefsBar = document.createElement("div");
     prefsBar.className = "db-prefs-bar";
-    prefsBar.append(inferFkToggle);
     const explorerSidebarHost = document.createElement("div");
     explorerSidebarHost.className = "db-explorer-sidebar-host";
     sidebar.append(toolsSection, dbToolbar, prefsBar, explorerSidebarHost, tableList.el);
@@ -15727,7 +17401,31 @@ ${frontmatter.yaml}
         detailPanelHeightPx = h;
         cb.onStateChange();
       },
-      getText: () => paneText()
+      getText: () => paneText(),
+      getEditable: () => isSqlKind(currentDbInfo?.kind),
+      applyMutations: (mutations) => applyRowMutations(mutations)
+    });
+    const editModeToggle = makePrefToggle({
+      title: paneText().edit.editModeTitle,
+      label: paneText().edit.editMode,
+      pathD: ICON_PATH_EDIT_MODE,
+      extraClass: "db-edit-mode-toggle"
+    });
+    editModeToggle.hidden = true;
+    editModeToggle.addEventListener("click", () => {
+      grid.setEditMode(!grid.getEditMode());
+    });
+    prefsBar.append(editModeToggle);
+    grid.onEditableChange((editable) => {
+      editModeToggle.hidden = !editable;
+    });
+    grid.onEditModeChange((on) => {
+      editModeToggle.classList.toggle("active", on);
+      editModeToggle.setAttribute("aria-pressed", String(on));
+    });
+    reloc(() => {
+      const e2 = paneText().edit;
+      localizePrefToggle(editModeToggle, e2.editMode, e2.editModeTitle);
     });
     const queryEditor = createQueryEditor({
       executeQuery: (sql) => executeQuery(sql),
@@ -15759,23 +17457,33 @@ ${frontmatter.yaml}
         setActiveTab("query");
       }
     });
+    const sessionLogView = createSessionLogView({
+      store: outerDeps.sessionLog,
+      getText: () => paneText(),
+      copySqlToQuery: (sql) => {
+        queryEditor.setSql(sql);
+        setActiveTab("query");
+      }
+    });
     const redisExplorer = createRedisExplorer({
       onSelectionChange: () => cb.onStateChange(),
-      getText: () => paneText()
+      getText: () => paneText(),
+      trackLoad: (p2) => deps.trackLoad(p2)
     });
     redisExplorer.el.hidden = true;
     redisExplorer.sidebarSlot.hidden = true;
     const esExplorer = createElasticsearchExplorer({
       onSelectionChange: () => cb.onStateChange(),
-      getText: () => paneText()
+      getText: () => paneText(),
+      trackLoad: (p2) => deps.trackLoad(p2)
     });
     esExplorer.el.hidden = true;
     esExplorer.sidebarSlot.hidden = true;
     const s3Explorer = createS3Explorer({
       onSelectionChange: () => cb.onStateChange(),
       getText: () => paneText(),
-      getTooltipEnabled: () => outerDeps.getDbUiPref("s3TooltipEnabled", true),
-      setTooltipEnabled: (enabled) => outerDeps.setDbUiPref("s3TooltipEnabled", enabled)
+      trackLoad: (p2) => deps.trackLoad(p2),
+      getTooltipEnabled: () => outerDeps.getDbUiPref("s3TooltipEnabled", true)
     });
     s3Explorer.el.hidden = true;
     s3Explorer.sidebarSlot.hidden = true;
@@ -15795,7 +17503,76 @@ ${frontmatter.yaml}
     historyPane.className = "db-history-pane";
     if (initial.historyHeight)
       historyPane.style.height = initial.historyHeight;
-    historyPane.appendChild(historyView.el);
+    const historyTabContent = document.createElement("div");
+    historyTabContent.className = "db-history-pane-content";
+    historyTabContent.appendChild(historyView.el);
+    const logTabContent = document.createElement("div");
+    logTabContent.className = "db-history-pane-content";
+    logTabContent.hidden = true;
+    logTabContent.appendChild(sessionLogView.el);
+    historyPane.append(historyTabContent, logTabContent);
+    const historyDock = document.createElement("div");
+    historyDock.className = "db-history-dock";
+    historyDock.setAttribute("role", "tablist");
+    const historyTabBtn = document.createElement("button");
+    historyTabBtn.type = "button";
+    historyTabBtn.className = "db-history-dock-tab";
+    historyTabBtn.setAttribute("role", "tab");
+    historyTabBtn.textContent = paneText().sessionLog.historyTabLabel;
+    historyTabBtn.classList.add("active");
+    historyTabBtn.setAttribute("aria-selected", "true");
+    const logTabBtn = document.createElement("button");
+    logTabBtn.type = "button";
+    logTabBtn.className = "db-history-dock-tab";
+    logTabBtn.setAttribute("role", "tab");
+    logTabBtn.textContent = paneText().sessionLog.tabLabel;
+    logTabBtn.setAttribute("aria-selected", "false");
+    const historyDockSpacer = document.createElement("div");
+    historyDockSpacer.className = "db-history-dock-spacer";
+    const historyDockClose = document.createElement("button");
+    historyDockClose.type = "button";
+    historyDockClose.className = "db-history-dock-close";
+    historyDockClose.setAttribute("aria-label", paneText().nav.queryHistory);
+    historyDockClose.title = paneText().nav.queryHistoryTitle;
+    historyDockClose.textContent = "×";
+    historyDock.append(historyTabBtn, logTabBtn, historyDockSpacer, historyDockClose);
+    let activeHistoryTab = initial.activeHistoryTab === "log" ? "log" : "history";
+    function setActiveHistoryTab(which) {
+      activeHistoryTab = which;
+      const isHistory = which === "history";
+      historyTabBtn.classList.toggle("active", isHistory);
+      logTabBtn.classList.toggle("active", !isHistory);
+      historyTabBtn.setAttribute("aria-selected", String(isHistory));
+      logTabBtn.setAttribute("aria-selected", String(!isHistory));
+      historyTabContent.hidden = !isHistory;
+      logTabContent.hidden = isHistory;
+    }
+    setActiveHistoryTab(activeHistoryTab);
+    function handleHistoryTabClick(which) {
+      if (userPrefersHistoryOpen && activeHistoryTab === which) {
+        userPrefersHistoryOpen = false;
+      } else {
+        setActiveHistoryTab(which);
+        userPrefersHistoryOpen = true;
+      }
+      applyVisibility();
+      cb.onStateChange();
+    }
+    historyTabBtn.addEventListener("click", () => handleHistoryTabClick("history"));
+    logTabBtn.addEventListener("click", () => handleHistoryTabClick("log"));
+    historyDockClose.addEventListener("click", () => {
+      if (!userPrefersHistoryOpen)
+        return;
+      userPrefersHistoryOpen = false;
+      applyVisibility();
+      cb.onStateChange();
+    });
+    reloc(() => {
+      historyTabBtn.textContent = paneText().sessionLog.historyTabLabel;
+      logTabBtn.textContent = paneText().sessionLog.tabLabel;
+      historyDockClose.setAttribute("aria-label", paneText().nav.queryHistory);
+      historyDockClose.title = paneText().nav.queryHistoryTitle;
+    });
     let historyResizing = false;
     historyResizer.addEventListener("mousedown", (e2) => {
       e2.preventDefault();
@@ -15820,21 +17597,13 @@ ${frontmatter.yaml}
       window.addEventListener("mousemove", onMove);
       window.addEventListener("mouseup", onUp);
     });
-    const historyToggle = document.createElement("button");
-    historyToggle.className = "db-history-toggle";
-    historyToggle.type = "button";
-    reloc(() => {
-      historyToggle.textContent = paneText().nav.queryHistory;
-      historyToggle.title = paneText().nav.queryHistoryTitle;
-    });
-    sidebar.appendChild(historyToggle);
     let userPrefersHistoryOpen = initial.historyOpen ?? true;
     function applyVisibility() {
       const sqlMode = isSqlKind(currentDbInfo?.kind);
       const visibility = computeVisibility(currentDbInfo?.kind, currentTab, userPrefersHistoryOpen);
       toolsSection.hidden = visibility.toolsHidden;
       prefsBar.hidden = visibility.toolsHidden;
-      historyToggle.hidden = visibility.historyToggleHidden;
+      historyDock.hidden = visibility.historyTabStripHidden;
       historyResizer.hidden = visibility.historyResizerHidden;
       historyPane.hidden = visibility.historyPaneHidden;
       tableList.el.hidden = visibility.tableListHidden;
@@ -15858,19 +17627,14 @@ ${frontmatter.yaml}
         searchBtn.classList.remove("active");
         snapshotBtn.classList.remove("active");
       }
-      historyToggle.classList.toggle("active", userPrefersHistoryOpen);
+      historyDock.classList.toggle("open", userPrefersHistoryOpen);
       if (!visibility.historyPaneHidden && cb.isActive())
         historyView.refresh();
     }
     applyVisibility();
-    historyToggle.addEventListener("click", () => {
-      userPrefersHistoryOpen = !userPrefersHistoryOpen;
-      applyVisibility();
-      cb.onStateChange();
-    });
     const container = document.createElement("div");
     container.className = "db-container";
-    container.append(upperArea, historyResizer, historyPane);
+    container.append(upperArea, historyResizer, historyPane, historyDock);
     function createInnerTab(text2, active) {
       const btn = document.createElement("button");
       btn.className = `db-tab${active ? " active" : ""}`;
@@ -15975,11 +17739,12 @@ ${frontmatter.yaml}
       const params = new URLSearchParams({ db: dbId });
       if (preferredSchema)
         params.set("schema", preferredSchema);
-      const res = await deps.trackLoad(fetch(`/_db/schemas?${params}`));
-      if (!res.ok) {
-        throw new Error(await responseErrorMessage(res, "failed to fetch schemas"));
-      }
-      return await res.json();
+      return logSqlFetch({
+        url: `/_db/schemas?${params}`,
+        kind: "query",
+        label: `_db/schemas db=${dbId}`,
+        errorPrefix: "failed to fetch schemas"
+      });
     }
     function renderSchemaOptions(schemas, selected) {
       schemaSelect.innerHTML = "";
@@ -15999,11 +17764,12 @@ ${frontmatter.yaml}
     }
     async function fetchSchema(dbId) {
       const params = withCurrentSchema(new URLSearchParams({ db: dbId, includeColumns: "1" }));
-      const res = await deps.trackLoad(fetch(`/_db/schema?${params}`));
-      if (!res.ok) {
-        throw new Error(await responseErrorMessage(res, "failed to fetch schema"));
-      }
-      return await res.json();
+      return logSqlFetch({
+        url: `/_db/schema?${params}`,
+        kind: "query",
+        label: `_db/schema db=${dbId}`,
+        errorPrefix: "failed to fetch schema"
+      });
     }
     async function fetchTablePage(table2, offset, limit, sort, filters, signal, eq = []) {
       if (!currentDbInfo)
@@ -16025,38 +17791,128 @@ ${frontmatter.yaml}
       if (eq.length > 0) {
         params.set("eq", JSON.stringify(eq));
       }
-      const res = await fetch(`/_db/table?${params}`, signal ? { signal } : undefined);
-      if (!res.ok) {
-        throw new Error(await responseErrorMessage(res, "failed to fetch table"));
-      }
-      return await res.json();
+      return logSqlFetch({
+        url: `/_db/table?${params}`,
+        init: signal ? { signal } : undefined,
+        kind: "query",
+        label: `SELECT FROM ${table2}`,
+        trackLoad: false,
+        errorPrefix: "failed to fetch table",
+        rowCountOf: (r2) => r2.rows.length
+      });
     }
     function fetchRelatedPage(table2, offset, limit, sort, filters, eq, signal) {
       return fetchTablePage(table2, offset, limit, sort, filters, signal, eq);
     }
+    async function logSqlFetch(opts) {
+      const startedAt = Date.now();
+      const trackEnabled = opts.trackLoad !== false;
+      try {
+        const fetchPromise = fetch(opts.url, opts.init);
+        const res = await (trackEnabled ? deps.trackLoad(fetchPromise) : fetchPromise);
+        const elapsedMs = Date.now() - startedAt;
+        if (!res.ok) {
+          const message = await responseErrorMessage(res, opts.errorPrefix);
+          outerDeps.sessionLog.add({
+            kind: opts.kind,
+            status: "error",
+            label: opts.label,
+            detail: opts.fallbackDetail,
+            message,
+            elapsedMs
+          });
+          const err = new Error(message);
+          err.__sessionLogged = true;
+          throw err;
+        }
+        const data = await res.json();
+        const detail = data.executedSql && data.executedSql.length > 0 ? data.executedSql.join(`;
+`) : opts.fallbackDetail;
+        outerDeps.sessionLog.add({
+          kind: opts.kind,
+          status: "ok",
+          label: opts.label,
+          detail,
+          elapsedMs,
+          rowCount: opts.rowCountOf?.(data)
+        });
+        return data;
+      } catch (err) {
+        if (!(err instanceof Error))
+          throw err;
+        if (err.__sessionLogged)
+          throw err;
+        if (err.name === "AbortError")
+          throw err;
+        outerDeps.sessionLog.add({
+          kind: opts.kind,
+          status: "error",
+          label: opts.label,
+          detail: opts.fallbackDetail,
+          message: err.message,
+          elapsedMs: Date.now() - startedAt
+        });
+        throw err;
+      }
+    }
     async function executeQuery(sql) {
       if (!currentDbInfo)
         throw new Error("no database selected");
-      const res = await fetch("/_db/query", {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          "X-Code-Viewer-Action": "1"
+      const label = sql.split(`
+`)[0]?.trim() || sql;
+      return logSqlFetch({
+        url: "/_db/query",
+        init: {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            "X-Code-Viewer-Action": "1"
+          },
+          body: JSON.stringify({
+            db: currentDbInfo.id,
+            ...currentSchema ? { schema: currentSchema } : {},
+            sql,
+            saveHistory: true,
+            source: "browser",
+            executedBy: "user"
+          })
         },
-        body: JSON.stringify({
-          db: currentDbInfo.id,
-          ...currentSchema ? { schema: currentSchema } : {},
-          sql,
-          saveHistory: true,
-          source: "browser",
-          executedBy: "user"
-        })
+        kind: "query",
+        label,
+        fallbackDetail: sql,
+        trackLoad: false,
+        errorPrefix: "failed to execute query",
+        rowCountOf: (r2) => r2.rowCount ?? r2.rows.length
+      });
+    }
+    async function applyRowMutations(mutations) {
+      if (!currentDbInfo)
+        throw new Error("no database selected");
+      if (!currentTable)
+        throw new Error("no table selected");
+      const label = paneText().sessionLog.commitLabel(mutations.length);
+      const fallback = JSON.stringify({ table: currentTable, mutations }, null, 2);
+      await logSqlFetch({
+        url: "/_db/mutate",
+        init: {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            "X-Code-Viewer-Action": "1"
+          },
+          body: JSON.stringify({
+            db: currentDbInfo.id,
+            ...currentSchema ? { schema: currentSchema } : {},
+            table: currentTable,
+            mutations
+          })
+        },
+        kind: "mutate",
+        label,
+        fallbackDetail: fallback,
+        errorPrefix: "failed to save changes",
+        rowCountOf: () => mutations.length
       });
-      if (!res.ok) {
-        throw new Error(await responseErrorMessage(res, "failed to execute query"));
-      }
-      const result = await res.json();
-      return result;
     }
     async function selectDb(dbId, explorerInitial, generation = loadGeneration, preferredSchema, preferredTable, targetView) {
       if (generation !== loadGeneration || currentDbInfo?.id !== dbId)
@@ -16235,11 +18091,18 @@ ${frontmatter.yaml}
       }
       if (!currentDbInfo)
         return [];
-      const res = await fetch(`/_db/columns?${withCurrentSchema(new URLSearchParams({ db: currentDbInfo.id, table: table2 }))}`);
-      if (!res.ok)
+      try {
+        const data = await logSqlFetch({
+          url: `/_db/columns?${withCurrentSchema(new URLSearchParams({ db: currentDbInfo.id, table: table2 }))}`,
+          kind: "query",
+          label: `_db/columns ${table2}`,
+          trackLoad: false,
+          errorPrefix: "failed to fetch columns"
+        });
+        return data.columns;
+      } catch {
         return [];
-      const data = await res.json();
-      return data.columns;
+      }
     }
     async function showSchema(table2) {
       setActiveTab("schema");
@@ -16253,10 +18116,13 @@ ${frontmatter.yaml}
         return;
       setActiveTab("schema");
       try {
-        const res = await fetch(`/_db/ddl?${withCurrentSchema(new URLSearchParams({ db: currentDbInfo.id, table: table2 }))}`);
-        if (!res.ok)
-          return;
-        const data = await res.json();
+        const data = await logSqlFetch({
+          url: `/_db/ddl?${withCurrentSchema(new URLSearchParams({ db: currentDbInfo.id, table: table2 }))}`,
+          kind: "query",
+          label: `_db/ddl ${table2}`,
+          trackLoad: false,
+          errorPrefix: "failed to fetch DDL"
+        });
         const columns = await fetchColumns(table2);
         schemaView.render(table2, columns, schemaCache?.indexes || [], {
           foreignKeys: schemaCache?.foreignKeys,
@@ -16503,6 +18369,8 @@ ${frontmatter.yaml}
         state.historyOpen = false;
       if (historyPane.style.height)
         state.historyHeight = historyPane.style.height;
+      if (activeHistoryTab === "log")
+        state.activeHistoryTab = "log";
       if (sidebar.style.width)
         state.sidebarWidth = sidebar.style.width;
       if (relatedPanelHeightPx != null)
@@ -16619,7 +18487,7 @@ ${frontmatter.yaml}
   var ICON_PATH_ER = "M1.5 1.75A.75.75 0 0 1 2.25 1h4.5a.75.75 0 0 1 .75.75v3.5h2v-1.5A.75.75 0 0 1 10.25 3h3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-3.5a.75.75 0 0 1-.75-.75V6.5h-2v3h2v-.75A.75.75 0 0 1 10.25 8h3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-3.5a.75.75 0 0 1-.75-.75v-1.5h-2v3.5a.75.75 0 0 1-.75.75h-4.5a.75.75 0 0 1-.75-.75v-3.5A.75.75 0 0 1 2.25 9h4.5a.75.75 0 0 1 .75.75v.75h-.5v-1H3v3h3V11h.5v-.75a.75.75 0 0 0-.75-.75H3V6.5h2.5V2.5H3Z";
   var ICON_PATH_SEARCH = "M10.68 11.74a6 6 0 0 1-7.917-8.984 6 6 0 0 1 8.997 7.905l3.05 3.05a.75.75 0 1 1-1.06 1.06l-3.07-3.03ZM11.5 7a4.499 4.499 0 1 1-8.997 0A4.499 4.499 0 0 1 11.5 7Z";
   var ICON_PATH_SNAPSHOT = "M3.5 1.75A1.75 1.75 0 0 1 5.25 0h5.5A1.75 1.75 0 0 1 12.5 1.75v.5h1.75A1.75 1.75 0 0 1 16 4v9.25A1.75 1.75 0 0 1 14.25 15H1.75A1.75 1.75 0 0 1 0 13.25V4a1.75 1.75 0 0 1 1.75-1.75H3.5v-.5Zm1.5.5v.5h6v-.5a.25.25 0 0 0-.25-.25h-5.5a.25.25 0 0 0-.25.25Zm-3.25 2a.25.25 0 0 0-.25.25v9.25c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V4a.25.25 0 0 0-.25-.25H1.75ZM8 6a2.75 2.75 0 1 0 0 5.5 2.75 2.75 0 0 0 0-5.5Z";
-  var ICON_PATH_INFER_FK = "M7.775 3.275a.75.75 0 0 0 1.06 1.06l1.25-1.25a2 2 0 1 1 2.83 2.83l-2.5 2.5a2 2 0 0 1-2.83 0 .75.75 0 0 0-1.06 1.06 3.5 3.5 0 0 0 4.95 0l2.5-2.5a3.5 3.5 0 0 0-4.95-4.95l-1.25 1.25Zm-4.69 9.64a2 2 0 0 1 0-2.83l2.5-2.5a2 2 0 0 1 2.83 0 .75.75 0 0 0 1.06-1.06 3.5 3.5 0 0 0-4.95 0l-2.5 2.5a3.5 3.5 0 0 0 4.95 4.95l1.25-1.25a.75.75 0 0 0-1.06-1.06l-1.25 1.25a2 2 0 0 1-2.83 0Z";
+  var ICON_PATH_EDIT_MODE = "M11.013 1.427a1.75 1.75 0 0 1 2.474 0l1.086 1.086a1.75 1.75 0 0 1 0 2.474l-8.61 8.61c-.21.21-.47.364-.756.445l-3.251.93a.75.75 0 0 1-.927-.928l.929-3.25c.081-.286.235-.547.445-.758l8.61-8.61Zm.176 4.823L9.75 4.81l-6.286 6.287a.247.247 0 0 0-.064.108l-.558 1.953 1.953-.558a.249.249 0 0 0 .108-.064l6.286-6.286Zm1.238-3.763a.25.25 0 0 0-.354 0L10.811 3.75l1.439 1.44 1.263-1.263a.25.25 0 0 0 0-.354L12.427 2.49Z";
   function makeIconButton(opts) {
     const btn = document.createElement("button");
     btn.type = "button";
@@ -16666,6 +18534,7 @@ ${frontmatter.yaml}
     let dbFilesCache = null;
     let dbUiState = { version: 1, columnWidths: {} };
     let dbUiLoadPromise = null;
+    const sessionLog = createSessionLog();
     function isRestoring() {
       return restoringDepth > 0;
     }
@@ -17168,10 +19037,11 @@ ${frontmatter.yaml}
       const closeBtn = document.createElement("button");
       closeBtn.type = "button";
       closeBtn.className = "db-tabs-chip-close";
-      closeBtn.title = "閉じる";
       closeBtn.tabIndex = -1;
       closeBtn.textContent = "×";
-      closeBtn.setAttribute("aria-label", outerText().nav.closeTab(initialLabel));
+      const closeTabLabel = outerText().nav.closeTab(initialLabel);
+      closeBtn.title = closeTabLabel;
+      closeBtn.setAttribute("aria-label", closeTabLabel);
       closeBtn.addEventListener("click", (e2) => {
         e2.stopPropagation();
         closeTab(id);
@@ -17204,7 +19074,8 @@ ${frontmatter.yaml}
         getDbUiPref,
         setDbUiPref,
         onDbUiPrefChange,
-        loadSqlHistory
+        loadSqlHistory,
+        sessionLog
       }, {
         tabId: id,
         isActive: () => activeTabId === id,
@@ -17223,6 +19094,7 @@ ${frontmatter.yaml}
         sqlDraft: initial?.sqlDraft,
         historyOpen: initial?.historyOpen,
         historyHeight: initial?.historyHeight,
+        activeHistoryTab: initial?.activeHistoryTab,
         sidebarWidth: initial?.sidebarWidth,
         relatedPanelHeight: initial?.relatedPanelHeight,
         detailPanelHeight: initial?.detailPanelHeight,
@@ -17588,7 +19460,10 @@ ${frontmatter.yaml}
       suspend,
       leave,
       handleSse,
-      localize
+      localize,
+      getDbUiPref,
+      setDbUiPref,
+      onDbUiPrefChange
     };
   }
   function formatSize(bytes) {
@@ -19052,7 +20927,21 @@ ${frontmatter.yaml}
   // web-src/views/history-view.ts
   var HISTORY_BODY_COLLAPSE_LINES = 10;
   var HISTORY_WORKTREE_COMMIT = "worktree";
-  var HISTORY_WORKTREE_LABEL = "未コミット変更 (Working tree)";
+  var HISTORY_TEXT = {
+    en: {
+      worktreeLabel: "Uncommitted changes (Working tree)",
+      bodyExpandClose: "Collapse",
+      bodyExpandMore: (n2) => `Show more (${n2} lines)`
+    },
+    ja: {
+      worktreeLabel: "未コミット変更 (Working tree)",
+      bodyExpandClose: "閉じる",
+      bodyExpandMore: (n2) => `もっと見る (${n2} 行)`
+    }
+  };
+  function historyWorktreeLabel(lang) {
+    return HISTORY_TEXT[lang].worktreeLabel;
+  }
   function buildHistoryPanelDom(options = {}) {
     const variant = options.variant || "page";
     const page = variant === "page";
@@ -19161,10 +21050,11 @@ ${frontmatter.yaml}
       return 0;
     return rawText.split(/\r?\n/).length;
   }
-  function historyBodyToggleLabel(expanded, remainingLines) {
-    return expanded ? "閉じる" : `もっと見る (${remainingLines} 行)`;
+  function historyBodyToggleLabel(expanded, remainingLines, lang) {
+    const t2 = HISTORY_TEXT[lang];
+    return expanded ? t2.bodyExpandClose : t2.bodyExpandMore(remainingLines);
   }
-  function buildExpandableHistoryBody(rendered, rawText) {
+  function buildExpandableHistoryBody(rendered, rawText, lang) {
     const lineCount = historyBodyLineCount(rawText);
     if (lineCount <= HISTORY_BODY_COLLAPSE_LINES)
       return rendered;
@@ -19180,7 +21070,7 @@ ${frontmatter.yaml}
     const remainingLines = lineCount - HISTORY_BODY_COLLAPSE_LINES;
     const sync = () => {
       const expanded = collapsible.classList.contains("expanded");
-      button.textContent = historyBodyToggleLabel(expanded, remainingLines);
+      button.textContent = historyBodyToggleLabel(expanded, remainingLines, lang);
       button.setAttribute("aria-expanded", expanded ? "true" : "false");
     };
     const toggle = () => {
@@ -19339,7 +21229,7 @@ ${frontmatter.yaml}
     }
     function worktreeRow() {
       const active = selectedSha === HISTORY_WORKTREE_COMMIT ? " active" : "";
-      return `<li class="history-item history-item-worktree${active}" data-sha="${HISTORY_WORKTREE_COMMIT}">` + `<span class="subject" title="${deps.escapeHtml(HISTORY_WORKTREE_LABEL)}">${deps.escapeHtml(HISTORY_WORKTREE_LABEL)}</span>` + `<span class="meta2">` + `<span class="sha">HEAD..worktree</span>` + `<span class="author">Working tree</span>` + `</span>` + `</li>`;
+      return `<li class="history-item history-item-worktree${active}" data-sha="${HISTORY_WORKTREE_COMMIT}">` + `<span class="subject" title="${deps.escapeHtml(historyWorktreeLabel(deps.getLanguage()))}">${deps.escapeHtml(historyWorktreeLabel(deps.getLanguage()))}</span>` + `<span class="meta2">` + `<span class="sha">HEAD..worktree</span>` + `<span class="author">Working tree</span>` + `</span>` + `</li>`;
     }
     function renderList() {
       const now = new Date;
@@ -19390,7 +21280,7 @@ ${frontmatter.yaml}
           const rendered = await renderMarkdownPreview(commit.body, { path: "COMMIT_MSG", ref: commit.sha }, { syntaxHighlight: deps.getSyntaxHighlight() });
           if (gen !== generation || selectedSha !== commit.sha)
             return;
-          body.replaceChildren(buildExpandableHistoryBody(rendered, commit.body));
+          body.replaceChildren(buildExpandableHistoryBody(rendered, commit.body, deps.getLanguage()));
         }
       }
       info.hidden = false;
@@ -19401,8 +21291,9 @@ ${frontmatter.yaml}
         return;
       info.querySelector(".hci-head")?.setAttribute("hidden", "");
       const subject = info.querySelector(".hci-subject");
-      if (subject)
-        subject.textContent = HISTORY_WORKTREE_LABEL;
+      if (subject) {
+        subject.textContent = historyWorktreeLabel(deps.getLanguage());
+      }
       const body = info.querySelector(".hci-body");
       if (body) {
         body.hidden = true;
@@ -20141,7 +22032,7 @@ code-viewer annotate add-db --db app.db --tab query \\
         database: {
           nav: "Datastores",
           title: "Datastore Viewer",
-          intro: "Browse SQLite files, Docker-hosted databases, Redis, Elasticsearch, and S3-compatible object stores from one local viewer.",
+          intro: "Browse and edit SQLite files, Docker-hosted databases, Redis, Elasticsearch, and S3-compatible object stores from one local viewer.",
           groups: [
             {
               title: "Supported datastores",
@@ -20151,27 +22042,27 @@ code-viewer annotate add-db --db app.db --tab query \\
                   rows: [
                     [
                       "SQLite",
-                      "Automatically discovered from .db, .sqlite, .sqlite3, and .s3db files in the repository."
+                      "Automatically discovered from .db, .sqlite, .sqlite3, and .s3db files in the repository. Inline row edit / insert / delete via the grid Edit mode (atomic per-commit batch)."
                     ],
                     [
                       "MySQL / MariaDB",
-                      "Detected from docker-compose.yml / compose.yml (or .yaml). Multiple databases per server are listed."
+                      "Detected from docker-compose.yml / compose.yml (or .yaml). Multiple databases per server are listed. Same inline row edit / insert / delete as SQLite."
                     ],
                     [
                       "PostgreSQL",
-                      "Detected from compose files. Multiple databases per server, plus a schema selector for switching schemas without reopening."
+                      "Detected from compose files. Multiple databases per server, plus a schema selector for switching schemas without reopening. Same inline row edit / insert / delete as SQLite."
                     ],
                     [
                       "Redis",
-                      "Detected from compose files. Read-only browse over DB 0-15, SCAN keys, dedicated string/hash/list panes, JSON view for set/zset/stream, and participates in snapshots and diffs."
+                      "Detected from compose files. Browse DB 0-15, SCAN keys, dedicated string/hash/list panes, JSON view for set/zset/stream. Edit values, delete keys, and create new keys (all types) via in-pane editors. Participates in snapshots and diffs."
                     ],
                     [
                       "Elasticsearch",
-                      "Detected from compose files. List indices, view mappings, paginate with search_after, run lucene q= or DSL queries on an allowlist, and take snapshots/diffs."
+                      "Detected from compose files. List indices, view mappings, paginate with search_after, run lucene q= or DSL queries on an allowlist. Edit / create / delete documents with _seq_no / _primary_term optimistic concurrency. Take snapshots/diffs."
                     ],
                     [
                       "S3 / MinIO / LocalStack",
-                      "Detected from compose files. Folder-tree browse, prefix/filename search, updated-time sort, and previews for images, video, audio, PDF, Markdown, HTML, and text. LocalStack falls back to `docker exec curl` when no host port is published; MinIO requires a published host port."
+                      "Detected from compose files. Folder-tree browse, prefix/filename search, updated-time sort, and previews for images, video, audio, PDF, Markdown, HTML, and text. Edit text/markdown/JSON object bodies inline, upload new objects, and delete existing ones. LocalStack falls back to `docker exec curl` when no host port is published; MinIO requires a published host port."
                     ]
                   ]
                 }
@@ -20193,7 +22084,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "Data tab",
-                      "Paginated grid with sort, filter, cell copy, and CSV/JSON export (capped at 100k rows; export respects the current filter and sort)."
+                      "Paginated grid with sort, filter, cell copy, and CSV/JSON export (capped at 100k rows; export respects the current filter and sort). Toggle Edit mode in the prefs bar to enable inline editing — double-click a cell to edit, queue insert/delete via row actions, and commit the batch atomically. Edited rows/cells highlight in yellow until committed."
                     ],
                     [
                       "Detail footer & related panel",
@@ -20205,7 +22096,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "Query editor",
-                      "SQL syntax highlighting, Tab indent, auto-resize, Ctrl+Enter to run. Allowlist depends on the engine (SQLite: SELECT/PRAGMA/EXPLAIN/WITH; PostgreSQL and MySQL also accept SHOW/DESCRIBE)."
+                      "SQL syntax highlighting (shiki), Tab indent, auto-resize, Ctrl+Enter to run. Allowlist depends on the engine (SQLite: SELECT/PRAGMA/EXPLAIN/WITH; PostgreSQL and MySQL also accept SHOW/DESCRIBE)."
                     ],
                     [
                       "ER Diagram",
@@ -20220,12 +22111,12 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "Capture point-in-time snapshots of selected tables/indices/key spaces and diff any two to see inserts, updates, and deletes with full before/after values."
                     ],
                     [
-                      "Query History",
-                      "Master-detail panel with history list and result preview. Each entry records whether it came from the browser or the CLI, and updates live over SSE."
+                      "Footer dock (Query History / Session log)",
+                      "JetBrains-style bottom dock with two tabs. Query History: per-DB master/detail of saved queries, SSE-synced across tabs. Session log: every SQL the server runs in this session (read fetches, user queries, write commits) with timing, row count, and the executed SQL syntax-highlighted. Auto-follow keeps the newest entry pinned; scroll up or click a non-latest entry to pause. The active tab and open/closed state persist in tabs.json."
                     ],
                     [
                       "Datastore explorers",
-                      "Redis / Elasticsearch / S3 keep the same Multi-DB tab UI but swap the table tree for a key-space / index-tree / folder-tree explorer."
+                      "Redis / Elasticsearch / S3 keep the same Multi-DB tab UI but swap the table tree for a key-space / index-tree / folder-tree explorer. Each supports value editing, document/key/object creation, and deletion via in-pane editors and confirmation dialogs."
                     ]
                   ]
                 }
@@ -20704,7 +22595,7 @@ code-viewer annotate add-db --db app.db --tab query \\
         database: {
           nav: "データストア",
           title: "データストアビューア",
-          intro: "SQLite ファイル、Docker 上のデータベース、Redis、Elasticsearch、S3 互換オブジェクトストアをローカルビューアで閲覧できます。",
+          intro: "SQLite ファイル、Docker 上のデータベース、Redis、Elasticsearch、S3 互換オブジェクトストアをローカルビューアで閲覧・編集できます。",
           groups: [
             {
               title: "対応データストア",
@@ -20714,27 +22605,27 @@ code-viewer annotate add-db --db app.db --tab query \\
                   rows: [
                     [
                       "SQLite",
-                      "リポジトリ内の .db, .sqlite, .sqlite3, .s3db ファイルを自動検出します。"
+                      "リポジトリ内の .db, .sqlite, .sqlite3, .s3db ファイルを自動検出します。グリッドの Edit モードで行のインライン編集 / 追加 / 削除に対応 (コミット単位でアトミックに適用)。"
                     ],
                     [
                       "MySQL / MariaDB",
-                      "docker-compose.yml / compose.yml (.yaml 含む) のサービスから検出。同一サーバー上の複数データベースを一覧表示します。"
+                      "docker-compose.yml / compose.yml (.yaml 含む) のサービスから検出。同一サーバー上の複数データベースを一覧表示します。SQLite と同じく Edit モードで行のインライン編集 / 追加 / 削除に対応。"
                     ],
                     [
                       "PostgreSQL",
-                      "compose ファイルから検出。同一サーバー上の複数データベースに対応し、スキーマ切替セレクターで再オープンせずスキーマを切り替えられます。"
+                      "compose ファイルから検出。同一サーバー上の複数データベースに対応し、スキーマ切替セレクターで再オープンせずスキーマを切り替えられます。SQLite と同じく行のインライン編集 / 追加 / 削除に対応。"
                     ],
                     [
                       "Redis",
-                      "compose ファイルから検出。DB 0-15 を read-only で SCAN し、string/hash/list は専用ペイン、set/zset/stream は JSON ビュー。スナップショット/差分にも参加します。"
+                      "compose ファイルから検出。DB 0-15 を SCAN し、string/hash/list は専用ペイン、set/zset/stream は JSON ビュー。値の編集 / キー削除 / 新規キー作成 (全タイプ) に対応。スナップショット/差分にも参加します。"
                     ],
                     [
                       "Elasticsearch",
-                      "compose ファイルから検出。インデックス一覧、マッピング、search_after ページング、lucene q= と許可リスト経由の DSL、スナップショット/差分に対応します。"
+                      "compose ファイルから検出。インデックス一覧、マッピング、search_after ページング、lucene q= と許可リスト経由の DSL、スナップショット/差分に対応。_seq_no / _primary_term 楽観ロックでドキュメントの編集 / 新規作成 / 削除も可能。"
                     ],
                     [
                       "S3 / MinIO / LocalStack",
-                      "compose ファイルから検出。フォルダツリー型ブラウザ、prefix/ファイル名検索、更新日時順表示、画像/動画/音声/PDF/Markdown/HTML/テキストのプレビューに対応。LocalStack はホストポート未公開時 `docker exec curl` にフォールバックしますが、MinIO はホストポート公開が必須です。"
+                      "compose ファイルから検出。フォルダツリー型ブラウザ、prefix/ファイル名検索、更新日時順表示、画像/動画/音声/PDF/Markdown/HTML/テキストのプレビューに対応。テキスト/Markdown/JSON のインライン編集、新規オブジェクトアップロード、オブジェクト削除も可能。LocalStack はホストポート未公開時 `docker exec curl` にフォールバックしますが、MinIO はホストポート公開が必須です。"
                     ]
                   ]
                 }
@@ -20756,7 +22647,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "Data タブ",
-                      "ページネーション付きグリッド。ソート、フィルター、セルコピー、CSV/JSON エクスポート（最大10万行、現在のフィルター/ソートを反映）。"
+                      "ページネーション付きグリッド。ソート、フィルター、セルコピー、CSV/JSON エクスポート（最大10万行、現在のフィルター/ソートを反映）。設定バーで Edit モードを ON にするとインライン編集が可能 — セルをダブルクリックで編集、行操作で挿入/削除を予約、コミット単位で一括適用。未コミットの編集行/セルは黄色でハイライト。"
                     ],
                     [
                       "詳細フッタ・関連パネル",
@@ -20768,7 +22659,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "クエリエディター",
-                      "SQL シンタックスハイライト、Tab インデント、自動リサイズ、Ctrl+Enter で実行。許可文は DB 種別により異なります（SQLite: SELECT/PRAGMA/EXPLAIN/WITH。PostgreSQL と MySQL は SHOW/DESCRIBE も可）。"
+                      "SQL シンタックスハイライト (shiki)、Tab インデント、自動リサイズ、Ctrl+Enter で実行。許可文は DB 種別により異なります（SQLite: SELECT/PRAGMA/EXPLAIN/WITH。PostgreSQL と MySQL は SHOW/DESCRIBE も可）。"
                     ],
                     [
                       "ER 図",
@@ -20783,12 +22674,12 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "選んだテーブル / インデックス / キー空間の状態を保存し、任意の 2 つの差分（insert / update / delete + before/after）を表示します。"
                     ],
                     [
-                      "クエリ履歴",
-                      "マスター/ディテール表示。各エントリは browser / CLI どちらから来たかを記録し、SSE でライブ更新されます。"
+                      "フッタ Dock (クエリ履歴 / ログ)",
+                      "JetBrains 風の常駐 bottom dock に 2 タブ。「クエリ履歴」: DB ごとに保存されたクエリのマスター/ディテール、SSE で全タブにライブ同期。「ログ」: このセッションでサーバが実行した SQL すべて (テーブル読み込み / ユーザークエリ / 編集コミット) を所要時間・行数・実行 SQL (シンタックスハイライト) 付きで時系列表示。自動追従 ON で常に最新を表示、下スクロール or 最新以外をクリックすると追従解除。アクティブタブと開閉状態は tabs.json に永続化されます。"
                     ],
                     [
                       "データストア専用エクスプローラ",
-                      "Redis / Elasticsearch / S3 はマルチ DB タブ UI を共有しつつ、テーブルツリーをキー空間ツリー / インデックスツリー / フォルダツリーに差し替えます。"
+                      "Redis / Elasticsearch / S3 はマルチ DB タブ UI を共有しつつ、テーブルツリーをキー空間ツリー / インデックスツリー / フォルダツリーに差し替えます。それぞれインライン編集ペインと確認ダイアログによる値編集 / ドキュメント・キー・オブジェクト作成 / 削除に対応。"
                     ]
                   ]
                 }
@@ -23490,176 +25381,25 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
     function closeRepoContextMenu() {
       document.querySelector(".gdp-context-menu")?.remove();
     }
-    function closeTrashDialog() {
-      document.querySelector(".gdp-trash-dialog-backdrop")?.remove();
-    }
-    function createTrashDialog(title, body, actions) {
-      closeTrashDialog();
-      const backdrop = document.createElement("div");
-      backdrop.className = "gdp-trash-dialog-backdrop";
-      const dialog = document.createElement("div");
-      dialog.className = "gdp-trash-dialog";
-      const titleId = "gdp-trash-dialog-title";
-      const bodyId = "gdp-trash-dialog-body";
-      dialog.setAttribute("role", "dialog");
-      dialog.setAttribute("aria-modal", "true");
-      dialog.setAttribute("aria-labelledby", titleId);
-      dialog.setAttribute("aria-describedby", bodyId);
-      const heading2 = document.createElement("div");
-      heading2.id = titleId;
-      heading2.className = "gdp-trash-dialog-title";
-      heading2.textContent = title;
-      const message = document.createElement("div");
-      message.id = bodyId;
-      message.className = "gdp-trash-dialog-body";
-      message.textContent = body;
-      const actionRow = document.createElement("div");
-      actionRow.className = "gdp-trash-dialog-actions";
-      actionRow.append(...actions);
-      dialog.append(heading2, message, actionRow);
-      backdrop.appendChild(dialog);
-      document.body.appendChild(backdrop);
-      return backdrop;
-    }
     function confirmMoveToTrash(path, focusReturnTarget) {
-      return new Promise((resolve) => {
-        const previousFocus = focusReturnTarget || document.activeElement;
-        const cancel = document.createElement("button");
-        cancel.type = "button";
-        cancel.className = "gdp-btn gdp-btn-sm";
-        cancel.textContent = "Cancel";
-        const move = document.createElement("button");
-        move.type = "button";
-        move.className = "gdp-btn gdp-btn-sm gdp-trash-dialog-danger";
-        move.textContent = "Move to Trash";
-        const done = (ok) => {
-          document.removeEventListener("keydown", onKeydown);
-          closeTrashDialog();
-          previousFocus?.focus?.();
-          resolve(ok);
-        };
-        const onKeydown = (event) => {
-          if (isImeComposing(event))
-            return;
-          if (event.key === "Escape") {
-            event.preventDefault();
-            event.stopPropagation();
-            done(false);
-            return;
-          }
-          if (event.key !== "Tab")
-            return;
-          const focusables = [cancel, move];
-          const index = focusables.indexOf(document.activeElement);
-          if (index < 0) {
-            event.preventDefault();
-            focusables[0].focus();
-            return;
-          }
-          if (event.shiftKey && index <= 0) {
-            event.preventDefault();
-            focusables[focusables.length - 1].focus();
-          } else if (!event.shiftKey && index === focusables.length - 1) {
-            event.preventDefault();
-            focusables[0].focus();
-          }
-        };
-        cancel.addEventListener("click", () => done(false));
-        move.addEventListener("click", () => done(true));
-        const backdrop = createTrashDialog("Move to Trash?", `Move "${path}" to Trash?`, [cancel, move]);
-        backdrop.addEventListener("pointerdown", (event) => {
-          if (event.target === backdrop)
-            done(false);
-        });
-        document.addEventListener("keydown", onKeydown);
-        cancel.focus();
+      return showConfirmDialog({
+        title: "Move to Trash?",
+        body: `Move "${path}" to Trash?`,
+        confirmLabel: "Move to Trash",
+        danger: true,
+        focusReturnTarget
       });
     }
     function askNewDirectoryName(path, focusReturnTarget) {
-      return new Promise((resolve) => {
-        const previousFocus = focusReturnTarget || document.activeElement;
-        const cancel = document.createElement("button");
-        cancel.type = "button";
-        cancel.className = "gdp-btn gdp-btn-sm";
-        cancel.textContent = "Cancel";
-        const create = document.createElement("button");
-        create.type = "button";
-        create.className = "gdp-btn gdp-btn-sm";
-        create.textContent = "Create";
-        const input = document.createElement("input");
-        input.className = "gdp-create-dir-input";
-        input.type = "text";
-        input.autocomplete = "off";
-        input.placeholder = "Folder name";
-        input.setAttribute("aria-label", "Folder name");
-        const error2 = document.createElement("div");
-        error2.className = "gdp-create-dir-error";
-        error2.setAttribute("role", "alert");
-        const syncValidity = () => {
-          const valid = !!normalizeNewDirectoryName(input.value);
-          create.disabled = !valid;
-          error2.textContent = input.value && !valid ? "Use a folder name without slashes, control characters, . or .." : "";
-          return valid;
-        };
-        const done = (name) => {
-          document.removeEventListener("keydown", onKeydown);
-          closeTrashDialog();
-          previousFocus?.focus?.();
-          resolve(name);
-        };
-        const submit = () => {
-          const name = normalizeNewDirectoryName(input.value);
-          if (!name) {
-            syncValidity();
-            input.focus();
-            return;
-          }
-          done(name);
-        };
-        const onKeydown = (event) => {
-          if (isImeComposing(event))
-            return;
-          if (event.key === "Escape") {
-            event.preventDefault();
-            event.stopPropagation();
-            done(null);
-            return;
-          }
-          if (event.key === "Enter") {
-            event.preventDefault();
-            submit();
-            return;
-          }
-          if (event.key !== "Tab")
-            return;
-          const focusables = [input, cancel, create];
-          const index = focusables.indexOf(document.activeElement);
-          if (index < 0) {
-            event.preventDefault();
-            focusables[0].focus();
-            return;
-          }
-          if (event.shiftKey && index <= 0) {
-            event.preventDefault();
-            focusables[focusables.length - 1].focus();
-          } else if (!event.shiftKey && index === focusables.length - 1) {
-            event.preventDefault();
-            focusables[0].focus();
-          }
-        };
-        cancel.addEventListener("click", () => done(null));
-        create.addEventListener("click", submit);
-        input.addEventListener("input", syncValidity);
-        create.disabled = true;
-        const backdrop = createTrashDialog("New Folder", `Create a folder in "${path || getProjectName() || "repository"}".`, [cancel, create]);
-        const body = backdrop.querySelector(".gdp-trash-dialog-body");
-        body?.append(input, error2);
-        backdrop.addEventListener("pointerdown", (event) => {
-          if (event.target === backdrop)
-            done(null);
-        });
-        document.addEventListener("keydown", onKeydown);
-        input.focus();
+      return showPromptDialog({
+        title: "New Folder",
+        body: `Create a folder in "${path || getProjectName() || "repository"}".`,
+        placeholder: "Folder name",
+        ariaLabel: "Folder name",
+        confirmLabel: "Create",
+        validate: (v) => normalizeNewDirectoryName(v),
+        invalidMessage: "Use a folder name without slashes, control characters, . or ..",
+        focusReturnTarget
       });
     }
     async function requestCreateDirectory(path, onCreated, options = {}) {
@@ -23730,7 +25470,7 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
       return button;
     }
     function showRepoContextMenu(event, entry, ref, onChanged) {
-      if (document.querySelector(".gdp-trash-dialog-backdrop"))
+      if (document.querySelector(".gdp-dialog-backdrop"))
         return false;
       if (!canTrashWorktreeRef(ref))
         return false;
@@ -24364,22 +26104,10 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
     }
     let creatingDirectory = false;
     function showTrashError(message) {
-      const ok = document.createElement("button");
-      ok.type = "button";
-      ok.className = "gdp-btn gdp-btn-sm";
-      ok.textContent = "OK";
-      ok.addEventListener("click", closeTrashDialog);
-      createTrashDialog("Trash failed", message, [ok]);
-      ok.focus();
+      showAlertDialog({ title: "Trash failed", body: message });
     }
     function showCreateDirectoryError(message) {
-      const ok = document.createElement("button");
-      ok.type = "button";
-      ok.className = "gdp-btn gdp-btn-sm";
-      ok.textContent = "OK";
-      ok.addEventListener("click", closeTrashDialog);
-      createTrashDialog("New folder failed", message, [ok]);
-      ok.focus();
+      showAlertDialog({ title: "New folder failed", body: message });
     }
     async function moveRepoPathToTrash(path) {
       const res = await fetch("/_trash_path", {
@@ -24404,7 +26132,12 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
       if (!list2.length)
         return;
       const label = path || getProjectName() || "repository root";
-      if (!window.confirm("Upload " + list2.length + " file" + (list2.length === 1 ? "" : "s") + " into " + label + "?"))
+      const ok = await showConfirmDialog({
+        title: "Upload files?",
+        body: `Upload ${list2.length} file${list2.length === 1 ? "" : "s"} into ${label}?`,
+        confirmLabel: "Upload"
+      });
+      if (!ok)
         return;
       const form = new FormData;
       form.set("dir", path);
@@ -27440,6 +29173,11 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
           uploadsTitle: "Uploads",
           uploadEnabledLabel: "Allow file uploads into worktree folders",
           uploadEnabledHelp: "Disable to make the worktree read-only for everyone using this server.",
+          datastoreTitle: "Datastores",
+          datastoreInferFkLabel: "Infer FK from Rails-style naming (<name>_id → <names>.id)",
+          datastoreInferFkHelp: "Show inferred foreign-key links in the related-data panel for SQL tables.",
+          datastoreS3TooltipLabel: "Show S3 object preview tooltip on hover",
+          datastoreS3TooltipHelp: "Hovering an S3 object row shows the full key path and a content preview.",
           watchTitle: "File change watcher",
           watchLimit: "Maximum directories to watch",
           watchLimitHelp: (defaultLimit) => `Higher values reduce missed updates in deep trees at the cost of file handles. Combine with the Skip list above to keep heavy folders (node_modules, .git, dist...) out of the watch budget. Default: ${defaultLimit}.`
@@ -27541,6 +29279,11 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
           uploadsTitle: "アップロード",
           uploadEnabledLabel: "ワークツリーへのファイルアップロードを許可する",
           uploadEnabledHelp: "オフにすると、このサーバを使う全員に対してワークツリーは読み取り専用になります。",
+          datastoreTitle: "データストア",
+          datastoreInferFkLabel: "Rails 命名規約 (<name>_id → <names>.id) から FK を推測",
+          datastoreInferFkHelp: "SQL テーブルの関連データパネルに Rails 命名規約由来の仮想 FK リンクを表示します。",
+          datastoreS3TooltipLabel: "S3 オブジェクトの hover プレビューを表示",
+          datastoreS3TooltipHelp: "S3 オブジェクト行にホバーすると、完全な key とコンテンツプレビューを表示します。",
           watchTitle: "ファイル変更の監視",
           watchLimit: "監視するディレクトリ数の上限",
           watchLimitHelp: (defaultLimit) => `値を大きくすると深いツリーの変更を取りこぼしにくくなりますが、ファイルハンドル数を消費します。上の Skip リストと併用すると、重いフォルダ（node_modules, .git, dist など）を監視枠から外せます。既定値: ${defaultLimit}。`
@@ -27662,7 +29405,13 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
       if (settingsSections[2])
         settingsSections[2].textContent = text2.settings.excludedDirectories;
       if (settingsSections[3])
-        settingsSections[3].textContent = text2.settings.watchTitle;
+        settingsSections[3].textContent = text2.settings.datastoreTitle;
+      if (settingsSections[4])
+        settingsSections[4].textContent = text2.settings.watchTitle;
+      setElementText("#datastore-infer-fk-label", text2.settings.datastoreInferFkLabel);
+      setElementText("#datastore-infer-fk-help", text2.settings.datastoreInferFkHelp);
+      setElementText("#datastore-s3-tooltip-label", text2.settings.datastoreS3TooltipLabel);
+      setElementText("#datastore-s3-tooltip-help", text2.settings.datastoreS3TooltipHelp);
       setElementText("#upload-enabled-label", text2.settings.uploadEnabledLabel);
       setElementText("#upload-help", text2.settings.uploadEnabledHelp);
       setElementText("#scope-omit-dirs-help", text2.settings.omitDirsHelp);
@@ -27874,6 +29623,7 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
       const uploadToggle = document.querySelector("#upload-enabled");
       if (uploadToggle)
         uploadToggle.checked = APP_SETTINGS.uploadEnabled !== false;
+      syncDatastoreToggles();
       source.textContent = uiText().settings.scopeSource(PROJECT_NAME || "default", scopeOmitSourceLabel());
       pop.hidden = false;
       viewerLanguage.focus();
@@ -28491,6 +30241,22 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
     $("#upload-enabled")?.addEventListener("change", (event) => {
       saveUploadEnabled(event.currentTarget.checked);
     });
+    $("#datastore-infer-fk")?.addEventListener("change", (event) => {
+      DATABASE_VIEW.setDbUiPref("inferFkRails", event.currentTarget.checked);
+    });
+    $("#datastore-s3-tooltip")?.addEventListener("change", (event) => {
+      DATABASE_VIEW.setDbUiPref("s3TooltipEnabled", event.currentTarget.checked);
+    });
+    function syncDatastoreToggles() {
+      const inferToggle = document.querySelector("#datastore-infer-fk");
+      if (inferToggle) {
+        inferToggle.checked = DATABASE_VIEW.getDbUiPref("inferFkRails", false);
+      }
+      const tooltipToggle = document.querySelector("#datastore-s3-tooltip");
+      if (tooltipToggle) {
+        tooltipToggle.checked = DATABASE_VIEW.getDbUiPref("s3TooltipEnabled", true);
+      }
+    }
     $("#scope-omit-dirs")?.addEventListener("change", (event) => {
       saveScopeOmitDirsField(event.currentTarget.value);
     });
@@ -28912,6 +30678,7 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
         if (!isCurrentDiffRequest())
           return null;
         const result = renderShell(data, options.changedPaths);
+        applyHideTestsToMeta();
         setStatus("live");
         return result;
       }).catch(() => {
@@ -29022,6 +30789,7 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
         });
       },
       getSyntaxHighlight: () => STATE.syntaxHighlight,
+      getLanguage: () => STATE.language,
       trackLoad
     });
     const DATABASE_VIEW = createDatabaseView({
@@ -29033,6 +30801,11 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
       getLanguage: () => STATE.language
     });
     relocalizeDatabase = () => DATABASE_VIEW.localize();
+    DATABASE_VIEW.onDbUiPrefChange(() => {
+      if (!document.querySelector("#scope-settings-popover")?.hidden) {
+        syncDatastoreToggles();
+      }
+    });
     const REF_PICKER = createRefPicker({
       $,
       escapeHtml: escapeHtml3,
@@ -29203,6 +30976,28 @@ code-viewer query diff rows --id diff-xyz789 --table users --type inserted --lim
         updateTreeDirVisibility();
       if (typeof applyViewedState === "function")
         applyViewedState();
+      applyHideTestsToMeta();
+    }
+    function applyHideTestsToMeta() {
+      const meta = window._lastMeta;
+      if (!meta || !meta.totals)
+        return;
+      const effective = STATE.hideTests && !isRepositorySidebarMode();
+      if (!effective) {
+        renderMeta(meta);
+        return;
+      }
+      let additions = 0;
+      let deletions = 0;
+      let files = 0;
+      for (const f2 of STATE.files) {
+        if (TEST_RE.test(f2.path || ""))
+          continue;
+        additions += f2.additions || 0;
+        deletions += f2.deletions || 0;
+        files += 1;
+      }
+      renderMeta({ ...meta, totals: { files, additions, deletions } });
     }
     applyHideTests();
     $("#hide-tests").addEventListener("click", () => {