@waveform-playlist/browser 14.0.0 → 15.1.0

package/dist/tone.js

@@ -68,12 +68,15 @@ var __async = (__this, __arguments, generator) => {
 var tone_exports = {};
 __export(tone_exports, {
   ExportWavButton: () => ExportWavButton,
+  WamEffectGui: () => WamEffectGui,
   createEffectChain: () => createEffectChain,
   createEffectInstance: () => createEffectInstance,
+  createWamEffectInstance: () => createWamEffectInstance,
   effectCategories: () => effectCategories,
   effectDefinitions: () => effectDefinitions,
   getEffectDefinition: () => getEffectDefinition,
   getEffectsByCategory: () => getEffectsByCategory,
+  loadWamModule: () => loadWamModule,
   useAudioTracks: () => useAudioTracks,
   useDynamicEffects: () => useDynamicEffects,
   useDynamicTracks: () => useDynamicTracks,
@@ -301,6 +304,7 @@ var useMasterAnalyser = (fftSize = 256) => {
 
 // src/hooks/useDynamicEffects.ts
 var import_react3 = require("react");
+var import_playout = require("@waveform-playlist/playout");
 
 // src/effects/effectDefinitions.ts
 var effectDefinitions = [
@@ -903,8 +907,7 @@ function createEffectInstance(definition, initialParams) {
         effect.dispose();
       } catch (e) {
         console.warn(
-          `[waveform-playlist] Error disposing effect "${definition.id}" (${instanceId}):`,
-          e
+          `[waveform-playlist] Error disposing effect "${definition.id}" (${instanceId}): ${e instanceof Error ? e.message : String(e)}`
         );
       }
     },
@@ -949,8 +952,7 @@ function createEffectInstance(definition, initialParams) {
         effect.disconnect();
       } catch (e) {
         console.warn(
-          `[waveform-playlist] Error disconnecting effect "${definition.id}" (${instanceId}):`,
-          e
+          `[waveform-playlist] Error disconnecting effect "${definition.id}" (${instanceId}): ${e instanceof Error ? e.message : String(e)}`
         );
       }
     }
@@ -961,7 +963,7 @@ function createEffectChain(effects) {
     throw new Error("Cannot create effect chain with no effects");
   }
   for (let i = 0; i < effects.length - 1; i++) {
-    effects[i].effect.connect(effects[i + 1].effect);
+    (0, import_tone2.connect)(effects[i].effect, effects[i + 1].effect);
   }
   return {
     input: effects[0].effect,
@@ -972,13 +974,105 @@ function createEffectChain(effects) {
   };
 }
 
-// src/hooks/useDynamicEffects.ts
+// src/effects/loadWam.ts
+function loadWamModule() {
+  return __async(this, null, function* () {
+    try {
+      return yield import("@dawcore/wam");
+    } catch (err) {
+      const detail = err instanceof Error ? err.message : String(err);
+      throw new Error(
+        "[waveform-playlist] WAM plugin support requires the optional '@dawcore/wam' package.\nInstall it with: npm install @dawcore/wam\nOriginal error: " + detail
+      );
+    }
+  });
+}
+
+// src/effects/wamEffectFactory.ts
 var import_tone3 = require("tone");
+var wamInstanceCounter = 0;
+function createWamEffectInstance(plugin) {
+  var _a, _b, _c;
+  const node = plugin.audioNode;
+  const instanceId = "wam_" + ++wamInstanceCounter;
+  return {
+    kind: "wam",
+    plugin,
+    url: plugin.url,
+    effect: node,
+    id: "wam:" + ((_c = (_b = (_a = plugin.descriptor) == null ? void 0 : _a.name) != null ? _b : plugin.url) != null ? _c : "plugin"),
+    instanceId,
+    dispose: () => {
+      try {
+        plugin.destroy();
+      } catch (err) {
+        console.warn(
+          "[waveform-playlist] Error destroying WAM plugin: " + (err instanceof Error ? err.message : String(err))
+        );
+      }
+    },
+    setParameter: (name, value) => {
+      var _a2;
+      if (typeof value !== "number") return;
+      const target = plugin.audioNode;
+      void ((_a2 = target.setParameterValues) == null ? void 0 : _a2.call(target, { [name]: { id: name, value, normalized: false } }));
+    },
+    getParameter: () => void 0,
+    // WAM params are async; read via the plugin GUI
+    connect: (destination) => (0, import_tone3.connect)(node, destination),
+    disconnect: () => (0, import_tone3.disconnect)(node)
+  };
+}
+
+// src/effects/offlineChain.ts
+var import_tone4 = require("tone");
+function buildOfflineChain(entries, getLivePlugin, rawContext) {
+  return __async(this, null, function* () {
+    const instances = [];
+    const dispose = () => {
+      instances.forEach((inst) => inst.dispose());
+    };
+    try {
+      for (const entry of entries) {
+        if (entry.kind === "native") {
+          instances.push(createEffectInstance(entry.definition, entry.params));
+          continue;
+        }
+        const livePlugin = getLivePlugin(entry.instanceId);
+        if (!livePlugin) {
+          throw new Error(
+            '[waveform-playlist] WAV export: no live WAM plugin found for "' + entry.definition.name + '" (' + entry.instanceId + ") \u2014 cannot re-instantiate it offline."
+          );
+        }
+        const wam = yield loadWamModule();
+        const { hostGroupId } = yield wam.ensureWamHost(rawContext);
+        const clone = yield wam.cloneInstanceInto(livePlugin, rawContext, hostGroupId);
+        instances.push(createWamEffectInstance(clone));
+      }
+    } catch (err) {
+      dispose();
+      throw err;
+    }
+    return { instances, dispose };
+  });
+}
+function connectOfflineChain(from, instances, to) {
+  let current = from;
+  for (const inst of instances) {
+    (0, import_tone4.connect)(current, inst.effect);
+    current = inst.effect;
+  }
+  (0, import_tone4.connect)(current, to);
+}
+
+// src/hooks/useDynamicEffects.ts
+var import_tone5 = require("tone");
 function useDynamicEffects(fftSize = 256) {
   const [activeEffects, setActiveEffects] = (0, import_react3.useState)([]);
   const activeEffectsRef = (0, import_react3.useRef)(activeEffects);
   activeEffectsRef.current = activeEffects;
   const effectInstancesRef = (0, import_react3.useRef)(/* @__PURE__ */ new Map());
+  const isMountedRef = (0, import_react3.useRef)(true);
   const analyserRef = (0, import_react3.useRef)(null);
   const graphNodesRef = (0, import_react3.useRef)(null);
   const rebuildChain = (0, import_react3.useCallback)((effects) => {
@@ -990,7 +1084,8 @@ function useDynamicEffects(fftSize = 256) {
     } catch (e) {
       console.warn("[waveform-playlist] Error disconnecting master effects chain:", e);
     }
-    const instances = effects.map((ae) => effectInstancesRef.current.get(ae.instanceId)).filter((inst) => inst !== void 0);
+    const audible = effects.filter((ae) => !(ae.kind === "wam" && ae.bypassed));
+    const instances = audible.map((ae) => effectInstancesRef.current.get(ae.instanceId)).filter((inst) => inst !== void 0);
     if (instances.length === 0) {
       masterGainNode.connect(analyserNode);
       analyserNode.connect(destination);
@@ -1002,10 +1097,10 @@ function useDynamicEffects(fftSize = 256) {
         } catch (e) {
           console.warn(`[waveform-playlist] Error disconnecting effect "${inst.id}":`, e);
         }
-        currentNode.connect(inst.effect);
+        (0, import_tone5.connect)(currentNode, inst.effect);
         currentNode = inst.effect;
       });
-      currentNode.connect(analyserNode);
+      (0, import_tone5.connect)(currentNode, analyserNode);
       analyserNode.connect(destination);
     }
   }, []);
@@ -1024,12 +1119,68 @@ function useDynamicEffects(fftSize = 256) {
     const newActiveEffect = {
       instanceId: instance.instanceId,
       effectId: definition.id,
+      kind: "native",
       definition,
       params,
       bypassed: false
     };
     setActiveEffects((prev) => [...prev, newActiveEffect]);
   }, []);
+  const addWamEffect = (0, import_react3.useCallback)((url, initialState) => __async(null, null, function* () {
+    var _a, _b;
+    if (!(0, import_playout.isNativeGlobalContext)()) {
+      throw new Error(
+        "[waveform-playlist] WAM plugins require a native AudioContext. Call configureGlobalContext({ nativeAudioContext: true }) from @waveform-playlist/playout before any audio initialization."
+      );
+    }
+    const wam = yield loadWamModule();
+    const ctx = (0, import_playout.getGlobalAudioContext)();
+    const { hostGroupId } = yield wam.ensureWamHost(ctx);
+    const plugin = yield wam.createWamInstance(
+      url,
+      ctx,
+      hostGroupId,
+      initialState !== void 0 ? { initialState } : void 0
+    );
+    if (!isMountedRef.current) {
+      try {
+        plugin.destroy();
+      } catch (err) {
+        console.warn(
+          "[waveform-playlist] Error destroying WAM plugin after unmount: " + (err instanceof Error ? err.message : String(err))
+        );
+      }
+      throw new Error(
+        "[waveform-playlist] addWamEffect aborted: hook unmounted before the plugin finished loading."
+      );
+    }
+    const instance = createWamEffectInstance(plugin);
+    effectInstancesRef.current.set(instance.instanceId, instance);
+    const definition = {
+      id: instance.id,
+      name: (_b = (_a = plugin.descriptor) == null ? void 0 : _a.name) != null ? _b : url,
+      category: "wam",
+      description: "WAM plugin",
+      parameters: []
+    };
+    setActiveEffects((prev) => [
+      ...prev,
+      {
+        instanceId: instance.instanceId,
+        effectId: instance.id,
+        kind: "wam",
+        url,
+        definition,
+        params: {},
+        bypassed: false
+      }
+    ]);
+    return instance.instanceId;
+  }), []);
+  const getWamPlugin = (0, import_react3.useCallback)((instanceId) => {
+    const inst = effectInstancesRef.current.get(instanceId);
+    return (inst == null ? void 0 : inst.kind) === "wam" ? inst.plugin : void 0;
+  }, []);
   const removeEffect = (0, import_react3.useCallback)((instanceId) => {
     const instance = effectInstancesRef.current.get(instanceId);
     if (instance) {
@@ -1057,6 +1208,12 @@ function useDynamicEffects(fftSize = 256) {
     const effect = activeEffectsRef.current.find((e) => e.instanceId === instanceId);
     if (!effect) return;
     const newBypassed = !effect.bypassed;
+    if (effect.kind === "wam") {
+      setActiveEffects(
+        (prev) => prev.map((e) => e.instanceId === instanceId ? __spreadProps(__spreadValues({}, e), { bypassed: newBypassed }) : e)
+      );
+      return;
+    }
     const instance = effectInstancesRef.current.get(instanceId);
     if (instance) {
       const originalWet = (_a = effect.params.wet) != null ? _a : 1;
@@ -1084,7 +1241,7 @@ function useDynamicEffects(fftSize = 256) {
   }, [activeEffects, rebuildChain]);
   const masterEffects = (0, import_react3.useCallback)(
     (masterGainNode, destination, _isOffline) => {
-      const analyserNode = new import_tone3.Analyser("fft", fftSize);
+      const analyserNode = new import_tone5.Analyser("fft", fftSize);
       analyserRef.current = analyserNode;
       graphNodesRef.current = {
         masterGainNode,
@@ -1092,17 +1249,18 @@ function useDynamicEffects(fftSize = 256) {
         analyserNode
       };
       const effects = activeEffectsRef.current;
-      const instances = effects.map((ae) => effectInstancesRef.current.get(ae.instanceId)).filter((inst) => inst !== void 0);
+      const audible = effects.filter((ae) => !(ae.kind === "wam" && ae.bypassed));
+      const instances = audible.map((ae) => effectInstancesRef.current.get(ae.instanceId)).filter((inst) => inst !== void 0);
       if (instances.length === 0) {
         masterGainNode.connect(analyserNode);
         analyserNode.connect(destination);
       } else {
         let currentNode = masterGainNode;
         instances.forEach((inst) => {
-          currentNode.connect(inst.effect);
+          (0, import_tone5.connect)(currentNode, inst.effect);
           currentNode = inst.effect;
         });
-        currentNode.connect(analyserNode);
+        (0, import_tone5.connect)(currentNode, analyserNode);
         analyserNode.connect(destination);
       }
       return function cleanup() {
@@ -1115,42 +1273,45 @@ function useDynamicEffects(fftSize = 256) {
     // Only fftSize - reads effects from ref
   );
   (0, import_react3.useEffect)(() => {
+    isMountedRef.current = true;
     const effectInstances = effectInstancesRef.current;
     return () => {
+      isMountedRef.current = false;
       effectInstances.forEach((inst) => inst.dispose());
       effectInstances.clear();
     };
   }, []);
   const createOfflineEffectsFunction = (0, import_react3.useCallback)(() => {
-    const nonBypassedEffects = activeEffects.filter((e) => !e.bypassed);
-    if (nonBypassedEffects.length === 0) {
+    const nonBypassed = activeEffects.filter((e) => !e.bypassed);
+    if (nonBypassed.length === 0) {
       return void 0;
     }
-    return (masterGainNode, destination, _isOffline) => {
-      const offlineInstances = [];
-      for (const activeEffect of nonBypassedEffects) {
-        const instance = createEffectInstance(activeEffect.definition, activeEffect.params);
-        offlineInstances.push(instance);
-      }
-      if (offlineInstances.length === 0) {
-        masterGainNode.connect(destination);
-      } else {
-        let currentNode = masterGainNode;
-        offlineInstances.forEach((inst) => {
-          currentNode.connect(inst.effect);
-          currentNode = inst.effect;
-        });
-        currentNode.connect(destination);
+    const hasWam = nonBypassed.some((e) => e.kind === "wam");
+    return (masterGainNode, destination, _isOffline) => __async(null, null, function* () {
+      if (hasWam && !(0, import_playout.isNativeGlobalContext)()) {
+        throw new Error(
+          "[waveform-playlist] WAV export with WAM effects requires a native AudioContext. Call configureGlobalContext({ nativeAudioContext: true }) from @waveform-playlist/playout before any audio initialization."
+        );
       }
-      return function cleanup() {
-        offlineInstances.forEach((inst) => inst.dispose());
-      };
-    };
+      const rawContext = masterGainNode.context.rawContext;
+      const { instances, dispose } = yield buildOfflineChain(
+        nonBypassed,
+        (instanceId) => {
+          const inst = effectInstancesRef.current.get(instanceId);
+          return (inst == null ? void 0 : inst.kind) === "wam" ? inst.plugin : void 0;
+        },
+        rawContext
+      );
+      connectOfflineChain(masterGainNode, instances, destination);
+      return dispose;
+    });
   }, [activeEffects]);
   return {
     activeEffects,
     availableEffects: effectDefinitions,
     addEffect,
+    addWamEffect,
+    getWamPlugin,
     removeEffect,
     updateParameter,
     toggleBypass,
@@ -1164,11 +1325,14 @@ function useDynamicEffects(fftSize = 256) {
 
 // src/hooks/useTrackDynamicEffects.ts
 var import_react4 = require("react");
+var import_playout2 = require("@waveform-playlist/playout");
+var import_tone6 = require("tone");
 function useTrackDynamicEffects() {
   const [trackEffectsState, setTrackEffectsState] = (0, import_react4.useState)(
     /* @__PURE__ */ new Map()
   );
   const trackEffectInstancesRef = (0, import_react4.useRef)(/* @__PURE__ */ new Map());
+  const isMountedRef = (0, import_react4.useRef)(true);
   const trackGraphNodesRef = (0, import_react4.useRef)(/* @__PURE__ */ new Map());
   const rebuildTrackChain = (0, import_react4.useCallback)((trackId, trackEffects) => {
     const nodes = trackGraphNodesRef.current.get(trackId);
@@ -1180,7 +1344,8 @@ function useTrackDynamicEffects() {
     } catch (e) {
       console.warn(`[waveform-playlist] Error disconnecting track "${trackId}" effect chain:`, e);
     }
-    const instances = trackEffects.map((ae) => instancesMap == null ? void 0 : instancesMap.get(ae.instanceId)).filter((inst) => inst !== void 0);
+    const audible = trackEffects.filter((ae) => !(ae.kind === "wam" && ae.bypassed));
+    const instances = audible.map((ae) => instancesMap == null ? void 0 : instancesMap.get(ae.instanceId)).filter((inst) => inst !== void 0);
     if (instances.length === 0) {
       graphEnd.connect(masterGainNode);
     } else {
@@ -1194,10 +1359,10 @@ function useTrackDynamicEffects() {
             e
           );
         }
-        currentNode.connect(inst.effect);
+        (0, import_tone6.connect)(currentNode, inst.effect);
         currentNode = inst.effect;
       });
-      currentNode.connect(masterGainNode);
+      (0, import_tone6.connect)(currentNode, masterGainNode);
     }
   }, []);
   const addEffectToTrack = (0, import_react4.useCallback)((trackId, effectId) => {
@@ -1218,6 +1383,7 @@ function useTrackDynamicEffects() {
     const newActiveEffect = {
       instanceId: instance.instanceId,
       effectId: definition.id,
+      kind: "native",
       definition,
       params,
       bypassed: false
@@ -1229,6 +1395,76 @@ function useTrackDynamicEffects() {
       return newState;
     });
   }, []);
+  const addWamEffectToTrack = (0, import_react4.useCallback)(
+    (trackId, url, initialState) => __async(null, null, function* () {
+      var _a, _b;
+      if (!(0, import_playout2.isNativeGlobalContext)()) {
+        throw new Error(
+          "[waveform-playlist] WAM plugins require a native AudioContext. Call configureGlobalContext({ nativeAudioContext: true }) from @waveform-playlist/playout before any audio initialization."
+        );
+      }
+      const wam = yield loadWamModule();
+      const ctx = (0, import_playout2.getGlobalAudioContext)();
+      const { hostGroupId } = yield wam.ensureWamHost(ctx);
+      const plugin = yield wam.createWamInstance(
+        url,
+        ctx,
+        hostGroupId,
+        initialState !== void 0 ? { initialState } : void 0
+      );
+      if (!isMountedRef.current) {
+        try {
+          plugin.destroy();
+        } catch (err) {
+          console.warn(
+            "[waveform-playlist] Error destroying WAM plugin after unmount: " + (err instanceof Error ? err.message : String(err))
+          );
+        }
+        throw new Error(
+          "[waveform-playlist] addWamEffectToTrack aborted: hook unmounted before the plugin finished loading."
+        );
+      }
+      const instance = createWamEffectInstance(plugin);
+      if (!trackEffectInstancesRef.current.has(trackId)) {
+        trackEffectInstancesRef.current.set(trackId, /* @__PURE__ */ new Map());
+      }
+      trackEffectInstancesRef.current.get(trackId).set(instance.instanceId, instance);
+      const definition = {
+        id: instance.id,
+        name: (_b = (_a = plugin.descriptor) == null ? void 0 : _a.name) != null ? _b : url,
+        category: "wam",
+        description: "WAM plugin",
+        parameters: []
+      };
+      setTrackEffectsState((prev) => {
+        const newState = new Map(prev);
+        const existing = newState.get(trackId) || [];
+        newState.set(trackId, [
+          ...existing,
+          {
+            instanceId: instance.instanceId,
+            effectId: instance.id,
+            kind: "wam",
+            url,
+            definition,
+            params: {},
+            bypassed: false
+          }
+        ]);
+        return newState;
+      });
+      return instance.instanceId;
+    }),
+    []
+  );
+  const getTrackWamPlugin = (0, import_react4.useCallback)(
+    (trackId, instanceId) => {
+      const instancesMap = trackEffectInstancesRef.current.get(trackId);
+      const inst = instancesMap == null ? void 0 : instancesMap.get(instanceId);
+      return (inst == null ? void 0 : inst.kind) === "wam" ? inst.plugin : void 0;
+    },
+    []
+  );
   const removeEffectFromTrack = (0, import_react4.useCallback)((trackId, instanceId) => {
     const instancesMap = trackEffectInstancesRef.current.get(trackId);
     const instance = instancesMap == null ? void 0 : instancesMap.get(instanceId);
@@ -1273,6 +1509,18 @@ function useTrackDynamicEffects() {
     const effect = trackEffects.find((e) => e.instanceId === instanceId);
     if (!effect) return;
     const newBypassed = !effect.bypassed;
+    if (effect.kind === "wam") {
+      setTrackEffectsState((prev) => {
+        const newState = new Map(prev);
+        const existing = newState.get(trackId) || [];
+        newState.set(
+          trackId,
+          existing.map((e) => e.instanceId === instanceId ? __spreadProps(__spreadValues({}, e), { bypassed: newBypassed }) : e)
+        );
+        return newState;
+      });
+      return;
+    }
     const instancesMap = trackEffectInstancesRef.current.get(trackId);
     const instance = instancesMap == null ? void 0 : instancesMap.get(instanceId);
     if (instance) {
@@ -1312,16 +1560,17 @@ function useTrackDynamicEffects() {
         });
         const trackEffects = trackEffectsStateRef.current.get(trackId) || [];
         const instancesMap = trackEffectInstancesRef.current.get(trackId);
-        const instances = trackEffects.map((ae) => instancesMap == null ? void 0 : instancesMap.get(ae.instanceId)).filter((inst) => inst !== void 0);
+        const audible = trackEffects.filter((ae) => !(ae.kind === "wam" && ae.bypassed));
+        const instances = audible.map((ae) => instancesMap == null ? void 0 : instancesMap.get(ae.instanceId)).filter((inst) => inst !== void 0);
         if (instances.length === 0) {
           graphEnd.connect(masterGainNode);
         } else {
           let currentNode = graphEnd;
           instances.forEach((inst) => {
-            currentNode.connect(inst.effect);
+            (0, import_tone6.connect)(currentNode, inst.effect);
             currentNode = inst.effect;
           });
-          currentNode.connect(masterGainNode);
+          (0, import_tone6.connect)(currentNode, masterGainNode);
         }
         return function cleanup() {
           trackGraphNodesRef.current.delete(trackId);
@@ -1337,8 +1586,10 @@ function useTrackDynamicEffects() {
     });
   }, [trackEffectsState, rebuildTrackChain]);
   (0, import_react4.useEffect)(() => {
+    isMountedRef.current = true;
     const trackEffectInstances = trackEffectInstancesRef.current;
     return () => {
+      isMountedRef.current = false;
       trackEffectInstances.forEach((instancesMap) => {
         instancesMap.forEach((inst) => inst.dispose());
         instancesMap.clear();
@@ -1349,36 +1600,38 @@ function useTrackDynamicEffects() {
   const createOfflineTrackEffectsFunction = (0, import_react4.useCallback)(
     (trackId) => {
       const trackEffects = trackEffectsState.get(trackId) || [];
-      const nonBypassedEffects = trackEffects.filter((e) => !e.bypassed);
-      if (nonBypassedEffects.length === 0) {
+      const nonBypassed = trackEffects.filter((e) => !e.bypassed);
+      if (nonBypassed.length === 0) {
         return void 0;
       }
-      return (graphEnd, masterGainNode, _isOffline) => {
-        const offlineInstances = [];
-        for (const activeEffect of nonBypassedEffects) {
-          const instance = createEffectInstance(activeEffect.definition, activeEffect.params);
-          offlineInstances.push(instance);
-        }
-        if (offlineInstances.length === 0) {
-          graphEnd.connect(masterGainNode);
-        } else {
-          let currentNode = graphEnd;
-          offlineInstances.forEach((inst) => {
-            currentNode.connect(inst.effect);
-            currentNode = inst.effect;
-          });
-          currentNode.connect(masterGainNode);
+      const hasWam = nonBypassed.some((e) => e.kind === "wam");
+      return (graphEnd, masterGainNode, _isOffline) => __async(null, null, function* () {
+        if (hasWam && !(0, import_playout2.isNativeGlobalContext)()) {
+          throw new Error(
+            "[waveform-playlist] WAV export with WAM effects requires a native AudioContext. Call configureGlobalContext({ nativeAudioContext: true }) from @waveform-playlist/playout before any audio initialization."
+          );
         }
-        return function cleanup() {
-          offlineInstances.forEach((inst) => inst.dispose());
-        };
-      };
+        const rawContext = graphEnd.context.rawContext;
+        const { instances, dispose } = yield buildOfflineChain(
+          nonBypassed,
+          (instanceId) => {
+            var _a;
+            const inst = (_a = trackEffectInstancesRef.current.get(trackId)) == null ? void 0 : _a.get(instanceId);
+            return (inst == null ? void 0 : inst.kind) === "wam" ? inst.plugin : void 0;
+          },
+          rawContext
+        );
+        connectOfflineChain(graphEnd, instances, masterGainNode);
+        return dispose;
+      });
     },
     [trackEffectsState]
   );
   return {
     trackEffectsState,
     addEffectToTrack,
+    addWamEffectToTrack,
+    getTrackWamPlugin,
     removeEffectFromTrack,
     updateTrackEffectParameter,
     toggleBypass,
@@ -1392,7 +1645,45 @@ function useTrackDynamicEffects() {
 // src/hooks/useExportWav.ts
 var import_react5 = require("react");
 var import_core2 = require("@waveform-playlist/core");
-var import_playout = require("@waveform-playlist/playout");
+var import_playout4 = require("@waveform-playlist/playout");
+
+// src/utils/renderToneOffline.ts
+var import_tone7 = require("tone");
+var import_playout3 = require("@waveform-playlist/playout");
+var renderQueue = Promise.resolve();
+function renderToneOffline(build, duration, channels, sampleRate) {
+  return __async(this, null, function* () {
+    const run = renderQueue.then(
+      () => renderToneOfflineSerial(build, duration, channels, sampleRate)
+    );
+    renderQueue = run.catch(() => void 0);
+    return run;
+  });
+}
+function renderToneOfflineSerial(build, duration, channels, sampleRate) {
+  return __async(this, null, function* () {
+    const offlineContext = (0, import_playout3.isNativeGlobalContext)() ? new import_tone7.OfflineContext(
+      new OfflineAudioContext({
+        numberOfChannels: channels,
+        length: Math.round(duration * sampleRate),
+        sampleRate
+      })
+    ) : new import_tone7.OfflineContext(channels, duration, sampleRate);
+    const previousContext = (0, import_tone7.getContext)();
+    (0, import_tone7.setContext)(offlineContext);
+    try {
+      yield build(offlineContext);
+    } finally {
+      (0, import_tone7.setContext)(previousContext);
+    }
+    const toneBuffer = yield offlineContext.render();
+    const audioBuffer = toneBuffer.get();
+    if (!audioBuffer) {
+      throw new Error("Offline rendering produced no audio buffer");
+    }
+    return audioBuffer;
+  });
+}
 
 // src/utils/wavEncoder.ts
 function encodeWav(audioBuffer, options = {}) {
@@ -1491,7 +1782,7 @@ function useExportWav() {
         if (mode === "individual" && (trackIndex === void 0 || trackIndex < 0 || trackIndex >= tracks.length)) {
           throw new Error("Invalid track index for individual export");
         }
-        const sampleRate = (0, import_playout.getGlobalAudioContext)().sampleRate;
+        const sampleRate = (0, import_playout4.getGlobalAudioContext)().sampleRate;
         let totalDurationSamples = 0;
         for (const track of tracks) {
           for (const clip of track.clips) {
@@ -1548,7 +1839,7 @@ function useExportWav() {
 }
 function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffects, effectsFunction, createOfflineTrackEffects, onProgress) {
   return __async(this, null, function* () {
-    const { Offline, Volume: Volume2, Gain, Panner, Player, ToneAudioBuffer } = yield import("tone");
+    const { Volume: Volume2, Gain: Gain2, Panner, Player, ToneAudioBuffer } = yield import("tone");
     onProgress(0.1);
     const audibleTracks = tracksToRender.filter(({ state }) => {
       if (state.muted && !state.soloed) return false;
@@ -1559,23 +1850,25 @@ function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffec
       (max, { track }) => Math.max(max, (0, import_core2.trackChannelCount)(track)),
       1
     );
-    let buffer;
+    const cleanups = [];
     try {
-      buffer = yield Offline(
-        (_0) => __async(null, [_0], function* ({ transport, destination }) {
+      const audioBuffer = yield renderToneOffline(
+        (context) => __async(null, null, function* () {
           const masterVolume = new Volume2(0);
           if (effectsFunction && applyEffects) {
-            effectsFunction(masterVolume, destination, true);
+            const cleanup = yield effectsFunction(masterVolume, context.destination, true);
+            if (cleanup) cleanups.push(cleanup);
           } else {
-            masterVolume.connect(destination);
+            masterVolume.connect(context.destination);
           }
           for (const { track, state } of audibleTracks) {
             const trackVolume = new Volume2((0, import_core2.gainToDb)(state.volume));
             const trackPan = new Panner({ pan: state.pan, channelCount: (0, import_core2.trackChannelCount)(track) });
-            const trackMute = new Gain(state.muted ? 0 : 1);
+            const trackMute = new Gain2(state.muted ? 0 : 1);
             const trackEffects = createOfflineTrackEffects == null ? void 0 : createOfflineTrackEffects(track.id);
             if (trackEffects && applyEffects) {
-              trackEffects(trackMute, masterVolume, true);
+              const cleanup = yield trackEffects(trackMute, masterVolume, true);
+              if (cleanup) cleanups.push(cleanup);
             } else {
               trackMute.connect(masterVolume);
             }
@@ -1583,7 +1876,7 @@ function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffec
             trackVolume.connect(trackPan);
             for (const clip of track.clips) {
               const {
-                audioBuffer,
+                audioBuffer: clipBuffer,
                 startSample,
                 durationSamples,
                 offsetSamples,
@@ -1591,7 +1884,7 @@ function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffec
                 fadeIn,
                 fadeOut
               } = clip;
-              if (!audioBuffer) {
+              if (!clipBuffer) {
                 console.warn(
                   '[waveform-playlist] Skipping clip "' + (clip.name || clip.id) + '" - no audioBuffer for export'
                 );
@@ -1600,13 +1893,13 @@ function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffec
               const startTime = startSample / sampleRate;
               const clipDuration = durationSamples / sampleRate;
               const offset = offsetSamples / sampleRate;
-              const toneBuffer = new ToneAudioBuffer(audioBuffer);
+              const toneBuffer = new ToneAudioBuffer(clipBuffer);
               const player = new Player(toneBuffer);
-              const fadeGain = new Gain(clipGain);
+              const fadeGain = new Gain2(clipGain);
               player.connect(fadeGain);
               fadeGain.connect(trackVolume);
               if (applyEffects) {
-                const audioParam = (0, import_playout.getUnderlyingAudioParam)(fadeGain.gain);
+                const audioParam = (0, import_playout4.getUnderlyingAudioParam)(fadeGain.gain);
                 if (audioParam) {
                   applyClipFades(audioParam, clipGain, startTime, clipDuration, fadeIn, fadeOut);
                 } else if (fadeIn || fadeOut) {
@@ -1618,25 +1911,29 @@ function renderOffline(tracksToRender, hasSolo, duration, sampleRate, applyEffec
               player.start(startTime, offset, clipDuration);
             }
           }
-          transport.start(0);
+          context.transport.start(0);
         }),
         duration,
         outputChannels,
         sampleRate
       );
+      return audioBuffer;
     } catch (err) {
       if (err instanceof Error) {
         throw err;
-      } else {
-        throw new Error("Tone.Offline rendering failed: " + String(err));
+      }
+      throw new Error("Offline rendering failed: " + String(err));
+    } finally {
+      for (const cleanup of cleanups) {
+        try {
+          cleanup();
+        } catch (err) {
+          console.warn(
+            "[waveform-playlist] Export cleanup error: " + (err instanceof Error ? err.message : String(err))
+          );
+        }
       }
     }
-    onProgress(0.9);
-    const result = buffer.get();
-    if (!result) {
-      throw new Error("Offline rendering produced no audio buffer");
-    }
-    return result;
   });
 }
 function applyClipFades(gainParam, clipGain, startTime, clipDuration, fadeIn, fadeOut) {
@@ -1660,7 +1957,7 @@ function applyClipFades(gainParam, clipGain, startTime, clipDuration, fadeIn, fa
 // src/hooks/useDynamicTracks.ts
 var import_react6 = require("react");
 var import_core3 = require("@waveform-playlist/core");
-var import_playout2 = require("@waveform-playlist/playout");
+var import_playout5 = require("@waveform-playlist/playout");
 function getSourceName(source) {
   var _a, _b, _c, _d, _e;
   if (source instanceof File) {
@@ -1711,7 +2008,7 @@ function useDynamicTracks() {
   }, []);
   const addTracks = (0, import_react6.useCallback)((sources) => {
     if (sources.length === 0) return;
-    const audioContext = (0, import_playout2.getGlobalAudioContext)();
+    const audioContext = (0, import_playout5.getGlobalAudioContext)();
     const placeholders = sources.map((source) => ({
       track: (0, import_core3.createTrack)({ name: `${getSourceName(source)} (loading...)`, clips: [] }),
       source
@@ -1782,7 +2079,7 @@ function useDynamicTracks() {
 
 // src/hooks/useOutputMeter.ts
 var import_react7 = require("react");
-var import_playout3 = require("@waveform-playlist/playout");
+var import_playout6 = require("@waveform-playlist/playout");
 var import_core4 = require("@waveform-playlist/core");
 var import_worklets = require("@waveform-playlist/worklets");
 var PEAK_DECAY = 0.98;
@@ -1810,7 +2107,7 @@ function useOutputMeter(options = {}) {
   (0, import_react7.useEffect)(() => {
     let isMounted = true;
     const setup = () => __async(null, null, function* () {
-      const context = (0, import_playout3.getGlobalContext)();
+      const context = (0, import_playout6.getGlobalContext)();
       const rawCtx = context.rawContext;
       yield rawCtx.audioWorklet.addModule(import_worklets.meterProcessorUrl);
       if (!isMounted) return;
@@ -1859,7 +2156,7 @@ function useOutputMeter(options = {}) {
       isMounted = false;
       if (workletNodeRef.current) {
         try {
-          const context = (0, import_playout3.getGlobalContext)();
+          const context = (0, import_playout6.getGlobalContext)();
           context.destination.chain();
         } catch (err) {
           console.warn("[waveform-playlist] Failed to restore destination chain:", String(err));
@@ -1943,15 +2240,78 @@ var ExportWavButton = ({
     }
   );
 };
+
+// src/components/WamEffectGui.tsx
+var import_react9 = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var WamEffectGui = ({ plugin, className }) => {
+  const hostRef = (0, import_react9.useRef)(null);
+  (0, import_react9.useEffect)(() => {
+    const host = hostRef.current;
+    if (!plugin || !host) return;
+    let cancelled = false;
+    let gui = null;
+    (() => __async(null, null, function* () {
+      var _a;
+      try {
+        if (plugin.createGui) {
+          gui = yield plugin.createGui();
+        } else {
+          const wam = yield loadWamModule();
+          gui = yield wam.createWamParameterPanel(
+            plugin.audioNode
+          );
+        }
+        if (cancelled) {
+          if (gui) {
+            try {
+              (_a = plugin.destroyGui) == null ? void 0 : _a.call(plugin, gui);
+            } catch (destroyErr) {
+              console.warn(
+                "[waveform-playlist] Error destroying WAM GUI: " + (destroyErr instanceof Error ? destroyErr.message : String(destroyErr))
+              );
+            }
+          }
+          gui = null;
+          return;
+        }
+        host.innerHTML = "";
+        host.appendChild(gui);
+      } catch (err) {
+        console.warn(
+          "[waveform-playlist] Failed to create WAM GUI: " + (err instanceof Error ? err.message : String(err))
+        );
+      }
+    }))();
+    return () => {
+      var _a;
+      cancelled = true;
+      if (gui) {
+        gui.remove();
+        try {
+          (_a = plugin.destroyGui) == null ? void 0 : _a.call(plugin, gui);
+        } catch (destroyErr) {
+          console.warn(
+            "[waveform-playlist] Error destroying WAM GUI: " + (destroyErr instanceof Error ? destroyErr.message : String(destroyErr))
+          );
+        }
+      }
+    };
+  }, [plugin]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { ref: hostRef, className: className != null ? className : "wam-effect-gui" });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ExportWavButton,
+  WamEffectGui,
   createEffectChain,
   createEffectInstance,
+  createWamEffectInstance,
   effectCategories,
   effectDefinitions,
   getEffectDefinition,
   getEffectsByCategory,
+  loadWamModule,
   useAudioTracks,
   useDynamicEffects,
   useDynamicTracks,