egaki 0.7.1 → 0.8.0

package/CHANGELOG.md

@@ -2,6 +2,38 @@
 
 All notable changes to this project will be documented in this file.
 
+## 0.8.0
+
+1. **`egaki bpm` command** — detect BPM of audio files locally using peak detection and interval analysis. No API call needed, runs entirely on device via `node-web-audio-api`:
+
+   ```bash
+   egaki bpm song.mp3
+   egaki bpm track.wav --json
+   ffmpeg -i video.mp4 -f mp3 - | egaki bpm --stdin
+   ```
+
+   Returns BPM and beat interval in seconds. Useful for syncing music to video sections with `bpm:` frontmatter.
+
+2. **`egaki loudness` command** — measure perceived loudness (LUFS) of audio files locally. Uses K-weighted filtering and two-pass gating inspired by EBU R128:
+
+   ```bash
+   egaki loudness song.mp3
+   egaki loudness track.wav --json
+   ffmpeg -i video.mp4 -f mp3 - | egaki loudness --stdin
+   ```
+
+   Returns integrated, max, min loudness and loudness range. Helpful for normalizing audio levels across video scenes.
+
+3. **Collapsible tweakpane sidebar** — the right-side tweakpane panel is now collapsed by default so the video preview takes the full width. A panel icon button in the top-right corner toggles it open.
+
+4. **Fixed CodeBlock empty frames during export** — shiki highlight was racing with React's batched state updates, causing empty code blocks in screenshots, filmstrips, and video exports. Now uses `delayRender`/`continueRender` correctly via `useLayoutEffect`.
+
+5. **Removed HMR auto-seek on MDX edits** — editing the entry MDX no longer auto-seeks to the changed scene and auto-plays. The behavior was fragile and surprising. MDX edits still hot-reload via RSC update.
+
+## 0.7.2
+
+1. **Fixed missing `spiceflow` and `@vitejs/plugin-react` dependencies** — both were listed as optional peer dependencies but imported unconditionally by the Vite plugin. Now included as regular dependencies so `egaki/vite` works out of the box without manually installing them.
+
 ## 0.7.1
 
 1. **Fixed `egaki/vite` import failing from npm** — the Vite plugin export was pointing to raw `.ts` source files, which Node cannot load from `node_modules`. Now correctly points to compiled JS. The `./cached-generate` export had the same issue.

package/dist/cli/bpm-detect.d.ts

@@ -0,0 +1,7 @@
+interface BpmResult {
+    bpm: number;
+    intervalInSeconds: number;
+}
+export declare function detectBpm(buffer: ArrayBuffer): Promise<Error | BpmResult>;
+export {};
+//# sourceMappingURL=bpm-detect.d.ts.map

package/dist/cli/bpm-detect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpm-detect.d.ts","sourceRoot":"","sources":["../../src/cli/bpm-detect.ts"],"names":[],"mappings":"AAKA,UAAU,SAAS;IACjB,GAAG,EAAE,MAAM,CAAA;IACX,iBAAiB,EAAE,MAAM,CAAA;CAC1B;AAMD,wBAAsB,SAAS,CAAC,MAAM,EAAE,WAAW,GAAG,OAAO,CAAC,KAAK,GAAG,SAAS,CAAC,CAsB/E"}

package/dist/cli/bpm-detect.js

@@ -0,0 +1,123 @@
+// BPM detection for audio files using Web Audio API.
+// Ported from https://github.com/tornqvist/bpm-detective
+// Uses node-web-audio-api (native NAPI Rust binding) as an optional dependency.
+// If missing, returns an Error with install instructions.
+// Cached module reference set by detectBpm() before calling detect().
+// This avoids require() in ESM and avoids passing the module through every function.
+let webAudioMod = null;
+export async function detectBpm(buffer) {
+    try {
+        webAudioMod = await import('node-web-audio-api');
+    }
+    catch {
+        return new Error('node-web-audio-api is required for BPM detection. Install it:\n\n' +
+            '  pnpm add node-web-audio-api\n');
+    }
+    const context = new webAudioMod.AudioContext();
+    try {
+        const data = await context.decodeAudioData(buffer);
+        const bpm = detect(data);
+        const intervalInSeconds = 60 / bpm;
+        return { bpm, intervalInSeconds };
+    }
+    catch (err) {
+        if (err instanceof Error)
+            return err;
+        return new Error(String(err));
+    }
+    finally {
+        await context.close().catch(() => { });
+    }
+}
+function detect(buffer) {
+    const source = getLowPassSource(buffer);
+    source.start(0);
+    const channelData = source.buffer.getChannelData(0);
+    const peaks = findPeaks(channelData);
+    const intervals = identifyIntervals(peaks);
+    const tempoCounts = groupByTempo(buffer.sampleRate, intervals);
+    return getTopCandidate(tempoCounts);
+}
+function getTopCandidate(candidates) {
+    return candidates.sort((a, b) => b.count - a.count).splice(0, 5)[0].tempo;
+}
+function getLowPassSource(buffer) {
+    const { length, numberOfChannels, sampleRate } = buffer;
+    const context = new webAudioMod.OfflineAudioContext(numberOfChannels, length, sampleRate);
+    const source = context.createBufferSource();
+    source.buffer = buffer;
+    const filter = context.createBiquadFilter();
+    filter.type = 'lowpass';
+    source.connect(filter);
+    filter.connect(context.destination);
+    return source;
+}
+function findPeaks(data) {
+    let peaks = [];
+    let threshold = 0.9;
+    const minThreshold = 0.3;
+    const minPeaks = 15;
+    while (peaks.length < minPeaks && threshold >= minThreshold) {
+        peaks = findPeaksAtThreshold(data, threshold);
+        threshold -= 0.05;
+    }
+    if (peaks.length < minPeaks) {
+        throw new Error('Could not find enough samples for a reliable BPM detection.');
+    }
+    return peaks;
+}
+function findPeaksAtThreshold(data, threshold) {
+    const peaks = [];
+    for (let i = 0, l = data.length; i < l; i += 1) {
+        if (data[i] > threshold) {
+            peaks.push(i);
+            // Skip forward ~1/4s to get past this peak
+            i += 10000;
+        }
+    }
+    return peaks;
+}
+function identifyIntervals(peaks) {
+    const intervals = [];
+    peaks.forEach((peak, index) => {
+        for (let i = 0; i < 10; i += 1) {
+            const interval = peaks[index + i] - peak;
+            const foundInterval = intervals.some((ic) => {
+                if (ic.interval === interval) {
+                    ic.count += 1;
+                    return true;
+                }
+                return false;
+            });
+            if (!foundInterval) {
+                intervals.push({ interval, count: 1 });
+            }
+        }
+    });
+    return intervals;
+}
+function groupByTempo(sampleRate, intervalCounts) {
+    const tempoCounts = [];
+    intervalCounts.forEach((intervalCount) => {
+        if (intervalCount.interval !== 0) {
+            let theoreticalTempo = 60 / (intervalCount.interval / sampleRate);
+            // Adjust to fit within the 90-180 BPM range
+            while (theoreticalTempo < 90)
+                theoreticalTempo *= 2;
+            while (theoreticalTempo > 180)
+                theoreticalTempo /= 2;
+            theoreticalTempo = Math.round(theoreticalTempo);
+            const foundTempo = tempoCounts.some((tc) => {
+                if (tc.tempo === theoreticalTempo) {
+                    tc.count += intervalCount.count;
+                    return true;
+                }
+                return false;
+            });
+            if (!foundTempo) {
+                tempoCounts.push({ tempo: theoreticalTempo, count: intervalCount.count });
+            }
+        }
+    });
+    return tempoCounts;
+}

package/dist/cli/cli.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cli.d.ts","sourceRoot":"","sources":["../../src/cli/cli.ts"],"names":[],"mappings":";AA0FA,QAAA,MAAM,GAAG,yBAAgB,CAAA;AA4pCzB,OAAO,EAAE,GAAG,EAAE,CAAA"}
+{"version":3,"file":"cli.d.ts","sourceRoot":"","sources":["../../src/cli/cli.ts"],"names":[],"mappings":";AAgGA,QAAA,MAAM,GAAG,yBAAgB,CAAA;AA2yCzB,OAAO,EAAE,GAAG,EAAE,CAAA"}

package/dist/cli/cli.js

@@ -30,6 +30,8 @@ import { DEFAULT_SPEECH_MODEL, } from './speech-models.js';
 import { DEFAULT_TRANSCRIPTION_MODEL, } from './transcription-models.js';
 import { separateAudioUncached as separateAudio, downloadStem, } from './separation-generate.js';
 import { cloneVoiceUncached as cloneVoice, } from './clone-generate.js';
+import { detectBpm, } from './bpm-detect.js';
+import { detectLoudness, } from './loudness-detect.js';
 const cli = goke('egaki');
 process.title = 'egaki';
 process.on('uncaughtException', (err) => {
@@ -654,6 +656,119 @@ cli
         }, null, 2));
     }
 });
+// ─── bpm command ─────────────────────────────────────────────────────────────
+cli
+    .command('bpm [audio]', dedent `
+      Detect the BPM (beats per minute) of an audio file.
+      Runs locally using peak detection, no API call needed.
+      Requires node-web-audio-api as an optional dependency.
+    `)
+    .option('--stdin', 'Read audio from stdin instead of a file path')
+    .option('--json', 'Output result as JSON to stdout')
+    .example('# Detect BPM of a song')
+    .example('egaki bpm song.mp3')
+    .example('# Pipe audio from another command')
+    .example('ffmpeg -i video.mp4 -f mp3 - | egaki bpm --stdin')
+    .example('# Get JSON output')
+    .example('egaki bpm track.wav --json')
+    .action(async (audioPath = '', options) => {
+    if (!options.stdin && !audioPath) {
+        console.error(pc.red('No audio provided. Pass an audio file path or use --stdin.'));
+        process.exit(1);
+    }
+    let audioData;
+    if (options.stdin) {
+        const chunks = [];
+        for await (const chunk of process.stdin) {
+            chunks.push(chunk);
+        }
+        const buf = Buffer.concat(chunks);
+        audioData = buf.buffer.slice(buf.byteOffset, buf.byteOffset + buf.byteLength);
+    }
+    else {
+        const resolved = path.resolve(audioPath);
+        if (!fs.existsSync(resolved)) {
+            console.error(pc.red(`File not found: ${resolved}`));
+            process.exit(1);
+        }
+        const buf = fs.readFileSync(resolved);
+        audioData = buf.buffer.slice(buf.byteOffset, buf.byteOffset + buf.byteLength);
+    }
+    if (!options.json) {
+        console.error(pc.dim(`Audio: ${options.stdin ? 'stdin' : audioPath} (${(audioData.byteLength / 1024).toFixed(1)} KB)`));
+        console.error(pc.cyan('Detecting BPM...'));
+    }
+    const result = await detectBpm(audioData);
+    if (result instanceof Error) {
+        console.error(pc.red(result.message));
+        process.exit(1);
+    }
+    if (options.json) {
+        console.log(JSON.stringify(result, null, 2));
+    }
+    else {
+        console.error(pc.green(`BPM: ${result.bpm}`));
+        console.error(pc.dim(`Interval: ${result.intervalInSeconds.toFixed(3)}s`));
+    }
+});
+// ─── loudness command ────────────────────────────────────────────────────────
+cli
+    .command('loudness [audio]', dedent `
+      Measure the perceived loudness (LUFS) of an audio file.
+      Uses K-weighting and two-pass gating inspired by EBU R128.
+      Runs locally, no API call needed.
+      Requires node-web-audio-api as an optional dependency.
+    `)
+    .option('--stdin', 'Read audio from stdin instead of a file path')
+    .option('--json', 'Output result as JSON to stdout')
+    .example('# Measure loudness of a song')
+    .example('egaki loudness song.mp3')
+    .example('# Pipe audio from another command')
+    .example('ffmpeg -i video.mp4 -f mp3 - | egaki loudness --stdin')
+    .example('# Get JSON output')
+    .example('egaki loudness track.wav --json')
+    .action(async (audioPath = '', options) => {
+    if (!options.stdin && !audioPath) {
+        console.error(pc.red('No audio provided. Pass an audio file path or use --stdin.'));
+        process.exit(1);
+    }
+    let audioData;
+    if (options.stdin) {
+        const chunks = [];
+        for await (const chunk of process.stdin) {
+            chunks.push(chunk);
+        }
+        const buf = Buffer.concat(chunks);
+        audioData = buf.buffer.slice(buf.byteOffset, buf.byteOffset + buf.byteLength);
+    }
+    else {
+        const resolved = path.resolve(audioPath);
+        if (!fs.existsSync(resolved)) {
+            console.error(pc.red(`File not found: ${resolved}`));
+            process.exit(1);
+        }
+        const buf = fs.readFileSync(resolved);
+        audioData = buf.buffer.slice(buf.byteOffset, buf.byteOffset + buf.byteLength);
+    }
+    if (!options.json) {
+        console.error(pc.dim(`Audio: ${options.stdin ? 'stdin' : audioPath} (${(audioData.byteLength / 1024).toFixed(1)} KB)`));
+        console.error(pc.cyan('Measuring loudness...'));
+    }
+    const result = await detectLoudness(audioData);
+    if (result instanceof Error) {
+        console.error(pc.red(result.message));
+        process.exit(1);
+    }
+    if (options.json) {
+        console.log(JSON.stringify(result, null, 2));
+    }
+    else {
+        console.error(pc.green(`Integrated: ${result.integrated.toFixed(1)} LUFS`));
+        console.error(pc.dim(`Max: ${result.max.toFixed(1)} LUFS`));
+        console.error(pc.dim(`Min: ${result.min.toFixed(1)} LUFS`));
+        console.error(pc.dim(`Range: ${result.range.toFixed(1)} LU`));
+    }
+});
 // ─── voice clone command ─────────────────────────────────────────────────────
 cli
     .command('voice clone [audio]', dedent `

package/dist/cli/loudness-detect.d.ts

@@ -0,0 +1,13 @@
+interface LoudnessResult {
+    /** Integrated loudness in LUFS (two-pass gated average). */
+    integrated: number;
+    /** Maximum momentary loudness (single 400ms block). */
+    max: number;
+    /** Minimum momentary loudness above the absolute gate. */
+    min: number;
+    /** Loudness range (max - min) in LU. */
+    range: number;
+}
+export declare function detectLoudness(buffer: ArrayBuffer): Promise<Error | LoudnessResult>;
+export {};
+//# sourceMappingURL=loudness-detect.d.ts.map

package/dist/cli/loudness-detect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loudness-detect.d.ts","sourceRoot":"","sources":["../../src/cli/loudness-detect.ts"],"names":[],"mappings":"AAcA,UAAU,cAAc;IACtB,4DAA4D;IAC5D,UAAU,EAAE,MAAM,CAAA;IAClB,uDAAuD;IACvD,GAAG,EAAE,MAAM,CAAA;IACX,0DAA0D;IAC1D,GAAG,EAAE,MAAM,CAAA;IACX,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAA;CACd;AAMD,wBAAsB,cAAc,CAAC,MAAM,EAAE,WAAW,GAAG,OAAO,CAAC,KAAK,GAAG,cAAc,CAAC,CAmGzF"}

package/dist/cli/loudness-detect.js

@@ -0,0 +1,96 @@
+// LUFS (Loudness Units Full Scale) measurement for audio files.
+// Ported from meltica. Uses node-web-audio-api (native NAPI Rust binding)
+// as an optional dependency. If missing, returns an Error with install instructions.
+//
+// Implements a simplified LUFS measurement inspired by EBU R128 / ITU-R BS.1770:
+// K-weighting via biquad filters (approximate, not exact BS.1770 coefficients),
+// 400ms blocks with 100ms hop, two-pass gating (absolute -70 LUFS gate, then
+// relative -10 LU gate). Energy averaging is done in the linear domain (mean
+// square) before converting to LUFS, which is the correct approach.
+//
+// The K-weighting filters are simplified (highpass 60Hz + highshelf 1500Hz)
+// rather than the exact BS.1770 pre-filter + RLB coefficients, so results
+// may differ slightly from reference implementations.
+function lufsFromMeanSquare(ms) {
+    return -0.691 + 10 * Math.log10(ms);
+}
+export async function detectLoudness(buffer) {
+    let webAudioMod;
+    try {
+        webAudioMod = await import('node-web-audio-api');
+    }
+    catch {
+        return new Error('node-web-audio-api is required for loudness measurement. Install it:\n\n' +
+            '  pnpm add node-web-audio-api\n');
+    }
+    const context = new webAudioMod.AudioContext();
+    try {
+        const audioBuffer = await context.decodeAudioData(buffer);
+        const offlineContext = new webAudioMod.OfflineAudioContext(audioBuffer.numberOfChannels, audioBuffer.length, audioBuffer.sampleRate);
+        const source = offlineContext.createBufferSource();
+        source.buffer = audioBuffer;
+        // Simplified K-weighting: high-pass at 60Hz + high-shelf boost at 1500Hz
+        const highPass = offlineContext.createBiquadFilter();
+        highPass.type = 'highpass';
+        highPass.frequency.value = 60;
+        highPass.Q.value = 0.7;
+        const highShelf = offlineContext.createBiquadFilter();
+        highShelf.type = 'highshelf';
+        highShelf.frequency.value = 1500;
+        highShelf.gain.value = 4;
+        source.connect(highPass);
+        highPass.connect(highShelf);
+        highShelf.connect(offlineContext.destination);
+        source.start(0);
+        const rendered = await offlineContext.startRendering();
+        // 400ms blocks, 100ms hop
+        const blockSize = Math.floor(0.4 * rendered.sampleRate);
+        const hopSize = Math.floor(0.1 * rendered.sampleRate);
+        if (rendered.length < blockSize) {
+            return new Error('Audio must be at least 400ms for loudness measurement.');
+        }
+        // Collect mean square energy per block
+        const blocks = [];
+        for (let i = 0; i <= rendered.length - blockSize; i += hopSize) {
+            let sumSquared = 0;
+            for (let ch = 0; ch < rendered.numberOfChannels; ch++) {
+                const data = rendered.getChannelData(ch);
+                for (let j = 0; j < blockSize; j++) {
+                    sumSquared += data[i + j] * data[i + j];
+                }
+            }
+            blocks.push(sumSquared / (blockSize * rendered.numberOfChannels));
+        }
+        // Two-pass gating per EBU R128:
+        // Pass 1: absolute gate at -70 LUFS
+        const absoluteGate = -70;
+        const absoluteGated = blocks.filter((ms) => lufsFromMeanSquare(ms) > absoluteGate);
+        if (absoluteGated.length === 0) {
+            return new Error('Audio is silent or below the -70 LUFS gate threshold.');
+        }
+        // Pass 2: relative gate at -10 LU below the absolute-gated integrated loudness
+        const preliminaryMs = absoluteGated.reduce((s, v) => s + v, 0) / absoluteGated.length;
+        const relativeGate = lufsFromMeanSquare(preliminaryMs) - 10;
+        const relativeGated = absoluteGated.filter((ms) => lufsFromMeanSquare(ms) > relativeGate);
+        if (relativeGated.length === 0) {
+            return new Error('Audio is too quiet for reliable loudness measurement.');
+        }
+        // Integrated loudness: average energy in linear domain, then convert to LUFS
+        const integratedMs = relativeGated.reduce((s, v) => s + v, 0) / relativeGated.length;
+        const integrated = lufsFromMeanSquare(integratedMs);
+        // Momentary loudness values for range calculation (from absolute-gated blocks)
+        const momentaryLufs = absoluteGated.map(lufsFromMeanSquare);
+        const max = Math.max(...momentaryLufs);
+        const min = Math.min(...momentaryLufs);
+        const range = max - min;
+        return { integrated, max, min, range };
+    }
+    catch (err) {
+        if (err instanceof Error)
+            return err;
+        return new Error(String(err));
+    }
+    finally {
+        await context.close().catch(() => { });
+    }
+}

package/dist/vite/code-block.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/vite/code-block.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/vite/code-block.tsx"],"names":[],"mappings":"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"}

package/dist/vite/code-block.js

@@ -31,8 +31,8 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  * - Supabase frame:         https://github.com/raycast/ray-so/blob/main/app/(navigation)/(code)/components/frames/SupabaseFrame.tsx
  * - Cloudflare frame:       https://github.com/raycast/ray-so/blob/main/app/(navigation)/(code)/components/frames/CloudflareFrame.tsx
  */
-import { createContext, useContext, useEffect, useMemo, useState } from 'react';
-import { interpolate, spring, useCurrentFrame, useVideoConfig } from 'remotion';
+import { createContext, useContext, useEffect, useLayoutEffect, useMemo, useState } from 'react';
+import { interpolate, spring, useCurrentFrame, useDelayRender, useVideoConfig } from 'remotion';
 import { useTweakpane } from "./tweakpane-hook.js";
 // ---------------------------------------------------------------------------
 // Nesting guard
@@ -328,11 +328,28 @@ function detectLanguage(title, language) {
 // ---------------------------------------------------------------------------
 function useHighlightedHtml(code, lang, highlightLines) {
     const [html, setHtml] = useState('');
-    useEffect(() => {
+    const { delayRender, continueRender } = useDelayRender();
+    // delayRender registered during the first render (useState initializer) and
+    // continued only AFTER the highlighted html has been committed to the DOM
+    // (layout effect below). Continuing from inside the shiki .then() is too
+    // early: React batches the setHtml update, so the renderer could capture the
+    // frame between continueRender and the commit, producing an empty block in
+    // screenshots/filmstrips/exports.
+    const [handle] = useState(() => delayRender('shiki highlight'));
+    useLayoutEffect(() => {
+        if (html)
+            continueRender(handle);
+    }, [html, handle, continueRender]);
+    // Unmount safety: never leave a dangling handle.
+    useLayoutEffect(() => {
+        return () => continueRender(handle);
+    }, [handle, continueRender]);
+    useLayoutEffect(() => {
         let cancelled = false;
         void getHighlighter().then((h) => {
-            if (cancelled)
+            if (cancelled) {
                 return;
+            }
             // Load language on demand if not already loaded
             const loaded = h.getLoadedLanguages();
             const langToUse = loaded.includes(lang) ? lang : 'tsx';
@@ -353,8 +370,12 @@ function useHighlightedHtml(code, lang, highlightLines) {
             });
             if (!cancelled)
                 setHtml(result);
+        }).catch(() => {
+            continueRender(handle);
         });
-        return () => { cancelled = true; };
+        return () => {
+            cancelled = true;
+        };
     }, [code, lang, highlightLines.join(',')]);
     return html;
 }

package/dist/vite/layout-editor.js

@@ -583,5 +583,5 @@ export function LayoutEditor({ playerContainerRef, playerRef, editing, onEditing
         setSelectedEl(null);
         onReset();
     }, [onReset]);
-    return (_jsxs("div", { "data-layout-editor-toolbar": true, className: 'flex items-center gap-1.5 text-[13px]', children: [_jsx(ToolbarButton, { onClick: () => onEditingChange(!editing), active: editing, title: editing ? 'Exit editing mode' : 'Edit layout — click to select, drag to move, corners to scale, double-click text to edit', children: editing ? '✦ Editing' : '✦ Edit Layout' }), editing && changesCount > 0 && (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { onClick: handleCopy, title: 'Copy changes for an AI agent', children: copied ? 'Copied!' : `Copy ${changesCount} change${changesCount > 1 ? 's' : ''}` }), _jsx(ToolbarButton, { onClick: handleReset, title: 'Revert all changes', children: "Reset" })] })), editing && !selectedEl && (_jsx("span", { className: 'text-zinc-600 italic', children: "Click an element" }))] }));
+    return (_jsxs("div", { "data-layout-editor-toolbar": true, className: 'flex items-center gap-1.5 text-[13px]', children: [_jsx(ToolbarButton, { onClick: () => onEditingChange(!editing), active: editing, title: editing ? 'Exit editing mode' : 'Edit layout — click to select, drag to move, corners to scale, double-click text to edit', children: editing ? 'Editing' : 'Edit' }), editing && changesCount > 0 && (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { onClick: handleCopy, title: 'Copy changes for an AI agent', children: copied ? 'Copied!' : `Copy ${changesCount} change${changesCount > 1 ? 's' : ''}` }), _jsx(ToolbarButton, { onClick: handleReset, title: 'Revert all changes', children: "Reset" })] })), editing && !selectedEl && (_jsx("span", { className: 'text-zinc-600 italic', children: "Click an element" }))] }));
 }

package/dist/vite/mdx-video.test.js

@@ -13,7 +13,6 @@ import { SafeMdxRenderer } from 'safe-mdx';
 import { mdxParse, extractImports, resolveModulePath } from 'safe-mdx/parse';
 import { MdastToJsx } from 'safe-mdx';
 import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, parseFrontmatter, aspectRatioFromDimensions, buildMdxScope } from "./mdx-parse.js";
-import { findChangedSectionIndex } from "./vite-plugin.js";
 import { computeEffectiveDuration } from "./media-duration-store.js";
 import { findServerNodes, blankServerContents, collectServerImportSources, wrapGenerateNodes, collectServerFileImportNames } from "./server-mdx.js";
 import { stableJsonKey, hashKey, promptPrefix } from "./server-components.js";
@@ -1734,84 +1733,6 @@ describe('computeEffectiveDuration with startInFrames', () => {
         expect(computeEffectiveDuration({ fps: 30, startInFrames: 30 })).toBeNull();
     });
 });
-describe('findChangedSectionIndex', () => {
-    const base = [
-        '---',
-        'fps: 30',
-        'bpm: 120',
-        '---',
-        '',
-        '# Intro duration=3s',
-        '',
-        'Hello world',
-        '',
-        '# Middle duration=2s',
-        '',
-        'Some content here',
-        '',
-        '# Outro duration=1s',
-        '',
-        'Goodbye',
-    ].join('\n');
-    test('identical content returns null', () => {
-        expect(findChangedSectionIndex(base, base)).toBe(null);
-    });
-    test('editing first section returns 0', () => {
-        const edited = base.replace('Hello world', 'Hello EDITED');
-        expect(findChangedSectionIndex(base, edited)).toBe(0);
-    });
-    test('editing second section returns 1', () => {
-        const edited = base.replace('Some content here', 'New content');
-        expect(findChangedSectionIndex(base, edited)).toBe(1);
-    });
-    test('editing last section returns 2', () => {
-        const edited = base.replace('Goodbye', 'See ya');
-        expect(findChangedSectionIndex(base, edited)).toBe(2);
-    });
-    test('adding a new section returns its index', () => {
-        const added = base + '\n\n# Bonus duration=1s\n\nExtra stuff';
-        expect(findChangedSectionIndex(base, added)).toBe(3);
-    });
-    test('deleting last section returns null (skip deletions)', () => {
-        const deleted = base.replace('\n# Outro duration=1s\n\nGoodbye', '');
-        expect(findChangedSectionIndex(base, deleted)).toBe(null);
-    });
-    test('deleting middle section returns null (skip deletions)', () => {
-        const deleted = base.replace('\n# Middle duration=2s\n\nSome content here\n', '\n');
-        expect(findChangedSectionIndex(base, deleted)).toBe(null);
-    });
-    test('editing heading text returns that section index', () => {
-        const edited = base.replace('# Middle duration=2s', '# Middle Renamed duration=2s');
-        expect(findChangedSectionIndex(base, edited)).toBe(1);
-    });
-    test('preamble-only change returns null', () => {
-        const withPreamble = '<Audio src="/bg.mp3" />\n\n' + base.split('\n').slice(4).join('\n');
-        const oldPreamble = '---\nfps: 30\nbpm: 120\n---\n\n' + withPreamble;
-        const newPreamble = oldPreamble.replace('/bg.mp3', '/new-bg.mp3');
-        expect(findChangedSectionIndex(oldPreamble, newPreamble)).toBe(null);
-    });
-    test('frontmatter-only change returns null', () => {
-        const edited = base.replace('fps: 30', 'fps: 60');
-        expect(findChangedSectionIndex(base, edited)).toBe(null);
-    });
-    test('editing heading duration returns that section index', () => {
-        const edited = base.replace('duration=3s', 'duration=4s');
-        expect(findChangedSectionIndex(base, edited)).toBe(0);
-    });
-    test('editing heading transition returns that section index', () => {
-        const old = '# Intro duration=3s transition=10\n\nHello';
-        const edited = '# Intro duration=3s transition=20\n\nHello';
-        expect(findChangedSectionIndex(old, edited)).toBe(0);
-    });
-    test('broken MDX returns null (does not throw)', () => {
-        const valid = '# Intro duration=3s\n\nHello world';
-        const broken = '# Intro duration=3s\n\n<Component';
-        expect(findChangedSectionIndex(valid, broken)).toBe(null);
-    });
-    test('both sources broken returns null', () => {
-        expect(findChangedSectionIndex('<Foo', '<Bar')).toBe(null);
-    });
-});
 // ---------------------------------------------------------------------------
 // Parse error recovery
 // ---------------------------------------------------------------------------

package/dist/vite/player-page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"player-page.d.ts","sourceRoot":"","sources":["../../src/vite/player-page.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,EAAyG,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AA2BpJ,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAmOtD,UAAU,YAAY;IACpB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,EAAE,SAAS,CAAA;CACf;AAyJD,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,SAAS,EACT,sBAA8B,EAC9B,WAAW,EACX,gBAAqB,EACrB,YAAiB,GAClB,EAAE;IACD,QAAQ,EAAE,YAAY,EAAE,CAAA;IACxB,aAAa,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qEAAqE;IACrE,SAAS,EAAE,MAAM,CAAA;IACjB;6DACyD;IACzD,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,WAAW,EAAE,gBAAgB,CAAA;IAC7B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,qBAipBA"}
+{"version":3,"file":"player-page.d.ts","sourceRoot":"","sources":["../../src/vite/player-page.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,EAAyG,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AA2BpJ,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAkNtD,UAAU,YAAY;IACpB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,EAAE,SAAS,CAAA;CACf;AAyJD,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,SAAS,EACT,sBAA8B,EAC9B,WAAW,EACX,gBAAqB,EACrB,YAAiB,GAClB,EAAE;IACD,QAAQ,EAAE,YAAY,EAAE,CAAA;IACxB,aAAa,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qEAAqE;IACrE,SAAS,EAAE,MAAM,CAAA;IACjB;6DACyD;IACzD,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,WAAW,EAAE,gBAAgB,CAAA;IAC7B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,qBAykBA"}