@onjmin/dtm 0.1.57 → 0.1.58

package/dist/index.js

@@ -5142,8 +5142,6 @@ var DAW_CSS = `
   max-height: 180px;
   overflow-y: auto;
   padding: 8px 10px 10px;
-  overflow-x: auto;
-  white-space: nowrap;
   scrollbar-width: none;
   display: flex;
   flex-direction: column;
@@ -5172,6 +5170,7 @@ var DAW_CSS = `
 .dtm-cp-bar {
   display: flex;
   align-items: center;
+  flex-wrap: wrap;
   gap: 2px;
   margin-top: 2px;
 }
@@ -6874,11 +6873,13 @@ var loadDrumFont = (ctx, pitch) => {
   _drumLoading.set(pitch, p);
   return p;
 };
+var BAR_SEP = /[|lｌ→]/;
+var NON_EVENT_RE = /^[=_]$|^N\.C\.$|^N$/i;
 var buildDisplayLines = (chords, eventsCount) => {
   const rawLines = chords.split("\n").map((l) => l.trim()).filter((l) => l);
   const displayLines = [];
   let eventCounter = 0;
-  let colorIdx = -1;
+  let colorIdx = 0;
   for (const line of rawLines) {
     if (/^#/.test(line)) {
       const label = line.replace(/^#\s*/, "").trim();
@@ -6886,19 +6887,21 @@ var buildDisplayLines = (chords, eventsCount) => {
       if (/^tone\s*=/i.test(label)) continue;
       if (/^instrument\s*=/i.test(label)) continue;
       if (/^metronome/i.test(label)) continue;
-      colorIdx++;
+      if (displayLines.length > 0 || eventCounter > 0) colorIdx++;
       displayLines.push({
         type: "section",
         section: label,
-        colorIdx: Math.max(0, colorIdx)
+        colorIdx
       });
       continue;
     }
-    const segments = line.split("|");
-    if (segments.length <= 1) continue;
+    const segments = line.split(BAR_SEP);
+    if (segments.length === 0) continue;
+    const hasMultiSeg = segments.length > 1;
     const parts = [];
     for (let i = 0; i < segments.length; i++) {
-      if (i > 0) parts.push({ text: "|", isChord: false, eventIdx: -1 });
+      if (hasMultiSeg && i > 0)
+        parts.push({ text: "|", isChord: false, eventIdx: -1 });
       const bar = segments[i].trim();
       if (!bar) continue;
       const splitAt = [];
@@ -6921,7 +6924,7 @@ var buildDisplayLines = (chords, eventsCount) => {
           splitAt.push(j + 1);
           continue;
         }
-        if (/^[A-G]$/i.test(char)) {
+        if (/^[A-G]$/.test(char)) {
           const prev = bar[j - 1];
           const prev2 = bar.slice(Math.max(0, j - 2), j);
           if (prev === "/" || prev2.toLowerCase() === "on") continue;
@@ -6930,12 +6933,13 @@ var buildDisplayLines = (chords, eventsCount) => {
       }
       const uniqueSplitAt = Array.from(new Set(splitAt)).filter((idx) => idx >= 0 && idx < bar.length).sort((a, b) => a - b);
       if (uniqueSplitAt.length === 0) {
+        const isEvent = !NON_EVENT_RE.test(bar);
         parts.push({
           text: bar,
           isChord: true,
-          eventIdx: eventCounter < eventsCount ? eventCounter : -1
+          eventIdx: isEvent && eventCounter < eventsCount ? eventCounter : -1
         });
-        eventCounter++;
+        if (isEvent) eventCounter++;
         continue;
       }
       for (let ci = 0; ci < uniqueSplitAt.length; ci++) {
@@ -6944,19 +6948,20 @@ var buildDisplayLines = (chords, eventsCount) => {
         const end = ci < uniqueSplitAt.length - 1 ? uniqueSplitAt[ci + 1] : bar.length;
         const symbol = bar.slice(start, end).trim();
         if (symbol) {
+          const isEvent = !NON_EVENT_RE.test(symbol);
           parts.push({
             text: symbol,
             isChord: true,
-            eventIdx: eventCounter < eventsCount ? eventCounter : -1
+            eventIdx: isEvent && eventCounter < eventsCount ? eventCounter : -1
           });
-          eventCounter++;
+          if (isEvent) eventCounter++;
         }
       }
     }
     if (parts.length > 0) {
       displayLines.push({
         type: "bar",
-        colorIdx: Math.max(0, colorIdx),
+        colorIdx,
         parts
       });
     }
@@ -8890,6 +8895,18 @@ var MidiSearchClient = class {
     if (!res.ok) throw new Error(`picotune fetch failed: ${res.status}`);
     return res.arrayBuffer();
   }
+  async searchRechord(word) {
+    if (!this.enabled) return [];
+    const qs = new URLSearchParams();
+    qs.set("word", word);
+    qs.set("guest", "true");
+    const url2 = `${this.baseUrl}/rechord/scores?${qs.toString()}`;
+    const res = await fetch(url2, { headers: this.headers() });
+    if (!res.ok) throw new Error(`rechord search failed: ${res.status}`);
+    const body = await res.json();
+    const list = body.result ?? body.data ?? body;
+    return Array.isArray(list) ? list : [];
+  }
 };
 
 // src/linked-list.ts
@@ -11314,6 +11331,7 @@ var mountDAW = (target, options = {}) => {
           <div style="display: inline-flex; align-items: center; gap: 6px;">
             <span class="dtm-label">\u548C\u97F3</span>
             <button class="dtm-infobtn" data-dtm="chord-info" title="\u30B3\u30FC\u30C9\u9032\u884C\u306E\u66F8\u304D\u65B9\u89E3\u8AAC">${icon("info", 12)}</button>
+            ${showMidiSearch ? `<button class="dtm-btn dtm-btn--ghost" data-dtm="chord-search" title="\u30B3\u30FC\u30C9\u9032\u884C\u691C\u7D22" style="min-height: 24px; min-width: auto; height: 24px; padding: 0 6px; font-size: 11px; display: inline-flex; align-items: center;">\u30B3\u30FC\u30C9\u691C\u7D22</button>` : ""}
           </div>
           <select class="dtm-select" data-dtm="chord-pattern">
             <option value="block">\u30D6\u30ED\u30C3\u30AF</option>
@@ -11349,6 +11367,14 @@ var mountDAW = (target, options = {}) => {
         save();
         applyChord();
       });
+      const searchChordBtn = div.querySelector(
+        '[data-dtm="chord-search"]'
+      );
+      if (searchChordBtn) {
+        searchChordBtn.addEventListener("click", () => {
+          openChordSearchModal(input);
+        });
+      }
     }
   };
   const switchTrack = (id) => {
@@ -12212,6 +12238,8 @@ var mountDAW = (target, options = {}) => {
       searchPreviewBtn = null;
     }
   };
+  let mmlSearchCache = null;
+  let chordSearchCache = null;
   const wireMidiSearch = () => {
     if (!midiSearchClient) return;
     refs.midiSearchOpenBtn.addEventListener("click", () => {
@@ -12222,6 +12250,7 @@ var mountDAW = (target, options = {}) => {
 					<input type="text" class="dtm-input dtm-grow" data-dtm="modal-midi-search-input" placeholder="\u66F2\u540D\u3067MML\u691C\u7D22" style="min-width:0">
 					<button class="dtm-btn dtm-btn--primary" data-dtm="modal-midi-search-btn" style="flex-shrink:0">\u691C\u7D22</button>
 				</div>
+				<div data-dtm="modal-midi-search-status" style="font-size:11px;color:rgba(255,255,255,0.5);min-height:1.4em"></div>
 				<div class="dtm-row" data-dtm="modal-midi-search-results" style="flex-direction:column;align-items:stretch;gap:4px"></div>
 				`
       );
@@ -12231,9 +12260,17 @@ var mountDAW = (target, options = {}) => {
       const searchBtn = refs.modalBody.querySelector(
         '[data-dtm="modal-midi-search-btn"]'
       );
+      const statusEl = refs.modalBody.querySelector(
+        '[data-dtm="modal-midi-search-status"]'
+      );
       const results = refs.modalBody.querySelector(
         '[data-dtm="modal-midi-search-results"]'
       );
+      if (mmlSearchCache) {
+        input.value = mmlSearchCache.query;
+        statusEl.textContent = `\u300C${mmlSearchCache.query}\u300D\u306E\u691C\u7D22\u7D50\u679C\u3000${mmlSearchCache.count}\u4EF6\u306E\u30D2\u30C3\u30C8`;
+        mmlSearchCache.renderResults(results);
+      }
       const runSearch = async () => {
         const q2 = input.value.trim();
         if (!q2) return;
@@ -12241,37 +12278,85 @@ var mountDAW = (target, options = {}) => {
         searchBtn.disabled = true;
         searchBtn.textContent = "\u691C\u7D22\u4E2D...";
         results.innerHTML = "";
+        statusEl.textContent = "";
         try {
           const songs = await midiSearchClient.searchSongs({ title: q2 });
           if (songs.length === 0) {
+            statusEl.textContent = `\u300C${q2}\u300D\u306E\u691C\u7D22\u7D50\u679C\u30000\u4EF6\u306E\u30D2\u30C3\u30C8`;
             results.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u898B\u3064\u304B\u308A\u307E\u305B\u3093\u3067\u3057\u305F</span>';
+            mmlSearchCache = {
+              query: q2,
+              count: 0,
+              renderResults: (c) => {
+                c.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u898B\u3064\u304B\u308A\u307E\u305B\u3093\u3067\u3057\u305F</span>';
+              }
+            };
             return;
           }
-          for (const song of songs) {
-            const box = document.createElement("div");
-            box.className = "dtm-modal-sample-box";
-            const row = document.createElement("div");
-            row.className = "dtm-row";
-            row.style.cssText = "flex-wrap:nowrap;gap:4px;padding:2px 0";
-            const label = document.createElement("span");
-            label.className = "dtm-label";
-            label.style.cssText = "flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap";
-            label.textContent = `${song.title} - ${song.user}`;
-            const previewBtn = document.createElement("button");
-            previewBtn.className = "dtm-btn dtm-btn--ghost";
-            previewBtn.style.cssText = "flex-shrink:0";
-            previewBtn.textContent = "\u25B6 \u8A66\u8074";
-            const loadBtn = document.createElement("button");
-            loadBtn.className = "dtm-btn dtm-btn--primary";
-            loadBtn.style.cssText = "flex-shrink:0";
-            loadBtn.textContent = "\u8AAD\u307F\u8FBC\u307F";
-            const playerContainer = document.createElement("div");
-            playerContainer.className = "dtm-modal-sample-player-container";
-            previewBtn.addEventListener("click", async () => {
-              if (searchPreviewBtn === previewBtn) {
-                if (searchPreviewPlayer?.isPlaying()) {
-                  searchPreviewPlayer.stop();
+          statusEl.textContent = `\u300C${q2}\u300D\u306E\u691C\u7D22\u7D50\u679C\u3000${songs.length}\u4EF6\u306E\u30D2\u30C3\u30C8`;
+          const renderMmlResults = (container) => {
+            container.innerHTML = "";
+            for (const song of songs) {
+              const box = document.createElement("div");
+              box.className = "dtm-modal-sample-box";
+              const row = document.createElement("div");
+              row.className = "dtm-row";
+              row.style.cssText = "flex-wrap:nowrap;gap:4px;padding:2px 0";
+              const label = document.createElement("span");
+              label.className = "dtm-label";
+              label.style.cssText = "flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap";
+              label.textContent = `${song.title} - ${song.user}`;
+              const previewBtn = document.createElement("button");
+              previewBtn.className = "dtm-btn dtm-btn--ghost";
+              previewBtn.style.cssText = "flex-shrink:0";
+              previewBtn.textContent = "\u25B6 \u8A66\u8074";
+              const loadBtn = document.createElement("button");
+              loadBtn.className = "dtm-btn dtm-btn--primary";
+              loadBtn.style.cssText = "flex-shrink:0";
+              loadBtn.textContent = "\u8AAD\u307F\u8FBC\u307F";
+              const playerContainer = document.createElement("div");
+              playerContainer.className = "dtm-modal-sample-player-container";
+              previewBtn.addEventListener("click", async () => {
+                if (searchPreviewBtn === previewBtn) {
+                  if (searchPreviewPlayer?.isPlaying()) {
+                    searchPreviewPlayer.stop();
+                  } else {
+                    stop();
+                    previewBtn.textContent = "\u8AAD\u8FBC\u4E2D...";
+                    try {
+                      const midi = await fetchVerifiedMidi(song.file);
+                      const mml = buildPreviewMml(midi);
+                      playerContainer.innerHTML = "";
+                      const player = mountMmlPlayer(playerContainer, mml, {
+                        onPlayNote: options.onPlayNote,
+                        onPlayDrum: options.onPlayDrum,
+                        onResumeAudio: options.onResumeAudio,
+                        getAudioTime: options.getAudioTime,
+                        singingVoices: options.singingVoices,
+                        drumPatterns: options.drumPatterns,
+                        volume: masterVolume,
+                        _skipInfoModals: true,
+                        onStop: () => {
+                          if (searchPreviewBtn === previewBtn) {
+                            previewBtn.textContent = "\u25B6 \u8A66\u8074";
+                            previewBtn.classList.remove("dtm-btn--danger");
+                            previewBtn.classList.add("dtm-btn--ghost");
+                          }
+                        }
+                      });
+                      searchPreviewPlayer = player;
+                      searchPreviewBtn = previewBtn;
+                      player.play();
+                      previewBtn.textContent = "\u25A0 \u505C\u6B62";
+                      previewBtn.classList.remove("dtm-btn--ghost");
+                      previewBtn.classList.add("dtm-btn--danger");
+                    } catch (e) {
+                      console.error("[dtm] MIDI preview failed", e);
+                      previewBtn.textContent = "\u5931\u6557";
+                    }
+                  }
                 } else {
+                  collapseSearchPreview();
                   stop();
                   previewBtn.textContent = "\u8AAD\u8FBC\u4E2D...";
                   try {
@@ -12306,31 +12391,169 @@ var mountDAW = (target, options = {}) => {
                     previewBtn.textContent = "\u5931\u6557";
                   }
                 }
+              });
+              loadBtn.addEventListener("click", async () => {
+                loadBtn.disabled = true;
+                loadBtn.textContent = "\u8AAD\u8FBC\u4E2D...";
+                try {
+                  const pending = await fetchVerifiedMidi(song.file);
+                  const analysis = analyzeMidiTracks(pending);
+                  const sel = analysis.filter((a) => a.selected).map((a) => a.index);
+                  collapseSearchPreview();
+                  overlayDuring(() => applyMidiSelection(pending, sel));
+                  refs.modalOverlay.setAttribute("hidden", "");
+                } catch (e) {
+                  console.error("[dtm] MIDI fetch failed", e);
+                  loadBtn.textContent = "\u5931\u6557";
+                } finally {
+                  loadBtn.disabled = false;
+                }
+              });
+              row.appendChild(label);
+              row.appendChild(previewBtn);
+              row.appendChild(loadBtn);
+              box.appendChild(row);
+              box.appendChild(playerContainer);
+              container.appendChild(box);
+            }
+          };
+          renderMmlResults(results);
+          mmlSearchCache = {
+            query: q2,
+            count: songs.length,
+            renderResults: renderMmlResults
+          };
+        } catch (e) {
+          console.error("[dtm] MIDI search failed", e);
+          results.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u691C\u7D22\u306B\u5931\u6557\u3057\u307E\u3057\u305F</span>';
+        } finally {
+          searchBtn.disabled = false;
+          searchBtn.textContent = "\u691C\u7D22";
+        }
+      };
+      searchBtn.addEventListener("click", () => void runSearch());
+      input.addEventListener("keydown", (e) => {
+        if (e.key === "Enter") void runSearch();
+      });
+      input.focus();
+    });
+  };
+  const openChordSearchModal = (chordTextArea) => {
+    if (!midiSearchClient) return;
+    const active = trackStates.find((t) => t.config.id === activeTrackId);
+    if (!active) return;
+    showModal(
+      "\u30B3\u30FC\u30C9\u9032\u884C\u691C\u7D22",
+      `
+			<div class="dtm-row" style="flex-wrap:nowrap">
+				<input type="text" class="dtm-input dtm-grow" data-dtm="modal-chord-search-input" placeholder="\u66F2\u540D\u3084\u30B3\u30FC\u30C9\u9032\u884C\u3067\u691C\u7D22" style="min-width:0">
+				<button class="dtm-btn dtm-btn--primary" data-dtm="modal-chord-search-btn" style="flex-shrink:0">\u691C\u7D22</button>
+			</div>
+			<div data-dtm="modal-chord-search-status" style="font-size:11px;color:rgba(255,255,255,0.5);min-height:1.4em"></div>
+			<div class="dtm-row" data-dtm="modal-chord-search-results" style="flex-direction:column;align-items:stretch;gap:4px"></div>
+			`
+    );
+    const input = refs.modalBody.querySelector(
+      '[data-dtm="modal-chord-search-input"]'
+    );
+    const searchBtn = refs.modalBody.querySelector(
+      '[data-dtm="modal-chord-search-btn"]'
+    );
+    const statusEl = refs.modalBody.querySelector(
+      '[data-dtm="modal-chord-search-status"]'
+    );
+    const results = refs.modalBody.querySelector(
+      '[data-dtm="modal-chord-search-results"]'
+    );
+    if (chordSearchCache) {
+      input.value = chordSearchCache.query;
+      statusEl.textContent = `\u300C${chordSearchCache.query}\u300D\u306E\u691C\u7D22\u7D50\u679C\u3000${chordSearchCache.count}\u4EF6\u306E\u30D2\u30C3\u30C8`;
+      chordSearchCache.renderResults(results);
+    }
+    const runSearch = async () => {
+      const q2 = input.value.trim();
+      if (!q2) return;
+      collapseSearchPreview();
+      searchBtn.disabled = true;
+      searchBtn.textContent = "\u691C\u7D22\u4E2D...";
+      results.innerHTML = "";
+      statusEl.textContent = "";
+      try {
+        const scores = await midiSearchClient.searchRechord(q2);
+        if (scores.length === 0) {
+          statusEl.textContent = `\u300C${q2}\u300D\u306E\u691C\u7D22\u7D50\u679C\u30000\u4EF6\u306E\u30D2\u30C3\u30C8`;
+          results.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u898B\u3064\u304B\u308A\u307E\u305B\u3093\u3067\u3057\u305F</span>';
+          chordSearchCache = {
+            query: q2,
+            count: 0,
+            renderResults: (c) => {
+              c.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u898B\u3064\u304B\u308A\u307E\u305B\u3093\u3067\u3057\u305F</span>';
+            }
+          };
+          return;
+        }
+        statusEl.textContent = `\u300C${q2}\u300D\u306E\u691C\u7D22\u7D50\u679C\u3000${scores.length}\u4EF6\u306E\u30D2\u30C3\u30C8`;
+        const renderChordResults = (container) => {
+          container.innerHTML = "";
+          for (const score of scores) {
+            const box = document.createElement("div");
+            box.className = "dtm-modal-sample-box";
+            const row = document.createElement("div");
+            row.className = "dtm-row";
+            row.style.cssText = "flex-wrap:nowrap;gap:4px;padding:2px 0";
+            const label = document.createElement("span");
+            label.className = "dtm-label";
+            label.style.cssText = "flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap";
+            label.textContent = `${score.title}${score.user?.screen_name ? ` - ${score.user.screen_name}` : ""}`;
+            const previewBtn = document.createElement("button");
+            previewBtn.className = "dtm-btn dtm-btn--ghost";
+            previewBtn.style.cssText = "flex-shrink:0";
+            previewBtn.textContent = "\u25B6 \u8A66\u8074";
+            const loadBtn = document.createElement("button");
+            loadBtn.className = "dtm-btn dtm-btn--primary";
+            loadBtn.style.cssText = "flex-shrink:0";
+            loadBtn.textContent = "\u8AAD\u307F\u8FBC\u307F";
+            const playerContainer = document.createElement("div");
+            playerContainer.className = "dtm-modal-sample-player-container";
+            previewBtn.addEventListener("click", async () => {
+              if (searchPreviewBtn === previewBtn) {
+                if (searchPreviewPlayer?.isPlaying()) {
+                  searchPreviewPlayer.stop();
+                } else {
+                  stop();
+                  previewBtn.textContent = "\u518D\u751F\u4E2D...";
+                  try {
+                    searchPreviewPlayer?.play();
+                    previewBtn.textContent = "\u25A0 \u505C\u6B62";
+                    previewBtn.classList.remove("dtm-btn--ghost");
+                    previewBtn.classList.add("dtm-btn--danger");
+                  } catch (e) {
+                    console.error("[dtm] Chord preview play failed", e);
+                    previewBtn.textContent = "\u5931\u6557";
+                  }
+                }
               } else {
                 collapseSearchPreview();
                 stop();
                 previewBtn.textContent = "\u8AAD\u8FBC\u4E2D...";
                 try {
-                  const midi = await fetchVerifiedMidi(song.file);
-                  const mml = buildPreviewMml(midi);
                   playerContainer.innerHTML = "";
-                  const player = mountMmlPlayer(playerContainer, mml, {
-                    onPlayNote: options.onPlayNote,
-                    onPlayDrum: options.onPlayDrum,
-                    onResumeAudio: options.onResumeAudio,
-                    getAudioTime: options.getAudioTime,
-                    singingVoices: options.singingVoices,
-                    drumPatterns: options.drumPatterns,
-                    volume: masterVolume,
-                    _skipInfoModals: true,
-                    onStop: () => {
-                      if (searchPreviewBtn === previewBtn) {
-                        previewBtn.textContent = "\u25B6 \u8A66\u8074";
-                        previewBtn.classList.remove("dtm-btn--danger");
-                        previewBtn.classList.add("dtm-btn--ghost");
+                  const player = mountChordPlayer(
+                    playerContainer,
+                    score.content,
+                    {
+                      volume: masterVolume,
+                      bpm: score.bpm ?? bpm ?? 120,
+                      _skipInfoModals: true,
+                      onStop: () => {
+                        if (searchPreviewBtn === previewBtn) {
+                          previewBtn.textContent = "\u25B6 \u8A66\u8074";
+                          previewBtn.classList.remove("dtm-btn--danger");
+                          previewBtn.classList.add("dtm-btn--ghost");
+                        }
                       }
                     }
-                  });
+                  );
                   searchPreviewPlayer = player;
                   searchPreviewBtn = previewBtn;
                   player.play();
@@ -12338,49 +12561,48 @@ var mountDAW = (target, options = {}) => {
                   previewBtn.classList.remove("dtm-btn--ghost");
                   previewBtn.classList.add("dtm-btn--danger");
                 } catch (e) {
-                  console.error("[dtm] MIDI preview failed", e);
+                  console.error("[dtm] Chord preview mount failed", e);
                   previewBtn.textContent = "\u5931\u6557";
                 }
               }
             });
-            loadBtn.addEventListener("click", async () => {
-              loadBtn.disabled = true;
-              loadBtn.textContent = "\u8AAD\u8FBC\u4E2D...";
-              try {
-                const pending = await fetchVerifiedMidi(song.file);
-                const analysis = analyzeMidiTracks(pending);
-                const sel = analysis.filter((a) => a.selected).map((a) => a.index);
-                collapseSearchPreview();
-                overlayDuring(() => applyMidiSelection(pending, sel));
-                refs.modalOverlay.setAttribute("hidden", "");
-              } catch (e) {
-                console.error("[dtm] MIDI fetch failed", e);
-                loadBtn.textContent = "\u5931\u6557";
-              } finally {
-                loadBtn.disabled = false;
+            loadBtn.addEventListener("click", () => {
+              collapseSearchPreview();
+              chordTextArea.value = score.content;
+              active.savedChordInput = score.content;
+              if (score.bpm) {
+                setBpm(score.bpm);
               }
+              applyChord();
+              refs.modalOverlay.setAttribute("hidden", "");
             });
             row.appendChild(label);
             row.appendChild(previewBtn);
             row.appendChild(loadBtn);
             box.appendChild(row);
             box.appendChild(playerContainer);
-            results.appendChild(box);
+            container.appendChild(box);
           }
-        } catch (e) {
-          console.error("[dtm] MIDI search failed", e);
-          results.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u691C\u7D22\u306B\u5931\u6557\u3057\u307E\u3057\u305F</span>';
-        } finally {
-          searchBtn.disabled = false;
-          searchBtn.textContent = "\u691C\u7D22";
-        }
-      };
-      searchBtn.addEventListener("click", () => void runSearch());
-      input.addEventListener("keydown", (e) => {
-        if (e.key === "Enter") void runSearch();
-      });
-      input.focus();
+        };
+        renderChordResults(results);
+        chordSearchCache = {
+          query: q2,
+          count: scores.length,
+          renderResults: renderChordResults
+        };
+      } catch (e) {
+        console.error("[dtm] Chord search failed", e);
+        results.innerHTML = '<span class="dtm-label" style="color:var(--dtm-warn)">\u691C\u7D22\u306B\u5931\u6557\u3057\u307E\u3057\u305F</span>';
+      } finally {
+        searchBtn.disabled = false;
+        searchBtn.textContent = "\u691C\u7D22";
+      }
+    };
+    searchBtn.addEventListener("click", () => void runSearch());
+    input.addEventListener("keydown", (e) => {
+      if (e.key === "Enter") void runSearch();
     });
+    input.focus();
   };
   const onKeyDown = (e) => {
     if (!(e.ctrlKey || e.metaKey)) return;