@signalsandsorcery/plugin-sdk 1.0.0

package/dist/index.js

@@ -0,0 +1,1312 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  DB_MAX: () => DB_MAX,
+  DB_MIN: () => DB_MIN,
+  DEFAULT_FX_CATEGORY_DETAIL: () => DEFAULT_FX_CATEGORY_DETAIL,
+  DEFAULT_FX_DRY_WET: () => DEFAULT_FX_DRY_WET,
+  EMPTY_FX_DETAIL_STATE: () => EMPTY_FX_DETAIL_STATE,
+  EMPTY_FX_STATE: () => EMPTY_FX_STATE,
+  FX_CATEGORIES: () => FX_CATEGORIES,
+  FX_CHAIN_ORDER: () => FX_CHAIN_ORDER,
+  FX_DISPLAY_LABELS: () => FX_DISPLAY_LABELS,
+  FX_ENGINE_PLUGIN_NAMES: () => FX_ENGINE_PLUGIN_NAMES,
+  FX_PRESET_CONFIGS: () => FX_PRESET_CONFIGS,
+  FxToggleBar: () => FxToggleBar,
+  InstrumentDrawer: () => InstrumentDrawer,
+  PLUGIN_SDK_VERSION: () => PLUGIN_SDK_VERSION,
+  PanSlider: () => PanSlider,
+  PluginError: () => PluginError,
+  SLIDER_UNITY: () => SLIDER_UNITY,
+  SorceryProgressBar: () => SorceryProgressBar,
+  TrackRow: () => TrackRow,
+  VALID_INSTRUMENT_ROLES: () => VALID_INSTRUMENT_ROLES,
+  VolumeSlider: () => VolumeSlider,
+  calculateTimeBasedTarget: () => calculateTimeBasedTarget,
+  dbToSlider: () => dbToSlider,
+  sliderToDb: () => sliderToDb,
+  useSceneState: () => useSceneState
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/types/plugin-sdk.types.ts
+var PluginError = class extends Error {
+  constructor(code, message, details) {
+    super(message);
+    this.name = "PluginError";
+    this.code = code;
+    this.details = details;
+  }
+};
+
+// src/types/fx-toggle.types.ts
+var FX_CATEGORIES = [
+  "eq",
+  "compressor",
+  "chorus",
+  "phaser",
+  "delay",
+  "reverb"
+];
+var FX_CHAIN_ORDER = {
+  eq: 0,
+  compressor: 1,
+  chorus: 2,
+  phaser: 3,
+  delay: 4,
+  reverb: 5
+};
+var FX_ENGINE_PLUGIN_NAMES = {
+  eq: "4bandEq",
+  compressor: "compressor",
+  chorus: "chorus",
+  phaser: "phaser",
+  delay: "delay",
+  reverb: "reverb"
+};
+var FX_DISPLAY_LABELS = {
+  eq: "EQ",
+  compressor: "Comp",
+  chorus: "Chorus",
+  phaser: "Phaser",
+  delay: "Delay",
+  reverb: "Reverb"
+};
+var EMPTY_FX_STATE = {
+  eq: false,
+  compressor: false,
+  chorus: false,
+  phaser: false,
+  delay: false,
+  reverb: false
+};
+var DEFAULT_FX_DRY_WET = 0.33;
+var DEFAULT_FX_CATEGORY_DETAIL = {
+  enabled: false,
+  presetIndex: 0,
+  dryWet: DEFAULT_FX_DRY_WET
+};
+var EMPTY_FX_DETAIL_STATE = {
+  eq: { ...DEFAULT_FX_CATEGORY_DETAIL },
+  compressor: { ...DEFAULT_FX_CATEGORY_DETAIL },
+  chorus: { ...DEFAULT_FX_CATEGORY_DETAIL },
+  phaser: { ...DEFAULT_FX_CATEGORY_DETAIL },
+  delay: { ...DEFAULT_FX_CATEGORY_DETAIL },
+  reverb: { ...DEFAULT_FX_CATEGORY_DETAIL }
+};
+
+// src/components/TrackRow.tsx
+var import_lucide_react = require("lucide-react");
+
+// src/components/InstrumentDrawer.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function InstrumentDrawer({
+  instruments,
+  currentPluginId,
+  isLoading,
+  onSelect,
+  onRefresh
+}) {
+  const [search, setSearch] = (0, import_react.useState)("");
+  const SURGE_XT_DEFAULT_ID = "Surge XT";
+  const filtered = (0, import_react.useMemo)(() => {
+    const all = instruments.filter(
+      (i) => i.name !== "Surge XT"
+    );
+    if (!search.trim()) return all;
+    const q = search.toLowerCase();
+    return all.filter(
+      (i) => i.name.toLowerCase().includes(q) || i.manufacturer.toLowerCase().includes(q)
+    );
+  }, [instruments, search]);
+  const isDefaultSelected = currentPluginId === null;
+  const isSelected = (pluginId) => {
+    return pluginId === currentPluginId;
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          type: "text",
+          value: search,
+          onChange: (e) => setSearch(e.target.value),
+          placeholder: "Search instruments...",
+          className: "sas-input flex-1 px-2 py-1 text-xs"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          onClick: onRefresh,
+          disabled: isLoading,
+          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: isLoading ? "..." : "Refresh"
+        }
+      )
+    ] }),
+    isLoading && instruments.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "button",
+        {
+          onClick: () => onSelect(SURGE_XT_DEFAULT_ID),
+          className: `flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors ${isDefaultSelected ? "border-sas-accent bg-sas-accent/20 text-sas-accent" : "border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
+          title: "Surge XT \u2014 Default instrument",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs font-medium truncate w-full", children: [
+              isDefaultSelected && "\u2713 ",
+              "Surge XT"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: "Default" })
+          ]
+        },
+        "__surge-xt-default__"
+      ),
+      filtered.map((inst) => {
+        const selected = isSelected(inst.pluginId);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "button",
+          {
+            onClick: () => onSelect(inst.pluginId),
+            className: `flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors ${selected ? "border-sas-accent bg-sas-accent/20 text-sas-accent" : inst.missing ? "border-amber-500/50 bg-amber-500/10 text-amber-400 hover:border-amber-500" : "border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
+            title: `${inst.name} by ${inst.manufacturer} (${inst.type.toUpperCase()})${inst.missing ? " \u2014 MISSING" : ""}`,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs font-medium truncate w-full", children: [
+                selected && "\u2713 ",
+                inst.name
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: inst.manufacturer || inst.type.toUpperCase() })
+            ]
+          },
+          inst.pluginId
+        );
+      }),
+      filtered.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "col-span-2 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No other plugins found" })
+    ] })
+  ] });
+}
+
+// src/components/VolumeSlider.tsx
+var import_react2 = require("react");
+
+// src/utils/volume-conversion.ts
+var SLIDER_UNITY = 0.75;
+var DB_MAX = 6;
+var DB_MIN = -60;
+var EXPONENT = Math.log(Math.pow(10, DB_MAX / 20)) / Math.log(1 / SLIDER_UNITY);
+function sliderToDb(slider) {
+  if (slider <= 0) return DB_MIN;
+  const gain = Math.pow(slider / SLIDER_UNITY, EXPONENT);
+  const db = 20 * Math.log10(gain);
+  return Math.max(DB_MIN, Math.min(DB_MAX, db));
+}
+function dbToSlider(db) {
+  if (db <= DB_MIN) return 0;
+  if (db >= DB_MAX) return 1;
+  const gain = Math.pow(10, db / 20);
+  const slider = SLIDER_UNITY * Math.pow(gain, 1 / EXPONENT);
+  return Math.min(1, Math.max(0, slider));
+}
+
+// src/components/VolumeSlider.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function formatDb(value) {
+  const db = sliderToDb(value);
+  if (db <= -60) return "-\u221E dB";
+  const sign = db >= 0 ? "+" : "";
+  return `${sign}${db.toFixed(1)} dB`;
+}
+function useDebouncedCallback(callback, delay) {
+  const timeoutRef = (0, import_react2.useRef)(null);
+  const callbackRef = (0, import_react2.useRef)(callback);
+  (0, import_react2.useEffect)(() => {
+    callbackRef.current = callback;
+  }, [callback]);
+  const debouncedCallback = (0, import_react2.useCallback)(
+    (...args) => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+      timeoutRef.current = setTimeout(() => {
+        callbackRef.current(...args);
+      }, delay);
+    },
+    [delay]
+  );
+  (0, import_react2.useEffect)(() => {
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
+  return debouncedCallback;
+}
+var VolumeSlider = ({
+  value,
+  onChange,
+  disabled = false,
+  className = ""
+}) => {
+  const [localValue, setLocalValue] = (0, import_react2.useState)(value);
+  const [isDragging, setIsDragging] = (0, import_react2.useState)(false);
+  (0, import_react2.useEffect)(() => {
+    if (!isDragging) {
+      setLocalValue(value);
+    }
+  }, [value, isDragging]);
+  const debouncedOnChange = useDebouncedCallback(onChange, 50);
+  const handleChange = (0, import_react2.useCallback)(
+    (e) => {
+      const newValue = parseFloat(e.target.value);
+      setLocalValue(newValue);
+      debouncedOnChange(newValue);
+    },
+    [debouncedOnChange]
+  );
+  const handleMouseDown = (0, import_react2.useCallback)(() => {
+    setIsDragging(true);
+  }, []);
+  const handleMouseUp = (0, import_react2.useCallback)(() => {
+    setIsDragging(false);
+    onChange(localValue);
+  }, [localValue, onChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    {
+      className: `flex items-center ${className}`,
+      title: `Volume: ${formatDb(localValue)}`,
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        "input",
+        {
+          type: "range",
+          min: "0",
+          max: "1",
+          step: "0.01",
+          value: localValue,
+          onChange: handleChange,
+          onMouseDown: handleMouseDown,
+          onMouseUp: handleMouseUp,
+          onTouchStart: handleMouseDown,
+          onTouchEnd: handleMouseUp,
+          disabled,
+          className: `
+          w-full h-1.5 rounded-full appearance-none cursor-pointer
+          bg-gray-700
+          disabled:opacity-50 disabled:cursor-not-allowed
+          [&::-webkit-slider-thumb]:appearance-none
+          [&::-webkit-slider-thumb]:w-3
+          [&::-webkit-slider-thumb]:h-3
+          [&::-webkit-slider-thumb]:rounded-full
+          [&::-webkit-slider-thumb]:bg-sas-accent
+          [&::-webkit-slider-thumb]:cursor-pointer
+          [&::-webkit-slider-thumb]:transition-transform
+          [&::-webkit-slider-thumb]:hover:scale-110
+          [&::-moz-range-thumb]:w-3
+          [&::-moz-range-thumb]:h-3
+          [&::-moz-range-thumb]:rounded-full
+          [&::-moz-range-thumb]:bg-sas-accent
+          [&::-moz-range-thumb]:border-0
+          [&::-moz-range-thumb]:cursor-pointer
+        `
+        }
+      )
+    }
+  );
+};
+
+// src/components/PanSlider.tsx
+var import_react3 = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function toPanDisplay(value) {
+  if (Math.abs(value) < 0.02) {
+    return "Center";
+  }
+  const percent = Math.abs(Math.round(value * 100));
+  return value < 0 ? `L${percent}` : `R${percent}`;
+}
+function useDebouncedCallback2(callback, delay) {
+  const timeoutRef = (0, import_react3.useRef)(null);
+  const callbackRef = (0, import_react3.useRef)(callback);
+  (0, import_react3.useEffect)(() => {
+    callbackRef.current = callback;
+  }, [callback]);
+  const debouncedCallback = (0, import_react3.useCallback)(
+    (...args) => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+      timeoutRef.current = setTimeout(() => {
+        callbackRef.current(...args);
+      }, delay);
+    },
+    [delay]
+  );
+  (0, import_react3.useEffect)(() => {
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
+  return debouncedCallback;
+}
+var PanSlider = ({
+  value,
+  onChange,
+  disabled = false,
+  className = ""
+}) => {
+  const [localValue, setLocalValue] = (0, import_react3.useState)(value);
+  const [isDragging, setIsDragging] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    if (!isDragging) {
+      setLocalValue(value);
+    }
+  }, [value, isDragging]);
+  const debouncedOnChange = useDebouncedCallback2(onChange, 50);
+  const handleChange = (0, import_react3.useCallback)(
+    (e) => {
+      const newValue = parseFloat(e.target.value);
+      setLocalValue(newValue);
+      debouncedOnChange(newValue);
+    },
+    [debouncedOnChange]
+  );
+  const handleMouseDown = (0, import_react3.useCallback)(() => {
+    setIsDragging(true);
+  }, []);
+  const handleMouseUp = (0, import_react3.useCallback)(() => {
+    setIsDragging(false);
+    onChange(localValue);
+  }, [localValue, onChange]);
+  const handleDoubleClick = (0, import_react3.useCallback)(() => {
+    setLocalValue(0);
+    onChange(0);
+  }, [onChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "div",
+    {
+      className: `flex items-center ${className}`,
+      title: `Pan: ${toPanDisplay(localValue)}`,
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        "input",
+        {
+          type: "range",
+          min: "-1",
+          max: "1",
+          step: "0.01",
+          value: localValue,
+          onChange: handleChange,
+          onMouseDown: handleMouseDown,
+          onMouseUp: handleMouseUp,
+          onTouchStart: handleMouseDown,
+          onTouchEnd: handleMouseUp,
+          onDoubleClick: handleDoubleClick,
+          disabled,
+          className: `
+          w-full h-1.5 rounded-full appearance-none cursor-pointer
+          bg-gray-700
+          disabled:opacity-50 disabled:cursor-not-allowed
+          [&::-webkit-slider-thumb]:appearance-none
+          [&::-webkit-slider-thumb]:w-3
+          [&::-webkit-slider-thumb]:h-3
+          [&::-webkit-slider-thumb]:rounded-full
+          [&::-webkit-slider-thumb]:bg-sas-accent
+          [&::-webkit-slider-thumb]:cursor-pointer
+          [&::-webkit-slider-thumb]:transition-transform
+          [&::-webkit-slider-thumb]:hover:scale-110
+          [&::-moz-range-thumb]:w-3
+          [&::-moz-range-thumb]:h-3
+          [&::-moz-range-thumb]:rounded-full
+          [&::-moz-range-thumb]:bg-sas-accent
+          [&::-moz-range-thumb]:border-0
+          [&::-moz-range-thumb]:cursor-pointer
+        `
+        }
+      )
+    }
+  );
+};
+
+// src/constants/fx-presets.ts
+var EQ_PRESETS = {
+  presets: [
+    {
+      name: "The Smiley",
+      shortLabel: "SM",
+      params: {
+        "Low-shelf freq": 80,
+        "Low-shelf gain": 4,
+        "Low-shelf Q": 0.5,
+        "Mid freq 1": 500,
+        "Mid gain 1": -3,
+        "Mid Q 1": 0.7,
+        "Mid freq 2": 2e3,
+        "Mid gain 2": -2,
+        "Mid Q 2": 0.7,
+        "High-shelf freq": 12e3,
+        "High-shelf gain": 4,
+        "High-shelf Q": 0.5
+      }
+    },
+    {
+      name: "Telephone",
+      shortLabel: "TP",
+      params: {
+        "Low-shelf freq": 400,
+        "Low-shelf gain": -20,
+        "Low-shelf Q": 1,
+        "Mid freq 1": 1e3,
+        "Mid gain 1": 5,
+        "Mid Q 1": 2,
+        "Mid freq 2": 3e3,
+        "Mid gain 2": -5,
+        "Mid Q 2": 1,
+        "High-shelf freq": 5e3,
+        "High-shelf gain": -20,
+        "High-shelf Q": 1
+      }
+    },
+    {
+      name: "Warmth",
+      shortLabel: "WM",
+      params: {
+        "Low-shelf freq": 120,
+        "Low-shelf gain": 3,
+        "Low-shelf Q": 0.7,
+        "Mid freq 1": 400,
+        "Mid gain 1": 2,
+        "Mid Q 1": 1,
+        "Mid freq 2": 4e3,
+        "Mid gain 2": 0,
+        "Mid Q 2": 0.5,
+        "High-shelf freq": 1e4,
+        "High-shelf gain": -4,
+        "High-shelf Q": 0.5
+      }
+    },
+    {
+      name: "Vocal Air",
+      shortLabel: "VA",
+      params: {
+        "Low-shelf freq": 100,
+        "Low-shelf gain": -6,
+        "Low-shelf Q": 0.7,
+        "Mid freq 1": 300,
+        "Mid gain 1": -2,
+        "Mid Q 1": 1,
+        "Mid freq 2": 1500,
+        "Mid gain 2": 0,
+        "Mid Q 2": 0.5,
+        "High-shelf freq": 14e3,
+        "High-shelf gain": 6,
+        "High-shelf Q": 0.4
+      }
+    },
+    {
+      name: "De-Box",
+      shortLabel: "DB",
+      params: {
+        "Low-shelf freq": 60,
+        "Low-shelf gain": 0,
+        "Low-shelf Q": 0.5,
+        "Mid freq 1": 350,
+        "Mid gain 1": -5,
+        "Mid Q 1": 2,
+        "Mid freq 2": 800,
+        "Mid gain 2": -3,
+        "Mid Q 2": 2,
+        "High-shelf freq": 1e4,
+        "High-shelf gain": 0,
+        "High-shelf Q": 0.5
+      }
+    }
+  ],
+  mixParamName: null,
+  mixInterpolation: "gain-scale"
+};
+var COMPRESSOR_PRESETS = {
+  presets: [
+    {
+      name: "Vocal Leveler",
+      shortLabel: "VL",
+      params: { "Threshold": 0.251, "Ratio": 0.5, "Attack": 20, "Release": 200, "Output": 2 }
+    },
+    {
+      name: "Drum Smash",
+      shortLabel: "DS",
+      params: { "Threshold": 0.1, "Ratio": 0.1, "Attack": 0.5, "Release": 100, "Output": 8 }
+    },
+    {
+      name: "Bus Glue",
+      shortLabel: "BG",
+      params: { "Threshold": 0.316, "Ratio": 0.666, "Attack": 80, "Release": 150, "Output": 1 }
+    },
+    {
+      name: "Bass Anchor",
+      shortLabel: "BA",
+      params: { "Threshold": 0.177, "Ratio": 0.25, "Attack": 10, "Release": 250, "Output": 4 }
+    },
+    {
+      name: "Safety Net",
+      shortLabel: "SN",
+      params: { "Threshold": 0.891, "Ratio": 0, "Attack": 0.3, "Release": 50, "Output": 0 }
+    }
+  ],
+  mixParamName: null,
+  mixInterpolation: "ratio-scale"
+};
+var CHORUS_PRESETS = {
+  presets: [
+    {
+      name: "Dimension",
+      shortLabel: "DM",
+      params: {},
+      xmlStateParams: { depthMs: 1.5, speedHz: 0.5, width: 1, mixProportion: 0.5 }
+    },
+    {
+      name: "80s Crystal",
+      shortLabel: "80",
+      params: {},
+      xmlStateParams: { depthMs: 4, speedHz: 2.5, width: 0.8, mixProportion: 0.4 }
+    },
+    {
+      name: "Sea Sick",
+      shortLabel: "SS",
+      params: {},
+      xmlStateParams: { depthMs: 7, speedHz: 0.8, width: 0.3, mixProportion: 1 }
+    },
+    {
+      name: "Pseudo-Leslie",
+      shortLabel: "PL",
+      params: {},
+      xmlStateParams: { depthMs: 2, speedHz: 6, width: 0.9, mixProportion: 0.7 }
+    },
+    {
+      name: "Thickener",
+      shortLabel: "TK",
+      params: {},
+      xmlStateParams: { depthMs: 1, speedHz: 0.2, width: 1, mixProportion: 0.3 }
+    }
+  ],
+  mixParamName: null,
+  mixXmlAttr: "mixProportion",
+  mixInterpolation: "direct"
+};
+var PHASER_PRESETS = {
+  presets: [
+    {
+      name: "Slow Burn",
+      shortLabel: "SB",
+      params: {},
+      xmlStateParams: { depth: 6, rate: 0.1, feedback: 0.3 }
+    },
+    {
+      name: "Funky Quack",
+      shortLabel: "FQ",
+      params: {},
+      xmlStateParams: { depth: 3, rate: 2, feedback: 0.8 }
+    },
+    {
+      name: "Jet Plane",
+      shortLabel: "JP",
+      params: {},
+      xmlStateParams: { depth: 8, rate: 0.2, feedback: 0.9 }
+    },
+    {
+      name: "Underwater",
+      shortLabel: "UW",
+      params: {},
+      xmlStateParams: { depth: 1.5, rate: 4, feedback: 0.1 }
+    },
+    {
+      name: "Static Notch",
+      shortLabel: "ST",
+      params: {},
+      xmlStateParams: { depth: 2, rate: 0.05, feedback: 0.6 }
+    }
+  ],
+  mixParamName: null,
+  mixXmlAttr: "depth",
+  mixInterpolation: "direct"
+};
+var DELAY_PRESETS = {
+  presets: [
+    {
+      name: "Vocal Slap",
+      shortLabel: "VS",
+      fixedLengthMs: 110,
+      params: { "Feedback": -20, "Mix proportion": 0.25 }
+    },
+    {
+      name: "Grand Canyon",
+      shortLabel: "GC",
+      noteMultiplier: 1,
+      params: { "Feedback": -4, "Mix proportion": 0.45 }
+    },
+    {
+      name: "Wide Doubler",
+      shortLabel: "WD",
+      fixedLengthMs: 25,
+      params: { "Feedback": -30, "Mix proportion": 0.5 }
+    },
+    {
+      name: "Dub Echo",
+      shortLabel: "DE",
+      noteMultiplier: 0.6,
+      params: { "Feedback": -1.5, "Mix proportion": 0.4 }
+    },
+    {
+      name: "Rhythmic Wash",
+      shortLabel: "RW",
+      noteMultiplier: 0.75,
+      params: { "Feedback": -8, "Mix proportion": 0.2 }
+    }
+  ],
+  mixParamName: "Mix proportion",
+  mixInterpolation: "direct"
+};
+var REVERB_PRESETS = {
+  presets: [
+    {
+      name: "Drum Room",
+      shortLabel: "DR",
+      params: { "Room Size": 0.2, "Damping": 0.2, "Wet Level": 0.15, "Dry Level": 0.5, "Width": 0.8 }
+    },
+    {
+      name: "Vocal Hall",
+      shortLabel: "VH",
+      params: { "Room Size": 0.8, "Damping": 0.6, "Wet Level": 0.25, "Dry Level": 0.5, "Width": 1 }
+    },
+    {
+      name: "Cathedral",
+      shortLabel: "CT",
+      params: { "Room Size": 1, "Damping": 0.1, "Wet Level": 0.333, "Dry Level": 0.2, "Width": 1 }
+    },
+    {
+      name: "Tile Bathroom",
+      shortLabel: "TB",
+      params: { "Room Size": 0.15, "Damping": 0, "Wet Level": 0.2, "Dry Level": 0.5, "Width": 0.5 }
+    },
+    {
+      name: "Vintage Plate",
+      shortLabel: "VP",
+      params: { "Room Size": 0.4, "Damping": 1, "Wet Level": 0.2, "Dry Level": 0.5, "Width": 1 }
+    }
+  ],
+  mixParamName: "Wet Level",
+  mixInterpolation: "direct"
+};
+var FX_PRESET_CONFIGS = {
+  eq: EQ_PRESETS,
+  compressor: COMPRESSOR_PRESETS,
+  chorus: CHORUS_PRESETS,
+  phaser: PHASER_PRESETS,
+  delay: DELAY_PRESETS,
+  reverb: REVERB_PRESETS
+};
+
+// src/components/FxToggleBar.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var FX_COLORS = {
+  eq: "bg-blue-500",
+  compressor: "bg-orange-500",
+  chorus: "bg-teal-500",
+  phaser: "bg-purple-500",
+  delay: "bg-green-500",
+  reverb: "bg-cyan-500"
+};
+var FxToggleBar = ({
+  trackId,
+  fxState,
+  onToggle,
+  onPresetChange,
+  onDryWetChange,
+  disabled = false
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-col gap-1", "data-testid": "fx-toggle-bar", children: FX_CATEGORIES.map((category) => {
+    const detail = fxState[category];
+    const isActive = detail.enabled;
+    const label = FX_DISPLAY_LABELS[category];
+    const activeColor = FX_COLORS[category];
+    const config = FX_PRESET_CONFIGS[category];
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-0.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        "button",
+        {
+          "data-testid": `fx-toggle-${category}`,
+          disabled,
+          onClick: () => onToggle(trackId, category, !isActive),
+          className: `w-14 py-0.5 text-[10px] font-semibold rounded-sm transition-colors leading-none flex-shrink-0 text-center ${disabled ? "bg-sas-panel text-sas-muted/30 cursor-not-allowed" : isActive ? `${activeColor} text-white` : "bg-sas-panel-alt text-sas-muted/60 hover:bg-sas-border hover:text-sas-muted"}`,
+          title: `${isActive ? "Disable" : "Enable"} ${category.toUpperCase()}`,
+          children: label
+        }
+      ),
+      config.presets.map((preset, idx) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        "button",
+        {
+          "data-testid": `fx-preset-${category}-${idx}`,
+          disabled: disabled || !isActive,
+          onClick: () => onPresetChange(trackId, category, idx),
+          className: `w-5 h-5 text-[9px] font-medium rounded-sm transition-colors leading-none flex-shrink-0 ${disabled || !isActive ? "bg-sas-panel text-sas-muted/20 cursor-not-allowed" : detail.presetIndex === idx ? `${activeColor} text-white` : "bg-sas-panel-alt text-sas-muted/50 hover:bg-sas-border hover:text-sas-muted"}`,
+          title: preset.name,
+          children: idx + 1
+        },
+        idx
+      )),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        "input",
+        {
+          type: "range",
+          "data-testid": `fx-drywet-${category}`,
+          min: "0",
+          max: "100",
+          value: Math.round(detail.dryWet * 100),
+          disabled: disabled || !isActive,
+          onChange: (e) => onDryWetChange(trackId, category, Number(e.target.value) / 100),
+          className: "flex-1 min-w-[30px] h-3 accent-sas-accent disabled:opacity-30 cursor-pointer disabled:cursor-not-allowed",
+          title: `Dry/Wet: ${Math.round(detail.dryWet * 100)}%`
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "text-[8px] text-sas-muted/50 w-6 text-right flex-shrink-0", children: [
+        Math.round(detail.dryWet * 100),
+        "%"
+      ] })
+    ] }, category);
+  }) });
+};
+
+// src/components/SorceryProgressBar.tsx
+var import_react4 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function calculateTimeBasedTarget(elapsedMs, estimatedDurationMs) {
+  const t = elapsedMs / estimatedDurationMs;
+  if (t <= 0) return 0;
+  if (t <= 1) {
+    return 90 * (1 - Math.pow(1 - t, 2.5));
+  }
+  const overshootRatio = (elapsedMs - estimatedDurationMs) / estimatedDurationMs;
+  return 90 + 5 * (1 - Math.exp(-overshootRatio * 3));
+}
+function calculateNextProgress(currentProgress) {
+  if (currentProgress < 20) {
+    return currentProgress + Math.random() * 10 + 5;
+  }
+  if (currentProgress < 60) {
+    return currentProgress + Math.random() * 5 + 2;
+  }
+  if (currentProgress < 95) {
+    const remaining = 95 - currentProgress;
+    const increment = remaining * (Math.random() * 0.2 + 0.1);
+    return currentProgress + Math.max(increment, 0.1);
+  }
+  return 95;
+}
+function calculateNextTickInterval(progress) {
+  if (progress < 30) {
+    return Math.random() * 200 + 150;
+  }
+  if (progress < 70) {
+    return Math.random() * 300 + 200;
+  }
+  return Math.random() * 600 + 400;
+}
+var TIME_BASED_TICK_MIN = 200;
+var TIME_BASED_TICK_RANGE = 100;
+function SorceryProgressBar({
+  isLoading,
+  statusText = "CONJURING...",
+  completeText = "COMPLETE",
+  onComplete,
+  heightClass = "h-10",
+  initialProgress = 0,
+  onProgressChange,
+  estimatedDurationMs
+}) {
+  const [progress, setProgress] = (0, import_react4.useState)(initialProgress);
+  const timerRef = (0, import_react4.useRef)(null);
+  const isLoadingRef = (0, import_react4.useRef)(false);
+  const hasStartedRef = (0, import_react4.useRef)(false);
+  const startTimeRef = (0, import_react4.useRef)(0);
+  const onProgressChangeRef = (0, import_react4.useRef)(onProgressChange);
+  const onCompleteRef = (0, import_react4.useRef)(onComplete);
+  onProgressChangeRef.current = onProgressChange;
+  onCompleteRef.current = onComplete;
+  const initialProgressRef = (0, import_react4.useRef)(initialProgress);
+  initialProgressRef.current = initialProgress;
+  const estimatedDurationMsRef = (0, import_react4.useRef)(estimatedDurationMs);
+  estimatedDurationMsRef.current = estimatedDurationMs;
+  (0, import_react4.useEffect)(() => {
+    const wasLoading = isLoadingRef.current;
+    isLoadingRef.current = isLoading;
+    if (isLoading && !wasLoading) {
+      hasStartedRef.current = true;
+      startTimeRef.current = Date.now();
+      const startProgress = initialProgressRef.current > 0 ? initialProgressRef.current : 0;
+      setProgress(startProgress);
+      const duration = estimatedDurationMsRef.current;
+      if (duration && duration > 0) {
+        const tick = () => {
+          setProgress((prev) => {
+            const elapsed = Date.now() - startTimeRef.current;
+            const target = calculateTimeBasedTarget(elapsed, duration);
+            const jitter = (Math.random() - 0.5) * 1;
+            const next = Math.min(Math.max(target + jitter, prev + 0.05), 95);
+            onProgressChangeRef.current?.(next);
+            timerRef.current = setTimeout(tick, TIME_BASED_TICK_MIN + Math.random() * TIME_BASED_TICK_RANGE);
+            return next;
+          });
+        };
+        timerRef.current = setTimeout(tick, TIME_BASED_TICK_MIN);
+      } else {
+        const tick = () => {
+          setProgress((prev) => {
+            if (prev >= 95) {
+              timerRef.current = setTimeout(tick, 1e3);
+              return 95;
+            }
+            const next = Math.min(calculateNextProgress(prev), 95);
+            onProgressChangeRef.current?.(next);
+            const interval = calculateNextTickInterval(next);
+            timerRef.current = setTimeout(tick, interval);
+            return next;
+          });
+        };
+        const firstInterval = calculateNextTickInterval(startProgress);
+        timerRef.current = setTimeout(tick, firstInterval);
+      }
+    } else if (!isLoading && wasLoading && hasStartedRef.current) {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+        timerRef.current = null;
+      }
+      setProgress(100);
+      onProgressChangeRef.current?.(100);
+      onCompleteRef.current?.();
+      hasStartedRef.current = false;
+    }
+    return () => {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+  }, [isLoading]);
+  if (!isLoading && progress === 0) {
+    return null;
+  }
+  const displayProgress = Math.floor(progress);
+  const isComplete = !isLoading && progress === 100;
+  const transitionDuration = progress < 50 ? "300ms" : progress < 80 ? "500ms" : "700ms";
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      className: `relative w-full ${heightClass} bg-sas-panel-alt border border-sas-border rounded-sm overflow-hidden shadow-inner`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "div",
+          {
+            className: `
+          h-full
+          bg-gradient-to-r from-sas-accent/70 to-sas-accent
+          shadow-glow-soft
+          sorcery-progress-fill
+          animate-progress-stripes
+          ${progress > 70 ? "animate-progress-pulse" : ""}
+          transition-all ease-out
+        `,
+            style: {
+              width: `${progress}%`,
+              transitionDuration
+            }
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: isLoading && progress < 100 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "font-mono text-xs text-sas-accent font-bold drop-shadow-md tracking-wider", children: [
+          statusText,
+          " ",
+          displayProgress,
+          "%"
+        ] }) : isComplete ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "font-mono text-xs text-sas-text font-bold drop-shadow-md tracking-wider", children: completeText }) : null }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "div",
+          {
+            className: "absolute inset-0 pointer-events-none opacity-10",
+            style: {
+              backgroundImage: `repeating-linear-gradient(
+            to bottom,
+            transparent,
+            transparent 2px,
+            rgba(0, 0, 0, 0.3) 2px,
+            rgba(0, 0, 0, 0.3) 4px
+          )`
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/TrackRow.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function TrackRow({
+  track,
+  prompt,
+  runtimeState,
+  fxDetailState,
+  fxDrawerOpen,
+  isGenerating = false,
+  isAuthenticated = false,
+  error,
+  hasMidi = false,
+  generationProgress = 0,
+  estimatedGenerationMs = 15e3,
+  onPromptChange,
+  onGenerate,
+  onShuffle,
+  onCopy,
+  onDelete,
+  contentSlot,
+  onMuteToggle,
+  onSoloToggle,
+  onVolumeChange,
+  onPanChange,
+  onFxToggle,
+  onFxPresetChange,
+  onFxDryWetChange,
+  onToggleFxDrawer,
+  onProgressChange,
+  accentColor = "#A78BFA",
+  instrumentName,
+  instrumentMissing,
+  instrumentDrawerOpen,
+  onToggleInstrumentDrawer,
+  availableInstruments,
+  currentInstrumentPluginId,
+  onInstrumentSelect,
+  instrumentsLoading,
+  onRefreshInstruments
+}) {
+  const { muted: isMuted, solo: isSoloed, volume: currentVolume, pan: currentPan } = runtimeState;
+  const needsGeneration = !!(prompt?.trim() && !hasMidi && !isGenerating);
+  const hasFxActive = Object.values(fxDetailState).some(
+    (d) => d.enabled
+  );
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey && onGenerate) {
+      e.preventDefault();
+      onGenerate();
+    }
+  };
+  const borderColorStyle = needsGeneration ? void 0 : accentColor;
+  const borderClass = needsGeneration ? "border-amber-400 animate-pulse" : "border-sas-border";
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { "data-testid": "sdk-track-row-wrapper", className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+      "div",
+      {
+        "data-testid": "sdk-track-row",
+        className: `relative flex items-stretch gap-1 p-2 rounded-sm border w-full overflow-hidden ${borderClass} bg-sas-panel-alt`,
+        style: {
+          borderLeftColor: needsGeneration ? "#f59e0b" : borderColorStyle,
+          borderLeftWidth: "3px"
+        },
+        children: [
+          isGenerating && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "absolute left-0 top-0 bottom-0 right-44 z-20", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            SorceryProgressBar,
+            {
+              isLoading: true,
+              statusText: "CONJURING MIDI...",
+              heightClass: "h-full",
+              initialProgress: generationProgress,
+              onProgressChange,
+              estimatedDurationMs: estimatedGenerationMs
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col flex-1 min-w-0 relative z-10", children: [
+            contentSlot ? contentSlot : onPromptChange ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "input",
+              {
+                type: "text",
+                "data-testid": "sdk-prompt-input",
+                value: prompt ?? "",
+                onChange: (e) => onPromptChange(e.target.value),
+                onKeyDown: handleKeyDown,
+                placeholder: "Describe your part...",
+                disabled: isGenerating,
+                className: "sas-input w-full px-2 py-1 text-xs disabled:opacity-50 disabled:cursor-not-allowed"
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2 mt-1", children: [
+              track.name && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-sas-muted/60 truncate pl-2 flex-shrink-0 max-w-[80px]", title: track.name, children: track.name }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "vol:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                VolumeSlider,
+                {
+                  value: currentVolume,
+                  onChange: onVolumeChange,
+                  disabled: isGenerating,
+                  className: "flex-1 min-w-[40px]"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "pan:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                PanSlider,
+                {
+                  value: currentPan,
+                  onChange: onPanChange,
+                  disabled: isGenerating,
+                  className: "w-10 flex-shrink-0"
+                }
+              )
+            ] })
+          ] }),
+          error && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            "div",
+            {
+              "data-testid": "sdk-error-indicator",
+              className: "flex-shrink-0 relative z-10 self-stretch flex items-center px-1 group cursor-help",
+              title: error,
+              children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "relative", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  import_lucide_react.AlertCircle,
+                  {
+                    className: "w-5 h-5 text-red-500 animate-pulse",
+                    strokeWidth: 2.5
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-red-900/95 text-red-100 text-xs rounded shadow-lg whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-50 max-w-[200px] truncate", children: error })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col gap-0.5 flex-shrink-0 relative z-30 justify-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex gap-1 items-center", children: [
+              onGenerate && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-generate-button",
+                  onClick: onGenerate,
+                  disabled: !isAuthenticated || isGenerating || !prompt?.trim(),
+                  className: `w-14 py-0.5 rounded-sm text-xs font-medium transition-colors border ${!isAuthenticated || isGenerating ? "bg-sas-panel border-sas-border text-sas-muted/50 cursor-not-allowed" : needsGeneration ? "bg-amber-500/30 border-amber-500 text-amber-400 hover:bg-amber-500 hover:text-sas-bg animate-pulse" : prompt?.trim() ? "bg-sas-accent/20 border-sas-accent text-sas-accent hover:bg-sas-accent hover:text-sas-bg" : "bg-sas-panel border-sas-border text-sas-muted/50 cursor-not-allowed"}`,
+                  title: !isAuthenticated ? "Please log in" : isGenerating ? "Generating..." : "Generate MIDI",
+                  children: "Create"
+                }
+              ),
+              onCopy && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-copy-button",
+                  onClick: onCopy,
+                  disabled: !hasMidi || isGenerating,
+                  className: `w-14 py-0.5 rounded-sm text-xs font-medium transition-colors border ${!hasMidi || isGenerating ? "bg-sas-panel border-sas-border text-sas-muted/30 cursor-not-allowed" : "bg-sas-panel-alt border-sas-border text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
+                  title: hasMidi ? "Duplicate track with different preset" : "Generate MIDI first",
+                  children: "Copy"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-mute-button",
+                  onClick: onMuteToggle,
+                  disabled: isGenerating,
+                  className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${isGenerating ? "bg-sas-panel text-sas-muted/50 cursor-not-allowed" : isMuted ? "bg-red-600 text-white" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"}`,
+                  title: isMuted ? "Unmute track" : "Mute track",
+                  children: "M"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-delete-button",
+                  onClick: onDelete,
+                  className: "text-sas-danger/70 hover:text-sas-danger px-1 py-0.5 transition-colors text-sm",
+                  title: "Delete track",
+                  children: "x"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex gap-1 items-center", children: [
+              onShuffle && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-shuffle-button",
+                  onClick: onShuffle,
+                  disabled: !hasMidi || isGenerating,
+                  className: `w-14 py-0.5 rounded-sm text-xs font-medium transition-colors border ${!hasMidi || isGenerating ? "bg-sas-panel border-sas-border text-sas-muted/30 cursor-not-allowed" : "bg-sas-panel-alt border-sas-border text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
+                  title: hasMidi ? "Re-roll sound (keep MIDI)" : "Generate MIDI first",
+                  children: "Shuffle"
+                }
+              ),
+              onToggleFxDrawer && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-fx-button",
+                  onClick: onToggleFxDrawer,
+                  disabled: isGenerating,
+                  className: `w-14 py-0.5 rounded-sm text-xs font-medium transition-colors border ${isGenerating ? "bg-sas-panel border-sas-border text-sas-muted/50 cursor-not-allowed" : fxDrawerOpen ? "bg-sas-accent border-sas-accent text-sas-bg" : hasFxActive ? "bg-sas-accent/20 border-sas-accent text-sas-accent hover:bg-sas-accent hover:text-sas-bg" : "bg-sas-panel-alt border-sas-border text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
+                  title: fxDrawerOpen ? "Hide FX controls" : "Show FX controls",
+                  children: "FX"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-solo-button",
+                  onClick: onSoloToggle,
+                  disabled: isGenerating,
+                  className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${isGenerating ? "bg-sas-panel text-sas-muted/50 cursor-not-allowed" : isSoloed ? "bg-yellow-500 text-black" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"}`,
+                  title: isSoloed ? "Unsolo track" : "Solo track",
+                  children: "S"
+                }
+              ),
+              onToggleInstrumentDrawer && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  "data-testid": "sdk-plugin-button",
+                  onClick: onToggleInstrumentDrawer,
+                  disabled: isGenerating,
+                  className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${isGenerating ? "bg-sas-panel text-sas-muted/50 cursor-not-allowed" : instrumentDrawerOpen ? "bg-sas-accent border-sas-accent text-sas-bg" : instrumentMissing ? "bg-amber-500/20 text-amber-400 hover:bg-amber-500/40" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"}`,
+                  title: `Plugin: ${instrumentName ?? "Surge XT"}${instrumentMissing ? " (missing)" : ""}`,
+                  children: "P"
+                }
+              )
+            ] })
+          ] })
+        ]
+      }
+    ),
+    fxDrawerOpen && !instrumentDrawerOpen && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { "data-testid": "sdk-fx-drawer", className: "border border-t-0 border-sas-border bg-sas-bg rounded-b-sm px-3 py-2 max-h-[180px] overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      FxToggleBar,
+      {
+        trackId: track.id,
+        fxState: fxDetailState,
+        onToggle: (_trackId, category, enabled) => onFxToggle?.(category, enabled),
+        onPresetChange: (_trackId, category, presetIndex) => onFxPresetChange?.(category, presetIndex),
+        onDryWetChange: (_trackId, category, value) => onFxDryWetChange?.(category, value),
+        disabled: isGenerating
+      }
+    ) }),
+    instrumentDrawerOpen && !fxDrawerOpen && availableInstruments && onInstrumentSelect && onRefreshInstruments && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { "data-testid": "sdk-instrument-drawer", className: "border border-t-0 border-sas-border bg-sas-bg rounded-b-sm px-3 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      InstrumentDrawer,
+      {
+        instruments: availableInstruments,
+        currentPluginId: currentInstrumentPluginId ?? null,
+        isLoading: instrumentsLoading ?? false,
+        onSelect: onInstrumentSelect,
+        onRefresh: onRefreshInstruments
+      }
+    ) })
+  ] });
+}
+
+// src/hooks/useSceneState.ts
+var import_react5 = require("react");
+function useSceneState(activeSceneId, initialValue) {
+  const [stateMap, setStateMap] = (0, import_react5.useState)(() => /* @__PURE__ */ new Map());
+  const activeSceneIdRef = (0, import_react5.useRef)(activeSceneId);
+  activeSceneIdRef.current = activeSceneId;
+  const currentValue = activeSceneId !== null && stateMap.has(activeSceneId) ? stateMap.get(activeSceneId) : initialValue;
+  const setForCurrentScene = (0, import_react5.useCallback)((value) => {
+    const sid = activeSceneIdRef.current;
+    if (sid === null) return;
+    setStateMap((prev) => {
+      const current = prev.has(sid) ? prev.get(sid) : initialValue;
+      const next = typeof value === "function" ? value(current) : value;
+      const newMap = new Map(prev);
+      newMap.set(sid, next);
+      return newMap;
+    });
+  }, [initialValue]);
+  const setForScene = (0, import_react5.useCallback)((sceneId, value) => {
+    setStateMap((prev) => {
+      const current = prev.has(sceneId) ? prev.get(sceneId) : initialValue;
+      const next = typeof value === "function" ? value(current) : value;
+      const newMap = new Map(prev);
+      newMap.set(sceneId, next);
+      return newMap;
+    });
+  }, [initialValue]);
+  return [currentValue, setForCurrentScene, setForScene];
+}
+
+// src/constants/instrument-roles.ts
+var VALID_INSTRUMENT_ROLES = [
+  "bass",
+  "kick",
+  "snare",
+  "hat",
+  "808",
+  "percussion",
+  "lead",
+  "pad",
+  "keys",
+  "piano",
+  "organ",
+  "pluck",
+  "strings",
+  "brass",
+  "winds",
+  "bell",
+  "mallet",
+  "guitar",
+  "synth",
+  "atmosphere",
+  "drone",
+  "rhythm",
+  "soundscape",
+  "vocal",
+  "fx"
+];
+
+// src/constants/sdk-version.ts
+var PLUGIN_SDK_VERSION = "1.0.0";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DB_MAX,
+  DB_MIN,
+  DEFAULT_FX_CATEGORY_DETAIL,
+  DEFAULT_FX_DRY_WET,
+  EMPTY_FX_DETAIL_STATE,
+  EMPTY_FX_STATE,
+  FX_CATEGORIES,
+  FX_CHAIN_ORDER,
+  FX_DISPLAY_LABELS,
+  FX_ENGINE_PLUGIN_NAMES,
+  FX_PRESET_CONFIGS,
+  FxToggleBar,
+  InstrumentDrawer,
+  PLUGIN_SDK_VERSION,
+  PanSlider,
+  PluginError,
+  SLIDER_UNITY,
+  SorceryProgressBar,
+  TrackRow,
+  VALID_INSTRUMENT_ROLES,
+  VolumeSlider,
+  calculateTimeBasedTarget,
+  dbToSlider,
+  sliderToDb,
+  useSceneState
+});
+//# sourceMappingURL=index.js.map