@dawcore/components 0.0.18 → 0.0.20

package/dist/index.js

@@ -230,7 +230,7 @@ var DawTrackElement = class extends import_lit2.LitElement {
     this.pan = 0;
     this.muted = false;
     this.soloed = false;
-    this.renderMode = "waveform";
+    this._renderMode = "waveform";
     this.spectrogramConfig = null;
     this.trackId = crypto.randomUUID();
     // Track removal is detected by the editor's MutationObserver,
@@ -238,6 +238,21 @@ var DawTrackElement = class extends import_lit2.LitElement {
     // cannot bubble events to ancestors).
     this._hasRendered = false;
   }
+  get renderMode() {
+    return this._renderMode;
+  }
+  set renderMode(value) {
+    const old = this._renderMode;
+    let next = value;
+    if (next === "both") {
+      console.warn(
+        `[dawcore] <daw-track render-mode="both"> is not yet supported; falling back to 'spectrogram'`
+      );
+      next = "spectrogram";
+    }
+    this._renderMode = next;
+    this.requestUpdate("renderMode", old);
+  }
   // Light DOM so <daw-clip> children are queryable.
   createRenderRoot() {
     return this;
@@ -300,8 +315,8 @@ __decorateClass([
   (0, import_decorators2.property)({ type: Boolean })
 ], DawTrackElement.prototype, "soloed", 2);
 __decorateClass([
-  (0, import_decorators2.property)({ attribute: "render-mode" })
-], DawTrackElement.prototype, "renderMode", 2);
+  (0, import_decorators2.property)({ attribute: "render-mode", noAccessor: true })
+], DawTrackElement.prototype, "renderMode", 1);
 __decorateClass([
   (0, import_decorators2.property)({ attribute: false })
 ], DawTrackElement.prototype, "spectrogramConfig", 2);
@@ -1246,7 +1261,7 @@ function isDomClip(desc) {
 }
 
 // src/elements/daw-editor.ts
-var import_core8 = require("@waveform-playlist/core");
+var import_core9 = require("@waveform-playlist/core");
 
 // src/workers/peaksWorker.ts
 var import_waveform_data = __toESM(require("waveform-data"));
@@ -2774,15 +2789,7 @@ var RecordingController = class {
 
 // src/controllers/spectrogram-controller.ts
 var import_spectrogram = require("@dawcore/spectrogram");
-var LIBRARY_DEFAULTS = {
-  fftSize: 2048,
-  windowFunction: "hann",
-  frequencyScale: "mel",
-  minFrequency: 0,
-  gainDb: 20,
-  rangeDb: 80
-};
-var LIBRARY_DEFAULT_COLOR_MAP = "viridis";
+var import_core4 = require("@waveform-playlist/core");
 var SpectrogramController = class {
   constructor(host, workerFactory) {
     this.orchestrator = null;
@@ -2856,7 +2863,21 @@ var SpectrogramController = class {
         const detail = e.detail;
         this.host.dispatchEvent(
           new CustomEvent("daw-spectrogram-ready", {
-            detail,
+            detail: { trackId: detail.trackId, generation: detail.generation },
+            bubbles: true,
+            composed: true
+          })
+        );
+      });
+      this.orchestrator.addEventListener("viewport-error", (e) => {
+        const detail = e.detail;
+        this.host.dispatchEvent(
+          new CustomEvent("daw-spectrogram-error", {
+            detail: {
+              trackId: detail.trackId,
+              generation: detail.generation,
+              error: detail.error
+            },
             bubbles: true,
             composed: true
           })
@@ -2877,18 +2898,18 @@ var SpectrogramController = class {
       track = c;
       break;
     }
-    return { ...LIBRARY_DEFAULTS, ...this.editorConfig ?? {}, ...track ?? {} };
+    return { ...import_core4.SPECTROGRAM_DEFAULTS, ...this.editorConfig ?? {}, ...track ?? {} };
   }
   mergedColorMap() {
     for (const c of this.trackColorMaps.values()) {
-      return c ?? LIBRARY_DEFAULT_COLOR_MAP;
+      return c ?? import_core4.DEFAULT_SPECTROGRAM_COLOR_MAP;
     }
-    return this.editorColorMap ?? LIBRARY_DEFAULT_COLOR_MAP;
+    return this.editorColorMap ?? import_core4.DEFAULT_SPECTROGRAM_COLOR_MAP;
   }
 };
 
 // src/interactions/pointer-handler.ts
-var import_core4 = require("@waveform-playlist/core");
+var import_core5 = require("@waveform-playlist/core");
 
 // src/interactions/constants.ts
 var DRAG_THRESHOLD = 3;
@@ -2998,10 +3019,10 @@ var PointerHandler = class {
     const h = this._host;
     if (h.scaleMode === "beats") {
       let tick = px * h.ticksPerPixel;
-      tick = (0, import_core4.snapTickToGrid)(tick, h.snapTo, h._meterEntries, h.ppqn);
+      tick = (0, import_core5.snapTickToGrid)(tick, h.snapTo, h._meterEntries, h.ppqn);
       return h._ticksToSeconds(tick);
     }
-    return (0, import_core4.pixelsToSeconds)(px, h.samplesPerPixel, h.effectiveSampleRate);
+    return (0, import_core5.pixelsToSeconds)(px, h.samplesPerPixel, h.effectiveSampleRate);
   }
   _timeToPx(time) {
     const h = this._host;
@@ -3093,7 +3114,7 @@ var PointerHandler = class {
 };
 
 // src/interactions/clip-pointer-handler.ts
-var import_core5 = require("@waveform-playlist/core");
+var import_core6 = require("@waveform-playlist/core");
 var ClipPointerHandler = class {
   constructor(host) {
     this._mode = null;
@@ -3127,7 +3148,7 @@ var ClipPointerHandler = class {
       const anchorTick = h._secondsToTicks(anchorSeconds);
       const deltaTicks = totalDeltaPx * h.ticksPerPixel;
       const targetTick = anchorTick + deltaTicks;
-      const snappedTick = h.snapTo !== "off" ? (0, import_core5.snapTickToGrid)(targetTick, h.snapTo, h._meterEntries, h.ppqn) : targetTick;
+      const snappedTick = h.snapTo !== "off" ? (0, import_core6.snapTickToGrid)(targetTick, h.snapTo, h._meterEntries, h.ppqn) : targetTick;
       const snappedSeconds = h._ticksToSeconds(snappedTick);
       const snappedSample = Math.round(snappedSeconds * h.effectiveSampleRate);
       return snappedSample - anchorSample;
@@ -3390,7 +3411,7 @@ var ClipPointerHandler = class {
 };
 
 // src/interactions/file-loader.ts
-var import_core6 = require("@waveform-playlist/core");
+var import_core7 = require("@waveform-playlist/core");
 async function loadFiles(host, files) {
   if (!files) {
     console.warn("[dawcore] loadFiles called with null/undefined");
@@ -3412,7 +3433,7 @@ async function loadFiles(host, files) {
       host._audioCache.delete(blobUrl);
       host._resolvedSampleRate = audioBuffer.sampleRate;
       const name = file.name.replace(/\.\w+$/, "");
-      const clip = (0, import_core6.createClip)({
+      const clip = (0, import_core7.createClip)({
         audioBuffer,
         startSample: 0,
         durationSamples: audioBuffer.length,
@@ -3436,7 +3457,7 @@ async function loadFiles(host, files) {
       );
       host._peaksData = new Map(host._peaksData).set(clip.id, peakData);
       const trackId = crypto.randomUUID();
-      const track = (0, import_core6.createTrack)({ name, clips: [clip] });
+      const track = (0, import_core7.createTrack)({ name, clips: [clip] });
       track.id = trackId;
       host._tracks = new Map(host._tracks).set(trackId, {
         name,
@@ -3495,8 +3516,110 @@ async function loadFiles(host, files) {
   return { loaded, failed };
 }
 
+// src/interactions/midi-loader.ts
+var INSTALL_HINT = "@dawcore/midi is required for loadMidi(). Install with: npm install @dawcore/midi";
+async function loadMidiImpl(host, source, options = {}) {
+  const startTime = options.startTime ?? 0;
+  if (!Number.isFinite(startTime) || startTime < 0) {
+    throw new RangeError(
+      "loadMidi: startTime must be a non-negative finite number (got " + String(options.startTime) + ")"
+    );
+  }
+  let midiModule;
+  try {
+    midiModule = await import("@dawcore/midi");
+  } catch (originalErr) {
+    console.warn("[dawcore] @dawcore/midi dynamic import failed: " + String(originalErr));
+    throw new Error(INSTALL_HINT);
+  }
+  const { parseMidiUrl, parseMidiFile } = midiModule;
+  let parsed;
+  if (typeof source === "string") {
+    parsed = await parseMidiUrl(source, void 0, options.signal);
+  } else {
+    let buffer;
+    try {
+      buffer = await source.arrayBuffer();
+    } catch (err) {
+      throw new Error(
+        'loadMidi: failed to read File "' + source.name + '" (' + source.size + " bytes): " + String(err)
+      );
+    }
+    parsed = parseMidiFile(buffer);
+  }
+  const childrenBefore = new Set(host.querySelectorAll("daw-track"));
+  const settlements = await Promise.allSettled(
+    parsed.tracks.map(
+      (t) => host.addTrack({
+        name: t.name,
+        renderMode: "piano-roll",
+        clips: [
+          {
+            midiNotes: t.notes,
+            midiChannel: t.channel,
+            midiProgram: t.programNumber,
+            start: startTime
+          }
+        ]
+      })
+    )
+  );
+  const succeeded = [];
+  const rejections = [];
+  for (const s of settlements) {
+    if (s.status === "fulfilled") {
+      succeeded.push(s.value);
+    } else {
+      rejections.push(s.reason);
+    }
+  }
+  if (rejections.length > 0) {
+    const appendedTracks = Array.from(host.querySelectorAll("daw-track")).filter(
+      (el) => !childrenBefore.has(el)
+    );
+    for (const el of appendedTracks) {
+      try {
+        el.remove();
+      } catch (cleanupErr) {
+        console.warn("[dawcore] loadMidi cleanup failed for a track: " + String(cleanupErr));
+      }
+    }
+    await Promise.resolve();
+    for (let i = 1; i < rejections.length; i++) {
+      console.warn(
+        "[dawcore] loadMidi: additional track failure (" + i + "): " + stringifyReason(rejections[i])
+      );
+    }
+    const first = rejections[0];
+    if (rejections.length > 1) {
+      const message = "loadMidi: " + rejections.length + " of " + settlements.length + " tracks failed; first: " + (first instanceof Error ? first.message : stringifyReason(first));
+      throw new Error(message);
+    }
+    throw first instanceof Error ? first : new Error(stringifyReason(first));
+  }
+  return {
+    trackIds: succeeded.map((el) => el.trackId),
+    bpm: parsed.bpm,
+    timeSignature: parsed.timeSignature,
+    duration: parsed.duration,
+    name: parsed.name
+  };
+}
+function stringifyReason(reason) {
+  if (reason === null) return "null";
+  if (reason === void 0) return "undefined";
+  if (typeof reason === "object") {
+    try {
+      return JSON.stringify(reason);
+    } catch {
+      return Object.prototype.toString.call(reason);
+    }
+  }
+  return String(reason);
+}
+
 // src/interactions/recording-clip.ts
-var import_core7 = require("@waveform-playlist/core");
+var import_core8 = require("@waveform-playlist/core");
 function addRecordedClip(host, trackId, buf, startSample, durSamples, offsetSamples = 0) {
   let trimmedBuf = buf;
   if (offsetSamples > 0 && offsetSamples < buf.length) {
@@ -3511,7 +3634,7 @@ function addRecordedClip(host, trackId, buf, startSample, durSamples, offsetSamp
     }
     trimmedBuf = trimmed;
   }
-  const clip = (0, import_core7.createClip)({
+  const clip = (0, import_core8.createClip)({
     audioBuffer: trimmedBuf,
     startSample,
     durationSamples: durSamples,
@@ -3834,7 +3957,10 @@ var DawEditorElement = class extends import_lit14.LitElement {
      * `_selectedTrackId`, etc.) — most of which don't affect the spectrogram
      * viewport. Skip the cross-controller call when nothing changed.
      *
-     * The orchestrator dedupes too, but this avoids the call entirely.
+     * The orchestrator dedupes identical viewports too, so removing this cache
+     * wouldn't change observable behavior — but it would push a fresh
+     * `setViewport` call (with object allocation) into every Lit reactive
+     * update for properties unrelated to the viewport.
      */
     this._lastSpectrogramViewport = null;
     // --- Track Events ---
@@ -4077,9 +4203,10 @@ var DawEditorElement = class extends import_lit14.LitElement {
     this._spectrogramController?.unregisterCanvas(canvasId);
   }
   /**
-   * Push a clip's decoded audio into the spectrogram controller. No-op
-   * unless the track is in spectrogram render-mode and the controller
-   * already exists (it bootstraps from canvas registration).
+   * Forward a clip's AudioBuffer to the spectrogram controller if the parent
+   * track is in spectrogram render-mode. Eagerly creates the controller via
+   * `_ensureSpectrogramController` so the audio data is queued for the first
+   * render — even if no canvases have been registered yet.
    */
   _maybeRegisterSpectrogramClipAudio(trackId, clip) {
     const descriptor = this._tracks.get(trackId);
@@ -4530,7 +4657,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
     let clip;
     if (waveformData) {
       const wdRate = waveformData.sample_rate;
-      clip = (0, import_core8.createClip)({
+      clip = (0, import_core9.createClip)({
         audioBuffer,
         waveformData,
         startSample: Math.round(clipDesc.start * wdRate),
@@ -4543,7 +4670,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
       });
       this._peakPipeline.cacheWaveformData(audioBuffer, waveformData);
     } else {
-      clip = (0, import_core8.createClipFromSeconds)({
+      clip = (0, import_core9.createClipFromSeconds)({
         audioBuffer,
         startTime: clipDesc.start,
         duration: clipDesc.duration || audioBuffer.duration,
@@ -4623,7 +4750,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
     const noteSpanSeconds = notes.length ? notes.reduce((max, n) => Math.max(max, n.time + n.duration), 0) : 0;
     const sourceDurationSamples = Math.ceil(Math.max(noteSpanSeconds, clipDesc.duration, 1) * sr);
     const requestedDurationSamples = clipDesc.duration > 0 ? Math.round(clipDesc.duration * sr) : sourceDurationSamples;
-    const clip = (0, import_core8.createClip)({
+    const clip = (0, import_core9.createClip)({
       startSample: Math.round(clipDesc.start * sr),
       durationSamples: requestedDurationSamples,
       offsetSamples: Math.round(clipDesc.offset * sr),
@@ -4832,7 +4959,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
           const waveformData = await waveformDataPromise;
           if (waveformData) {
             const wdRate = waveformData.sample_rate;
-            const clip2 = (0, import_core8.createClip)({
+            const clip2 = (0, import_core9.createClip)({
               waveformData,
               startSample: Math.round(clipDesc.start * wdRate),
               durationSamples: Math.round((clipDesc.duration || waveformData.duration) * wdRate),
@@ -4857,7 +4984,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
             });
             this._peaksData = new Map(this._peaksData).set(clip2.id, peakData);
             this._minSamplesPerPixel = Math.max(this._minSamplesPerPixel, waveformData.scale);
-            const previewTrack = (0, import_core8.createTrack)({
+            const previewTrack = (0, import_core9.createTrack)({
               name: descriptor.name,
               clips: [clip2],
               volume: descriptor.volume,
@@ -4913,7 +5040,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
           }
         }
       }
-      const track = (0, import_core8.createTrack)({
+      const track = (0, import_core9.createTrack)({
         name: descriptor.name,
         clips,
         volume: descriptor.volume,
@@ -5067,6 +5194,22 @@ var DawEditorElement = class extends import_lit14.LitElement {
   async loadFiles(files) {
     return loadFiles(this, files);
   }
+  /**
+   * Imperatively load a `.mid` file (URL or File) and create N `<daw-track>`
+   * elements — one per note-bearing MIDI track. On any per-track failure,
+   * every `<daw-track>` appended during the call is removed (both successful
+   * and failed) so the editor returns to its pre-call state.
+   *
+   * `options.signal` is forwarded to `fetch()` only for URL sources; aborting
+   * after parsing does not cancel in-flight `addTrack` calls.
+   *
+   * Requires the optional `@dawcore/midi` peer dep — throws with an install
+   * hint (and `console.warn`s the original error) when the dynamic import
+   * fails for any reason.
+   */
+  async loadMidi(source, options) {
+    return loadMidiImpl(this, source, options);
+  }
   // --- Programmatic Track API ---
   /**
    * Build the engine if it hasn't been built yet. Lets consumers obtain a
@@ -5180,6 +5323,13 @@ var DawEditorElement = class extends import_lit14.LitElement {
     }
     const oldDesc = this._tracks.get(trackId);
     if (!oldDesc) return;
+    let normalizedRenderMode = partial.renderMode;
+    if (normalizedRenderMode === "both") {
+      console.warn(
+        `[dawcore] render-mode="both" is not yet supported; falling back to 'spectrogram'`
+      );
+      normalizedRenderMode = "spectrogram";
+    }
     const newDesc = {
       ...oldDesc,
       ...partial.name !== void 0 && { name: partial.name },
@@ -5187,7 +5337,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
       ...partial.pan !== void 0 && { pan: partial.pan },
       ...partial.muted !== void 0 && { muted: partial.muted },
       ...partial.soloed !== void 0 && { soloed: partial.soloed },
-      ...partial.renderMode !== void 0 && { renderMode: partial.renderMode }
+      ...normalizedRenderMode !== void 0 && { renderMode: normalizedRenderMode }
     };
     this._tracks = new Map(this._tracks).set(trackId, newDesc);
     if (this._engine) {
@@ -5675,7 +5825,7 @@ var DawEditorElement = class extends import_lit14.LitElement {
           width = Math.round(endTick / this.ticksPerPixel) - clipLeft;
         } else {
           clipLeft = Math.floor(clip.startSample / spp);
-          width = (0, import_core8.clipPixelWidth)(clip.startSample, clip.durationSamples, spp);
+          width = (0, import_core9.clipPixelWidth)(clip.startSample, clip.durationSamples, spp);
         }
         let clipSegments;
         let segmentChannels;
@@ -6297,7 +6447,7 @@ DawRecordButtonElement = __decorateClass([
 // src/elements/daw-keyboard-shortcuts.ts
 var import_lit18 = require("lit");
 var import_decorators16 = require("lit/decorators.js");
-var import_core9 = require("@waveform-playlist/core");
+var import_core10 = require("@waveform-playlist/core");
 var DawKeyboardShortcutsElement = class extends import_lit18.LitElement {
   constructor() {
     super(...arguments);
@@ -6317,7 +6467,7 @@ var DawKeyboardShortcutsElement = class extends import_lit18.LitElement {
       const shortcuts = this.shortcuts;
       if (shortcuts.length === 0) return;
       try {
-        (0, import_core9.handleKeyboardEvent)(e, shortcuts, true);
+        (0, import_core10.handleKeyboardEvent)(e, shortcuts, true);
       } catch (err) {
         console.warn("[dawcore] Keyboard shortcut failed (key=" + e.key + "): " + String(err));
         const target = this._editor ?? this;
@@ -6484,6 +6634,7 @@ var DawSpectrogramElement = class extends import_lit19.LitElement {
     this.originX = 0;
     this._canvases = [];
     this._registeredCanvasIds = [];
+    this._warnedNoHost = false;
   }
   get samplesPerPixel() {
     return this._samplesPerPixel;
@@ -6550,7 +6701,15 @@ var DawSpectrogramElement = class extends import_lit19.LitElement {
   }
   _registerCanvases() {
     const editor = this._findHostEditor();
-    if (!editor || typeof editor._spectrogramRegisterCanvas !== "function") return;
+    if (!editor || typeof editor._spectrogramRegisterCanvas !== "function") {
+      if (!this._warnedNoHost) {
+        this._warnedNoHost = true;
+        console.warn(
+          "[dawcore] <daw-spectrogram> (clip " + this.clipId + ") could not find host <daw-editor>. Canvases will not render. Ensure the element is mounted inside a <daw-editor>."
+        );
+      }
+      return;
+    }
     for (let i = 0; i < this._canvases.length; i++) {
       const canvas = this._canvases[i];
       const canvasId = this.clipId + "-ch" + this.channelIndex + "-chunk" + i;