From 7ff7e8852bd41b1eb524da84fd73840dcd7cff1c Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:42:23 +0100
Subject: [PATCH 01/21] feat: implement context-aware autocomplete

Adds context-sensitive autocompletion for:
- Sound names in s("...") and sound("...") after the opening quote or after whitespace/bracket
- Bank names in bank("...") with quote handling and live filtering
- Scale types in .scale("...") after the colon, inserting colon-form for multi-word names
- Pitch names (C, C#, Db, etc.) for scale keys on explicit completion (Ctrl+Space) before the colon
- Blocks fallback completions in scale context before colon to avoid function list cross-talk
---
 packages/codemirror/autocomplete.mjs | 166 +++++++++++++++++++++++++--
 1 file changed, 155 insertions(+), 11 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 59ca8adf2..c1c7bb14e 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -1,6 +1,11 @@
+
 import jsdoc from '../../doc.json';
 import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
+import { Scale } from '@tonaljs/tonal';
+import { soundMap } from 'superdough';
+
+
 
 const escapeHtml = (str) => {
   const div = document.createElement('div');
@@ -74,6 +79,31 @@ const isValidDoc = (doc) => {
 const hasExcludedTags = (doc) =>
   ['superdirtOnly', 'noAutocomplete'].some((tag) => doc.tags?.find((t) => t.originalTitle === tag));
 
+
+
+export function bankCompletions() {
+  const soundDict = soundMap.get();
+  const banks = new Set();
+  for (const key of Object.keys(soundDict)) {
+    const [bank, suffix] = key.split('_');
+    if (suffix && bank) banks.add(bank);
+  }
+  return Array.from(banks).sort().map((name) => ({ label: name, type: 'bank' }));
+}
+
+// Placeholder: Replace with actual logic to get live sound names
+const soundCompletions = [
+  // Example: { label: 'clap', type: 'sound' }, ...
+];
+
+// Attempt to get all scale names from Tonal
+let scaleCompletions = [];
+try {
+  scaleCompletions = (Scale.names ? Scale.names() : []).map((name) => ({ label: name, type: 'scale' }));
+} catch (e) {
+  console.warn('[autocomplete] Could not load scale names from Tonal:', e);
+}
+
 const jsdocCompletions = jsdoc.docs
   .filter((doc) => isValidDoc(doc) && !hasExcludedTags(doc))
   // https://codemirror.net/docs/ref/#autocomplete.Completion
@@ -85,18 +115,132 @@ const jsdocCompletions = jsdoc.docs
   }));
 
 export const strudelAutocomplete = (context) => {
-  const word = context.matchBefore(/\w*/);
-  if (word.from === word.to && !context.explicit) return null;
+  // --- Pitch names for scale key completion ---
+  // Ideally, these should be imported from packages/tonal/tonleiter.mjs
+  // but are duplicated here as they are not exported.
+  const pitchNames = [
+    'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
+    'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+  ];
+  
+  // Block fallback completions inside .scale("..."), even before the colon
+  let scalePreColonContext = context.matchBefore(/\.scale\(\s*['"][^'"]*$/);
+  if (scalePreColonContext) {
+    // Only yield completions if a colon is present (handled below)
+    if (!scalePreColonContext.text.includes(':')) {
+      if (context.explicit) {
+        // Provide pitch completions on explicit request
+        // (Union of sharps and flats from tonleiter.mjs)
+        const text = scalePreColonContext.text;
+        const match = text.match(/([A-Ga-g][#b]*)?$/);
+        const fragment = match ? match[0] : '';
+        const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
+        const from = scalePreColonContext.to - fragment.length;
+        const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
+        return { from, options };
+      } else {
+        // Block fallback completions
+        return { from: scalePreColonContext.to, options: [] };
+      }
+    }
 
-  return {
-    from: word.from,
-    options: jsdocCompletions,
-    /*     options: [
-      { label: 'match', type: 'keyword' },
-      { label: 'hello', type: 'variable', info: '(World)' },
-      { label: 'magic', type: 'text', apply: '⠁⭒*.✩.*⭒⠁', detail: 'macro' },
-    ], */
-  };
+    // (second block removed, handled above)
+    if (!scalePreColonContext.text.includes(':')) {
+      return { from: scalePreColonContext.to, options: [] };
+    }
+  }
+  
+  // 1. Check for sound context: s("..."), sound("...")
+  // Trigger after at least one letter is typed after whitespace or bracket inside the quotes
+  let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
+  if (soundContext) {
+    const text = soundContext.text;
+    const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+    if (quoteIdx === -1) return null;
+    const inside = text.slice(quoteIdx + 1);
+    const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w]*)$/);
+    const fragment = fragMatch ? fragMatch[1] : inside;
+    if (!fragment || fragment.length === 0) return null;
+    const soundNames = Object.keys(soundMap.get()).sort();
+    const filteredSounds = soundNames.filter((name) => name.startsWith(fragment));
+    let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
+    const from = soundContext.to - fragment.length;
+    return {
+      from,
+      options,
+    };
+  }
+
+  let bankMatch = context.matchBefore(/bank\(\s*(['"])?([\w]*)$/);
+  if (bankMatch) {
+    let banks = bankCompletions();
+    console.log('[autocomplete] Bank context detected:', bankMatch.text);
+    console.log('[autocomplete] soundMap keys:', Object.keys(soundMap.get()));
+    console.log('[autocomplete] bankCompletions:', banks);
+    // Extract quote and fragment using regex groups on match.text
+    const groups = bankMatch.text.match(/(['"])?([\w]*)$/);
+    const quote = groups ? groups[1] : undefined;
+    const fragment = groups ? groups[2] || '' : '';
+    let from;
+    if (quote) {
+      from = bankMatch.from + bankMatch.text.indexOf(quote) + 1;
+    } else {
+      from = bankMatch.to - fragment.length;
+    }
+    const filteredBanks = banks.filter((b) => b.label.startsWith(fragment));
+    let options;
+    if (!quote) {
+      options = filteredBanks.map((b) => ({ ...b, apply: '"' + b.label + '"' }));
+    } else {
+      const afterCursor = context.state.sliceDoc(bankMatch.to, bankMatch.to + 1);
+      options = filteredBanks.map((b) => {
+        if (afterCursor !== quote) {
+          return { ...b, apply: b.label + quote };
+        }
+        return b;
+      });
+    }
+    return {
+      from,
+      options,
+    };
+  }
+
+  // 3. Check for scale context: .scale("..."), only after colon
+  let scaleContext = context.matchBefore(/\.scale\(\s*['"][^'"]*:[^'"]*$/);
+  if (scaleContext) {
+    // Find the last colon in the text
+    const text = scaleContext.text;
+    const colonIdx = text.lastIndexOf(':');
+    if (colonIdx === -1) return null;
+    // Get the fragment after the colon
+    const fragment = text.slice(colonIdx + 1);
+    // Filter scale completions by fragment
+    const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
+    // Insert colon-form (replace spaces with colons) for completions
+    const options = filteredScales.map((s) => ({
+      ...s,
+      apply: s.label.replace(/\s+/g, ':')
+    }));
+    const from = scaleContext.from + colonIdx + 1;
+    return {
+      from,
+      options,
+    };
+  }
+
+  // fallback: original logic
+  const word = context.matchBefore(/\w*/);
+  if (word && word.from === word.to && !context.explicit) return null;
+
+  if (word) {
+    console.log('[autocomplete] Default context:', word.text);
+    return {
+      from: word.from,
+      options: jsdocCompletions,
+    };
+  }
+  return null;
 };
 
 export const isAutoCompletionEnabled = (enabled) =>

From 085e839bfe3f0e4f9404afecba943b70fe106c0f Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:59:26 +0100
Subject: [PATCH 02/21] refactor: modularize autocomplete context handlers
 using strategy array

---
 packages/codemirror/autocomplete.mjs | 68 ++++++++++++++++------------
 1 file changed, 38 insertions(+), 30 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index c1c7bb14e..591552cc7 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -114,23 +114,18 @@ const jsdocCompletions = jsdoc.docs
     type: 'function', // https://codemirror.net/docs/ref/#autocomplete.Completion.type
   }));
 
-export const strudelAutocomplete = (context) => {
-  // --- Pitch names for scale key completion ---
-  // Ideally, these should be imported from packages/tonal/tonleiter.mjs
-  // but are duplicated here as they are not exported.
-  const pitchNames = [
-    'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
-    'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
-  ];
-  
-  // Block fallback completions inside .scale("..."), even before the colon
+
+// --- Handler functions for each context ---
+const pitchNames = [
+  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
+  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+];
+
+function scalePreColonHandler(context) {
   let scalePreColonContext = context.matchBefore(/\.scale\(\s*['"][^'"]*$/);
   if (scalePreColonContext) {
-    // Only yield completions if a colon is present (handled below)
     if (!scalePreColonContext.text.includes(':')) {
       if (context.explicit) {
-        // Provide pitch completions on explicit request
-        // (Union of sharps and flats from tonleiter.mjs)
         const text = scalePreColonContext.text;
         const match = text.match(/([A-Ga-g][#b]*)?$/);
         const fragment = match ? match[0] : '';
@@ -139,19 +134,17 @@ export const strudelAutocomplete = (context) => {
         const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
         return { from, options };
       } else {
-        // Block fallback completions
         return { from: scalePreColonContext.to, options: [] };
       }
     }
-
-    // (second block removed, handled above)
     if (!scalePreColonContext.text.includes(':')) {
       return { from: scalePreColonContext.to, options: [] };
     }
   }
-  
-  // 1. Check for sound context: s("..."), sound("...")
-  // Trigger after at least one letter is typed after whitespace or bracket inside the quotes
+  return null;
+}
+
+function soundHandler(context) {
   let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
   if (soundContext) {
     const text = soundContext.text;
@@ -170,13 +163,13 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
+function bankHandler(context) {
   let bankMatch = context.matchBefore(/bank\(\s*(['"])?([\w]*)$/);
   if (bankMatch) {
     let banks = bankCompletions();
-    console.log('[autocomplete] Bank context detected:', bankMatch.text);
-    console.log('[autocomplete] soundMap keys:', Object.keys(soundMap.get()));
-    console.log('[autocomplete] bankCompletions:', banks);
     // Extract quote and fragment using regex groups on match.text
     const groups = bankMatch.text.match(/(['"])?([\w]*)$/);
     const quote = groups ? groups[1] : undefined;
@@ -205,19 +198,17 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
-  // 3. Check for scale context: .scale("..."), only after colon
+function scaleAfterColonHandler(context) {
   let scaleContext = context.matchBefore(/\.scale\(\s*['"][^'"]*:[^'"]*$/);
   if (scaleContext) {
-    // Find the last colon in the text
     const text = scaleContext.text;
     const colonIdx = text.lastIndexOf(':');
     if (colonIdx === -1) return null;
-    // Get the fragment after the colon
     const fragment = text.slice(colonIdx + 1);
-    // Filter scale completions by fragment
     const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
-    // Insert colon-form (replace spaces with colons) for completions
     const options = filteredScales.map((s) => ({
       ...s,
       apply: s.label.replace(/\s+/g, ':')
@@ -228,19 +219,36 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
-  // fallback: original logic
+function fallbackHandler(context) {
   const word = context.matchBefore(/\w*/);
   if (word && word.from === word.to && !context.explicit) return null;
-
   if (word) {
-    console.log('[autocomplete] Default context:', word.text);
     return {
       from: word.from,
       options: jsdocCompletions,
     };
   }
   return null;
+}
+
+const handlers = [
+  scalePreColonHandler,
+  soundHandler,
+  bankHandler,
+  scaleAfterColonHandler,
+  // this handler *must* be last
+  fallbackHandler
+];
+
+export const strudelAutocomplete = (context) => {
+  for (const handler of handlers) {
+    const result = handler(context);
+    if (result) return result;
+  }
+  return null;
 };
 
 export const isAutoCompletionEnabled = (enabled) =>

From 80fe5b81401741175411692f00604cb16dfc4cb6 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:59:50 +0100
Subject: [PATCH 03/21] refactor: modularize autocomplete context handlers
 using strategy array


From 9200a67a600471309162dabeeb8bce915f915c55 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 19:00:05 +0100
Subject: [PATCH 04/21] feat: add E# and B# to pitchNames for complete
 enharmonic coverage

---
 packages/codemirror/autocomplete.mjs | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 591552cc7..5d6c7233d 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -117,8 +117,8 @@ const jsdocCompletions = jsdoc.docs
 
 // --- Handler functions for each context ---
 const pitchNames = [
-  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
-  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'E#', 'Fb', 'F', 'F#', 'Gb',
+  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'B#', 'Cb'
 ];
 
 function scalePreColonHandler(context) {

From 2a00fcdf5d70a2b0789b11376cf71b9c60cdc3cf Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 19:01:22 +0100
Subject: [PATCH 05/21] Updated the codemirror packages to be able to access
 additional imports.

---
 packages/codemirror/package.json | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/codemirror/package.json b/packages/codemirror/package.json
index 803b33f3d..bb1059f11 100644
--- a/packages/codemirror/package.json
+++ b/packages/codemirror/package.json
@@ -47,6 +47,8 @@
     "@strudel/core": "workspace:*",
     "@strudel/draw": "workspace:*",
     "@strudel/transpiler": "workspace:*",
+    "@tonaljs/tonal": "^4.10.0",
+    "superdough": "workspace:*",
     "nanostores": "^0.11.3"
   },
   "devDependencies": {

From 41d6f1b5da98e3929ae71d2e2adf5ea00768664b Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 21:37:35 +0100
Subject: [PATCH 06/21] feat: sound autocomplete matches anywhere in name using
 includes()

---
 packages/codemirror/autocomplete.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 5d6c7233d..110a9165a 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -155,7 +155,7 @@ function soundHandler(context) {
     const fragment = fragMatch ? fragMatch[1] : inside;
     if (!fragment || fragment.length === 0) return null;
     const soundNames = Object.keys(soundMap.get()).sort();
-    const filteredSounds = soundNames.filter((name) => name.startsWith(fragment));
+  const filteredSounds = soundNames.filter((name) => name.includes(fragment));
     let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
     const from = soundContext.to - fragment.length;
     return {

From 7676641c9ef8a631a47fc7ef0d6877442eb5c509 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Fri, 12 Sep 2025 12:11:36 +0100
Subject: [PATCH 07/21] Commiting lockfile.

---
 pnpm-lock.yaml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f4a24f61c..4cf7ea602 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -215,9 +215,15 @@ importers:
       '@strudel/transpiler':
         specifier: workspace:*
         version: link:../transpiler
+      '@tonaljs/tonal':
+        specifier: ^4.10.0
+        version: 4.10.0
       nanostores:
         specifier: ^0.11.3
         version: 0.11.3
+      superdough:
+        specifier: workspace:*
+        version: link:../superdough
     devDependencies:
       vite:
         specifier: ^6.0.11

From d87ce960d218f00c8adfd2c3cfd1658e39eaa8b3 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:42:23 +0100
Subject: [PATCH 08/21] feat: implement context-aware autocomplete

Adds context-sensitive autocompletion for:
- Sound names in s("...") and sound("...") after the opening quote or after whitespace/bracket
- Bank names in bank("...") with quote handling and live filtering
- Scale types in .scale("...") after the colon, inserting colon-form for multi-word names
- Pitch names (C, C#, Db, etc.) for scale keys on explicit completion (Ctrl+Space) before the colon
- Blocks fallback completions in scale context before colon to avoid function list cross-talk
---
 packages/codemirror/autocomplete.mjs | 166 +++++++++++++++++++++++++--
 1 file changed, 155 insertions(+), 11 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 59ca8adf2..c1c7bb14e 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -1,6 +1,11 @@
+
 import jsdoc from '../../doc.json';
 import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
+import { Scale } from '@tonaljs/tonal';
+import { soundMap } from 'superdough';
+
+
 
 const escapeHtml = (str) => {
   const div = document.createElement('div');
@@ -74,6 +79,31 @@ const isValidDoc = (doc) => {
 const hasExcludedTags = (doc) =>
   ['superdirtOnly', 'noAutocomplete'].some((tag) => doc.tags?.find((t) => t.originalTitle === tag));
 
+
+
+export function bankCompletions() {
+  const soundDict = soundMap.get();
+  const banks = new Set();
+  for (const key of Object.keys(soundDict)) {
+    const [bank, suffix] = key.split('_');
+    if (suffix && bank) banks.add(bank);
+  }
+  return Array.from(banks).sort().map((name) => ({ label: name, type: 'bank' }));
+}
+
+// Placeholder: Replace with actual logic to get live sound names
+const soundCompletions = [
+  // Example: { label: 'clap', type: 'sound' }, ...
+];
+
+// Attempt to get all scale names from Tonal
+let scaleCompletions = [];
+try {
+  scaleCompletions = (Scale.names ? Scale.names() : []).map((name) => ({ label: name, type: 'scale' }));
+} catch (e) {
+  console.warn('[autocomplete] Could not load scale names from Tonal:', e);
+}
+
 const jsdocCompletions = jsdoc.docs
   .filter((doc) => isValidDoc(doc) && !hasExcludedTags(doc))
   // https://codemirror.net/docs/ref/#autocomplete.Completion
@@ -85,18 +115,132 @@ const jsdocCompletions = jsdoc.docs
   }));
 
 export const strudelAutocomplete = (context) => {
-  const word = context.matchBefore(/\w*/);
-  if (word.from === word.to && !context.explicit) return null;
+  // --- Pitch names for scale key completion ---
+  // Ideally, these should be imported from packages/tonal/tonleiter.mjs
+  // but are duplicated here as they are not exported.
+  const pitchNames = [
+    'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
+    'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+  ];
+  
+  // Block fallback completions inside .scale("..."), even before the colon
+  let scalePreColonContext = context.matchBefore(/\.scale\(\s*['"][^'"]*$/);
+  if (scalePreColonContext) {
+    // Only yield completions if a colon is present (handled below)
+    if (!scalePreColonContext.text.includes(':')) {
+      if (context.explicit) {
+        // Provide pitch completions on explicit request
+        // (Union of sharps and flats from tonleiter.mjs)
+        const text = scalePreColonContext.text;
+        const match = text.match(/([A-Ga-g][#b]*)?$/);
+        const fragment = match ? match[0] : '';
+        const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
+        const from = scalePreColonContext.to - fragment.length;
+        const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
+        return { from, options };
+      } else {
+        // Block fallback completions
+        return { from: scalePreColonContext.to, options: [] };
+      }
+    }
 
-  return {
-    from: word.from,
-    options: jsdocCompletions,
-    /*     options: [
-      { label: 'match', type: 'keyword' },
-      { label: 'hello', type: 'variable', info: '(World)' },
-      { label: 'magic', type: 'text', apply: '⠁⭒*.✩.*⭒⠁', detail: 'macro' },
-    ], */
-  };
+    // (second block removed, handled above)
+    if (!scalePreColonContext.text.includes(':')) {
+      return { from: scalePreColonContext.to, options: [] };
+    }
+  }
+  
+  // 1. Check for sound context: s("..."), sound("...")
+  // Trigger after at least one letter is typed after whitespace or bracket inside the quotes
+  let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
+  if (soundContext) {
+    const text = soundContext.text;
+    const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+    if (quoteIdx === -1) return null;
+    const inside = text.slice(quoteIdx + 1);
+    const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w]*)$/);
+    const fragment = fragMatch ? fragMatch[1] : inside;
+    if (!fragment || fragment.length === 0) return null;
+    const soundNames = Object.keys(soundMap.get()).sort();
+    const filteredSounds = soundNames.filter((name) => name.startsWith(fragment));
+    let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
+    const from = soundContext.to - fragment.length;
+    return {
+      from,
+      options,
+    };
+  }
+
+  let bankMatch = context.matchBefore(/bank\(\s*(['"])?([\w]*)$/);
+  if (bankMatch) {
+    let banks = bankCompletions();
+    console.log('[autocomplete] Bank context detected:', bankMatch.text);
+    console.log('[autocomplete] soundMap keys:', Object.keys(soundMap.get()));
+    console.log('[autocomplete] bankCompletions:', banks);
+    // Extract quote and fragment using regex groups on match.text
+    const groups = bankMatch.text.match(/(['"])?([\w]*)$/);
+    const quote = groups ? groups[1] : undefined;
+    const fragment = groups ? groups[2] || '' : '';
+    let from;
+    if (quote) {
+      from = bankMatch.from + bankMatch.text.indexOf(quote) + 1;
+    } else {
+      from = bankMatch.to - fragment.length;
+    }
+    const filteredBanks = banks.filter((b) => b.label.startsWith(fragment));
+    let options;
+    if (!quote) {
+      options = filteredBanks.map((b) => ({ ...b, apply: '"' + b.label + '"' }));
+    } else {
+      const afterCursor = context.state.sliceDoc(bankMatch.to, bankMatch.to + 1);
+      options = filteredBanks.map((b) => {
+        if (afterCursor !== quote) {
+          return { ...b, apply: b.label + quote };
+        }
+        return b;
+      });
+    }
+    return {
+      from,
+      options,
+    };
+  }
+
+  // 3. Check for scale context: .scale("..."), only after colon
+  let scaleContext = context.matchBefore(/\.scale\(\s*['"][^'"]*:[^'"]*$/);
+  if (scaleContext) {
+    // Find the last colon in the text
+    const text = scaleContext.text;
+    const colonIdx = text.lastIndexOf(':');
+    if (colonIdx === -1) return null;
+    // Get the fragment after the colon
+    const fragment = text.slice(colonIdx + 1);
+    // Filter scale completions by fragment
+    const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
+    // Insert colon-form (replace spaces with colons) for completions
+    const options = filteredScales.map((s) => ({
+      ...s,
+      apply: s.label.replace(/\s+/g, ':')
+    }));
+    const from = scaleContext.from + colonIdx + 1;
+    return {
+      from,
+      options,
+    };
+  }
+
+  // fallback: original logic
+  const word = context.matchBefore(/\w*/);
+  if (word && word.from === word.to && !context.explicit) return null;
+
+  if (word) {
+    console.log('[autocomplete] Default context:', word.text);
+    return {
+      from: word.from,
+      options: jsdocCompletions,
+    };
+  }
+  return null;
 };
 
 export const isAutoCompletionEnabled = (enabled) =>

From 0b67473bd3a7de3df71982b4bdc50d98bc41d3d6 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:59:26 +0100
Subject: [PATCH 09/21] refactor: modularize autocomplete context handlers
 using strategy array

---
 packages/codemirror/autocomplete.mjs | 68 ++++++++++++++++------------
 1 file changed, 38 insertions(+), 30 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index c1c7bb14e..591552cc7 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -114,23 +114,18 @@ const jsdocCompletions = jsdoc.docs
     type: 'function', // https://codemirror.net/docs/ref/#autocomplete.Completion.type
   }));
 
-export const strudelAutocomplete = (context) => {
-  // --- Pitch names for scale key completion ---
-  // Ideally, these should be imported from packages/tonal/tonleiter.mjs
-  // but are duplicated here as they are not exported.
-  const pitchNames = [
-    'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
-    'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
-  ];
-  
-  // Block fallback completions inside .scale("..."), even before the colon
+
+// --- Handler functions for each context ---
+const pitchNames = [
+  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
+  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+];
+
+function scalePreColonHandler(context) {
   let scalePreColonContext = context.matchBefore(/\.scale\(\s*['"][^'"]*$/);
   if (scalePreColonContext) {
-    // Only yield completions if a colon is present (handled below)
     if (!scalePreColonContext.text.includes(':')) {
       if (context.explicit) {
-        // Provide pitch completions on explicit request
-        // (Union of sharps and flats from tonleiter.mjs)
         const text = scalePreColonContext.text;
         const match = text.match(/([A-Ga-g][#b]*)?$/);
         const fragment = match ? match[0] : '';
@@ -139,19 +134,17 @@ export const strudelAutocomplete = (context) => {
         const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
         return { from, options };
       } else {
-        // Block fallback completions
         return { from: scalePreColonContext.to, options: [] };
       }
     }
-
-    // (second block removed, handled above)
     if (!scalePreColonContext.text.includes(':')) {
       return { from: scalePreColonContext.to, options: [] };
     }
   }
-  
-  // 1. Check for sound context: s("..."), sound("...")
-  // Trigger after at least one letter is typed after whitespace or bracket inside the quotes
+  return null;
+}
+
+function soundHandler(context) {
   let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
   if (soundContext) {
     const text = soundContext.text;
@@ -170,13 +163,13 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
+function bankHandler(context) {
   let bankMatch = context.matchBefore(/bank\(\s*(['"])?([\w]*)$/);
   if (bankMatch) {
     let banks = bankCompletions();
-    console.log('[autocomplete] Bank context detected:', bankMatch.text);
-    console.log('[autocomplete] soundMap keys:', Object.keys(soundMap.get()));
-    console.log('[autocomplete] bankCompletions:', banks);
     // Extract quote and fragment using regex groups on match.text
     const groups = bankMatch.text.match(/(['"])?([\w]*)$/);
     const quote = groups ? groups[1] : undefined;
@@ -205,19 +198,17 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
-  // 3. Check for scale context: .scale("..."), only after colon
+function scaleAfterColonHandler(context) {
   let scaleContext = context.matchBefore(/\.scale\(\s*['"][^'"]*:[^'"]*$/);
   if (scaleContext) {
-    // Find the last colon in the text
     const text = scaleContext.text;
     const colonIdx = text.lastIndexOf(':');
     if (colonIdx === -1) return null;
-    // Get the fragment after the colon
     const fragment = text.slice(colonIdx + 1);
-    // Filter scale completions by fragment
     const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
-    // Insert colon-form (replace spaces with colons) for completions
     const options = filteredScales.map((s) => ({
       ...s,
       apply: s.label.replace(/\s+/g, ':')
@@ -228,19 +219,36 @@ export const strudelAutocomplete = (context) => {
       options,
     };
   }
+  return null;
+}
 
-  // fallback: original logic
+function fallbackHandler(context) {
   const word = context.matchBefore(/\w*/);
   if (word && word.from === word.to && !context.explicit) return null;
-
   if (word) {
-    console.log('[autocomplete] Default context:', word.text);
     return {
       from: word.from,
       options: jsdocCompletions,
     };
   }
   return null;
+}
+
+const handlers = [
+  scalePreColonHandler,
+  soundHandler,
+  bankHandler,
+  scaleAfterColonHandler,
+  // this handler *must* be last
+  fallbackHandler
+];
+
+export const strudelAutocomplete = (context) => {
+  for (const handler of handlers) {
+    const result = handler(context);
+    if (result) return result;
+  }
+  return null;
 };
 
 export const isAutoCompletionEnabled = (enabled) =>

From 6b6d4b86a6a09d24484013a2f23b38f7269d1436 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 18:59:50 +0100
Subject: [PATCH 10/21] refactor: modularize autocomplete context handlers
 using strategy array


From 90614612e24673bab8ea0dd4eef00381c47c1a10 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 19:00:05 +0100
Subject: [PATCH 11/21] feat: add E# and B# to pitchNames for complete
 enharmonic coverage

---
 packages/codemirror/autocomplete.mjs | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 591552cc7..5d6c7233d 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -117,8 +117,8 @@ const jsdocCompletions = jsdoc.docs
 
 // --- Handler functions for each context ---
 const pitchNames = [
-  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'Fb', 'F', 'F#', 'Gb',
-  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'Cb'
+  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'E#', 'Fb', 'F', 'F#', 'Gb',
+  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'B#', 'Cb'
 ];
 
 function scalePreColonHandler(context) {

From ed182d4b3f2e118d4d56df2a141b6200043020dd Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 19:01:22 +0100
Subject: [PATCH 12/21] Updated the codemirror packages to be able to access
 additional imports.

---
 packages/codemirror/package.json | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/codemirror/package.json b/packages/codemirror/package.json
index 803b33f3d..bb1059f11 100644
--- a/packages/codemirror/package.json
+++ b/packages/codemirror/package.json
@@ -47,6 +47,8 @@
     "@strudel/core": "workspace:*",
     "@strudel/draw": "workspace:*",
     "@strudel/transpiler": "workspace:*",
+    "@tonaljs/tonal": "^4.10.0",
+    "superdough": "workspace:*",
     "nanostores": "^0.11.3"
   },
   "devDependencies": {

From cd659ac2a1eeccfc65ccd82d8a8c5a51129404c2 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Thu, 11 Sep 2025 21:37:35 +0100
Subject: [PATCH 13/21] feat: sound autocomplete matches anywhere in name using
 includes()

---
 packages/codemirror/autocomplete.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 5d6c7233d..110a9165a 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -155,7 +155,7 @@ function soundHandler(context) {
     const fragment = fragMatch ? fragMatch[1] : inside;
     if (!fragment || fragment.length === 0) return null;
     const soundNames = Object.keys(soundMap.get()).sort();
-    const filteredSounds = soundNames.filter((name) => name.startsWith(fragment));
+  const filteredSounds = soundNames.filter((name) => name.includes(fragment));
     let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
     const from = soundContext.to - fragment.length;
     return {

From 39460eb1005529dbc2d81d2eec92c92cb0a9b364 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Fri, 12 Sep 2025 12:11:36 +0100
Subject: [PATCH 14/21] Commiting lockfile.

---
 pnpm-lock.yaml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c225057f3..d67f42d28 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -215,9 +215,15 @@ importers:
       '@strudel/transpiler':
         specifier: workspace:*
         version: link:../transpiler
+      '@tonaljs/tonal':
+        specifier: ^4.10.0
+        version: 4.10.0
       nanostores:
         specifier: ^0.11.3
         version: 0.11.3
+      superdough:
+        specifier: workspace:*
+        version: link:../superdough
     devDependencies:
       vite:
         specifier: ^6.0.11

From 1670aebad80a5dc398317e0f70d5a20b37d27049 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Sat, 13 Sep 2025 21:35:28 +0100
Subject: [PATCH 15/21] Updated the gitignore rules for vscode.

---
 .gitignore | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/.gitignore b/.gitignore
index 2be3ee698..7532adaf0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -45,6 +45,20 @@ tidal-drum-machines
 webaudiofontdata
 src-tauri/target
 
+
+
+### BEGIN Visual Studio Code ###
+# Blanket, recursive exclude for .vscode directory and files
+.vscode/**/*
+# Unexclude specific files and directories within .vscode
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+### END Visual Studio Code ###
+
+
+
 # BEGIN JetBrains -> END JetBrains
 
 # for JetBrains IDE users, e.g. WebStorm. Source: https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore

From c8875b29c1ca1ff55d4bb74cc304a3a435e83112 Mon Sep 17 00:00:00 2001
From: drdozer <turingatemyhamster@gmail.com>
Date: Mon, 15 Sep 2025 14:27:59 +0100
Subject: [PATCH 16/21] Improve autocompletion behavior

- Refactored handlers to use consistent early return pattern for better readability
- Added blocking behavior for unquoted contexts (sound(, scale(, bank()) to guide users toward correct syntax instead of showing irrelevant fallback completions
- Fixed soundHandler to show all sounds when fragment is empty (e.g., sound(""))
- Simplified bankHandler by removing complex quote handling logic in favor of consistent blocking pattern
- Made scale handler regex patterns consistent (removed leading dots)
- All handlers now follow same structure: block unquoted contexts, provide completions for quoted contexts
---
 packages/codemirror/autocomplete.mjs | 176 +++++++++++++++------------
 1 file changed, 99 insertions(+), 77 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 2d53fe613..b5fb2f1fe 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -1,12 +1,9 @@
-
 import jsdoc from '../../doc.json';
 import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
 import { Scale } from '@tonaljs/tonal';
 import { soundMap } from 'superdough';
 
-
-
 const escapeHtml = (str) => {
   const div = document.createElement('div');
   div.innerText = str;
@@ -80,7 +77,6 @@ const isValidDoc = (doc) => {
 const hasExcludedTags = (doc) =>
   ['superdirtOnly', 'noAutocomplete'].some((tag) => doc.tags?.find((t) => t.originalTitle === tag));
 
-
 export function bankCompletions() {
   const soundDict = soundMap.get();
   const banks = new Set();
@@ -88,10 +84,11 @@ export function bankCompletions() {
     const [bank, suffix] = key.split('_');
     if (suffix && bank) banks.add(bank);
   }
-  return Array.from(banks).sort().map((name) => ({ label: name, type: 'bank' }));
+  return Array.from(banks)
+    .sort()
+    .map((name) => ({ label: name, type: 'bank' }));
 }
 
-
 // Attempt to get all scale names from Tonal
 let scaleCompletions = [];
 try {
@@ -138,15 +135,43 @@ const jsdocCompletions = (() => {
   return completions;
 })();
 
-
 // --- Handler functions for each context ---
 const pitchNames = [
-  'C', 'C#', 'Db', 'D', 'D#', 'Eb', 'E', 'E#', 'Fb', 'F', 'F#', 'Gb',
-  'G', 'G#', 'Ab', 'A', 'A#', 'Bb', 'B', 'B#', 'Cb'
+  'C',
+  'C#',
+  'Db',
+  'D',
+  'D#',
+  'Eb',
+  'E',
+  'E#',
+  'Fb',
+  'F',
+  'F#',
+  'Gb',
+  'G',
+  'G#',
+  'Ab',
+  'A',
+  'A#',
+  'Bb',
+  'B',
+  'B#',
+  'Cb',
 ];
 
 function scalePreColonHandler(context) {
-  let scalePreColonContext = context.matchBefore(/\.scale\(\s*['"][^'"]*$/);
+  // First check for scale context without quotes - block with empty completions
+  let scaleNoQuotesContext = context.matchBefore(/scale\(\s*$/);
+  if (scaleNoQuotesContext) {
+    return {
+      from: scaleNoQuotesContext.to,
+      options: [],
+    };
+  }
+
+  // Then check for scale context with quotes - provide completions
+  let scalePreColonContext = context.matchBefore(/scale\(\s*['"][^'"]*$/);
   if (scalePreColonContext) {
     if (!scalePreColonContext.text.includes(':')) {
       if (context.explicit) {
@@ -161,89 +186,86 @@ function scalePreColonHandler(context) {
         return { from: scalePreColonContext.to, options: [] };
       }
     }
-    if (!scalePreColonContext.text.includes(':')) {
-      return { from: scalePreColonContext.to, options: [] };
-    }
   }
   return null;
 }
 
 function soundHandler(context) {
-  let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
-  if (soundContext) {
-    const text = soundContext.text;
-    const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
-    if (quoteIdx === -1) return null;
-    const inside = text.slice(quoteIdx + 1);
-    const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w]*)$/);
-    const fragment = fragMatch ? fragMatch[1] : inside;
-    if (!fragment || fragment.length === 0) return null;
-    const soundNames = Object.keys(soundMap.get()).sort();
-  const filteredSounds = soundNames.filter((name) => name.includes(fragment));
-    let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
-    const from = soundContext.to - fragment.length;
+  // First check for sound context without quotes - block with empty completions
+  let soundNoQuotesContext = context.matchBefore(/(s|sound)\(\s*$/);
+  if (soundNoQuotesContext) {
     return {
-      from,
-      options,
+      from: soundNoQuotesContext.to,
+      options: [],
     };
   }
-  return null;
+
+  // Then check for sound context with quotes - provide completions
+  let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
+  if (!soundContext) return null;
+
+  const text = soundContext.text;
+  const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+  if (quoteIdx === -1) return null;
+  const inside = text.slice(quoteIdx + 1);
+  const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w]*)$/);
+  const fragment = fragMatch ? fragMatch[1] : inside;
+  const soundNames = Object.keys(soundMap.get()).sort();
+  const filteredSounds = soundNames.filter((name) => name.includes(fragment));
+  let options = filteredSounds.map((name) => ({ label: name, type: 'sound' }));
+  const from = soundContext.to - fragment.length;
+  return {
+    from,
+    options,
+  };
 }
 
 function bankHandler(context) {
-  let bankMatch = context.matchBefore(/bank\(\s*(['"])?([\w]*)$/);
-  if (bankMatch) {
-    let banks = bankCompletions();
-    // Extract quote and fragment using regex groups on match.text
-    const groups = bankMatch.text.match(/(['"])?([\w]*)$/);
-    const quote = groups ? groups[1] : undefined;
-    const fragment = groups ? groups[2] || '' : '';
-    let from;
-    if (quote) {
-      from = bankMatch.from + bankMatch.text.indexOf(quote) + 1;
-    } else {
-      from = bankMatch.to - fragment.length;
-    }
-    const filteredBanks = banks.filter((b) => b.label.startsWith(fragment));
-    let options;
-    if (!quote) {
-      options = filteredBanks.map((b) => ({ ...b, apply: '"' + b.label + '"' }));
-    } else {
-      const afterCursor = context.state.sliceDoc(bankMatch.to, bankMatch.to + 1);
-      options = filteredBanks.map((b) => {
-        if (afterCursor !== quote) {
-          return { ...b, apply: b.label + quote };
-        }
-        return b;
-      });
-    }
+  // First check for bank context without quotes - block with empty completions
+  let bankNoQuotesContext = context.matchBefore(/bank\(\s*$/);
+  if (bankNoQuotesContext) {
     return {
-      from,
-      options,
+      from: bankNoQuotesContext.to,
+      options: [],
     };
   }
-  return null;
+
+  // Then check for bank context with quotes - provide completions
+  let bankMatch = context.matchBefore(/bank\(\s*['"][^'"]*$/);
+  if (!bankMatch) return null;
+
+  const text = bankMatch.text;
+  const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+  if (quoteIdx === -1) return null;
+  const inside = text.slice(quoteIdx + 1);
+  const fragment = inside;
+  let banks = bankCompletions();
+  const filteredBanks = banks.filter((b) => b.label.startsWith(fragment));
+  const from = bankMatch.to - fragment.length;
+  return {
+    from,
+    options: filteredBanks,
+  };
 }
 
 function scaleAfterColonHandler(context) {
-  let scaleContext = context.matchBefore(/\.scale\(\s*['"][^'"]*:[^'"]*$/);
-  if (scaleContext) {
-    const text = scaleContext.text;
-    const colonIdx = text.lastIndexOf(':');
-    if (colonIdx === -1) return null;
-    const fragment = text.slice(colonIdx + 1);
-    const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
-    const options = filteredScales.map((s) => ({
-      ...s,
-      apply: s.label.replace(/\s+/g, ':')
-    }));
-    const from = scaleContext.from + colonIdx + 1;
-    return {
-      from,
-      options,
-    };
-  }
-  return null;
+  let scaleContext = context.matchBefore(/scale\(\s*['"][^'"]*:[^'"]*$/);
+  if (!scaleContext) return null;
+
+  const text = scaleContext.text;
+  const colonIdx = text.lastIndexOf(':');
+  if (colonIdx === -1) return null;
+  const fragment = text.slice(colonIdx + 1);
+  const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
+  const options = filteredScales.map((s) => ({
+    ...s,
+    apply: s.label.replace(/\s+/g, ':'),
+  }));
+  const from = scaleContext.from + colonIdx + 1;
+  return {
+    from,
+    options,
+  };
 }
 
 function fallbackHandler(context) {
@@ -264,7 +286,7 @@ const handlers = [
   bankHandler,
   scaleAfterColonHandler,
   // this handler *must* be last
-  fallbackHandler
+  fallbackHandler,
 ];
 
 export const strudelAutocomplete = (context) => {

From cb011c8bb0b4187938aa03f264fccc4569ddffdc Mon Sep 17 00:00:00 2001
From: Matthew Pocock <turingatemyhamster@gmail.com>
Date: Mon, 15 Sep 2025 18:44:30 +0100
Subject: [PATCH 17/21] Add autocomplete for mode function

- Added modePreColonHandler for autocomplete of mode values (below, above, duck, root)
- Added modeAfterColonHandler for pitch name completion after colon in mode:anchor syntax
- Follows same pattern as sound/bank/scale handlers for complex expressions
- Supports expressions like '<above [below root]>' with proper fragment matching
- Uses regex pattern (?:[\s\[\{\()<])([\w:]*)$ to handle delimited expressions
---
 packages/codemirror/autocomplete.mjs | 57 ++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index b5fb2f1fe..71b371e6c 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -97,6 +97,14 @@ try {
   console.warn('[autocomplete] Could not load scale names from Tonal:', e);
 }
 
+// Valid mode values for voicing
+const modeCompletions = [
+  { label: 'below', type: 'mode' },
+  { label: 'above', type: 'mode' },
+  { label: 'duck', type: 'mode' },
+  { label: 'root', type: 'mode' },
+];
+
 export const getSynonymDoc = (doc, synonym) => {
   const synonyms = doc.synonyms || [];
   const docLabel = getDocLabel(doc);
@@ -248,6 +256,53 @@ function bankHandler(context) {
   };
 }
 
+function modePreColonHandler(context) {
+  // First check for mode context without quotes - block with empty completions
+  let modeNoQuotesContext = context.matchBefore(/mode\(\s*$/);
+  if (modeNoQuotesContext) {
+    return {
+      from: modeNoQuotesContext.to,
+      options: [],
+    };
+  }
+
+  // Then check for mode context with quotes - provide completions
+  let modeContext = context.matchBefore(/mode\(\s*['"][^'"]*$/);
+  if (!modeContext) return null;
+
+  const text = modeContext.text;
+  const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+  if (quoteIdx === -1) return null;
+  const inside = text.slice(quoteIdx + 1);
+  const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w:]*)$/);
+  const fragment = fragMatch ? fragMatch[1] : inside;
+  const filteredModes = modeCompletions.filter((m) => m.label.startsWith(fragment));
+  const from = modeContext.to - fragment.length;
+  return {
+    from,
+    options: filteredModes,
+  };
+}
+
+function modeAfterColonHandler(context) {
+  let modeContext = context.matchBefore(/mode\(\s*['"][^'"]*:[^'"]*$/);
+  if (!modeContext) return null;
+
+  const text = modeContext.text;
+  const colonIdx = text.lastIndexOf(':');
+  if (colonIdx === -1) return null;
+  const fragment = text.slice(colonIdx + 1);
+
+  // For anchor after colon, we can suggest pitch names
+  const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
+  const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
+  const from = modeContext.from + colonIdx + 1;
+  return {
+    from,
+    options,
+  };
+}
+
 function scaleAfterColonHandler(context) {
   let scaleContext = context.matchBefore(/scale\(\s*['"][^'"]*:[^'"]*$/);
   if (!scaleContext) return null;
@@ -284,7 +339,9 @@ const handlers = [
   scalePreColonHandler,
   soundHandler,
   bankHandler,
+  modePreColonHandler,
   scaleAfterColonHandler,
+  modeAfterColonHandler,
   // this handler *must* be last
   fallbackHandler,
 ];

From 6ebe84e09629bae580ecafa595ea171f34be9cf1 Mon Sep 17 00:00:00 2001
From: Matthew Pocock <turingatemyhamster@gmail.com>
Date: Mon, 15 Sep 2025 21:34:15 +0100
Subject: [PATCH 18/21] Added completion for chord.

---
 packages/codemirror/autocomplete.mjs | 81 ++++++++++++++++++++++++++--
 1 file changed, 78 insertions(+), 3 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 71b371e6c..142c5f267 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -3,6 +3,7 @@ import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
 import { Scale } from '@tonaljs/tonal';
 import { soundMap } from 'superdough';
+import { complex } from '../tonal/ireal.mjs';
 
 const escapeHtml = (str) => {
   const div = document.createElement('div');
@@ -105,6 +106,23 @@ const modeCompletions = [
   { label: 'root', type: 'mode' },
 ];
 
+// Valid chord symbols from ireal dictionary plus empty string for major triads
+const chordSymbols = ['', ...Object.keys(complex)].sort();
+const chordSymbolCompletions = chordSymbols.map((symbol) => {
+  if (symbol === '') {
+    return {
+      label: 'major',
+      apply: '',
+      type: 'chord-symbol',
+    };
+  }
+  return {
+    label: symbol,
+    apply: symbol,
+    type: 'chord-symbol',
+  };
+});
+
 export const getSynonymDoc = (doc, synonym) => {
   const synonyms = doc.synonyms || [];
   const docLabel = getDocLabel(doc);
@@ -216,7 +234,7 @@ function soundHandler(context) {
   const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
   if (quoteIdx === -1) return null;
   const inside = text.slice(quoteIdx + 1);
-  const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w]*)$/);
+  const fragMatch = inside.match(/(?:[\s[{(<])([\w]*)$/);
   const fragment = fragMatch ? fragMatch[1] : inside;
   const soundNames = Object.keys(soundMap.get()).sort();
   const filteredSounds = soundNames.filter((name) => name.includes(fragment));
@@ -274,7 +292,7 @@ function modePreColonHandler(context) {
   const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
   if (quoteIdx === -1) return null;
   const inside = text.slice(quoteIdx + 1);
-  const fragMatch = inside.match(/(?:[\s\[\{\(<])([\w:]*)$/);
+  const fragMatch = inside.match(/(?:[\s[{(<])([\w:]*)$/);
   const fragment = fragMatch ? fragMatch[1] : inside;
   const filteredModes = modeCompletions.filter((m) => m.label.startsWith(fragment));
   const from = modeContext.to - fragment.length;
@@ -303,6 +321,60 @@ function modeAfterColonHandler(context) {
   };
 }
 
+function chordHandler(context) {
+  // First check for chord context without quotes - block with empty completions
+  let chordNoQuotesContext = context.matchBefore(/chord\(\s*$/);
+  if (chordNoQuotesContext) {
+    return {
+      from: chordNoQuotesContext.to,
+      options: [],
+    };
+  }
+
+  // Then check for chord context with quotes - provide completions
+  let chordContext = context.matchBefore(/chord\(\s*['"][^'"]*$/);
+  if (!chordContext) return null;
+
+  const text = chordContext.text;
+  const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
+  if (quoteIdx === -1) return null;
+  const inside = text.slice(quoteIdx + 1);
+
+  // Use same fragment matching as sound/mode for expressions like "<G Am>"
+  const fragMatch = inside.match(/(?:[\s[{(<])([\w#b+^:-]*)$/);
+  const fragment = fragMatch ? fragMatch[1] : inside;
+
+  // Check if fragment contains any pitch name at start (for root + symbol)
+  let rootMatch = null;
+  let symbolFragment = fragment;
+  for (const pitch of pitchNames) {
+    if (fragment.toLowerCase().startsWith(pitch.toLowerCase())) {
+      rootMatch = pitch;
+      symbolFragment = fragment.slice(pitch.length);
+      break;
+    }
+  }
+
+  if (rootMatch) {
+    // We have a root, now complete chord symbols
+    const filteredSymbols = chordSymbolCompletions.filter((s) =>
+      s.label.toLowerCase().startsWith(symbolFragment.toLowerCase()),
+    );
+
+    // Create completions that replace the entire chord, not just the symbol part
+    const options = filteredSymbols;
+
+    const from = chordContext.to - symbolFragment.length;
+    return { from, options };
+  } else {
+    // No root yet, complete with pitch names
+    const filteredPitches = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
+    const options = filteredPitches.map((p) => ({ label: p, type: 'pitch' }));
+    const from = chordContext.to - fragment.length;
+    return { from, options };
+  }
+}
+
 function scaleAfterColonHandler(context) {
   let scaleContext = context.matchBefore(/scale\(\s*['"][^'"]*:[^'"]*$/);
   if (!scaleContext) return null;
@@ -339,6 +411,7 @@ const handlers = [
   scalePreColonHandler,
   soundHandler,
   bankHandler,
+  chordHandler,
   modePreColonHandler,
   scaleAfterColonHandler,
   modeAfterColonHandler,
@@ -349,7 +422,9 @@ const handlers = [
 export const strudelAutocomplete = (context) => {
   for (const handler of handlers) {
     const result = handler(context);
-    if (result) return result;
+    if (result) {
+      return result;
+    }
   }
   return null;
 };

From edb6c0db2e0c9088db7f3b3c1240f63c07962127 Mon Sep 17 00:00:00 2001
From: Matthew Pocock <turingatemyhamster@gmail.com>
Date: Tue, 16 Sep 2025 14:45:22 +0100
Subject: [PATCH 19/21] Reordered handlers to be a bit more organised.

---
 packages/codemirror/autocomplete.mjs | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 142c5f267..8b3111b51 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -408,12 +408,12 @@ function fallbackHandler(context) {
 }
 
 const handlers = [
-  scalePreColonHandler,
   soundHandler,
   bankHandler,
   chordHandler,
-  modePreColonHandler,
+  scalePreColonHandler,
   scaleAfterColonHandler,
+  modePreColonHandler,
   modeAfterColonHandler,
   // this handler *must* be last
   fallbackHandler,

From 7080490c68839226705b9df0acc14aebb1f8f4e8 Mon Sep 17 00:00:00 2001
From: Matthew Pocock <turingatemyhamster@gmail.com>
Date: Thu, 18 Sep 2025 21:52:40 +0100
Subject: [PATCH 20/21] Merge handlers and cache regexes in autocomplete

- Merged scalePreColonHandler and scaleAfterColonHandler into single scaleHandler
- Merged modePreColonHandler and modeAfterColonHandler into single modeHandler
- Cached all regex patterns as constants above their respective handler functions
- Eliminated regex compilation overhead on every keystroke/navigation event
- Improved code maintainability by reducing duplication between similar handlers
- Preserved exact same functionality while improving performance

Each handler now follows a consistent pattern of checking after-colon context
first (more specific) then pre-colon context, with all regex patterns
pre-compiled for better performance during intensive autocomplete sessions.
---
 packages/codemirror/autocomplete.mjs | 147 ++++++++++++++++-----------
 1 file changed, 87 insertions(+), 60 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 8b3111b51..022c3bbaf 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -186,9 +186,16 @@ const pitchNames = [
   'Cb',
 ];
 
-function scalePreColonHandler(context) {
+// Cached regex patterns for scaleHandler
+const SCALE_NO_QUOTES_REGEX = /scale\(\s*$/;
+const SCALE_AFTER_COLON_REGEX = /scale\(\s*['"][^'"]*:[^'"]*$/;
+const SCALE_PRE_COLON_REGEX = /scale\(\s*['"][^'"]*$/;
+const SCALE_PITCH_MATCH_REGEX = /([A-Ga-g][#b]*)?$/;
+const SCALE_SPACES_TO_COLON_REGEX = /\s+/g;
+
+function scaleHandler(context) {
   // First check for scale context without quotes - block with empty completions
-  let scaleNoQuotesContext = context.matchBefore(/scale\(\s*$/);
+  let scaleNoQuotesContext = context.matchBefore(SCALE_NO_QUOTES_REGEX);
   if (scaleNoQuotesContext) {
     return {
       from: scaleNoQuotesContext.to,
@@ -196,13 +203,33 @@ function scalePreColonHandler(context) {
     };
   }
 
-  // Then check for scale context with quotes - provide completions
-  let scalePreColonContext = context.matchBefore(/scale\(\s*['"][^'"]*$/);
+  // Check for after-colon context first (more specific)
+  let scaleAfterColonContext = context.matchBefore(SCALE_AFTER_COLON_REGEX);
+  if (scaleAfterColonContext) {
+    const text = scaleAfterColonContext.text;
+    const colonIdx = text.lastIndexOf(':');
+    if (colonIdx !== -1) {
+      const fragment = text.slice(colonIdx + 1);
+      const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
+      const options = filteredScales.map((s) => ({
+        ...s,
+        apply: s.label.replace(SCALE_SPACES_TO_COLON_REGEX, ':'),
+      }));
+      const from = scaleAfterColonContext.from + colonIdx + 1;
+      return {
+        from,
+        options,
+      };
+    }
+  }
+
+  // Then check for pre-colon context
+  let scalePreColonContext = context.matchBefore(SCALE_PRE_COLON_REGEX);
   if (scalePreColonContext) {
     if (!scalePreColonContext.text.includes(':')) {
       if (context.explicit) {
         const text = scalePreColonContext.text;
-        const match = text.match(/([A-Ga-g][#b]*)?$/);
+        const match = text.match(SCALE_PITCH_MATCH_REGEX);
         const fragment = match ? match[0] : '';
         const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
         const from = scalePreColonContext.to - fragment.length;
@@ -216,9 +243,14 @@ function scalePreColonHandler(context) {
   return null;
 }
 
+// Cached regex patterns for soundHandler
+const SOUND_NO_QUOTES_REGEX = /(s|sound)\(\s*$/;
+const SOUND_WITH_QUOTES_REGEX = /(s|sound)\(\s*['"][^'"]*$/;
+const SOUND_FRAGMENT_MATCH_REGEX = /(?:[\s[{(<])([\w]*)$/;
+
 function soundHandler(context) {
   // First check for sound context without quotes - block with empty completions
-  let soundNoQuotesContext = context.matchBefore(/(s|sound)\(\s*$/);
+  let soundNoQuotesContext = context.matchBefore(SOUND_NO_QUOTES_REGEX);
   if (soundNoQuotesContext) {
     return {
       from: soundNoQuotesContext.to,
@@ -227,14 +259,14 @@ function soundHandler(context) {
   }
 
   // Then check for sound context with quotes - provide completions
-  let soundContext = context.matchBefore(/(s|sound)\(\s*['"][^'"]*$/);
+  let soundContext = context.matchBefore(SOUND_WITH_QUOTES_REGEX);
   if (!soundContext) return null;
 
   const text = soundContext.text;
   const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
   if (quoteIdx === -1) return null;
   const inside = text.slice(quoteIdx + 1);
-  const fragMatch = inside.match(/(?:[\s[{(<])([\w]*)$/);
+  const fragMatch = inside.match(SOUND_FRAGMENT_MATCH_REGEX);
   const fragment = fragMatch ? fragMatch[1] : inside;
   const soundNames = Object.keys(soundMap.get()).sort();
   const filteredSounds = soundNames.filter((name) => name.includes(fragment));
@@ -246,9 +278,13 @@ function soundHandler(context) {
   };
 }
 
+// Cached regex patterns for bankHandler
+const BANK_NO_QUOTES_REGEX = /bank\(\s*$/;
+const BANK_WITH_QUOTES_REGEX = /bank\(\s*['"][^'"]*$/;
+
 function bankHandler(context) {
   // First check for bank context without quotes - block with empty completions
-  let bankNoQuotesContext = context.matchBefore(/bank\(\s*$/);
+  let bankNoQuotesContext = context.matchBefore(BANK_NO_QUOTES_REGEX);
   if (bankNoQuotesContext) {
     return {
       from: bankNoQuotesContext.to,
@@ -257,7 +293,7 @@ function bankHandler(context) {
   }
 
   // Then check for bank context with quotes - provide completions
-  let bankMatch = context.matchBefore(/bank\(\s*['"][^'"]*$/);
+  let bankMatch = context.matchBefore(BANK_WITH_QUOTES_REGEX);
   if (!bankMatch) return null;
 
   const text = bankMatch.text;
@@ -274,9 +310,15 @@ function bankHandler(context) {
   };
 }
 
-function modePreColonHandler(context) {
+// Cached regex patterns for modeHandler
+const MODE_NO_QUOTES_REGEX = /mode\(\s*$/;
+const MODE_AFTER_COLON_REGEX = /mode\(\s*['"][^'"]*:[^'"]*$/;
+const MODE_PRE_COLON_REGEX = /mode\(\s*['"][^'"]*$/;
+const MODE_FRAGMENT_MATCH_REGEX = /(?:[\s[{(<])([\w:]*)$/;
+
+function modeHandler(context) {
   // First check for mode context without quotes - block with empty completions
-  let modeNoQuotesContext = context.matchBefore(/mode\(\s*$/);
+  let modeNoQuotesContext = context.matchBefore(MODE_NO_QUOTES_REGEX);
   if (modeNoQuotesContext) {
     return {
       from: modeNoQuotesContext.to,
@@ -284,15 +326,33 @@ function modePreColonHandler(context) {
     };
   }
 
-  // Then check for mode context with quotes - provide completions
-  let modeContext = context.matchBefore(/mode\(\s*['"][^'"]*$/);
+  // Check for after-colon context first (more specific)
+  let modeAfterColonContext = context.matchBefore(MODE_AFTER_COLON_REGEX);
+  if (modeAfterColonContext) {
+    const text = modeAfterColonContext.text;
+    const colonIdx = text.lastIndexOf(':');
+    if (colonIdx !== -1) {
+      const fragment = text.slice(colonIdx + 1);
+      // For anchor after colon, we can suggest pitch names
+      const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
+      const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
+      const from = modeAfterColonContext.from + colonIdx + 1;
+      return {
+        from,
+        options,
+      };
+    }
+  }
+
+  // Then check for pre-colon context
+  let modeContext = context.matchBefore(MODE_PRE_COLON_REGEX);
   if (!modeContext) return null;
 
   const text = modeContext.text;
   const quoteIdx = Math.max(text.lastIndexOf('"'), text.lastIndexOf("'"));
   if (quoteIdx === -1) return null;
   const inside = text.slice(quoteIdx + 1);
-  const fragMatch = inside.match(/(?:[\s[{(<])([\w:]*)$/);
+  const fragMatch = inside.match(MODE_FRAGMENT_MATCH_REGEX);
   const fragment = fragMatch ? fragMatch[1] : inside;
   const filteredModes = modeCompletions.filter((m) => m.label.startsWith(fragment));
   const from = modeContext.to - fragment.length;
@@ -302,28 +362,14 @@ function modePreColonHandler(context) {
   };
 }
 
-function modeAfterColonHandler(context) {
-  let modeContext = context.matchBefore(/mode\(\s*['"][^'"]*:[^'"]*$/);
-  if (!modeContext) return null;
-
-  const text = modeContext.text;
-  const colonIdx = text.lastIndexOf(':');
-  if (colonIdx === -1) return null;
-  const fragment = text.slice(colonIdx + 1);
-
-  // For anchor after colon, we can suggest pitch names
-  const filtered = pitchNames.filter((p) => p.toLowerCase().startsWith(fragment.toLowerCase()));
-  const options = filtered.map((p) => ({ label: p, type: 'pitch' }));
-  const from = modeContext.from + colonIdx + 1;
-  return {
-    from,
-    options,
-  };
-}
+// Cached regex patterns for chordHandler
+const CHORD_NO_QUOTES_REGEX = /chord\(\s*$/;
+const CHORD_WITH_QUOTES_REGEX = /chord\(\s*['"][^'"]*$/;
+const CHORD_FRAGMENT_MATCH_REGEX = /(?:[\s[{(<])([\w#b+^:-]*)$/;
 
 function chordHandler(context) {
   // First check for chord context without quotes - block with empty completions
-  let chordNoQuotesContext = context.matchBefore(/chord\(\s*$/);
+  let chordNoQuotesContext = context.matchBefore(CHORD_NO_QUOTES_REGEX);
   if (chordNoQuotesContext) {
     return {
       from: chordNoQuotesContext.to,
@@ -332,7 +378,7 @@ function chordHandler(context) {
   }
 
   // Then check for chord context with quotes - provide completions
-  let chordContext = context.matchBefore(/chord\(\s*['"][^'"]*$/);
+  let chordContext = context.matchBefore(CHORD_WITH_QUOTES_REGEX);
   if (!chordContext) return null;
 
   const text = chordContext.text;
@@ -341,7 +387,7 @@ function chordHandler(context) {
   const inside = text.slice(quoteIdx + 1);
 
   // Use same fragment matching as sound/mode for expressions like "<G Am>"
-  const fragMatch = inside.match(/(?:[\s[{(<])([\w#b+^:-]*)$/);
+  const fragMatch = inside.match(CHORD_FRAGMENT_MATCH_REGEX);
   const fragment = fragMatch ? fragMatch[1] : inside;
 
   // Check if fragment contains any pitch name at start (for root + symbol)
@@ -375,28 +421,11 @@ function chordHandler(context) {
   }
 }
 
-function scaleAfterColonHandler(context) {
-  let scaleContext = context.matchBefore(/scale\(\s*['"][^'"]*:[^'"]*$/);
-  if (!scaleContext) return null;
-
-  const text = scaleContext.text;
-  const colonIdx = text.lastIndexOf(':');
-  if (colonIdx === -1) return null;
-  const fragment = text.slice(colonIdx + 1);
-  const filteredScales = scaleCompletions.filter((s) => s.label.startsWith(fragment));
-  const options = filteredScales.map((s) => ({
-    ...s,
-    apply: s.label.replace(/\s+/g, ':'),
-  }));
-  const from = scaleContext.from + colonIdx + 1;
-  return {
-    from,
-    options,
-  };
-}
+// Cached regex patterns for fallbackHandler
+const FALLBACK_WORD_REGEX = /\w*/;
 
 function fallbackHandler(context) {
-  const word = context.matchBefore(/\w*/);
+  const word = context.matchBefore(FALLBACK_WORD_REGEX);
   if (word && word.from === word.to && !context.explicit) return null;
   if (word) {
     return {
@@ -411,10 +440,8 @@ const handlers = [
   soundHandler,
   bankHandler,
   chordHandler,
-  scalePreColonHandler,
-  scaleAfterColonHandler,
-  modePreColonHandler,
-  modeAfterColonHandler,
+  scaleHandler,
+  modeHandler,
   // this handler *must* be last
   fallbackHandler,
 ];

From 105db2a4ca1c05c4f2dd072209b059676d717042 Mon Sep 17 00:00:00 2001
From: Felix Roos <flix91@gmail.com>
Date: Sat, 18 Oct 2025 08:49:31 +0200
Subject: [PATCH 21/21] fix: tonal import in autocomplete + add tonal to
 codemirror package dependencies

---
 packages/codemirror/autocomplete.mjs | 2 +-
 packages/codemirror/package.json     | 1 +
 packages/tonal/index.mjs             | 4 ++--
 pnpm-lock.yaml                       | 3 +++
 4 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/codemirror/autocomplete.mjs b/packages/codemirror/autocomplete.mjs
index 022c3bbaf..b8a569bea 100644
--- a/packages/codemirror/autocomplete.mjs
+++ b/packages/codemirror/autocomplete.mjs
@@ -3,7 +3,7 @@ import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
 import { Scale } from '@tonaljs/tonal';
 import { soundMap } from 'superdough';
-import { complex } from '../tonal/ireal.mjs';
+import { complex } from '@strudel/tonal';
 
 const escapeHtml = (str) => {
   const div = document.createElement('div');
diff --git a/packages/codemirror/package.json b/packages/codemirror/package.json
index bb1059f11..b4e7d27a8 100644
--- a/packages/codemirror/package.json
+++ b/packages/codemirror/package.json
@@ -46,6 +46,7 @@
     "@replit/codemirror-vscode-keymap": "^6.0.2",
     "@strudel/core": "workspace:*",
     "@strudel/draw": "workspace:*",
+    "@strudel/tonal": "workspace:*",
     "@strudel/transpiler": "workspace:*",
     "@tonaljs/tonal": "^4.10.0",
     "superdough": "workspace:*",
diff --git a/packages/tonal/index.mjs b/packages/tonal/index.mjs
index a3c0cba39..ebbcf0851 100644
--- a/packages/tonal/index.mjs
+++ b/packages/tonal/index.mjs
@@ -1,9 +1,9 @@
 import './tonal.mjs';
 import './voicings.mjs';
+import './ireal.mjs';
 
 export * from './tonal.mjs';
 export * from './voicings.mjs';
-
-import './ireal.mjs';
+export * from './ireal.mjs';
 
 export const packageName = '@strudel/tonal';
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d67f42d28..055bb4bc7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -212,6 +212,9 @@ importers:
       '@strudel/draw':
         specifier: workspace:*
         version: link:../draw
+      '@strudel/tonal':
+        specifier: workspace:*
+        version: link:../tonal
       '@strudel/transpiler':
         specifier: workspace:*
         version: link:../transpiler