audio-mixer-ui 1.1.0 → 1.1.2

package/dist/audio-mixer-ui.js

@@ -46,16 +46,16 @@ var Dl = function() {
       }, l;
     }()
   );
-}(), Nl = typeof window < "u" && typeof document < "u" && window.document === document, bl = function() {
+}(), Nl = typeof window < "u" && typeof document < "u" && window.document === document, cl = function() {
   return typeof global < "u" && global.Math === Math ? global : typeof self < "u" && self.Math === Math ? self : typeof window < "u" && window.Math === Math ? window : Function("return this")();
 }(), mU = function() {
-  return typeof requestAnimationFrame == "function" ? requestAnimationFrame.bind(bl) : function(d) {
+  return typeof requestAnimationFrame == "function" ? requestAnimationFrame.bind(cl) : function(d) {
     return setTimeout(function() {
       return d(Date.now());
     }, 1e3 / 60);
   };
-}(), bU = 2;
-function cU(d, l) {
+}(), cU = 2;
+function bU(d, l) {
   var U = !1, F = !1, t = 0;
   function Z() {
     U && (U = !1, d()), F && Q();
@@ -66,7 +66,7 @@ function cU(d, l) {
   function Q() {
     var n = Date.now();
     if (U) {
-      if (n - t < bU)
+      if (n - t < cU)
         return;
       F = !0;
     } else
@@ -79,7 +79,7 @@ var WU = 20, sU = ["top", "right", "bottom", "left", "width", "height", "size",
   /** @class */
   function() {
     function d() {
-      this.connected_ = !1, this.mutationEventsAdded_ = !1, this.mutationsObserver_ = null, this.observers_ = [], this.onTransitionEnd_ = this.onTransitionEnd_.bind(this), this.refresh = cU(this.refresh.bind(this), WU);
+      this.connected_ = !1, this.mutationEventsAdded_ = !1, this.mutationsObserver_ = null, this.observers_ = [], this.onTransitionEnd_ = this.onTransitionEnd_.bind(this), this.refresh = bU(this.refresh.bind(this), WU);
     }
     return d.prototype.addObserver = function(l) {
       ~this.observers_.indexOf(l) || this.observers_.push(l), this.connected_ || this.connect_();
@@ -127,9 +127,9 @@ var WU = 20, sU = ["top", "right", "bottom", "left", "width", "height", "size",
   return d;
 }, Zl = function(d) {
   var l = d && d.ownerDocument && d.ownerDocument.defaultView;
-  return l || bl;
+  return l || cl;
 }, ql = ul(0, 0, 0, 0);
-function cl(d) {
+function bl(d) {
   return parseFloat(d) || 0;
 }
 function Ll(d) {
@@ -137,13 +137,13 @@ function Ll(d) {
     l[U - 1] = arguments[U];
   return l.reduce(function(F, t) {
     var Z = d["border-" + t + "-width"];
-    return F + cl(Z);
+    return F + bl(Z);
   }, 0);
 }
 function BU(d) {
   for (var l = ["top", "right", "bottom", "left"], U = {}, F = 0, t = l; F < t.length; F++) {
     var Z = t[F], a = d["padding-" + Z];
-    U[Z] = cl(a);
+    U[Z] = bl(a);
   }
   return U;
 }
@@ -155,7 +155,7 @@ function JU(d) {
   var l = d.clientWidth, U = d.clientHeight;
   if (!l && !U)
     return ql;
-  var F = Zl(d).getComputedStyle(d), t = BU(F), Z = t.left + t.right, a = t.top + t.bottom, Q = cl(F.width), n = cl(F.height);
+  var F = Zl(d).getComputedStyle(d), t = BU(F), Z = t.left + t.right, a = t.top + t.bottom, Q = bl(F.width), n = bl(F.height);
   if (F.boxSizing === "border-box" && (Math.round(Q + Z) !== l && (Q -= Ll(F, "left", "right") + Z), Math.round(n + a) !== U && (n -= Ll(F, "top", "bottom") + a)), !GU(d)) {
     var V = Math.round(Q + Z) - l, R = Math.round(n + a) - U;
     Math.abs(V) !== 1 && (Q -= V), Math.abs(R) !== 1 && (n -= R);
@@ -285,7 +285,7 @@ var NU = (
   };
 });
 var YU = function() {
-  return typeof bl.ResizeObserver < "u" ? bl.ResizeObserver : wl;
+  return typeof cl.ResizeObserver < "u" ? cl.ResizeObserver : wl;
 }();
 function Ul(d) {
   const l = k(0), U = k(0);
@@ -341,12 +341,12 @@ const v = (d, l) => {
       "2096b4c3": W.value,
       "757f26aa": m.value,
       "744b71b7": o.value,
-      d898db12: c.value,
+      d898db12: b.value,
       "3a8d2f7c": J.value
     }));
     const l = d, U = w("root"), { width: F, height: t } = Ul(U), Z = X(() => Math.min(F.value, t.value)), a = X(() => Math.max(F.value, t.value)), Q = X(() => F.value > t.value), n = X(() => Q.value ? "h-slide" : "v-slide"), V = _(d, "value");
     X(() => Math.pow(1 - V.value, 0.5) * 180 + 20), X(() => Math.pow(V.value, 0.5) * 180 + 20);
-    const R = X(() => Z.value * 0.8), e = X(() => Z.value * l.thumbLength * 0.8), m = X(() => (Q.value ? e : R).value + "px"), W = X(() => (Q.value ? R : e).value + "px"), c = X(() => Z.value * 0.1 + "px"), J = X(() => (a.value - e.value) * (V.value - l.min) / (l.max - l.min) + "px"), o = X(() => Q.value ? "90deg" : "0deg"), Y = k(!1), T = k(0), I = (i) => {
+    const R = X(() => Z.value * 0.8), e = X(() => Z.value * l.thumbLength * 0.8), m = X(() => (Q.value ? e : R).value + "px"), W = X(() => (Q.value ? R : e).value + "px"), b = X(() => Z.value * 0.1 + "px"), J = X(() => (a.value - e.value) * (V.value - l.min) / (l.max - l.min) + "px"), o = X(() => Q.value ? "90deg" : "0deg"), Y = k(!1), T = k(0), I = (i) => {
       if (!U.value) return V.value;
       const G = U.value.getBoundingClientRect(), L = i.clientX, tl = i.clientY;
       let f;
@@ -2392,7 +2392,7 @@ class AU {
       ticksPerBeat: l.ticksPerBeat
     };
     l.tracks.forEach((F, t) => {
-      if (F.name && !U.title && (U.title = F.name), F.events.filter((Z) => Z.type === "text").forEach((Z) => {
+      if (F.events.filter((Z) => Z.type === "text").forEach((Z) => {
         const a = Z.text.toLowerCase();
         (a.includes("compos") || a.includes("by")) && !U.composer && (U.composer = Z.text);
       }), F.name) {
@@ -2436,8 +2436,8 @@ class AU {
       let R;
       R = n + U * 4 * Q.numerator / Q.denominator;
       const e = Q.numerator, m = [], W = U * (4 / Q.denominator);
-      for (let c = 0; c < e; c++) {
-        const J = n + c * W, o = this._ticksToTime(J, l);
+      for (let b = 0; b < e; b++) {
+        const J = n + b * W, o = this._ticksToTime(J, l);
         m.push(o);
       }
       Z.push({
@@ -2535,13 +2535,13 @@ class AU {
               velocity: m.velocity
             };
           else if (m.type === "noteOff" && e[m.noteNumber]) {
-            const W = e[m.noteNumber], c = m.tick - W.tick;
+            const W = e[m.noteNumber], b = m.tick - W.tick;
             t.push({
               pitch: m.noteNumber,
               name: this._midiNoteToName(m.noteNumber),
               startTick: W.tick,
               endTick: m.tick,
-              duration: c,
+              duration: b,
               startTime: this._ticksToTime(W.tick, U),
               endTime: this._ticksToTime(m.tick, U),
               velocity: W.velocity,
@@ -2864,7 +2864,7 @@ class fU {
       }
       let e = Q[Z], m = e.sig[0];
       for (; m < R && Z + 1 < Q.length; ) {
-        const W = Q[Z + 1], c = [
+        const W = Q[Z + 1], b = [
           e.sig[0] + W.sig[0],
           // Total beats
           e.sig[1]
@@ -2874,16 +2874,16 @@ class fU {
           ...W.beats || []
         ];
         e = {
-          sig: c,
+          sig: b,
           beats: J
-        }, Q[Z] = e, Q.splice(Z + 1, 1), m = c[0];
+        }, Q[Z] = e, Q.splice(Z + 1, 1), m = b[0];
       }
       if (m > R) {
-        const W = R, c = m - R, J = e.beats ? e.beats.slice(0, W) : [], o = e.beats ? e.beats.slice(W) : [], Y = {
+        const W = R, b = m - R, J = e.beats ? e.beats.slice(0, W) : [], o = e.beats ? e.beats.slice(W) : [], Y = {
           sig: [W, e.sig[1]],
           beats: J
         }, T = {
-          sig: [c, e.sig[1]],
+          sig: [b, e.sig[1]],
           beats: o
         };
         Q[Z] = Y, Q.splice(Z + 1, 0, T), e = Y;
@@ -2901,13 +2901,13 @@ class fU {
       for (; a < l.length; ) {
         const e = l[a], m = e.barNumber, W = t[m] !== void 0 ? t[m] : 4;
         t[m] === void 0 && (t[m] = W);
-        const c = [];
+        const b = [];
         for (let o = 0; o < W; o++)
-          c.push(R), R += V;
+          b.push(R), R += V;
         const J = {
           sig: [W, 4],
           // Default to quarter notes
-          beats: c
+          beats: b
         };
         this._generateBeatsForBar(F, e, J, W), a++;
       }
@@ -2963,7 +2963,7 @@ class Gl {
   constructor(l = null, U, F = null, t = null) {
     if (!U)
       throw new Error("Parsed MIDI data is required");
-    this.audioEngine = l, this._audioEngineReady = !!(l && l.isInitialized), this.instrumentMap = F || {}, this.parsedData = U, this._isPlaying = !1, this._currentTime = 0, this._totalDuration = 0, this.playbackSpeed = 1, this.partChannels = /* @__PURE__ */ new Map(), this.partOutputs = /* @__PURE__ */ new Map(), this.playbackStartTime = 0, this.lookAheadTime = 0.05, this.scheduleInterval = null, this.partNotePointers = /* @__PURE__ */ new Map(), this.partProgramPointers = /* @__PURE__ */ new Map(), this.eventBus = kl(), this.beatMapper = new fU(), this.beats = [], this.structureMetadata = t, this._calculateTotalDuration();
+    this.audioEngine = l, this._audioEngineReady = !!(l && l.isInitialized), this.instrumentMap = F || {}, this.parsedData = U, this._isPlaying = !1, this._isPreScheduling = !1, this._currentTime = 0, this._totalDuration = 0, this.playbackSpeed = 1, this.partChannels = /* @__PURE__ */ new Map(), this.partOutputs = /* @__PURE__ */ new Map(), this.playbackStartTime = 0, this.lookAheadTime = 0.05, this.scheduleInterval = null, this.partNotePointers = /* @__PURE__ */ new Map(), this.partProgramPointers = /* @__PURE__ */ new Map(), this.eventBus = kl(), this.beatMapper = new fU(), this.beats = [], this.structureMetadata = t, this._calculateTotalDuration();
     const Z = t || this._createDefaultStructureMetadata();
     this.beats = this.beatMapper.mapBeats(U, Z), this._audioEngineReady && (this._setupPartChannels(), this._resetNotePointers(), this._resetProgramPointers());
   }
@@ -3007,17 +3007,36 @@ class Gl {
       throw new Error("Audio engine not ready. Call setAudioEngine() first.");
     this._isPlaying || (this._isPlaying = !0, this.playbackStartTime = l - this._currentTime / this.playbackSpeed, this._resetNotePointers(), this._resetProgramPointers(), this._schedulePlayback(), this._startTimeUpdateLoop());
   }
+  /**
+   * Begin pre-scheduling notes for a future start time (used during lead-in)
+   * Starts the scheduling loop but doesn't mark as "playing" yet
+   * @param {number} startTime - Audio context time when playback will begin
+   */
+  beginPreScheduling(l) {
+    if (!this._audioEngineReady)
+      throw new Error("Audio engine not ready. Call setAudioEngine() first.");
+    this._isPreScheduling || this._isPlaying || (this._isPreScheduling = !0, this.playbackStartTime = l - this._currentTime / this.playbackSpeed, this._resetNotePointers(), this._resetProgramPointers(), this._schedulePlayback());
+  }
+  /**
+   * Transition from pre-scheduling to playing state
+   * Called when lead-in completes and main playback begins
+   */
+  markAsPlaying() {
+    if (!this._isPreScheduling)
+      throw new Error("Cannot mark as playing - not in pre-scheduling state");
+    this._isPreScheduling = !1, this._isPlaying = !0, this._startTimeUpdateLoop();
+  }
   /**
    * Pause playback (resumable)
    */
   pause() {
-    this._isPlaying && (this._isPlaying = !1, this._stopScheduling(), this._stopTimeUpdateLoop());
+    !this._isPlaying && !this._isPreScheduling || (this._isPlaying = !1, this._isPreScheduling = !1, this._stopScheduling(), this._stopTimeUpdateLoop());
   }
   /**
    * Stop playback and reset to beginning
    */
   stop() {
-    this._isPlaying = !1, this._currentTime = 0, this._stopScheduling(), this._stopTimeUpdateLoop(), this._resetNotePointers(), this._resetProgramPointers();
+    this._isPlaying = !1, this._isPreScheduling = !1, this._currentTime = 0, this._stopScheduling(), this._stopTimeUpdateLoop(), this._resetNotePointers(), this._resetProgramPointers();
   }
   /**
    * Skip to a specific time in seconds
@@ -3233,7 +3252,7 @@ class Gl {
    */
   _startScheduleLoop() {
     this.scheduleInterval || (this.scheduleInterval = setInterval(() => {
-      if (!this._isPlaying) return;
+      if (!this._isPlaying && !this._isPreScheduling) return;
       const l = (this.audioEngine.audioContext.currentTime - this.playbackStartTime) * this.playbackSpeed, U = l + this.lookAheadTime;
       for (const [F, t] of this.partChannels) {
         const Z = this.parsedData.parts[F];
@@ -3444,9 +3463,13 @@ class _U {
       this.parsedData = l.parsedData, this.instrumentMap = F, this._audioEngineReady && this._setMidiPlayer(l);
     else if (l instanceof ArrayBuffer)
       this.parsedData = await this._parser.parse(l, U), this.instrumentMap = F || this._createDefaultInstrumentMap(this.parsedData.parts), this._audioEngineReady && this._setupPlayerWithAudio();
-    else if (l && typeof l == "object" && l.parts)
-      this.parsedData = l, this.instrumentMap = F || this._createDefaultInstrumentMap(l.parts), this._audioEngineReady && this._setupPlayerWithAudio();
-    else
+    else if (l && typeof l == "object" && l.parts) {
+      if (this.parsedData = l, U) {
+        const t = typeof U == "string" ? JSON.parse(U) : U;
+        this.parsedData.structureMetadata = t;
+      }
+      this.instrumentMap = F || this._createDefaultInstrumentMap(l.parts), this._audioEngineReady && this._setupPlayerWithAudio();
+    } else
       throw new Error("Invalid input type. Expected MidiPlayer, parsed MIDI data, or ArrayBuffer");
   }
   /**
@@ -3996,7 +4019,9 @@ class _U {
   async _startLeadIn(l) {
     this.state = "lead-in";
     const U = this.startupConfig.delayMs / 1e3;
-    this.leadInStartTime = this.audioEngine.audioContext.currentTime + U, this.leadInProgress = 0, this.leadInData = this._calculateLeadInBeats(), this._emitEvent("leadInStarted", {
+    this.leadInStartTime = this.audioEngine.audioContext.currentTime + U, this.leadInProgress = 0, this.leadInData = this._calculateLeadInBeats();
+    const F = this.leadInStartTime + this.leadInData.duration;
+    this.midiPlayer && this.midiPlayer.beginPreScheduling(F), this._emitEvent("leadInStarted", {
       totalBeats: this.leadInData.totalBeats,
       duration: this.leadInData.duration,
       bars: this.leadInConfig.bars,
@@ -4096,8 +4121,10 @@ class _U {
    * @private
    */
   _completeLeadIn(l) {
-    const U = this.leadInStartTime + this.leadInData.duration;
-    this._stopLeadIn(), this._emitEvent("leadInEnded", {}), this.leadInData = null, this.leadInProgress = null, this.leadInStartTime = null, this._startMidiPlaybackAt(U, l, !0);
+    this._stopLeadIn(), this._emitEvent("leadInEnded", {}), this.leadInData = null, this.leadInProgress = null, this.leadInStartTime = null, this.state = "playing", this.midiPlayer && this.midiPlayer.markAsPlaying(), l && !this.leadInUsedMetronome && this._startMetronome(), this._emitEvent("playbackStarted", {
+      startupDelayMs: 0,
+      position: this.frozenTime
+    });
   }
   /**
    * Start MIDI playback at a specific time (for seamless lead-in transitions)
@@ -4373,12 +4400,15 @@ class _U {
    * @private
    */
   _completeMidiPlayerSetup() {
-    this._partOutputsMap.clear(), Object.keys(this.midiPlayer.parsedData.parts).sort((l, U) => {
-      const F = this.midiPlayer.parsedData.parts[l], t = this.midiPlayer.parsedData.parts[U], Z = F.channel !== void 0 ? F.channel : F.trackIndex, a = t.channel !== void 0 ? t.channel : t.trackIndex;
-      return Z - a;
-    }).forEach((l) => {
-      const U = this.midiPlayer.getPartOutput(l);
-      U && this._partOutputsMap.set(l, U);
+    var l;
+    this._partOutputsMap.clear();
+    const U = ((l = this.midiPlayer.structureMetadata) == null ? void 0 : l.parts) || {}, F = Object.keys(this.midiPlayer.parsedData.parts).map((t) => {
+      const Z = U[t] || {}, a = this.midiPlayer.parsedData.parts[t], Q = Z.order !== void 0 && typeof Z.order == "number" ? Z.order : 999, n = a.channel ?? 0, V = a.trackIndex ?? 0;
+      return { name: t, order: Q, channel: n, trackIndex: V };
+    });
+    F.sort((t, Z) => t.order !== Z.order ? t.order - Z.order : t.channel !== Z.channel ? t.channel - Z.channel : t.trackIndex - Z.trackIndex), F.map((t) => t.name).forEach((t) => {
+      const Z = this.midiPlayer.getPartOutput(t);
+      Z && this._partOutputsMap.set(t, Z);
     }), this._setupEventDelegation(), this.state = "ready";
   }
   /**
@@ -4473,11 +4503,11 @@ class _U {
         t
       );
       if (W) {
-        const c = W.latencyMs;
-        Q.push(c), console.log(`Measurement ${e + 1}/${l}: ${c.toFixed(1)}ms (RMS: ${W.rms.toFixed(4)}, peak: ${W.peak.toFixed(4)})`);
+        const b = W.latencyMs;
+        Q.push(b), console.log(`Measurement ${e + 1}/${l}: ${b.toFixed(1)}ms (RMS: ${W.rms.toFixed(4)}, peak: ${W.peak.toFixed(4)})`);
       } else
         console.warn(`Measurement ${e + 1}/${l}: detection timeout (no signal above ${F} threshold)`);
-      await new Promise((c) => setTimeout(c, 300));
+      await new Promise((b) => setTimeout(b, 300));
     }
     if (Q.length === 0)
       throw new Error(`Failed to detect any metronome onsets. Try lowering threshold (current: ${F}) or check audio routing.`);
@@ -4518,10 +4548,10 @@ class _U {
           return;
         }
         l.getFloatTimeDomainData(n);
-        let W = 0, c = 0;
+        let W = 0, b = 0;
         for (let o = 0; o < Q; o++) {
           const Y = Math.abs(n[o]);
-          W += n[o] * n[o], Y > c && (c = Y);
+          W += n[o] * n[o], Y > b && (b = Y);
         }
         const J = Math.sqrt(W / Q);
         if (J >= t) {
@@ -4530,7 +4560,7 @@ class _U {
           e({
             latencyMs: Y,
             rms: J,
-            peak: c,
+            peak: b,
             detectedTime: o
           });
         }
@@ -4555,10 +4585,10 @@ class _U {
           return;
         }
         l.getFloatTimeDomainData(Q);
-        let W = 0, c = 0;
+        let W = 0, b = 0;
         for (let Y = 0; Y < a; Y++) {
           const T = Math.abs(Q[Y]);
-          W += Q[Y] * Q[Y], T > c && (c = T);
+          W += Q[Y] * Q[Y], T > b && (b = T);
         }
         const J = Math.sqrt(W / a), o = Z.currentTime;
         n.push({
@@ -4566,7 +4596,7 @@ class _U {
           relativeTime: (o - U) * 1e3,
           // ms relative to scheduled time
           rms: J,
-          peak: c
+          peak: b
         });
       }, F);
     });
@@ -5030,66 +5060,66 @@ const h = new UF();
 function Ql(d = {}) {
   const l = Fl(), U = $(), F = fl(), t = {
     soundfontUrl: d.soundfontUrl
-  }, Z = ({ currentTime: b }) => {
-    l.setCurrentTime(b);
-  }, a = ({ isPlaying: b }) => {
-    l.setPlaybackState(b), F.setTransportState(b ? "playing" : "stopped"), !b && l.isLeadInActive && (l.setLeadInActive(!1), h.emitTimeAndBarUpdates(l.currentTime));
-  }, Q = (b) => {
-    b && (l.isLeadInActive ? b.isLeadIn && b.beat !== void 0 && l.setCurrentBar(null, b.beat, null) : (l.setCurrentBar(b.bar, b.beat, b.repeat), F.updateLastBarPosition(b.bar)));
-  }, n = ({ speed: b }) => {
-    l.setPlaybackSpeed(b);
-  }, V = ({ volume: b }) => {
-    l.setMasterVolume(b);
-  }, R = ({ partName: b, volume: N }) => {
-    l.setPartVolume(b, N);
-  }, e = ({ partName: b, muted: N }) => {
-    l.setPartMuted(b, N);
-  }, m = ({ partName: b, solo: N }) => {
-    l.setPartSolo(b, N);
-  }, W = ({ bars: b }) => {
-    l.setLeadInActive(!0, b);
-  }, c = () => {
+  }, Z = ({ currentTime: c }) => {
+    l.setCurrentTime(c);
+  }, a = ({ isPlaying: c }) => {
+    l.setPlaybackState(c), F.setTransportState(c ? "playing" : "stopped"), !c && l.isLeadInActive && (l.setLeadInActive(!1), h.emitTimeAndBarUpdates(l.currentTime));
+  }, Q = (c) => {
+    c && (l.isLeadInActive ? c.isLeadIn && c.beat !== void 0 && l.setCurrentBar(null, c.beat, null) : (l.setCurrentBar(c.bar, c.beat, c.repeat), F.updateLastBarPosition(c.bar)));
+  }, n = ({ speed: c }) => {
+    l.setPlaybackSpeed(c);
+  }, V = ({ volume: c }) => {
+    l.setMasterVolume(c);
+  }, R = ({ partName: c, volume: N }) => {
+    l.setPartVolume(c, N);
+  }, e = ({ partName: c, muted: N }) => {
+    l.setPartMuted(c, N);
+  }, m = ({ partName: c, solo: N }) => {
+    l.setPartSolo(c, N);
+  }, W = ({ bars: c }) => {
+    l.setLeadInActive(!0, c);
+  }, b = () => {
     l.setLeadInActive(!1);
   }, J = () => {
     l.setStartingNotesActive(!0);
   }, o = () => {
     l.setStartingNotesActive(!1);
-  }, Y = ({ mark: b }) => {
-    F.updateLastPracticeMarkUsed(b);
-  }, T = ({ parts: b }) => {
-    l.initializeParts(b), U.setParts(b);
-  }, I = ({ finalTime: b }) => {
-    l.setPlaybackState(!1), F.setTransportState("stopped"), console.log(`Song ended at time: ${b}`);
-  }, g = ({ duration: b }) => {
-    console.log("Updating total duration in store to:", b), U.setTotalDuration(b);
-  }, K = ({ beats: b, practiceMarks: N, maxBar: q }) => {
-    console.log(`Updating music data store with ${b.length} beats and ${Object.keys(N).length} practice marks`), U.updateBeats(b), U.practiceMarks = N, U.maxBar = q;
+  }, Y = ({ mark: c }) => {
+    F.updateLastPracticeMarkUsed(c);
+  }, T = ({ parts: c }) => {
+    l.initializeParts(c), U.setParts(c);
+  }, I = ({ finalTime: c }) => {
+    l.setPlaybackState(!1), F.setTransportState("stopped"), console.log(`Song ended at time: ${c}`);
+  }, g = ({ duration: c }) => {
+    console.log("Updating total duration in store to:", c), U.setTotalDuration(c);
+  }, K = ({ beats: c, practiceMarks: N, maxBar: q }) => {
+    console.log(`Updating music data store with ${c.length} beats and ${Object.keys(N).length} practice marks`), U.updateBeats(c), U.practiceMarks = N, U.maxBar = q;
   }, M = () => {
-    h.on("timeChanged", Z), h.on("playbackStateChanged", a), h.on("barChanged", Q), h.on("speedChanged", n), h.on("masterVolumeChanged", V), h.on("partVolumeChanged", R), h.on("partMutedChanged", e), h.on("partSoloChanged", m), h.on("leadInStarted", W), h.on("leadInCompleted", c), h.on("startingNotesStarted", J), h.on("startingNotesCompleted", o), h.on("practiceMarkChanged", Y), h.on("initialized", T), h.on("songEnded", I), h.on("durationUpdated", g), h.on("musicDataExtracted", K);
+    h.on("timeChanged", Z), h.on("playbackStateChanged", a), h.on("barChanged", Q), h.on("speedChanged", n), h.on("masterVolumeChanged", V), h.on("partVolumeChanged", R), h.on("partMutedChanged", e), h.on("partSoloChanged", m), h.on("leadInStarted", W), h.on("leadInCompleted", b), h.on("startingNotesStarted", J), h.on("startingNotesCompleted", o), h.on("practiceMarkChanged", Y), h.on("initialized", T), h.on("songEnded", I), h.on("durationUpdated", g), h.on("musicDataExtracted", K);
   }, O = () => {
-    h.off("timeChanged", Z), h.off("playbackStateChanged", a), h.off("barChanged", Q), h.off("speedChanged", n), h.off("masterVolumeChanged", V), h.off("partVolumeChanged", R), h.off("partMutedChanged", e), h.off("partSoloChanged", m), h.off("leadInStarted", W), h.off("leadInCompleted", c), h.off("startingNotesStarted", J), h.off("startingNotesCompleted", o), h.off("practiceMarkChanged", Y), h.off("initialized", T), h.off("songEnded", I), h.off("durationUpdated", g), h.off("musicDataExtracted", K);
+    h.off("timeChanged", Z), h.off("playbackStateChanged", a), h.off("barChanged", Q), h.off("speedChanged", n), h.off("masterVolumeChanged", V), h.off("partVolumeChanged", R), h.off("partMutedChanged", e), h.off("partSoloChanged", m), h.off("leadInStarted", W), h.off("leadInCompleted", b), h.off("startingNotesStarted", J), h.off("startingNotesCompleted", o), h.off("practiceMarkChanged", Y), h.off("initialized", T), h.off("songEnded", I), h.off("durationUpdated", g), h.off("musicDataExtracted", K);
   };
   (() => {
     Sl(() => {
-      const b = l.masterVolume;
+      const c = l.masterVolume;
       try {
-        h.getMasterVolume() !== b && h.setMasterVolume(b);
+        h.getMasterVolume() !== c && h.setMasterVolume(c);
       } catch (N) {
         console.warn("Master volume sync skipped during initialization:", N.message);
       }
     }), Sl(() => {
-      const b = l.metronomeVolume;
+      const c = l.metronomeVolume;
       try {
-        h.getMetronomeVolume() !== b && h.setMetronomeVolume(b);
+        h.getMetronomeVolume() !== c && h.setMetronomeVolume(c);
       } catch (N) {
         console.warn("Metronome volume sync skipped during initialization:", N.message);
       }
     });
   })();
-  const i = async (b) => {
+  const i = async (c) => {
     try {
-      if (l.setLoaded(!1), M(), U.loadMusicData(b), await h.initialize(b, t), F.buildFixedNavigationPoints(), !b.midiData && b.beats && b.beats.length > 0) {
-        const N = b.beats[0];
+      if (l.setLoaded(!1), M(), U.loadMusicData(c), await h.initialize(c, t), F.buildFixedNavigationPoints(), !c.midiData && c.beats && c.beats.length > 0) {
+        const N = c.beats[0];
         l.setCurrentBar(N.bar, N.beat, N.repeat), h.setTime(N.time);
       }
       h.updateToggleStates(l.metronomeEnabled, l.leadInEnabled), l.setLoaded(!0);
@@ -5097,43 +5127,43 @@ function Ql(d = {}) {
       throw console.error("Failed to initialize audio engine:", N), l.setLoaded(!1), N;
     }
   }, G = () => {
-    const b = l.currentBar, N = l.currentRepeat, q = l.currentTime;
-    F.setLastPlayStart(b, N, q), F.setNavigationAction("play"), h.play();
+    const c = l.currentBar, N = l.currentRepeat, q = l.currentTime;
+    F.setLastPlayStart(c, N, q), F.setNavigationAction("play"), h.play();
   }, L = () => {
     F.setNavigationAction("pause"), h.stop();
   }, tl = () => {
     F.setNavigationAction("pause"), h.pause();
-  }, f = (b) => {
-    F.setNavigationAction("manual"), h.setTime(b);
-  }, A = (b, N = 0) => {
-    F.setNavigationAction("manual"), h.setBar(b, N);
-  }, u = (b) => {
-    h.goToPracticeMark(b);
-  }, S = (b) => {
-    h.setPlaybackSpeed(b);
-  }, E = (b) => {
-    h.setMasterVolume(b);
-  }, H = (b, N) => {
-    h.setPartVolume(b, N);
-  }, Vl = (b, N) => {
-    h.setPartMuted(b, N);
-  }, nl = (b, N) => {
-    h.setPartSolo(b, N);
-  }, Rl = (b = 1) => {
-    h.playLeadIn(b);
+  }, f = (c) => {
+    F.setNavigationAction("manual"), h.setTime(c);
+  }, A = (c, N = 0) => {
+    F.setNavigationAction("manual"), h.setBar(c, N);
+  }, u = (c) => {
+    h.goToPracticeMark(c);
+  }, S = (c) => {
+    h.setPlaybackSpeed(c);
+  }, E = (c) => {
+    h.setMasterVolume(c);
+  }, H = (c, N) => {
+    h.setPartVolume(c, N);
+  }, Vl = (c, N) => {
+    h.setPartMuted(c, N);
+  }, nl = (c, N) => {
+    h.setPartSolo(c, N);
+  }, Rl = (c = 1) => {
+    h.playLeadIn(c);
   }, FU = () => {
     h.playStartingNotes();
-  }, rl = (b, N = !0, q = 0) => {
-    N && F.leadInEnabled ? (A(b, q), Rl(F.leadInBars)) : (A(b, q), G());
-  }, tU = (b, N = !0) => {
-    const q = U.getBarForMark(b);
+  }, rl = (c, N = !0, q = 0) => {
+    N && F.leadInEnabled ? (A(c, q), Rl(F.leadInBars)) : (A(c, q), G());
+  }, tU = (c, N = !0) => {
+    const q = U.getBarForMark(c);
     q && rl(q, N);
   }, dU = () => {
-    const b = !l.metronomeEnabled;
-    return l.setMetronomeEnabled(b), h.setMetronomeEnabled(b), b;
+    const c = !l.metronomeEnabled;
+    return l.setMetronomeEnabled(c), h.setMetronomeEnabled(c), c;
   }, ZU = () => {
-    const b = !l.leadInEnabled;
-    return l.setLeadInEnabled(b), h.updateToggleStates(l.metronomeEnabled, b), b;
+    const c = !l.leadInEnabled;
+    return l.setLeadInEnabled(c), h.updateToggleStates(l.metronomeEnabled, c), c;
   }, aU = () => {
     h.stop(), l.setLoaded(!1), U.clear(), console.log("Audio mixer reset - ready for new score");
   };
@@ -5158,15 +5188,15 @@ function Ql(d = {}) {
     setPartVolume: H,
     setPartMuted: Vl,
     setPartSolo: nl,
-    getPartLevel: (b) => h.getPartLevel(b),
+    getPartLevel: (c) => h.getPartLevel(c),
     // Special features
     playLeadIn: Rl,
     playStartingNotes: FU,
     // Feature toggles
     toggleMetronome: dU,
     toggleLeadIn: ZU,
-    setMetronomeEnabled: (b) => {
-      l.setMetronomeEnabled(b), h.setMetronomeEnabled(b);
+    setMetronomeEnabled: (c) => {
+      l.setMetronomeEnabled(c), h.setMetronomeEnabled(c);
     },
     // Complex operations
     playFromBar: rl,
@@ -5201,18 +5231,18 @@ const FF = ["aria-label"], tF = {
   }),
   emits: ["update:volume", "update:mute", "update:solo"],
   setup(d) {
-    ll((c) => ({
+    ll((b) => ({
       "03f87250": V.value
     }));
     const l = d;
     Fl();
     const U = Ql(), F = _(d, "volume"), t = _(d, "mute"), Z = _(d, "solo");
-    z(F, (c) => {
-      U.setPartVolume(l.name, c);
-    }), z(t, (c) => {
-      U.setPartMuted(l.name, c), c && (Z.value = !1);
-    }), z(Z, (c) => {
-      U.setPartSolo(l.name, c), c && (t.value = !1);
+    z(F, (b) => {
+      U.setPartVolume(l.name, b);
+    }), z(t, (b) => {
+      U.setPartMuted(l.name, b), b && (Z.value = !1);
+    }), z(Z, (b) => {
+      U.setPartSolo(l.name, b), b && (t.value = !1);
     });
     const a = w("el"), { width: Q, height: n } = Ul(a), V = X(() => Math.min(Q.value, n.value) + "px"), R = X(
       () => Q.value > n.value ? "mobile" : Q.value < 60 ? "tablet" : "desktop"
@@ -5233,14 +5263,14 @@ const FF = ["aria-label"], tF = {
     }), sl(() => {
       e && (clearInterval(e), e = null);
     });
-    const W = (c) => {
-      if (["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft"].includes(c.key)) {
-        c.preventDefault(), c.stopPropagation();
-        const J = c.key === "ArrowUp" || c.key === "ArrowRight" ? 0.1 : -0.1;
+    const W = (b) => {
+      if (["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft"].includes(b.key)) {
+        b.preventDefault(), b.stopPropagation();
+        const J = b.key === "ArrowUp" || b.key === "ArrowRight" ? 0.1 : -0.1;
         F.value = Math.max(0, Math.min(1, F.value + J));
-      } else c.key === "m" && !c.shiftKey ? (c.preventDefault(), c.stopPropagation(), t.value = !t.value) : c.key === "s" && !c.shiftKey && (c.preventDefault(), c.stopPropagation(), Z.value = !Z.value);
+      } else b.key === "m" && !b.shiftKey ? (b.preventDefault(), b.stopPropagation(), t.value = !t.value) : b.key === "s" && !b.shiftKey && (b.preventDefault(), b.stopPropagation(), Z.value = !Z.value);
     };
-    return (c, J) => (p(), y("div", {
+    return (b, J) => (p(), y("div", {
       ref_key: "el",
       ref: a,
       class: C([R.value, "part"]),
@@ -5288,7 +5318,7 @@ const FF = ["aria-label"], tF = {
       77574882: Y.value,
       "188cd0ae": T.value
     }));
-    const l = w("el"), U = w("rpt"), { width: F, height: t } = Ul(l), Z = $(), a = Fl(), Q = Ql(), n = k("1"), V = k("A"), R = k(0), e = k(2), m = k(!1), W = k(!1), c = k(!1), J = k(!0);
+    const l = w("el"), U = w("rpt"), { width: F, height: t } = Ul(l), Z = $(), a = Fl(), Q = Ql(), n = k("1"), V = k("A"), R = k(0), e = k(2), m = k(!1), W = k(!1), b = k(!1), J = k(!0);
     let o = null;
     z(() => {
       var u;
@@ -5329,17 +5359,17 @@ const FF = ["aria-label"], tF = {
       S && S.stopPropagation(), V.value = u, W.value = !1, Q.goToPracticeMark(u), l.value && l.value.blur();
     }
     function i() {
-      e.value > 1 && (c.value = !0), a.currentRepeat < e.value && Q.setBar(a.currentBar, a.currentRepeat + 1);
+      e.value > 1 && (b.value = !0), a.currentRepeat < e.value && Q.setBar(a.currentBar, a.currentRepeat + 1);
     }
     function G() {
-      e.value > 1 && (c.value = !0), a.currentRepeat > 1 && Q.setBar(a.currentBar, a.currentRepeat - 1);
+      e.value > 1 && (b.value = !0), a.currentRepeat > 1 && Q.setBar(a.currentBar, a.currentRepeat - 1);
     }
     function L(u) {
-      g.value && (u.stopPropagation(), c.value = !1, W.value = !W.value);
+      g.value && (u.stopPropagation(), b.value = !1, W.value = !W.value);
     }
     function tl(u) {
       var S, E;
-      (S = l.value) != null && S.contains(u.target) || (W.value = !1), (E = U.value) != null && E.contains(u.target) || (c.value = !1);
+      (S = l.value) != null && S.contains(u.target) || (W.value = !1), (E = U.value) != null && E.contains(u.target) || (b.value = !1);
     }
     function f() {
       W.value && setTimeout(() => {
@@ -5404,7 +5434,7 @@ const FF = ["aria-label"], tF = {
         B("div", {
           ref_key: "rpt",
           ref: U,
-          class: C(["rpt-input", { edit: c.value, available: e.value > 1 }])
+          class: C(["rpt-input", { edit: b.value, available: e.value > 1 }])
         }, [
           B("div", aF, D(r(a).currentRepeat || "-"), 1),
           (p(), y("svg", {
@@ -5439,7 +5469,7 @@ const FF = ["aria-label"], tF = {
       ])) : j("", !0)
     ], 34));
   }
-}, bF = /* @__PURE__ */ v(mF, [["__scopeId", "data-v-7856f4ec"]]), cF = { class: "frame" }, WF = { class: "title" }, sF = {
+}, cF = /* @__PURE__ */ v(mF, [["__scopeId", "data-v-7856f4ec"]]), bF = { class: "frame" }, WF = { class: "title" }, sF = {
   __name: "BaseNumericInput",
   props: /* @__PURE__ */ yl({
     title: {
@@ -5529,7 +5559,7 @@ const FF = ["aria-label"], tF = {
       ref_key: "el",
       ref: U
     }, [
-      B("div", cF, [
+      B("div", bF, [
         El(B("input", {
           type: "text",
           class: "input",
@@ -5672,7 +5702,7 @@ const FF = ["aria-label"], tF = {
     function e() {
       Q.playStartingNotes();
     }
-    const m = X(() => Z.metronomeEnabled), W = X(() => Z.leadInEnabled), c = k(!1), J = k(null);
+    const m = X(() => Z.metronomeEnabled), W = X(() => Z.leadInEnabled), b = k(!1), J = k(null);
     function o() {
       if (U.externalMenuControl) {
         F("menu-click"), Q.audioEngine.initializeAudioSystem().catch((s) => {
@@ -5680,7 +5710,7 @@ const FF = ["aria-label"], tF = {
         });
         return;
       }
-      c.value = !c.value, c.value && (Q.audioEngine.initializeAudioSystem().catch((s) => {
+      b.value = !b.value, b.value && (Q.audioEngine.initializeAudioSystem().catch((s) => {
         console.warn("Audio system pre-initialization failed:", s);
       }), setTimeout(() => {
         var i;
@@ -5689,7 +5719,7 @@ const FF = ["aria-label"], tF = {
       }, 0));
     }
     function Y() {
-      c.value = !1;
+      b.value = !1;
     }
     function T(s) {
       J.value && !J.value.contains(s.target) && Y();
@@ -5785,7 +5815,7 @@ const FF = ["aria-label"], tF = {
           }, i[2] || (i[2] = [
             B("path", { d: "M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z" }, null, -1)
           ]))),
-          !d.externalMenuControl && c.value && s.$slots.menu ? (p(), y("div", {
+          !d.externalMenuControl && b.value && s.$slots.menu ? (p(), y("div", {
             key: 0,
             class: "dropdown-menu",
             onClick: Y
@@ -5814,7 +5844,7 @@ const FF = ["aria-label"], tF = {
       }, null, 8, ["value"]),
       i[10] || (i[10] = B("div", { class: "tick-t" }, "Tick", -1)),
       i[11] || (i[11] = B("div", { class: "tick-focus" }, null, -1)),
-      x(bF, { class: "bar" }),
+      x(cF, { class: "bar" }),
       x(iF, { class: "time" }),
       x(hF, { class: "speed" }),
       B("div", SF, [
@@ -6049,7 +6079,7 @@ const FF = ["aria-label"], tF = {
   },
   emits: ["menu-click"],
   setup(d, { emit: l }) {
-    ll((c) => ({
+    ll((b) => ({
       "3e3bf6e6": e.value,
       "3e499cb2": m.value,
       "3a701552": W.value
@@ -6059,8 +6089,8 @@ const FF = ["aria-label"], tF = {
       a.initializeListeners();
     });
     const Q = w("container"), { width: n } = Ul(Q), V = X(() => Z.isLoaded), R = X(() => {
-      const c = n.value, J = t.parts.length;
-      return c < 640 || c < xl * J + Il ? 0 : c < Ml * J + vl ? 1 : c < zl * J + gl ? 2 : 3;
+      const b = n.value, J = t.parts.length;
+      return b < 640 || b < xl * J + Il ? 0 : b < Ml * J + vl ? 1 : b < zl * J + gl ? 2 : 3;
     }), e = X(() => {
       switch (R.value) {
         case 0:
@@ -6084,10 +6114,10 @@ const FF = ["aria-label"], tF = {
           return `${zl}px `.repeat(t.parts.length) + `${gl}px`;
       }
     }), W = X(() => {
-      const c = [...t.parts.keys()];
-      return R.value > 0 ? '"' + c.map((J) => "part" + J).join(" ") + ' controls"' : '"controls" ' + c.map((J) => '"part' + J + '"').join(" ");
+      const b = [...t.parts.keys()];
+      return R.value > 0 ? '"' + b.map((J) => "part" + J).join(" ") + ' controls"' : '"controls" ' + b.map((J) => '"part' + J + '"').join(" ");
     });
-    return (c, J) => (p(), y("div", {
+    return (b, J) => (p(), y("div", {
       class: "outer",
       ref_key: "container",
       ref: Q
@@ -6113,7 +6143,7 @@ const FF = ["aria-label"], tF = {
             class: "controls"
           }, {
             menu: P(() => [
-              al(c.$slots, "menu", {}, void 0, !0)
+              al(b.$slots, "menu", {}, void 0, !0)
             ]),
             _: 3
           }, 8, ["external-menu-control"]),
@@ -6372,7 +6402,7 @@ new _F();
 export {
   dl as AudioButton,
   Wl as AudioSlider,
-  bF as BarInput,
+  cF as BarInput,
   UU as BaseNumericInput,
   pl as DEV_MODE,
   _F as DummyAudioEngine,