@youtyan/code-viewer 0.8.9 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@youtyan/code-viewer",
-  "version": "0.8.9",
+  "version": "0.9.0",
   "description": "Local browser-based code and git diff viewer",
   "type": "module",
   "bin": {

package/skills/code-viewer-query/SKILL.md

@@ -41,7 +41,9 @@ browser's Database > Search tab, so the human can review the same workflow.
    the sidebar — it lists every SQLite file plus PostgreSQL / MySQL / Redis
    / Elasticsearch / S3 service that any nearby `docker-compose` exposes, as
    well as any local Supabase CLI (`supabase start`) project found via a
-   `supabase/config.toml` (id form `supabase:<project_id>`).
+   `supabase/config.toml` (id form `supabase:<project_id>`) and any saved
+   connection added from the browser UI (id form `connection:<uuid>`,
+   including Cloudflare D1 and R2).
    Use the printed `id` as `--db` on every other command. Credentials and
    internal config are stripped server-side.
 

package/web/app.js

@@ -7669,15 +7669,24 @@ ${lines.join(`
   function markdownSlugify(text2) {
     return text2.trim().toLowerCase().replace(/[\s　]+/g, "-").replace(/[^\p{L}\p{N}\-_]/gu, "").slice(0, 80) || "section";
   }
-  function resolveMarkdownRelativePath(currentPath, href) {
+  function resolveMarkdownLinkTarget(currentPath, href) {
     if (!href || href.startsWith("#"))
       return null;
     if (/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i.test(href))
       return null;
-    const cleanHref = href.replace(/[?#].*$/, "");
-    if (!/\.(md|markdown|mdown|mkd|mkdn|mdx)$/i.test(cleanHref))
+    const hashAt = href.indexOf("#");
+    const hash = hashAt < 0 ? "" : href.slice(hashAt + 1);
+    const cleanHref = (hashAt < 0 ? href : href.slice(0, hashAt)).replace(/\?.*$/, "");
+    if (!cleanHref)
       return null;
-    return resolveRepoRelative(currentPath, decodeURIComponent(cleanHref));
+    const path = resolveRepoRelative(currentPath, decodeUriComponentSafe(cleanHref));
+    if (path == null)
+      return null;
+    return {
+      path,
+      hash: decodeUriComponentSafe(hash),
+      directory: cleanHref.endsWith("/")
+    };
   }
   function resolveMarkdownAssetPath(currentPath, src) {
     if (!src || src.startsWith("#") || /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i.test(src))
@@ -7685,6 +7694,13 @@ ${lines.join(`
     const cleanSrc = src.split(/[?#]/, 1)[0];
     return resolveRepoRelative(currentPath, cleanSrc);
   }
+  function decodeUriComponentSafe(value) {
+    try {
+      return decodeURIComponent(value);
+    } catch {
+      return value;
+    }
+  }
   function resolveRepoRelative(currentPath, requestedPath) {
     const base2 = currentPath.split("/").slice(0, -1);
     const parts = [
@@ -7780,11 +7796,15 @@ ${lines.join(`
     md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
       const token = tokens[idx];
       const href = token.attrGet("href") || "";
-      const mdPath = resolveMarkdownRelativePath(target.path, href);
-      if (mdPath) {
+      const link2 = resolveMarkdownLinkTarget(target.path, href);
+      if (link2) {
         token.attrSet("href", "#");
-        token.attrSet("data-gdp-md-link", mdPath);
+        token.attrSet("data-gdp-md-link", link2.path);
         token.attrSet("data-gdp-md-ref", target.ref || "worktree");
+        if (link2.hash)
+          token.attrSet("data-gdp-md-hash", link2.hash);
+        if (link2.directory)
+          token.attrSet("data-gdp-md-dir", "1");
       } else if (/^(?:https?:)?\/\//i.test(href)) {
         token.attrSet("target", "_blank");
         token.attrSet("rel", "noopener noreferrer");
@@ -7899,11 +7919,15 @@ ${frontmatter.yaml}
       if (!link2)
         return;
       const path = link2.dataset.gdpMdLink;
-      const ref = link2.dataset.gdpMdRef || target.ref;
-      if (!path)
+      if (path == null)
         return;
       e2.preventDefault();
-      options.onNavigateMarkdown?.(path, ref);
+      options.onNavigateMarkdown?.({
+        path,
+        ref: link2.dataset.gdpMdRef || target.ref,
+        hash: link2.dataset.gdpMdHash || "",
+        directory: link2.dataset.gdpMdDir === "1"
+      });
     });
     setupMarkdownScrollSpy(root);
     setupMermaidLightbox(root);
@@ -7986,12 +8010,7 @@ ${frontmatter.yaml}
     scrollMarkdownSectionIntoView(section, "auto");
   }
   function decodeHashFragment(hash) {
-    const value = hash.startsWith("#") ? hash.slice(1) : hash;
-    try {
-      return decodeURIComponent(value);
-    } catch {
-      return value;
-    }
+    return decodeUriComponentSafe(hash.startsWith("#") ? hash.slice(1) : hash);
   }
   function scrollMarkdownSectionIntoView(section, behavior) {
     const top = section.getBoundingClientRect().top + window.scrollY - markdownAnchorOffset() - 12;
@@ -10309,11 +10328,21 @@ ${frontmatter.yaml}
   var KINDS = [
     "postgresql",
     "mysql",
+    "d1",
     "redis",
     "elasticsearch",
     "s3",
     "dynamodb"
   ];
+  var S3_PROVIDERS = ["custom", "r2"];
+  var R2_ENDPOINT_RE = /^https:\/\/([a-z0-9-]+)\.r2\.cloudflarestorage\.com$/i;
+  var R2_REGION = "auto";
+  function r2EndpointFor(accountId) {
+    return `https://${accountId}.r2.cloudflarestorage.com`;
+  }
+  function r2AccountIdFromEndpoint(endpoint) {
+    return endpoint ? R2_ENDPOINT_RE.exec(endpoint)?.[1] ?? null : null;
+  }
   function text2(language) {
     return language === "ja" ? {
       titleAdd: "データストア接続を追加",
@@ -10327,6 +10356,12 @@ ${frontmatter.yaml}
       password: "パスワード",
       database: "データベース",
       schema: "既定スキーマ（任意）",
+      provider: "プロバイダ",
+      providerCustom: "S3 互換（AWS / MinIO / LocalStack）",
+      providerR2: "Cloudflare R2",
+      accountId: "Cloudflare アカウント ID",
+      databaseId: "データベース ID",
+      apiToken: "API トークン",
       endpoint: "エンドポイント URL",
       region: "リージョン",
       accessKeyId: "アクセスキー ID",
@@ -10345,7 +10380,9 @@ ${frontmatter.yaml}
       requestFailed: "接続情報を保存できませんでした",
       deleteTitle: "保存済み接続を削除",
       deleteBody: "この接続情報を削除します。タブやスナップショットのデータは削除されません。",
-      delete: "削除"
+      delete: "削除",
+      secretsLeftTitle: "資格情報がキーチェーンに残りました",
+      secretsLeftBody: "接続は削除しましたが、キーチェーンから資格情報を削除できませんでした。キーチェーンがロックされている可能性があります。ロックを解除して「キーチェーンアクセス」から code-viewer の項目を削除してください。"
     } : {
       titleAdd: "Add datastore connection",
       titleEdit: "Edit datastore connection",
@@ -10358,6 +10395,12 @@ ${frontmatter.yaml}
       password: "Password",
       database: "Database",
       schema: "Default schema (optional)",
+      provider: "Provider",
+      providerCustom: "S3-compatible (AWS / MinIO / LocalStack)",
+      providerR2: "Cloudflare R2",
+      accountId: "Cloudflare account ID",
+      databaseId: "Database ID",
+      apiToken: "API token",
       endpoint: "Endpoint URL",
       region: "Region",
       accessKeyId: "Access key ID",
@@ -10376,7 +10419,9 @@ ${frontmatter.yaml}
       requestFailed: "Failed to save the connection",
       deleteTitle: "Delete saved connection",
       deleteBody: "This removes the saved connection. Tabs and snapshot data are not deleted.",
-      delete: "Delete"
+      delete: "Delete",
+      secretsLeftTitle: "Credentials left in the keychain",
+      secretsLeftBody: "The connection was removed, but its credentials could not be deleted from the keychain — it may be locked. Unlock it and remove the code-viewer item from Keychain Access."
     };
   }
   function field(labelText, input, required = false, requiredLabel = "Required") {
@@ -10440,6 +10485,21 @@ ${frontmatter.yaml}
     database.value = current?.database ?? "";
     const schema = input();
     schema.value = current?.schema ?? "";
+    const provider = document.createElement("select");
+    for (const value of S3_PROVIDERS) {
+      const option = document.createElement("option");
+      option.value = value;
+      option.textContent = value === "r2" ? labels.providerR2 : labels.providerCustom;
+      provider.appendChild(option);
+    }
+    const currentR2AccountId = r2AccountIdFromEndpoint(current?.endpoint);
+    provider.value = currentR2AccountId ? "r2" : "custom";
+    const accountId = input();
+    accountId.value = current?.accountId ?? currentR2AccountId ?? "";
+    const databaseId = input();
+    databaseId.value = current?.databaseId ?? "";
+    const apiToken = input("password");
+    apiToken.autocomplete = "new-password";
     const endpoint = input("url");
     endpoint.value = current?.endpoint ?? "http://127.0.0.1:9200";
     const region = input();
@@ -10461,6 +10521,10 @@ ${frontmatter.yaml}
       password: field(labels.password, password),
       database: field(labels.database, database, true, labels.requiredField),
       schema: field(labels.schema, schema),
+      provider: field(labels.provider, provider),
+      accountId: field(labels.accountId, accountId, true, labels.requiredField),
+      databaseId: field(labels.databaseId, databaseId, true, labels.requiredField),
+      apiToken: field(labels.apiToken, apiToken, true, labels.requiredField),
       endpoint: field(labels.endpoint, endpoint, true, labels.requiredField),
       region: field(labels.region, region, true, labels.requiredField),
       accessKeyId: field(labels.accessKeyId, accessKeyId, true, labels.requiredField),
@@ -10469,21 +10533,28 @@ ${frontmatter.yaml}
       tls: field(labels.tls, tls)
     };
     form.append(...Object.values(rows));
+    const isR2 = () => kind.value === "s3" && provider.value === "r2";
     const syncKind = () => {
       const value = kind.value;
       const sql = value === "postgresql" || value === "mysql";
       const redis = value === "redis";
       const http = value === "elasticsearch";
       const aws = value === "s3" || value === "dynamodb";
+      const d1 = value === "d1";
+      const r2 = isR2();
       rows.host.hidden = !sql && !redis;
       rows.port.hidden = !sql && !redis;
       rows.user.hidden = !sql;
       rows.username.hidden = !redis && !http;
-      rows.password.hidden = aws;
+      rows.password.hidden = aws || d1;
       rows.database.hidden = !sql;
       rows.schema.hidden = value !== "postgresql";
-      rows.endpoint.hidden = !http && !aws;
-      rows.region.hidden = !aws;
+      rows.provider.hidden = value !== "s3";
+      rows.accountId.hidden = !d1 && !r2;
+      rows.databaseId.hidden = !d1;
+      rows.apiToken.hidden = !d1;
+      rows.endpoint.hidden = !http && !aws || r2;
+      rows.region.hidden = !aws || r2;
       rows.accessKeyId.hidden = !aws;
       rows.secretAccessKey.hidden = !aws;
       rows.sessionToken.hidden = !aws;
@@ -10498,8 +10569,11 @@ ${frontmatter.yaml}
       if (!current && (http || aws)) {
         endpoint.value = value === "elasticsearch" ? "http://127.0.0.1:9200" : "http://127.0.0.1:4566";
       }
+      if (!current && aws)
+        region.value = r2 ? R2_REGION : "us-east-1";
     };
     kind.addEventListener("change", syncKind);
+    provider.addEventListener("change", syncKind);
     syncKind();
     const validateConnection = () => {
       const value = kind.value;
@@ -10516,10 +10590,16 @@ ${frontmatter.yaml}
       if ((value === "postgresql" || value === "mysql") && (!user.value.trim() || !database.value.trim())) {
         return labels.required;
       }
-      if ((value === "elasticsearch" || value === "s3" || value === "dynamodb") && !endpoint.value.trim()) {
+      if (value === "d1" && (!accountId.value.trim() || !databaseId.value.trim() || !apiToken.value)) {
+        return labels.required;
+      }
+      if (isR2() && !accountId.value.trim()) {
+        return labels.required;
+      }
+      if ((value === "elasticsearch" || value === "s3" && !isR2() || value === "dynamodb") && !endpoint.value.trim()) {
         return labels.required;
       }
-      if ((value === "s3" || value === "dynamodb") && (!region.value.trim() || !accessKeyId.value.trim())) {
+      if ((value === "s3" || value === "dynamodb") && (!isR2() && !region.value.trim() || !accessKeyId.value.trim())) {
         return labels.required;
       }
       return null;
@@ -10555,10 +10635,16 @@ ${frontmatter.yaml}
           ...username.value.trim() || !current ? { username: username.value.trim() || undefined } : {},
           ...password.value || !current ? { password: password.value } : {}
         });
+      } else if (value === "d1") {
+        Object.assign(payload, {
+          accountId: accountId.value.trim(),
+          databaseId: databaseId.value.trim(),
+          apiToken: apiToken.value
+        });
       } else {
         Object.assign(payload, {
-          endpoint: endpoint.value.trim(),
-          region: region.value.trim(),
+          endpoint: isR2() ? r2EndpointFor(accountId.value.trim()) : endpoint.value.trim(),
+          region: isR2() ? R2_REGION : region.value.trim(),
           ...accessKeyId.value.trim() || !current ? { accessKeyId: accessKeyId.value.trim() } : {},
           ...secretAccessKey.value || !current ? { secretAccessKey: secretAccessKey.value } : {},
           ...sessionToken.value ? { sessionToken: sessionToken.value } : {}
@@ -10668,6 +10754,13 @@ ${frontmatter.yaml}
     }));
     if (!response.ok)
       throw new Error(await response.text() || labels.requestFailed);
+    const body = await response.json().catch(() => ({}));
+    if (body.secretsRemoved === false) {
+      await showAlertDialog({
+        title: labels.secretsLeftTitle,
+        body: labels.secretsLeftBody
+      });
+    }
     return true;
   }
 
@@ -20343,8 +20436,22 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
   function isAbortError2(err) {
     return err instanceof DOMException && err.name === "AbortError" || err instanceof Error && err.name === "AbortError";
   }
+  var SQL_KINDS = new Set([
+    "sqlite",
+    "postgresql",
+    "mysql",
+    "d1"
+  ]);
+  var ROW_EDITABLE_KINDS = new Set([
+    "sqlite",
+    "postgresql",
+    "mysql"
+  ]);
   function isSqlKind(kind) {
-    return kind === "sqlite" || kind === "postgresql" || kind === "mysql";
+    return !!kind && SQL_KINDS.has(kind);
+  }
+  function isRowEditableKind(kind) {
+    return !!kind && ROW_EDITABLE_KINDS.has(kind);
   }
   function isPostgresKind(kind) {
     return kind === "postgresql";
@@ -20700,7 +20807,7 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
         cb.onStateChange();
       },
       getText: () => paneText(),
-      getEditable: () => isSqlKind(currentDbInfo?.kind),
+      getEditable: () => isRowEditableKind(currentDbInfo?.kind),
       applyMutations: (mutations) => applyRowMutations(mutations),
       onRefreshComplete: ({ table: table2, filters }) => {
         if (filters.length === 0) {
@@ -26304,6 +26411,10 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
                   kind: "paragraph",
                   text: "A file detail page exposes up to four tabs — Preview, Code, Blame, History. For text files Code is the default and ?preview=1 opts in to the Markdown / HTML preview; media files (images, video, audio, PDF) show a Preview tab only, with no Code tab. Blame and History have their own canonical URLs (view=blame, view=history) so deep links and the browser back/forward stay in sync, and they keep the Repository sidebar visible. Opening another file from the repository tree keeps the active tab (a file that cannot be previewed falls back to Code)."
                 },
+                {
+                  kind: "paragraph",
+                  text: "Relative links inside a Markdown preview lead to the same destinations as they do on GitHub: another Markdown file opens its file page, an #anchor opens the preview and scrolls to that heading, a non-Markdown file opens in the Code view, and a link to a directory opens that folder in the repository tree."
+                },
                 {
                   kind: "paragraph",
                   text: "When the repository remote is on GitHub, repository and file headers can open the current path there. Selecting source lines also exposes separate actions to copy the AI reference, open the exact GitHub line range, or copy its URL. Markdown and HTML diff cards include a direct Preview shortcut."
@@ -26555,7 +26666,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, DynamoDB, and S3-compatible object stores from one local viewer.",
+          intro: "Browse SQLite files, Docker-hosted databases, Cloudflare D1, Redis, Elasticsearch, DynamoDB, and S3-compatible object stores (including Cloudflare R2) from one local viewer.",
           groups: [
             {
               title: "Supported datastores",
@@ -26565,7 +26676,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                   rows: [
                     [
                       "Saved connections",
-                      "Use + beside the datastore selector to add an arbitrary PostgreSQL, MySQL, Redis, Elasticsearch, S3-compatible, or DynamoDB endpoint. Required fields are marked, and Test connection verifies the current values before saving. Drivers are included, so no database CLI or curl is required. Non-secret settings are saved locally; authentication values stay in server memory and must be entered again after a restart."
+                      "Use + beside the datastore selector to add an arbitrary PostgreSQL, MySQL, Cloudflare D1, Redis, Elasticsearch, S3-compatible (including a Cloudflare R2 preset), or DynamoDB endpoint. Required fields are marked, and Test connection verifies the current values before saving. Drivers are included, so no database CLI or curl is required. Non-secret settings are saved locally; credentials are never written into the repository — on macOS they are kept in the Keychain so they survive a restart, and elsewhere they stay in server memory and must be entered again."
                     ],
                     [
                       "SQLite",
@@ -26579,6 +26690,10 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "PostgreSQL",
                       "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. Local Supabase CLI (`supabase start`) projects are also auto-discovered from `supabase/config.toml`, without needing a docker-compose file."
                     ],
+                    [
+                      "Cloudflare D1",
+                      "Added as a saved connection with an account ID, database ID, and API token (needs D1:Read). Browsed over the D1 REST API and reuses the SQL screens — table list, row grid, query editor, schema, ER diagram, snapshots and diffs. Read-only: the query editor accepts SELECT / PRAGMA / EXPLAIN / WITH only, and grid Edit mode is not offered."
+                    ],
                     [
                       "Redis",
                       "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."
@@ -26592,8 +26707,8 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "Detected when DynamoDB is enabled on a LocalStack compose service. List tables, browse a Structure tab (key schema, GSI/LSI, and non-key attribute types inferred from loaded items), scan or query items, follow pagination tokens, and open item details with a copyable key. Browsing is read-only."
                     ],
                     [
-                      "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. 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."
+                      "S3 / MinIO / LocalStack / Cloudflare R2",
+                      "Detected from compose files, or added as a saved connection. R2 uses the Cloudflare R2 provider preset: enter the account ID and an R2 access key pair, and the endpoint and the required auto signing region are filled in. 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."
                     ]
                   ]
                 }
@@ -26987,6 +27102,10 @@ code-viewer query agent-help`
                   kind: "paragraph",
                   text: "ファイル詳細ページには最大 4 つのタブ (Preview / Code / Blame / History) があります。テキストファイルは Code がデフォルトで、?preview=1 を付けると Markdown / HTML プレビューに切り替わります。画像・動画・音声・PDF などのメディアファイルは Preview タブのみ表示され、Code タブは表示されません。Blame と History はそれぞれ専用 URL (view=blame, view=history) を持つため、ディープリンクとブラウザの戻る / 進むが同期し、いずれも Repository サイドバーは表示されたままです。ツリーから別のファイルを開いても選択中のタブは維持されます (プレビューできないファイルでは Code に戻ります)。"
                 },
+                {
+                  kind: "paragraph",
+                  text: "Markdown プレビュー内の相対リンクは GitHub と同じ行き先に解決されます。別の Markdown ファイルはそのファイルページを開き、#見出し 付きのリンクはプレビューを開いて該当見出しまでスクロールし、Markdown 以外のファイルは Code ビュー、ディレクトリへのリンクはリポジトリツリーのそのフォルダを開きます。"
+                },
                 {
                   kind: "paragraph",
                   text: "リポジトリの remote が GitHub の場合、リポジトリとファイルのヘッダーから現在のパスを GitHub で開けます。ソース行を選択すると、AI 参照のコピー、選択行範囲を GitHub で開く、GitHub URL のコピーを個別に選べます。Markdown / HTML の diff カードには直接 Preview を開く導線も表示されます。"
@@ -27238,7 +27357,7 @@ code-viewer annotate add-db --db app.db --tab query \\
         database: {
           nav: "データストア",
           title: "データストアビューア",
-          intro: "SQLite ファイル、Docker 上のデータベース、Redis、Elasticsearch、DynamoDB、S3 互換オブジェクトストアをローカルビューアで閲覧できます。",
+          intro: "SQLite ファイル、Docker 上のデータベース、Cloudflare D1、Redis、Elasticsearch、DynamoDB、S3 互換オブジェクトストア (Cloudflare R2 を含む) をローカルビューアで閲覧できます。",
           groups: [
             {
               title: "対応データストア",
@@ -27248,7 +27367,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                   rows: [
                     [
                       "保存済み接続",
-                      "データストア選択の横にある + から、任意の PostgreSQL、MySQL、Redis、Elasticsearch、S3 互換、DynamoDB エンドポイントを追加できます。必須項目にはマークが付き、保存前に「接続テスト」で入力内容を確認できます。ドライバーは同梱されているため、データベース CLI や curl は不要です。非機密設定はローカルに保存されますが、認証情報はサーバーメモリだけに保持され、再起動後は再入力が必要です。"
+                      "データストア選択の横にある + から、任意の PostgreSQL、MySQL、Cloudflare D1、Redis、Elasticsearch、S3 互換 (Cloudflare R2 プリセットあり)、DynamoDB エンドポイントを追加できます。必須項目にはマークが付き、保存前に「接続テスト」で入力内容を確認できます。ドライバーは同梱されているため、データベース CLI や curl は不要です。非機密設定はローカルに保存されます。資格情報はリポジトリ配下には一切書かれず、macOS ではキーチェーンに保存されるため再起動をまたいで保持されます (それ以外の OS ではサーバーメモリのみで、再起動後は再入力が必要です)。"
                     ],
                     [
                       "SQLite",
@@ -27262,6 +27381,10 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "PostgreSQL",
                       "compose ファイルから検出。同一サーバー上の複数データベースに対応し、スキーマ切替セレクターで再オープンせずスキーマを切り替えられます。SQLite と同じく行のインライン編集 / 追加 / 削除に対応。ローカルの Supabase CLI (`supabase start`) プロジェクトも `supabase/config.toml` から自動検出され、docker-compose ファイルは不要です。"
                     ],
+                    [
+                      "Cloudflare D1",
+                      "アカウント ID・データベース ID・API トークン (D1:Read 権限が必要) を入力して保存済み接続として追加します。D1 REST API 経由で閲覧し、SQL 系の画面 (テーブル一覧・行グリッド・クエリエディタ・スキーマ・ER 図・スナップショット/差分) をそのまま使えます。閲覧専用で、クエリエディタは SELECT / PRAGMA / EXPLAIN / WITH のみ受け付け、グリッドの Edit モードは表示されません。"
+                    ],
                     [
                       "Redis",
                       "compose ファイルから検出。DB 0-15 を SCAN し、string/hash/list は専用ペイン、set/zset/stream は JSON ビュー。値の編集 / キー削除 / 新規キー作成 (全タイプ) に対応。スナップショット/差分にも参加します。"
@@ -27275,8 +27398,8 @@ code-viewer annotate add-db --db app.db --tab query \\
                       "LocalStack の compose サービスで DynamoDB が有効な場合に検出。テーブル一覧、構造タブ(キースキーマ・GSI/LSI・読み込み済みアイテムから推測した非キー属性の型)、scan / query、継続トークンによるページング、コピー可能なキー付きのアイテム詳細を表示します。閲覧専用です。"
                     ],
                     [
-                      "S3 / MinIO / LocalStack",
-                      "compose ファイルから検出。フォルダツリー型ブラウザ、prefix/ファイル名検索、更新日時順表示、画像/動画/音声/PDF/Markdown/HTML/テキストのプレビューに対応。テキスト/Markdown/JSON のインライン編集、新規オブジェクトアップロード、オブジェクト削除も可能。LocalStack はホストポート未公開時 `docker exec curl` にフォールバックしますが、MinIO はホストポート公開が必須です。"
+                      "S3 / MinIO / LocalStack / Cloudflare R2",
+                      "compose ファイルから検出するほか、保存済み接続としても追加できます。R2 は「Cloudflare R2」プロバイダプリセットを選び、アカウント ID と R2 のアクセスキーを入力すればエンドポイントと必須リージョン auto が自動で入ります。フォルダツリー型ブラウザ、prefix/ファイル名検索、更新日時順表示、画像/動画/音声/PDF/Markdown/HTML/テキストのプレビューに対応。テキスト/Markdown/JSON のインライン編集、新規オブジェクトアップロード、オブジェクト削除も可能。LocalStack はホストポート未公開時 `docker exec curl` にフォールバックしますが、MinIO はホストポート公開が必須です。"
                     ]
                   ]
                 }
@@ -30831,6 +30954,59 @@ code-viewer query agent-help`
     return trimmed;
   }
 
+  // web-src/views/markdown-link-navigation.ts
+  async function openMarkdownLink(target, deps) {
+    const ref = target.ref || "worktree";
+    const routeAtClick = currentRouteKey();
+    const directory = await isMarkdownDirectoryLink(target, deps);
+    if (directory === null || currentRouteKey() !== routeAtClick)
+      return;
+    if (directory) {
+      deps.setRoute(deps.repoRoute(ref, target.path));
+      await deps.loadRepo();
+      return;
+    }
+    const anchorInMarkdown = !!target.hash && sourcePreviewKind(target.path) === "markdown";
+    deps.setRoute({
+      screen: "file",
+      path: target.path,
+      ref,
+      view: "blob",
+      ...anchorInMarkdown ? { preview: true } : {},
+      range: deps.currentRange()
+    });
+    applyMarkdownLinkHash(target.hash);
+    await deps.renderStandaloneSource({ path: target.path, ref });
+  }
+  function currentRouteKey() {
+    return window.location.pathname + window.location.search;
+  }
+  async function isMarkdownDirectoryLink(target, deps) {
+    if (target.directory)
+      return true;
+    if (!target.path)
+      return true;
+    const name = target.path.split("/").pop() || "";
+    if (/.\.[^.]+$/.test(name))
+      return false;
+    try {
+      const res = await deps.trackLoad(fetch(buildRawFileUrl({ path: target.path, ref: target.ref }), {
+        method: "HEAD"
+      }));
+      return res.status === 404;
+    } catch (err) {
+      if (deps.isAbortError(err))
+        return null;
+      return false;
+    }
+  }
+  function applyMarkdownLinkHash(hash) {
+    if (!hash)
+      return;
+    const base2 = window.location.pathname + window.location.search;
+    history.replaceState(history.state, "", `${base2}#${encodeURIComponent(hash)}`);
+  }
+
   // web-src/views/repository-web-link.ts
   function createRepositoryWebLink(target, label) {
     const link2 = document.createElement("a");
@@ -32533,6 +32709,7 @@ code-viewer query agent-help`
       renderStandaloneSource,
       repoFileTargetFromRoute,
       trackLoad,
+      isAbortError: isAbortError3,
       syncSidebarHeaderHeight,
       clearLoadQueue,
       getProjectName,
@@ -32894,6 +33071,17 @@ code-viewer query agent-help`
         range: currentRange()
       };
     }
+    function markdownLinkNavigationDeps() {
+      return {
+        setRoute,
+        currentRange,
+        loadRepo,
+        repoRoute,
+        renderStandaloneSource,
+        trackLoad,
+        isAbortError: isAbortError3
+      };
+    }
     function createRepoBreadcrumb(target, path) {
       const nav = document.createElement("nav");
       nav.className = "gdp-file-breadcrumb gdp-repo-breadcrumb";
@@ -33087,16 +33275,7 @@ code-viewer query agent-help`
         try {
           wrapper.appendChild(await renderMarkdownPreview(meta.readme.text, { path: meta.readme.path, ref: meta.ref }, {
             syntaxHighlight: STATE.syntaxHighlight,
-            onNavigateMarkdown: (path, ref) => {
-              setRoute({
-                screen: "file",
-                path,
-                ref,
-                view: "blob",
-                range: currentRange()
-              });
-              renderStandaloneSource({ path, ref });
-            }
+            onNavigateMarkdown: (link2) => void openMarkdownLink(link2, markdownLinkNavigationDeps())
           }));
         } catch {
           const fallback = document.createElement("pre");
@@ -34321,6 +34500,17 @@ code-viewer query agent-help`
       focusMainSurface,
       isPaletteOpen
     } = deps;
+    function markdownLinkNavigationDeps() {
+      return {
+        setRoute,
+        currentRange,
+        loadRepo,
+        repoRoute,
+        renderStandaloneSource,
+        trackLoad,
+        isAbortError: isAbortError3
+      };
+    }
     const VIRTUAL_SOURCE_LINE_THRESHOLD = 3000;
     const VIRTUAL_SOURCE_SIZE_THRESHOLD = 1024 * 1024;
     const VIRTUAL_SOURCE_PAGE_SIZE = 2000;
@@ -34562,16 +34752,7 @@ code-viewer query agent-help`
         (deps.renderMarkdownPreview ?? renderMarkdownPreview)(textValue, target, {
           syntaxHighlight: true,
           signal,
-          onNavigateMarkdown: (path, ref) => {
-            setRoute({
-              screen: "file",
-              path,
-              ref,
-              view: "blob",
-              range: currentRange()
-            });
-            renderStandaloneSource({ path, ref });
-          }
+          onNavigateMarkdown: (link2) => void openMarkdownLink(link2, markdownLinkNavigationDeps())
         }).then((next) => {
           if (signal?.aborted || !preview.isConnected || !sourceTargetsEqual(sourceTargetFromRoute(), target))
             return;
@@ -34856,16 +35037,7 @@ code-viewer query agent-help`
           let preview = previewKind === "html" ? renderHtmlPreview(target, textValue) : await (deps.renderMarkdownPreview ?? renderMarkdownPreview)(textValue, target, {
             syntaxHighlight: false,
             signal,
-            onNavigateMarkdown: (path, ref) => {
-              setRoute({
-                screen: "file",
-                path,
-                ref,
-                view: "blob",
-                range: currentRange()
-              });
-              renderStandaloneSource({ path, ref });
-            }
+            onNavigateMarkdown: (link2) => void openMarkdownLink(link2, markdownLinkNavigationDeps())
           });
           if (signal?.aborted)
             return false;
@@ -34956,16 +35128,7 @@ code-viewer query agent-help`
         let preview = previewKind === "html" ? renderHtmlPreview(target, textValue) : await (deps.renderMarkdownPreview ?? renderMarkdownPreview)(textValue, target, {
           syntaxHighlight: false,
           signal,
-          onNavigateMarkdown: (path, ref) => {
-            setRoute({
-              screen: "file",
-              path,
-              ref,
-              view: "blob",
-              range: currentRange()
-            });
-            renderStandaloneSource({ path, ref });
-          }
+          onNavigateMarkdown: (link2) => void openMarkdownLink(link2, markdownLinkNavigationDeps())
         });
         if (signal?.aborted)
           return false;
@@ -36754,6 +36917,7 @@ code-viewer query agent-help`
       renderStandaloneSource,
       repoFileTargetFromRoute,
       trackLoad,
+      isAbortError: isAbortError3,
       syncSidebarHeaderHeight,
       clearLoadQueue: () => DIFF_VIEW.clearLoadQueue(),
       getProjectName: () => PROJECT_NAME,

package/web/style.css

@@ -3766,10 +3766,12 @@ table.d2h-diff-table td.d2h-code-side-linenumber {
   border-radius: 6px;
 }
 .gdp-upload-panel {
-  display: flex;
+  /* Grid, not space-between flex: the always-present error node would
+     otherwise take the right edge and strand the button in the middle. */
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
   align-items: center;
-  justify-content: space-between;
-  gap: 12px;
+  gap: 6px 12px;
   margin: 12px 14px;
   padding: 10px 14px;
   border: 1px dashed var(--border);
@@ -3789,11 +3791,15 @@ table.d2h-diff-table td.d2h-code-side-linenumber {
   border-color: var(--danger);
 }
 .gdp-upload-error {
-  min-height: 18px;
+  /* Second row, full width, so showing an error never shifts the button. */
+  grid-column: 1 / -1;
   color: var(--danger);
   font-size: var(--ui-font-base);
   line-height: 18px;
 }
+.gdp-upload-error:empty {
+  display: none;
+}
 .gdp-upload-copy {
   min-width: 0;
   color: var(--fg-muted);