@signalsandsorcery/plugin-sdk 2.35.1 → 2.35.2

package/dist/index.js

@@ -62,6 +62,7 @@ __export(index_exports, {
   PLUGIN_SDK_VERSION: () => PLUGIN_SDK_VERSION,
   PX_PER_BEAT: () => PX_PER_BEAT,
   PanSlider: () => PanSlider,
+  PanelMasterStrip: () => PanelMasterStrip,
   PianoRollEditor: () => PianoRollEditor,
   PluginError: () => PluginError,
   RESIZE_HANDLE_PX: () => RESIZE_HANDLE_PX,
@@ -126,6 +127,7 @@ __export(index_exports, {
   transposeNotes: () => transposeNotes,
   useAnySolo: () => useAnySolo,
   useGeneratorPanelCore: () => useGeneratorPanelCore,
+  usePanelBus: () => usePanelBus,
   useSceneState: () => useSceneState,
   useSoundHistory: () => useSoundHistory,
   useTrackLevel: () => useTrackLevel,
@@ -4265,9 +4267,276 @@ function TransitionDesigner({
   ] });
 }
 
-// src/components/DownloadPackButton.tsx
+// src/components/PanelMasterStrip.tsx
 var import_react17 = require("react");
 var import_jsx_runtime18 = require("react/jsx-runtime");
+function PanelMasterStrip({
+  bus,
+  availableFx = [],
+  fxLoading = false,
+  soloedOut = false,
+  disabled = false,
+  fxPickerOpen,
+  onToggleFxPicker,
+  onRefreshFx,
+  onVolumeChange,
+  onMuteToggle,
+  onSoloToggle,
+  onAddFx,
+  onRemoveFx,
+  onToggleFxEnabled,
+  onShowFxEditor
+}) {
+  const [search, setSearch] = (0, import_react17.useState)("");
+  const filtered = (0, import_react17.useMemo)(() => {
+    const q = search.trim().toLowerCase();
+    if (!q) return availableFx;
+    return availableFx.filter(
+      (fx) => fx.name.toLowerCase().includes(q) || fx.manufacturer.toLowerCase().includes(q)
+    );
+  }, [availableFx, search]);
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    "div",
+    {
+      "data-testid": "panel-master-strip",
+      className: `flex flex-col gap-1 px-2 py-1.5 rounded-sm border border-sas-border bg-sas-panel-alt/50 transition-opacity ${soloedOut ? "opacity-40" : ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "span",
+            {
+              className: "text-[9px] font-bold tracking-widest text-sas-muted/70 select-none",
+              title: "Panel mix bus \u2014 volume, mute/solo and FX applied to this panel's summed output",
+              children: "BUS"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "w-24", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            VolumeSlider,
+            {
+              value: dbToSlider(bus.volume),
+              onChange: (sliderValue) => onVolumeChange(sliderToDb(sliderValue)),
+              disabled
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "button",
+            {
+              "data-testid": "bus-mute-button",
+              onClick: onMuteToggle,
+              disabled,
+              className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${bus.muted ? "bg-red-600 text-white" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"} disabled:opacity-50`,
+              title: bus.muted ? "Unmute panel bus" : "Mute panel bus (silences the whole panel)",
+              children: "M"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "button",
+            {
+              "data-testid": "bus-solo-button",
+              onClick: onSoloToggle,
+              disabled,
+              className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${bus.soloed ? "bg-amber-500 text-black" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"} disabled:opacity-50`,
+              title: bus.soloed ? "Unsolo panel bus" : "Solo this panel (silences other panels/tracks in scope)",
+              children: "S"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex items-center gap-1 flex-1 min-w-0 overflow-x-auto", children: bus.fx.map((fx) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+            "span",
+            {
+              "data-testid": `bus-fx-chip-${fx.index}`,
+              className: `flex items-center gap-1 px-1.5 py-0.5 rounded-sm border text-[10px] whitespace-nowrap ${fx.enabled ? "border-sas-accent/60 text-sas-accent bg-sas-accent/10" : "border-sas-border text-sas-muted/50 bg-sas-panel"}`,
+              title: `${fx.name}${fx.enabled ? "" : " (bypassed)"}`,
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  "button",
+                  {
+                    "data-testid": `bus-fx-toggle-${fx.index}`,
+                    onClick: () => onToggleFxEnabled(fx.index, !fx.enabled),
+                    disabled,
+                    className: "hover:opacity-70 disabled:opacity-50",
+                    title: fx.enabled ? `Bypass ${fx.name}` : `Enable ${fx.name}`,
+                    children: fx.enabled ? "\u25CF" : "\u25CB"
+                  }
+                ),
+                onShowFxEditor ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  "button",
+                  {
+                    "data-testid": `bus-fx-edit-${fx.index}`,
+                    onClick: () => onShowFxEditor(fx.index),
+                    disabled,
+                    className: "max-w-[80px] truncate hover:underline disabled:opacity-50",
+                    title: `Open ${fx.name} editor`,
+                    children: fx.name
+                  }
+                ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "max-w-[80px] truncate", children: fx.name }),
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  "button",
+                  {
+                    "data-testid": `bus-fx-remove-${fx.index}`,
+                    onClick: () => onRemoveFx(fx.index),
+                    disabled,
+                    className: "text-sas-muted/60 hover:text-sas-danger disabled:opacity-50",
+                    title: `Remove ${fx.name} from the bus`,
+                    children: "\u2715"
+                  }
+                )
+              ]
+            },
+            `${fx.index}:${fx.pluginId}`
+          )) }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "button",
+            {
+              "data-testid": "bus-fx-add-button",
+              onClick: () => onToggleFxPicker(!fxPickerOpen),
+              disabled,
+              className: `px-1.5 py-0.5 rounded-sm border text-xs whitespace-nowrap transition-colors ${fxPickerOpen ? "border-sas-accent text-sas-accent bg-sas-accent/10" : "border-sas-border text-sas-muted hover:border-sas-accent hover:text-sas-accent"} disabled:opacity-50`,
+              title: "Add an FX plugin to the panel bus",
+              children: "FX +"
+            }
+          )
+        ] }),
+        fxPickerOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { "data-testid": "bus-fx-picker", className: "flex flex-col gap-2 pt-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+              "input",
+              {
+                type: "text",
+                value: search,
+                onChange: (e) => setSearch(e.target.value),
+                placeholder: "Search FX...",
+                className: "sas-input flex-1 px-2 py-1 text-xs"
+              }
+            ),
+            onRefreshFx && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+              "button",
+              {
+                onClick: () => onRefreshFx(),
+                disabled: fxLoading,
+                className: "px-2 py-1 text-xs rounded-sm border border-sas-border text-sas-muted hover:text-sas-accent hover:border-sas-accent transition-colors disabled:opacity-50",
+                title: "Re-scan plugins",
+                children: fxLoading ? "..." : "Refresh"
+              }
+            )
+          ] }),
+          fxLoading && availableFx.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
+            filtered.map((fx) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+              "button",
+              {
+                "data-testid": `bus-fx-pick-${fx.pluginId}`,
+                onClick: () => onAddFx(fx.pluginId),
+                className: "flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent",
+                title: `${fx.name} by ${fx.manufacturer} (${fx.type.toUpperCase()})`,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-xs font-medium truncate w-full", children: fx.name }),
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: fx.manufacturer || fx.type.toUpperCase() })
+                ]
+              },
+              fx.pluginId
+            )),
+            filtered.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "col-span-3 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No FX plugins found" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/hooks/usePanelBus.ts
+var import_react18 = require("react");
+function usePanelBus(host, activeSceneId) {
+  const supported = typeof host.getPanelBusState === "function";
+  const [bus, setBus] = (0, import_react18.useState)(null);
+  const [availableFx, setAvailableFx] = (0, import_react18.useState)([]);
+  const [fxLoading, setFxLoading] = (0, import_react18.useState)(false);
+  const [fxPickerOpen, setFxPickerOpen] = (0, import_react18.useState)(false);
+  const fxLoadedRef = (0, import_react18.useRef)(false);
+  const loadSeqRef = (0, import_react18.useRef)(0);
+  const reload = (0, import_react18.useCallback)(async () => {
+    if (!supported || !activeSceneId || !host.getPanelBusState) {
+      setBus(null);
+      return;
+    }
+    const seq = ++loadSeqRef.current;
+    try {
+      const state = await host.getPanelBusState(activeSceneId);
+      if (loadSeqRef.current === seq) setBus(state);
+    } catch {
+    }
+  }, [host, activeSceneId, supported]);
+  (0, import_react18.useEffect)(() => {
+    setBus(null);
+    setFxPickerOpen(false);
+    void reload();
+  }, [reload]);
+  const loadFxList = (0, import_react18.useCallback)(
+    async (force) => {
+      if (!supported || !host.getAvailableFx) return;
+      if (fxLoadedRef.current && !force) return;
+      setFxLoading(true);
+      try {
+        const list = await host.getAvailableFx();
+        setAvailableFx(list);
+        fxLoadedRef.current = true;
+      } catch {
+      } finally {
+        setFxLoading(false);
+      }
+    },
+    [host, supported]
+  );
+  const openPicker = (0, import_react18.useCallback)(
+    (open) => {
+      setFxPickerOpen(open);
+      if (open) void loadFxList(false);
+    },
+    [loadFxList]
+  );
+  const mutate = (0, import_react18.useCallback)(
+    (fn) => {
+      if (!fn || !activeSceneId) return;
+      void (async () => {
+        try {
+          await fn();
+        } catch {
+        }
+        await reload();
+      })();
+    },
+    [activeSceneId, reload]
+  );
+  return {
+    supported,
+    bus,
+    availableFx,
+    fxLoading,
+    fxPickerOpen,
+    setFxPickerOpen: openPicker,
+    refreshFx: () => void loadFxList(true),
+    reload,
+    onVolumeChange: (volumeDb) => mutate(host.setPanelBusVolume && (() => host.setPanelBusVolume(activeSceneId, volumeDb))),
+    onMuteToggle: () => mutate(
+      host.setPanelBusMute && (() => host.setPanelBusMute(activeSceneId, !(bus?.muted ?? false)))
+    ),
+    onSoloToggle: () => mutate(
+      host.setPanelBusSolo && (() => host.setPanelBusSolo(activeSceneId, !(bus?.soloed ?? false)))
+    ),
+    onAddFx: (pluginId) => mutate(host.loadPanelBusFx && (async () => {
+      await host.loadPanelBusFx(activeSceneId, pluginId);
+    })),
+    onRemoveFx: (fxIndex) => mutate(host.removePanelBusFx && (() => host.removePanelBusFx(activeSceneId, fxIndex))),
+    onToggleFxEnabled: (fxIndex, enabled) => mutate(
+      host.setPanelBusFxEnabled && (() => host.setPanelBusFxEnabled(activeSceneId, fxIndex, enabled))
+    ),
+    onShowFxEditor: (fxIndex) => mutate(
+      host.showPanelBusFxEditor && (() => host.showPanelBusFxEditor(activeSceneId, fxIndex))
+    )
+  };
+}
+
+// src/components/DownloadPackButton.tsx
+var import_react19 = require("react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function formatSize(bytes) {
   if (!bytes || bytes <= 0) return "";
   const gb = bytes / 1024 ** 3;
@@ -4283,10 +4552,10 @@ var DownloadPackButton = ({
   variant = "compact",
   onDownloadComplete
 }) => {
-  const [status, setStatus] = (0, import_react17.useState)("idle");
-  const [progress, setProgress] = (0, import_react17.useState)(0);
-  const [errorMessage, setErrorMessage] = (0, import_react17.useState)(null);
-  (0, import_react17.useEffect)(() => {
+  const [status, setStatus] = (0, import_react19.useState)("idle");
+  const [progress, setProgress] = (0, import_react19.useState)(0);
+  const [errorMessage, setErrorMessage] = (0, import_react19.useState)(null);
+  (0, import_react19.useEffect)(() => {
     const unsub = host.onSamplePackProgress(packId, (p) => {
       setStatus(p.status);
       setProgress(p.progress);
@@ -4301,7 +4570,7 @@ var DownloadPackButton = ({
     });
     return unsub;
   }, [host, packId, onDownloadComplete]);
-  const handleClick = (0, import_react17.useCallback)(async () => {
+  const handleClick = (0, import_react19.useCallback)(async () => {
     if (status !== "idle" && status !== "error") return;
     try {
       setStatus("downloading");
@@ -4355,8 +4624,8 @@ var DownloadPackButton = ({
   } else {
     className = `${baseClasses} text-sas-muted hover:text-sas-accent border-sas-border hover:border-sas-accent`;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       "button",
       {
         "data-testid": `download-pack-button-${packId}`,
@@ -4367,12 +4636,12 @@ var DownloadPackButton = ({
         children: buttonLabel
       }
     ),
-    variant === "large" && status === "error" && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-xs text-sas-danger mt-2", "data-testid": `download-pack-error-${packId}`, children: errorMessage })
+    variant === "large" && status === "error" && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-xs text-sas-danger mt-2", "data-testid": `download-pack-error-${packId}`, children: errorMessage })
   ] });
 };
 
 // src/components/SamplePackCTACard.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var SamplePackCTACard = ({
   host,
   pack,
@@ -4380,7 +4649,7 @@ var SamplePackCTACard = ({
   onDownloadComplete
 }) => {
   if (status === "checking") {
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       "div",
       {
         "data-testid": `sample-pack-cta-checking-${pack.packId}`,
@@ -4391,16 +4660,16 @@ var SamplePackCTACard = ({
   }
   const headline = status === "stale" ? `${pack.displayName} update available` : `${pack.displayName} not installed`;
   const sublabel = status === "stale" ? `A newer version is available for download.` : pack.description;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     {
       "data-testid": `sample-pack-cta-${pack.packId}`,
       className: "flex flex-col items-center justify-center py-12 px-6 text-center",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-sm uppercase tracking-wide text-sas-muted mb-2", children: status === "stale" ? "Update available" : "Sample library not installed" }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-base text-sas-text mb-1", children: headline }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-xs text-sas-muted mb-6 max-w-md", children: sublabel }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-sm uppercase tracking-wide text-sas-muted mb-2", children: status === "stale" ? "Update available" : "Sample library not installed" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-base text-sas-text mb-1", children: headline }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-xs text-sas-muted mb-6 max-w-md", children: sublabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           DownloadPackButton,
           {
             host,
@@ -4417,7 +4686,7 @@ var SamplePackCTACard = ({
 };
 
 // src/components/WaveformView.tsx
-var import_react18 = require("react");
+var import_react20 = require("react");
 
 // src/components/waveform.ts
 function computePeaks(audioBuffer, bins, targetSamples) {
@@ -4480,7 +4749,7 @@ function drawWaveform(canvas, peaks, options = {}) {
 }
 
 // src/components/WaveformView.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var WaveformView = ({
   host,
   filePath,
@@ -4489,9 +4758,9 @@ var WaveformView = ({
   fillStyle,
   targetSamples
 }) => {
-  const canvasRef = (0, import_react18.useRef)(null);
-  const [peaks, setPeaks] = (0, import_react18.useState)(null);
-  (0, import_react18.useEffect)(() => {
+  const canvasRef = (0, import_react20.useRef)(null);
+  const [peaks, setPeaks] = (0, import_react20.useState)(null);
+  (0, import_react20.useEffect)(() => {
     let cancelled = false;
     let audioContext = null;
     (async () => {
@@ -4517,7 +4786,7 @@ var WaveformView = ({
       cancelled = true;
     };
   }, [host, filePath, bins, targetSamples]);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (!peaks) return;
     const canvas = canvasRef.current;
     if (!canvas) return;
@@ -4528,7 +4797,7 @@ var WaveformView = ({
     observer.observe(canvas);
     return () => observer.disconnect();
   }, [peaks, fillStyle]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "canvas",
     {
       ref: canvasRef,
@@ -4539,8 +4808,8 @@ var WaveformView = ({
 };
 
 // src/components/ScrollingWaveform.tsx
-var import_react19 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_react21 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var ScrollingWaveform = ({
   getPeakDb,
   active,
@@ -4548,11 +4817,11 @@ var ScrollingWaveform = ({
   className,
   fillStyle
 }) => {
-  const canvasRef = (0, import_react19.useRef)(null);
-  const ringRef = (0, import_react19.useRef)(new Float32Array(columns));
-  const writeIdxRef = (0, import_react19.useRef)(0);
-  const rafRef = (0, import_react19.useRef)(null);
-  (0, import_react19.useEffect)(() => {
+  const canvasRef = (0, import_react21.useRef)(null);
+  const ringRef = (0, import_react21.useRef)(new Float32Array(columns));
+  const writeIdxRef = (0, import_react21.useRef)(0);
+  const rafRef = (0, import_react21.useRef)(null);
+  (0, import_react21.useEffect)(() => {
     if (ringRef.current.length !== columns) {
       const next = new Float32Array(columns);
       const prev = ringRef.current;
@@ -4564,7 +4833,7 @@ var ScrollingWaveform = ({
       writeIdxRef.current = writeIdxRef.current % columns;
     }
   }, [columns]);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!active) {
       if (rafRef.current !== null) {
         cancelAnimationFrame(rafRef.current);
@@ -4616,7 +4885,7 @@ var ScrollingWaveform = ({
       }
     };
   }, [active, getPeakDb, fillStyle]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "canvas",
     {
       ref: canvasRef,
@@ -4627,8 +4896,8 @@ var ScrollingWaveform = ({
 };
 
 // src/components/OffsetScrubber.tsx
-var import_react20 = require("react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_react22 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var SLIDER_HEIGHT_PX = 28;
 var TICK_HEIGHT_PX = 14;
 var DOWNBEAT_TICK_HEIGHT_PX = 22;
@@ -4641,40 +4910,40 @@ function OffsetScrubber({
   onChange,
   disabled = false
 }) {
-  const trackRef = (0, import_react20.useRef)(null);
-  const [draftOffset, setDraftOffset] = (0, import_react20.useState)(offsetSamples);
-  const [isDragging, setIsDragging] = (0, import_react20.useState)(false);
-  (0, import_react20.useEffect)(() => {
+  const trackRef = (0, import_react22.useRef)(null);
+  const [draftOffset, setDraftOffset] = (0, import_react22.useState)(offsetSamples);
+  const [isDragging, setIsDragging] = (0, import_react22.useState)(false);
+  (0, import_react22.useEffect)(() => {
     if (!isDragging) setDraftOffset(offsetSamples);
   }, [offsetSamples, isDragging]);
   const sampleRate = cuePoints?.sample_rate ?? 44100;
   const detectedBpm = cuePoints?.detected_bpm ?? projectBpm;
-  const beatsForRange = (0, import_react20.useMemo)(() => {
+  const beatsForRange = (0, import_react22.useMemo)(() => {
     return Math.round(60 / projectBpm * sampleRate);
   }, [projectBpm, sampleRate]);
   const rangeSamples = beatsForRange * meter;
-  const sampleToFraction = (0, import_react20.useCallback)(
+  const sampleToFraction = (0, import_react22.useCallback)(
     (sample) => {
       const clamped = Math.max(-rangeSamples, Math.min(rangeSamples, sample));
       return (clamped + rangeSamples) / (2 * rangeSamples);
     },
     [rangeSamples]
   );
-  const fractionToSample = (0, import_react20.useCallback)(
+  const fractionToSample = (0, import_react22.useCallback)(
     (fraction) => {
       const clamped = Math.max(0, Math.min(1, fraction));
       return Math.round(clamped * 2 * rangeSamples - rangeSamples);
     },
     [rangeSamples]
   );
-  const snapTargets = (0, import_react20.useMemo)(() => {
+  const snapTargets = (0, import_react22.useMemo)(() => {
     if (!cuePoints || cuePoints.beats.length === 0) return [];
     const downbeat = cuePoints.beats[0];
     const positives = cuePoints.beats.map((b) => b - downbeat);
     const negatives = positives.slice(1).map((p) => -p);
     return [...negatives, ...positives].sort((a, b) => a - b);
   }, [cuePoints]);
-  const snapToBeat = (0, import_react20.useCallback)(
+  const snapToBeat = (0, import_react22.useCallback)(
     (sample) => {
       if (snapTargets.length === 0) return sample;
       let best = snapTargets[0];
@@ -4690,7 +4959,7 @@ function OffsetScrubber({
     },
     [snapTargets]
   );
-  const handlePointerDown = (0, import_react20.useCallback)(
+  const handlePointerDown = (0, import_react22.useCallback)(
     (e) => {
       if (disabled || !cuePoints) return;
       e.preventDefault();
@@ -4724,7 +4993,7 @@ function OffsetScrubber({
     },
     [disabled, cuePoints, fractionToSample, onChange, snapToBeat]
   );
-  const handleResetToZero = (0, import_react20.useCallback)(() => {
+  const handleResetToZero = (0, import_react22.useCallback)(() => {
     if (disabled) return;
     setDraftOffset(0);
     onChange(0);
@@ -4732,7 +5001,7 @@ function OffsetScrubber({
   const thumbFraction = sampleToFraction(draftOffset);
   const thumbLeftPct = `${(thumbFraction * 100).toFixed(2)}%`;
   const bpmMismatch = cuePoints?.detected_bpm != null && Math.abs(cuePoints.detected_bpm - projectBpm) > 1;
-  const ticks = (0, import_react20.useMemo)(() => {
+  const ticks = (0, import_react22.useMemo)(() => {
     if (!cuePoints) return [];
     const downbeat = cuePoints.beats[0] ?? 0;
     return cuePoints.beats.map((b, i) => {
@@ -4743,9 +5012,9 @@ function OffsetScrubber({
     });
   }, [cuePoints, sampleToFraction]);
   const isDisabled = disabled || !cuePoints || cuePoints.beats.length === 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { "data-testid": "offset-scrubber", className: "flex items-center gap-2 w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[9px] text-sas-muted/60 uppercase tracking-wide flex-shrink-0", children: "Align" }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { "data-testid": "offset-scrubber", className: "flex items-center gap-2 w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-[9px] text-sas-muted/60 uppercase tracking-wide flex-shrink-0", children: "Align" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       "div",
       {
         ref: trackRef,
@@ -4761,7 +5030,7 @@ function OffsetScrubber({
         "aria-valuenow": draftOffset,
         "aria-disabled": isDisabled,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "div",
             {
               "aria-hidden": "true",
@@ -4769,7 +5038,7 @@ function OffsetScrubber({
               style: { left: "50%" }
             }
           ),
-          ticks.map((t) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          ticks.map((t) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "div",
             {
               "data-testid": t.isDownbeat ? "offset-tick-downbeat" : "offset-tick",
@@ -4784,7 +5053,7 @@ function OffsetScrubber({
             },
             t.i
           )),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "div",
             {
               "data-testid": "offset-scrubber-thumb",
@@ -4801,7 +5070,7 @@ function OffsetScrubber({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       "span",
       {
         "data-testid": "offset-scrubber-readout",
@@ -4809,7 +5078,7 @@ function OffsetScrubber({
         children: formatOffset(draftOffset, sampleRate)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       "button",
       {
         type: "button",
@@ -4821,7 +5090,7 @@ function OffsetScrubber({
         children: "\u2316"
       }
     ),
-    bpmMismatch && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    bpmMismatch && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       "span",
       {
         "data-testid": "offset-bpm-mismatch",
@@ -4893,16 +5162,16 @@ function synthesizeCuePoints({
 }
 
 // src/panel-core/useGeneratorPanelCore.tsx
-var import_react25 = require("react");
+var import_react27 = require("react");
 
 // src/hooks/useSceneState.ts
-var import_react21 = require("react");
+var import_react23 = require("react");
 function useSceneState(activeSceneId, initialValue) {
-  const [stateMap, setStateMap] = (0, import_react21.useState)(() => /* @__PURE__ */ new Map());
-  const activeSceneIdRef = (0, import_react21.useRef)(activeSceneId);
+  const [stateMap, setStateMap] = (0, import_react23.useState)(() => /* @__PURE__ */ new Map());
+  const activeSceneIdRef = (0, import_react23.useRef)(activeSceneId);
   activeSceneIdRef.current = activeSceneId;
   const currentValue = activeSceneId !== null && stateMap.has(activeSceneId) ? stateMap.get(activeSceneId) : initialValue;
-  const setForCurrentScene = (0, import_react21.useCallback)((value) => {
+  const setForCurrentScene = (0, import_react23.useCallback)((value) => {
     const sid = activeSceneIdRef.current;
     if (sid === null) return;
     setStateMap((prev) => {
@@ -4913,7 +5182,7 @@ function useSceneState(activeSceneId, initialValue) {
       return newMap;
     });
   }, [initialValue]);
-  const setForScene = (0, import_react21.useCallback)((sceneId, value) => {
+  const setForScene = (0, import_react23.useCallback)((sceneId, value) => {
     setStateMap((prev) => {
       const current = prev.has(sceneId) ? prev.get(sceneId) : initialValue;
       const next = typeof value === "function" ? value(current) : value;
@@ -4926,10 +5195,10 @@ function useSceneState(activeSceneId, initialValue) {
 }
 
 // src/hooks/useAnySolo.ts
-var import_react22 = require("react");
+var import_react24 = require("react");
 function useAnySolo(host) {
-  const [anySolo, setAnySolo] = (0, import_react22.useState)(false);
-  (0, import_react22.useEffect)(() => {
+  const [anySolo, setAnySolo] = (0, import_react24.useState)(false);
+  (0, import_react24.useEffect)(() => {
     let active = true;
     const refresh = () => {
       host.isAnySoloActive().then((v) => {
@@ -4948,7 +5217,7 @@ function useAnySolo(host) {
 }
 
 // src/hooks/useSoundHistory.ts
-var import_react23 = require("react");
+var import_react25 = require("react");
 var EMPTY = { entries: [], cursor: -1 };
 function sameDescriptor(a, b) {
   if (a === b) return true;
@@ -4960,14 +5229,14 @@ function sameDescriptor(a, b) {
 }
 function useSoundHistory(applySound, opts = {}) {
   const max = Math.max(2, opts.max ?? 24);
-  const applyRef = (0, import_react23.useRef)(applySound);
+  const applyRef = (0, import_react25.useRef)(applySound);
   applyRef.current = applySound;
-  const onChangeRef = (0, import_react23.useRef)(opts.onChange);
+  const onChangeRef = (0, import_react25.useRef)(opts.onChange);
   onChangeRef.current = opts.onChange;
-  const dataRef = (0, import_react23.useRef)({});
-  const [, setVersion] = (0, import_react23.useState)(0);
-  const bump = (0, import_react23.useCallback)(() => setVersion((v) => v + 1), []);
-  const commit = (0, import_react23.useCallback)(
+  const dataRef = (0, import_react25.useRef)({});
+  const [, setVersion] = (0, import_react25.useState)(0);
+  const bump = (0, import_react25.useCallback)(() => setVersion((v) => v + 1), []);
+  const commit = (0, import_react25.useCallback)(
     (trackId, next, notify) => {
       dataRef.current = { ...dataRef.current, [trackId]: next };
       bump();
@@ -4975,7 +5244,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [bump]
   );
-  const record = (0, import_react23.useCallback)(
+  const record = (0, import_react25.useCallback)(
     (trackId, descriptor, label) => {
       const h = dataRef.current[trackId];
       const current = h && h.cursor >= 0 ? h.entries[h.cursor] : void 0;
@@ -4990,7 +5259,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [max, commit]
   );
-  const restoreTo = (0, import_react23.useCallback)(
+  const restoreTo = (0, import_react25.useCallback)(
     async (trackId, index) => {
       const h = dataRef.current[trackId];
       if (!h || index < 0 || index >= h.entries.length || index === h.cursor) return false;
@@ -5000,7 +5269,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const undo = (0, import_react23.useCallback)(
+  const undo = (0, import_react25.useCallback)(
     (trackId) => {
       const h = dataRef.current[trackId];
       if (!h || h.cursor <= 0) return Promise.resolve(false);
@@ -5008,7 +5277,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [restoreTo]
   );
-  const toggleFavorite = (0, import_react23.useCallback)(
+  const toggleFavorite = (0, import_react25.useCallback)(
     (trackId, index) => {
       const h = dataRef.current[trackId];
       if (!h || index < 0 || index >= h.entries.length) return;
@@ -5017,7 +5286,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const restore = (0, import_react23.useCallback)(
+  const restore = (0, import_react25.useCallback)(
     (trackId, state) => {
       const entries = Array.isArray(state?.entries) ? [...state.entries] : [];
       const raw = typeof state?.cursor === "number" ? state.cursor : entries.length - 1;
@@ -5026,15 +5295,15 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const list = (0, import_react23.useCallback)(
+  const list = (0, import_react25.useCallback)(
     (trackId) => dataRef.current[trackId] ?? EMPTY,
     []
   );
-  const canUndo = (0, import_react23.useCallback)((trackId) => {
+  const canUndo = (0, import_react25.useCallback)((trackId) => {
     const h = dataRef.current[trackId];
     return !!h && h.cursor > 0;
   }, []);
-  const clear = (0, import_react23.useCallback)(
+  const clear = (0, import_react25.useCallback)(
     (trackId) => {
       if (dataRef.current[trackId]) {
         const next = { ...dataRef.current };
@@ -5046,11 +5315,11 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [bump]
   );
-  const reset = (0, import_react23.useCallback)(() => {
+  const reset = (0, import_react25.useCallback)(() => {
     dataRef.current = {};
     bump();
   }, [bump]);
-  return (0, import_react23.useMemo)(
+  return (0, import_react25.useMemo)(
     () => ({ record, undo, restoreTo, list, canUndo, clear, reset, restore, toggleFavorite }),
     [record, undo, restoreTo, list, canUndo, clear, reset, restore, toggleFavorite]
   );
@@ -5183,7 +5452,7 @@ function resolveTrackGroups(parsedGroups, tracks, getDbId, opts = {}) {
 }
 
 // src/panel-core/useTransitionOps.ts
-var import_react24 = require("react");
+var import_react26 = require("react");
 function useTransitionOps({
   host,
   adapter,
@@ -5200,8 +5469,8 @@ function useTransitionOps({
   resolvedFades
 }) {
   const { identity } = adapter;
-  const appliedFadeAutomationRef = (0, import_react24.useRef)(/* @__PURE__ */ new Set());
-  const applyCrossfadeAutomation = (0, import_react24.useCallback)(
+  const appliedFadeAutomationRef = (0, import_react26.useRef)(/* @__PURE__ */ new Set());
+  const applyCrossfadeAutomation = (0, import_react26.useCallback)(
     async (originTrackId, targetTrackId, bars, bpm, sliderPos) => {
       if (host.setTrackVolumeAutomation) {
         const curves = buildCrossfadeVolumeCurves(bars, bpm, sliderPos);
@@ -5218,7 +5487,7 @@ function useTransitionOps({
     },
     [host]
   );
-  const applyFadeAutomation = (0, import_react24.useCallback)(
+  const applyFadeAutomation = (0, import_react26.useCallback)(
     async (trackId, direction, bars, bpm, sliderPos, gesture) => {
       if (!host.setTrackVolumeAutomation) return;
       const points = buildFadeVolumeCurve(bars, bpm, direction, sliderPos, gesture);
@@ -5227,8 +5496,8 @@ function useTransitionOps({
     },
     [host]
   );
-  const [isCreatingCrossfade, setIsCreatingCrossfade] = (0, import_react24.useState)(false);
-  const handleCreateCrossfade = (0, import_react24.useCallback)(
+  const [isCreatingCrossfade, setIsCreatingCrossfade] = (0, import_react26.useState)(false);
+  const handleCreateCrossfade = (0, import_react26.useCallback)(
     async (origin, target) => {
       const scene = activeSceneId;
       const fromSceneId = sceneContext?.transitionFromSceneId ?? "";
@@ -5356,8 +5625,8 @@ function useTransitionOps({
       loadTracks
     ]
   );
-  const [isCreatingFade, setIsCreatingFade] = (0, import_react24.useState)(false);
-  const handleCreateFade = (0, import_react24.useCallback)(
+  const [isCreatingFade, setIsCreatingFade] = (0, import_react26.useState)(false);
+  const handleCreateFade = (0, import_react26.useCallback)(
     async (selection, direction, gesture) => {
       const scene = activeSceneId;
       const fromSceneId = sceneContext?.transitionFromSceneId ?? "";
@@ -5467,7 +5736,7 @@ function useTransitionOps({
       loadTracks
     ]
   );
-  const handleCrossfadeMute = (0, import_react24.useCallback)(
+  const handleCrossfadeMute = (0, import_react26.useCallback)(
     (pair) => {
       const newMuted = !pair.origin.runtimeState.muted;
       for (const id of [pair.origin.handle.id, pair.target.handle.id]) {
@@ -5482,7 +5751,7 @@ function useTransitionOps({
     },
     [host, setTracks]
   );
-  const handleCrossfadeSolo = (0, import_react24.useCallback)(
+  const handleCrossfadeSolo = (0, import_react26.useCallback)(
     (pair) => {
       const newSolo = !pair.origin.runtimeState.solo;
       for (const id of [pair.origin.handle.id, pair.target.handle.id]) {
@@ -5497,7 +5766,7 @@ function useTransitionOps({
     },
     [host, setTracks]
   );
-  const handleCrossfadeDelete = (0, import_react24.useCallback)(
+  const handleCrossfadeDelete = (0, import_react26.useCallback)(
     async (pair) => {
       try {
         for (const member of [pair.origin, pair.target]) {
@@ -5523,8 +5792,8 @@ function useTransitionOps({
     },
     [host, activeSceneId, setCrossfadePairsMeta, setTracks]
   );
-  const crossfadeSliderTimers = (0, import_react24.useRef)({});
-  const handleCrossfadeSlider = (0, import_react24.useCallback)(
+  const crossfadeSliderTimers = (0, import_react26.useRef)({});
+  const handleCrossfadeSlider = (0, import_react26.useCallback)(
     (pair, pos) => {
       setCrossfadePairsMeta(
         (prev) => prev.map((p) => p.groupId === pair.groupId ? { ...p, sliderPos: pos } : p)
@@ -5557,7 +5826,7 @@ function useTransitionOps({
     },
     [host, activeSceneId, applyCrossfadeAutomation, setCrossfadePairsMeta]
   );
-  const handleFadeDelete = (0, import_react24.useCallback)(
+  const handleFadeDelete = (0, import_react26.useCallback)(
     async (fade) => {
       try {
         await host.deleteTrack(fade.track.handle.id);
@@ -5577,8 +5846,8 @@ function useTransitionOps({
     },
     [host, activeSceneId, setFadesMeta, setTracks]
   );
-  const fadeSliderTimers = (0, import_react24.useRef)({});
-  const handleFadeSlider = (0, import_react24.useCallback)(
+  const fadeSliderTimers = (0, import_react26.useRef)({});
+  const handleFadeSlider = (0, import_react26.useCallback)(
     (fade, pos) => {
       setFadesMeta(
         (prev) => prev.map((f) => f.dbId === fade.dbId ? { ...f, meta: { ...f.meta, sliderPos: pos } } : f)
@@ -5608,8 +5877,8 @@ function useTransitionOps({
     },
     [host, activeSceneId, applyFadeAutomation, setFadesMeta]
   );
-  const lastResyncKeyRef = (0, import_react24.useRef)("");
-  (0, import_react24.useEffect)(() => {
+  const lastResyncKeyRef = (0, import_react26.useRef)("");
+  (0, import_react26.useEffect)(() => {
     if (!host.getTrackSound || resolvedCrossfadePairs.length === 0 && resolvedFades.length === 0) {
       return;
     }
@@ -5650,7 +5919,7 @@ function useTransitionOps({
       cancelled = true;
     };
   }, [resolvedCrossfadePairs, resolvedFades, host, adapter]);
-  (0, import_react24.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (!host.setTrackVolumeAutomation || resolvedFades.length === 0) return;
     void (async () => {
       const mc = await host.getMusicalContext();
@@ -5684,7 +5953,7 @@ function useTransitionOps({
 }
 
 // src/panel-core/useGeneratorPanelCore.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var EMPTY_PLACEHOLDERS = [];
 function useGeneratorPanelCore({
   ui,
@@ -5704,8 +5973,8 @@ function useGeneratorPanelCore({
   } = ui;
   const { identity, features } = adapter;
   const logTag = identity.logTag;
-  const adapterRef = (0, import_react25.useRef)(adapter);
-  (0, import_react25.useEffect)(() => {
+  const adapterRef = (0, import_react27.useRef)(adapter);
+  (0, import_react27.useEffect)(() => {
     if (adapterRef.current !== adapter) {
       adapterRef.current = adapter;
       console.warn(
@@ -5715,27 +5984,27 @@ function useGeneratorPanelCore({
   }, [adapter, logTag]);
   const supportsMeters = typeof host.getTrackLevels === "function";
   const trackLevels = useTrackLevels(host, isExpanded);
-  const [tracks, setTracks] = (0, import_react25.useState)([]);
-  const [isLoadingTracks, setIsLoadingTracks] = (0, import_react25.useState)(false);
-  const [importOpen, setImportOpen] = (0, import_react25.useState)(false);
-  const [soundImportTarget, setSoundImportTarget] = (0, import_react25.useState)(null);
-  const [designerView, setDesignerView] = (0, import_react25.useState)(false);
-  const [transitionSourceTotal, setTransitionSourceTotal] = (0, import_react25.useState)(0);
-  const [crossfadePairsMeta, setCrossfadePairsMeta] = (0, import_react25.useState)([]);
-  const [fadesMeta, setFadesMeta] = (0, import_react25.useState)([]);
-  const [genericGroupMetas, setGenericGroupMetas] = (0, import_react25.useState)({});
+  const [tracks, setTracks] = (0, import_react27.useState)([]);
+  const [isLoadingTracks, setIsLoadingTracks] = (0, import_react27.useState)(false);
+  const [importOpen, setImportOpen] = (0, import_react27.useState)(false);
+  const [soundImportTarget, setSoundImportTarget] = (0, import_react27.useState)(null);
+  const [designerView, setDesignerView] = (0, import_react27.useState)(false);
+  const [transitionSourceTotal, setTransitionSourceTotal] = (0, import_react27.useState)(0);
+  const [crossfadePairsMeta, setCrossfadePairsMeta] = (0, import_react27.useState)([]);
+  const [fadesMeta, setFadesMeta] = (0, import_react27.useState)([]);
+  const [genericGroupMetas, setGenericGroupMetas] = (0, import_react27.useState)({});
   const [isComposing, , setIsComposingForScene] = useSceneState(activeSceneId, false);
   const [placeholders, , setPlaceholdersForScene] = useSceneState(
     activeSceneId,
     EMPTY_PLACEHOLDERS
   );
-  const saveTimeoutRefs = (0, import_react25.useRef)({});
-  const editLoadStartedRef = (0, import_react25.useRef)(/* @__PURE__ */ new Set());
-  const [availableInstruments, setAvailableInstruments] = (0, import_react25.useState)([]);
-  const [instrumentsLoading, setInstrumentsLoading] = (0, import_react25.useState)(false);
-  const engineToDbIdRef = (0, import_react25.useRef)(/* @__PURE__ */ new Map());
-  const tracksLoadedForSceneRef = (0, import_react25.useRef)(null);
-  const persistSoundHistory = (0, import_react25.useCallback)(
+  const saveTimeoutRefs = (0, import_react27.useRef)({});
+  const editLoadStartedRef = (0, import_react27.useRef)(/* @__PURE__ */ new Set());
+  const [availableInstruments, setAvailableInstruments] = (0, import_react27.useState)([]);
+  const [instrumentsLoading, setInstrumentsLoading] = (0, import_react27.useState)(false);
+  const engineToDbIdRef = (0, import_react27.useRef)(/* @__PURE__ */ new Map());
+  const tracksLoadedForSceneRef = (0, import_react27.useRef)(null);
+  const persistSoundHistory = (0, import_react27.useCallback)(
     (trackId, state) => {
       if (!activeSceneId) return;
       const dbId = engineToDbIdRef.current.get(trackId) ?? trackId;
@@ -5755,7 +6024,7 @@ function useGeneratorPanelCore({
     setItems: setTracks,
     getId: (t) => t.handle.dbId
   });
-  const loadTracks = (0, import_react25.useCallback)(
+  const loadTracks = (0, import_react27.useCallback)(
     async (incremental = false) => {
       const sceneAtStart = activeSceneId;
       if (!sceneAtStart) {
@@ -5880,18 +6149,18 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId, soundHistory, adapter, logTag]
   );
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     loadTracks();
   }, [loadTracks]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     const map = /* @__PURE__ */ new Map();
     for (const t of tracks) {
       map.set(t.handle.id, t.handle.dbId);
     }
     engineToDbIdRef.current = map;
   }, [tracks]);
-  const loadedCompletedIdsRef = (0, import_react25.useRef)(/* @__PURE__ */ new Set());
-  (0, import_react25.useEffect)(() => {
+  const loadedCompletedIdsRef = (0, import_react27.useRef)(/* @__PURE__ */ new Set());
+  (0, import_react27.useEffect)(() => {
     if (placeholders.length === 0) {
       loadedCompletedIdsRef.current.clear();
       return;
@@ -5910,16 +6179,16 @@ function useGeneratorPanelCore({
       loadTracks(true);
     }
   }, [placeholders, loadTracks, logTag]);
-  const adoptAndLoad = (0, import_react25.useCallback)(() => {
+  const adoptAndLoad = (0, import_react27.useCallback)(() => {
     loadTracks(true);
   }, [loadTracks]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     const unsub = host.onEngineReady(() => {
       adoptAndLoad();
     });
     return unsub;
   }, [host, adoptAndLoad]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (typeof host.onAfterAgentMutation !== "function") return;
     let timer = null;
     const unsub = host.onAfterAgentMutation(() => {
@@ -5934,13 +6203,13 @@ function useGeneratorPanelCore({
       if (timer) clearTimeout(timer);
     };
   }, [host, loadTracks]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     const unsub = host.onTrackStateChange((trackId, state) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: state } : t));
     });
     return unsub;
   }, [host]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (!features.bulkComposePlaceholders) return;
     console.log(`[${logTag}] Subscribing to composeProgress`);
     const unsub = host.onComposeProgress((event) => {
@@ -5974,7 +6243,7 @@ function useGeneratorPanelCore({
     });
     return unsub;
   }, [host, setIsComposingForScene, setPlaceholdersForScene, features.bulkComposePlaceholders, logTag]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     const refs = saveTimeoutRefs;
     return () => {
       for (const timeout of Object.values(refs.current)) {
@@ -5982,9 +6251,9 @@ function useGeneratorPanelCore({
       }
     };
   }, []);
-  const isAddingTrackRef = (0, import_react25.useRef)(false);
-  const [isAddingTrack, setIsAddingTrack] = (0, import_react25.useState)(false);
-  const handleAddTrack = (0, import_react25.useCallback)(async () => {
+  const isAddingTrackRef = (0, import_react27.useRef)(false);
+  const [isAddingTrack, setIsAddingTrack] = (0, import_react27.useState)(false);
+  const handleAddTrack = (0, import_react27.useCallback)(async () => {
     if (isAddingTrackRef.current) return;
     if (!activeSceneId) {
       host.showToast("warning", "Select SCENE");
@@ -6024,7 +6293,7 @@ function useGeneratorPanelCore({
       setIsAddingTrack(false);
     }
   }, [host, adapter, identity, activeSceneId, isConnected, isAuthenticated, tracks.length, onExpandSelf]);
-  const handlePortTrack = (0, import_react25.useCallback)(
+  const handlePortTrack = (0, import_react27.useCallback)(
     async (sel) => {
       if (!activeSceneId) {
         host.showToast("warning", "Select SCENE");
@@ -6081,7 +6350,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, identity, activeSceneId, isConnected, tracks.length, loadTracks]
   );
-  const handleSoundImportPick = (0, import_react25.useCallback)(
+  const handleSoundImportPick = (0, import_react27.useCallback)(
     async (sel) => {
       const target = soundImportTarget;
       if (!target || !host.getTrackSound) {
@@ -6112,8 +6381,8 @@ function useGeneratorPanelCore({
     },
     [soundImportTarget, host, adapter, identity.familyKey, soundHistory]
   );
-  const [isExportingMidi, setIsExportingMidi] = (0, import_react25.useState)(false);
-  const handleExportMidi = (0, import_react25.useCallback)(async () => {
+  const [isExportingMidi, setIsExportingMidi] = (0, import_react27.useState)(false);
+  const handleExportMidi = (0, import_react27.useCallback)(async () => {
     if (isExportingMidi) return;
     setIsExportingMidi(true);
     try {
@@ -6144,10 +6413,10 @@ function useGeneratorPanelCore({
   const xfFromId = sceneContext?.transitionFromSceneId ?? null;
   const xfToId = sceneContext?.transitionToSceneId ?? null;
   const canCrossfade = features.transitionDesigner && sceneContext?.sceneType === "transition" && !!xfFromId && !!xfToId && !!host.listSceneFamilyTracks;
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (!canCrossfade) setDesignerView(false);
   }, [canCrossfade]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (!canCrossfade || !xfFromId || !xfToId || !host.listSceneFamilyTracks) {
       setTransitionSourceTotal(0);
       return;
@@ -6163,12 +6432,12 @@ function useGeneratorPanelCore({
     };
   }, [canCrossfade, xfFromId, xfToId, host]);
   const transitionDone = crossfadePairsMeta.length * 2 + fadesMeta.length;
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (!onHeaderContent) return;
     const addDisabled = needsContract || !isConnected || !activeSceneId || tracks.length >= identity.maxTracks || isAddingTrack;
     onHeaderContent(
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex gap-1 items-center", children: [
-        features.importTracks && (!canCrossfade || !designerView) && host.listImportableTracks && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex gap-1 items-center", children: [
+        features.importTracks && (!canCrossfade || !designerView) && host.listImportableTracks && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "button",
           {
             "data-testid": `import-from-scene-${identity.familyKey}-button`,
@@ -6182,7 +6451,7 @@ function useGeneratorPanelCore({
             children: identity.importTrackLabel ?? "Import Track"
           }
         ),
-        (!canCrossfade || !designerView) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        (!canCrossfade || !designerView) && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "button",
           {
             "data-testid": `add-${identity.familyKey}-track-button`,
@@ -6198,7 +6467,7 @@ function useGeneratorPanelCore({
             children: identity.addTrackLabel ?? "Add Track"
           }
         ),
-        canCrossfade && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        canCrossfade && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "button",
           {
             "data-testid": `${identity.familyKey}-view-toggle`,
@@ -6217,7 +6486,7 @@ function useGeneratorPanelCore({
             title: designerView ? "Back to the track list" : "Open the transition designer",
             className: "relative overflow-hidden px-2 py-0.5 text-[10px] font-medium rounded-sm border border-sas-accent/40 text-sas-accent transition-colors hover:border-sas-accent disabled:opacity-50",
             children: [
-              transitionSourceTotal > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              transitionSourceTotal > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                 "span",
                 {
                   className: "absolute inset-y-0 left-0 bg-sas-accent/25",
@@ -6225,7 +6494,7 @@ function useGeneratorPanelCore({
                   "aria-hidden": true
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "relative", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "relative", children: [
                 "\u21C4 ",
                 designerView ? "Transition" : "Tracks",
                 transitionSourceTotal > 0 ? ` ${transitionDone}/${transitionSourceTotal}` : ""
@@ -6256,7 +6525,7 @@ function useGeneratorPanelCore({
     identity,
     features.importTracks
   ]);
-  (0, import_react25.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (!onLoading) return;
     const anyGenerating = tracks.some((t) => t.isGenerating);
     onLoading(isLoadingTracks || anyGenerating || isBulkActive);
@@ -6264,7 +6533,7 @@ function useGeneratorPanelCore({
       onLoading(false);
     };
   }, [onLoading, isLoadingTracks, tracks, isBulkActive]);
-  const handleDeleteTrack = (0, import_react25.useCallback)(
+  const handleDeleteTrack = (0, import_react27.useCallback)(
     async (trackId) => {
       try {
         await host.deleteTrack(trackId);
@@ -6280,7 +6549,7 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId]
   );
-  const handlePromptChange = (0, import_react25.useCallback)(
+  const handlePromptChange = (0, import_react27.useCallback)(
     (trackId, prompt) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, prompt } : t));
       const dbId = engineToDbIdRef.current.get(trackId) ?? trackId;
@@ -6296,7 +6565,7 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId]
   );
-  const resolvedGenericGroups = (0, import_react25.useMemo)(() => {
+  const resolvedGenericGroups = (0, import_react27.useMemo)(() => {
     const out = {};
     for (const ext of adapter.groupExtensions ?? []) {
       out[ext.metaKey] = resolveTrackGroups(
@@ -6310,18 +6579,18 @@ function useGeneratorPanelCore({
     }
     return out;
   }, [adapter, genericGroupMetas, tracks]);
-  const genericGroupMemberDbIds = (0, import_react25.useMemo)(() => {
+  const genericGroupMemberDbIds = (0, import_react27.useMemo)(() => {
     const s = /* @__PURE__ */ new Set();
     for (const r of Object.values(resolvedGenericGroups)) {
       for (const dbId of r.memberDbIds) s.add(dbId);
     }
     return s;
   }, [resolvedGenericGroups]);
-  const engineToDbId = (0, import_react25.useCallback)(
+  const engineToDbId = (0, import_react27.useCallback)(
     (trackId) => engineToDbIdRef.current.get(trackId) ?? trackId,
     []
   );
-  const updateTrack = (0, import_react25.useCallback)(
+  const updateTrack = (0, import_react27.useCallback)(
     (trackId, patch) => {
       setTracks(
         (prev) => prev.map(
@@ -6331,18 +6600,18 @@ function useGeneratorPanelCore({
     },
     []
   );
-  const markEditLoaded = (0, import_react25.useCallback)((trackId) => {
+  const markEditLoaded = (0, import_react27.useCallback)((trackId) => {
     editLoadStartedRef.current.add(trackId);
   }, []);
-  const tracksRef = (0, import_react25.useRef)(tracks);
-  (0, import_react25.useEffect)(() => {
+  const tracksRef = (0, import_react27.useRef)(tracks);
+  (0, import_react27.useEffect)(() => {
     tracksRef.current = tracks;
   }, [tracks]);
-  const resolvedGenericGroupsRef = (0, import_react25.useRef)(resolvedGenericGroups);
-  (0, import_react25.useEffect)(() => {
+  const resolvedGenericGroupsRef = (0, import_react27.useRef)(resolvedGenericGroups);
+  (0, import_react27.useEffect)(() => {
     resolvedGenericGroupsRef.current = resolvedGenericGroups;
   }, [resolvedGenericGroups]);
-  const makeServices = (0, import_react25.useCallback)(() => {
+  const makeServices = (0, import_react27.useCallback)(() => {
     return {
       host,
       activeSceneId,
@@ -6361,7 +6630,7 @@ function useGeneratorPanelCore({
       resolvedGroups: (metaKey) => resolvedGenericGroupsRef.current[metaKey]?.resolved ?? []
     };
   }, [host, activeSceneId, updateTrack, loadTracks, soundHistory, engineToDbId, markEditLoaded, identity, adapter]);
-  const handleGenerate = (0, import_react25.useCallback)(
+  const handleGenerate = (0, import_react27.useCallback)(
     async (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track || !track.prompt.trim()) return;
@@ -6388,7 +6657,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, tracks, isAuthenticated, makeServices]
   );
-  const handleMuteToggle = (0, import_react25.useCallback)(
+  const handleMuteToggle = (0, import_react27.useCallback)(
     (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -6408,7 +6677,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const handleSoloToggle = (0, import_react25.useCallback)(
+  const handleSoloToggle = (0, import_react27.useCallback)(
     (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -6428,7 +6697,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const handleVolumeChange = (0, import_react25.useCallback)(
+  const handleVolumeChange = (0, import_react27.useCallback)(
     (trackId, volume) => {
       setTracks(
         (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: { ...t.runtimeState, volume } } : t)
@@ -6438,7 +6707,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handlePanChange = (0, import_react25.useCallback)(
+  const handlePanChange = (0, import_react27.useCallback)(
     (trackId, pan) => {
       setTracks(
         (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: { ...t.runtimeState, pan } } : t)
@@ -6448,7 +6717,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleShuffle = (0, import_react25.useCallback)(
+  const handleShuffle = (0, import_react27.useCallback)(
     async (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -6490,7 +6759,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, tracks, soundHistory, logTag]
   );
-  const handleCopy = (0, import_react25.useCallback)(
+  const handleCopy = (0, import_react27.useCallback)(
     async (trackId) => {
       try {
         const newHandle = await host.duplicateTrack(trackId);
@@ -6503,7 +6772,7 @@ function useGeneratorPanelCore({
     },
     [host, loadTracks]
   );
-  const handleFxToggle = (0, import_react25.useCallback)(
+  const handleFxToggle = (0, import_react27.useCallback)(
     (trackId, category, enabled) => {
       setTracks(
         (prev) => prev.map(
@@ -6526,7 +6795,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleFxPresetChange = (0, import_react25.useCallback)(
+  const handleFxPresetChange = (0, import_react27.useCallback)(
     (trackId, category, presetIndex) => {
       setTracks(
         (prev) => prev.map(
@@ -6552,7 +6821,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleFxDryWetChange = (0, import_react25.useCallback)(
+  const handleFxDryWetChange = (0, import_react27.useCallback)(
     (trackId, category, value) => {
       setTracks(
         (prev) => prev.map(
@@ -6564,7 +6833,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const toggleFxDrawer = (0, import_react25.useCallback)(
+  const toggleFxDrawer = (0, import_react27.useCallback)(
     (trackId) => {
       setTracks(
         (prev) => prev.map((t) => {
@@ -6586,7 +6855,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const loadEditNotes = (0, import_react25.useCallback)(
+  const loadEditNotes = (0, import_react27.useCallback)(
     async (trackId) => {
       try {
         const mc = await host.getMusicalContext();
@@ -6604,7 +6873,7 @@ function useGeneratorPanelCore({
     },
     [host, logTag]
   );
-  const handleNotesChange = (0, import_react25.useCallback)(
+  const handleNotesChange = (0, import_react27.useCallback)(
     (trackId, notes) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, editNotes: notes } : t));
       const key = `edit:${trackId}`;
@@ -6634,7 +6903,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleTabChange = (0, import_react25.useCallback)(
+  const handleTabChange = (0, import_react27.useCallback)(
     (trackId, tab) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, drawerOpen: true, drawerTab: tab } : t));
       if (tab === "fx") {
@@ -6659,10 +6928,10 @@ function useGeneratorPanelCore({
     },
     [host, availableInstruments.length, instrumentsLoading, loadEditNotes]
   );
-  const handleProgressChange = (0, import_react25.useCallback)((trackId, pct) => {
+  const handleProgressChange = (0, import_react27.useCallback)((trackId, pct) => {
     setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, generationProgress: pct } : t));
   }, []);
-  const handleToggleDrawer = (0, import_react25.useCallback)((trackId) => {
+  const handleToggleDrawer = (0, import_react27.useCallback)((trackId) => {
     setTracks(
       (prev) => prev.map((t) => {
         if (t.handle.id !== trackId) return t;
@@ -6671,7 +6940,7 @@ function useGeneratorPanelCore({
       })
     );
   }, []);
-  const handleInstrumentSelect = (0, import_react25.useCallback)(
+  const handleInstrumentSelect = (0, import_react27.useCallback)(
     async (trackId, pluginId) => {
       const isDefaultInstrument = pluginId === (identity.defaultInstrumentPluginId ?? "Surge XT");
       if (isDefaultInstrument) {
@@ -6724,7 +6993,7 @@ function useGeneratorPanelCore({
     },
     [host, identity.defaultInstrumentPluginId, logTag]
   );
-  const handleShowEditor = (0, import_react25.useCallback)(
+  const handleShowEditor = (0, import_react27.useCallback)(
     async (trackId) => {
       try {
         await host.showInstrumentEditor(trackId);
@@ -6735,12 +7004,12 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleBackToInstruments = (0, import_react25.useCallback)((trackId) => {
+  const handleBackToInstruments = (0, import_react27.useCallback)((trackId) => {
     setTracks(
       (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, editorStage: false } : t)
     );
   }, []);
-  const handleRefreshInstruments = (0, import_react25.useCallback)(() => {
+  const handleRefreshInstruments = (0, import_react27.useCallback)(() => {
     setInstrumentsLoading(true);
     host.getAvailableInstruments().then((instruments) => {
       setAvailableInstruments(instruments);
@@ -6749,13 +7018,13 @@ function useGeneratorPanelCore({
       setInstrumentsLoading(false);
     });
   }, [host]);
-  const onAuditionNote = (0, import_react25.useCallback)(
+  const onAuditionNote = (0, import_react27.useCallback)(
     (trackId, pitch, velocity, ms) => {
       void host.auditionNote(trackId, pitch, velocity, ms);
     },
     [host]
   );
-  const { resolvedCrossfadePairs, crossfadeMemberDbIds } = (0, import_react25.useMemo)(() => {
+  const { resolvedCrossfadePairs, crossfadeMemberDbIds } = (0, import_react27.useMemo)(() => {
     const byDbId = new Map(tracks.map((t) => [t.handle.dbId, t]));
     const pairs = [];
     const members = /* @__PURE__ */ new Set();
@@ -6770,7 +7039,7 @@ function useGeneratorPanelCore({
     }
     return { resolvedCrossfadePairs: pairs, crossfadeMemberDbIds: members };
   }, [tracks, crossfadePairsMeta]);
-  const { resolvedFades, fadeMemberDbIds } = (0, import_react25.useMemo)(() => {
+  const { resolvedFades, fadeMemberDbIds } = (0, import_react27.useMemo)(() => {
     const byDbId = new Map(tracks.map((t) => [t.handle.dbId, t]));
     const list = [];
     const members = /* @__PURE__ */ new Set();
@@ -6798,7 +7067,7 @@ function useGeneratorPanelCore({
     resolvedCrossfadePairs,
     resolvedFades
   });
-  const setGroupMute = (0, import_react25.useCallback)(
+  const setGroupMute = (0, import_react27.useCallback)(
     (trackIds, muted) => {
       for (const id of trackIds) {
         setTracks(
@@ -6810,7 +7079,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const setGroupSolo = (0, import_react25.useCallback)(
+  const setGroupSolo = (0, import_react27.useCallback)(
     (trackIds, solo) => {
       for (const id of trackIds) {
         setTracks(
@@ -6822,7 +7091,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const deleteGroup = (0, import_react25.useCallback)(
+  const deleteGroup = (0, import_react27.useCallback)(
     async (members, cleanupKeySuffixes) => {
       for (const member of members) {
         try {
@@ -6842,7 +7111,7 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId, loadTracks]
   );
-  const handlers = (0, import_react25.useMemo)(
+  const handlers = (0, import_react27.useMemo)(
     () => ({
       promptChange: handlePromptChange,
       generate: (trackId) => {
@@ -6956,8 +7225,8 @@ function useGeneratorPanelCore({
 }
 
 // src/panel-core/GeneratorPanelShell.tsx
-var import_react26 = __toESM(require("react"));
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_react28 = __toESM(require("react"));
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function GeneratorPanelShell({ core, slots }) {
   const {
     ui,
@@ -7010,8 +7279,9 @@ function GeneratorPanelShell({ core, slots }) {
     deleteGroup
   } = core;
   const { host, activeSceneId, isAuthenticated, sceneContext, onSelectScene, onOpenContract } = ui;
+  const panelBus = usePanelBus(host, activeSceneId);
   const { identity, features } = adapter;
-  const buildRowProps = (0, import_react26.useCallback)(
+  const buildRowProps = (0, import_react28.useCallback)(
     (track, drag) => {
       const id = track.handle.id;
       const pickerProps = features.instrumentPicker ? {
@@ -7110,12 +7380,12 @@ function GeneratorPanelShell({ core, slots }) {
     ]
   );
   if (!activeSceneId) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "div",
       {
         "data-testid": `no-scene-placeholder-${identity.familyKey}`,
         className: "flex items-center justify-center py-8",
-        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           "button",
           {
             onClick: () => onSelectScene?.(),
@@ -7127,12 +7397,12 @@ function GeneratorPanelShell({ core, slots }) {
     );
   }
   if (!sceneContext?.hasContract) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "div",
       {
         "data-testid": `no-contract-placeholder-${identity.familyKey}`,
         className: "flex items-center justify-center py-8",
-        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           "button",
           {
             onClick: () => onOpenContract?.(),
@@ -7144,7 +7414,7 @@ function GeneratorPanelShell({ core, slots }) {
     );
   }
   if (features.bulkComposePlaceholders && isComposing) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SorceryProgressBar, { isLoading: true, statusText: "COMPOSING...", heightClass: "h-10" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SorceryProgressBar, { isLoading: true, statusText: "COMPOSING...", heightClass: "h-10" }) });
   }
   const activePlaceholders = features.bulkComposePlaceholders ? placeholders : [];
   if (activePlaceholders.length > 0) {
@@ -7155,18 +7425,18 @@ function GeneratorPanelShell({ core, slots }) {
         tracksByDbId.set(t.handle.id, t);
       }
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: activePlaceholders.map((ph) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: activePlaceholders.map((ph) => {
       const loadedTrack = ph.status === "completed" ? tracksByDbId.get(ph.id) : void 0;
       if (loadedTrack) {
-        return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TrackRow, { ...buildRowProps(loadedTrack) }, ph.id);
+        return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TrackRow, { ...buildRowProps(loadedTrack) }, ph.id);
       }
-      return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         "div",
         {
           "data-testid": "bulk-placeholder-track",
           className: "relative rounded-sm border w-full overflow-hidden border-sas-border bg-sas-panel-alt",
           style: { borderLeftColor: identity.placeholderAccentColor, borderLeftWidth: "3px" },
-          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SorceryProgressBar, { isLoading: true, statusText: "CONJURING MIDI...", heightClass: "h-10" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SorceryProgressBar, { isLoading: true, statusText: "CONJURING MIDI...", heightClass: "h-10" })
         },
         ph.id
       );
@@ -7178,13 +7448,13 @@ function GeneratorPanelShell({ core, slots }) {
     supportsMeters,
     levels: supportsMeters ? trackLevels : void 0,
     handlers,
-    renderDefaultTrackRow: (track, overrides, drag) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TrackRow, { ...{ ...buildRowProps(track, drag), ...overrides ?? {} } }, track.handle.id),
+    renderDefaultTrackRow: (track, overrides, drag) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TrackRow, { ...{ ...buildRowProps(track, drag), ...overrides ?? {} } }, track.handle.id),
     setGroupMute,
     setGroupSolo,
     deleteGroup
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: [
-    features.importTracks && host.listImportableTracks && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: [
+    features.importTracks && host.listImportableTracks && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       ImportTrackModal,
       {
         host,
@@ -7197,7 +7467,7 @@ function GeneratorPanelShell({ core, slots }) {
         testIdPrefix: `${identity.familyKey}-import`
       }
     ),
-    features.importTracks && host.listImportableTracks && host.getTrackSound && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    features.importTracks && host.listImportableTracks && host.getTrackSound && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       ImportTrackModal,
       {
         host,
@@ -7212,7 +7482,7 @@ function GeneratorPanelShell({ core, slots }) {
       }
     ),
     slots?.modals,
-    canCrossfade && xfFromId && xfToId && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: designerView ? "contents" : "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    canCrossfade && xfFromId && xfToId && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: designerView ? "contents" : "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       TransitionDesigner,
       {
         host,
@@ -7229,9 +7499,28 @@ function GeneratorPanelShell({ core, slots }) {
         testIdPrefix: `${identity.familyKey}-transition-designer`
       }
     ) }),
-    !(designerView && canCrossfade) && (isLoadingTracks ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "text-sas-muted text-xs text-center py-4", children: "Loading tracks..." }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    !(designerView && canCrossfade) && (isLoadingTracks ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "text-sas-muted text-xs text-center py-4", children: "Loading tracks..." }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+      panelBus.supported && panelBus.bus && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        PanelMasterStrip,
+        {
+          bus: panelBus.bus,
+          availableFx: panelBus.availableFx,
+          fxLoading: panelBus.fxLoading,
+          soloedOut: anySolo && !panelBus.bus.soloed,
+          fxPickerOpen: panelBus.fxPickerOpen,
+          onToggleFxPicker: panelBus.setFxPickerOpen,
+          onRefreshFx: panelBus.refreshFx,
+          onVolumeChange: panelBus.onVolumeChange,
+          onMuteToggle: panelBus.onMuteToggle,
+          onSoloToggle: panelBus.onSoloToggle,
+          onAddFx: panelBus.onAddFx,
+          onRemoveFx: panelBus.onRemoveFx,
+          onToggleFxEnabled: panelBus.onToggleFxEnabled,
+          onShowFxEditor: panelBus.onShowFxEditor
+        }
+      ),
       slots?.beforeRows,
-      resolvedCrossfadePairs.map((pair) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      resolvedCrossfadePairs.map((pair) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         CrossfadeTrackRow,
         {
           accentColor: identity.transitionAccentColor,
@@ -7268,7 +7557,7 @@ function GeneratorPanelShell({ core, slots }) {
         },
         pair.groupId
       )),
-      resolvedFades.map((fade) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      resolvedFades.map((fade) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         FadeTrackRow,
         {
           accentColor: identity.transitionAccentColor,
@@ -7294,20 +7583,20 @@ function GeneratorPanelShell({ core, slots }) {
         fade.dbId
       )),
       (adapter.groupExtensions ?? []).flatMap(
-        (ext) => (resolvedGenericGroups[ext.metaKey]?.resolved ?? []).map((group) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react26.default.Fragment, { children: ext.renderGroup(group, groupCtx) }, `${ext.metaKey}:${group.groupId}`))
+        (ext) => (resolvedGenericGroups[ext.metaKey]?.resolved ?? []).map((group) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react28.default.Fragment, { children: ext.renderGroup(group, groupCtx) }, `${ext.metaKey}:${group.groupId}`))
       ),
       tracks.map((track, index) => {
         if (crossfadeMemberDbIds.has(track.handle.dbId) || fadeMemberDbIds.has(track.handle.dbId) || genericGroupMemberDbIds.has(track.handle.dbId)) {
           return null;
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TrackRow, { ...buildRowProps(track, reorder.dragPropsFor(index)) }, track.handle.id);
+        return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TrackRow, { ...buildRowProps(track, reorder.dragPropsFor(index)) }, track.handle.id);
       }),
       slots?.afterRows
     ] })),
     features.exportMidi && !designerView && !isLoadingTracks && tracks.length > 0 && (() => {
       const hasAnyMidi = tracks.some((t) => t.hasMidi);
       const exportDisabled = isExportingMidi || !hasAnyMidi;
-      return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         "button",
         {
           "data-testid": "export-midi-tracks-button",
@@ -7375,7 +7664,7 @@ function createSurgeSoundAdapter(host, overrides = {}) {
 }
 
 // src/constants/sdk-version.ts
-var PLUGIN_SDK_VERSION = "2.35.0";
+var PLUGIN_SDK_VERSION = "2.37.0";
 
 // src/utils/format-concurrent-tracks.ts
 function formatConcurrentTracks(ctx) {
@@ -7551,6 +7840,7 @@ function pickTopKWeighted(scored, options = {}) {
   PLUGIN_SDK_VERSION,
   PX_PER_BEAT,
   PanSlider,
+  PanelMasterStrip,
   PianoRollEditor,
   PluginError,
   RESIZE_HANDLE_PX,
@@ -7615,6 +7905,7 @@ function pickTopKWeighted(scored, options = {}) {
   transposeNotes,
   useAnySolo,
   useGeneratorPanelCore,
+  usePanelBus,
   useSceneState,
   useSoundHistory,
   useTrackLevel,