@bendyline/squisq-video-react 2.4.11 → 2.4.13

package/dist/index.js

@@ -1,28 +1,37 @@
 import {
   VideoExportButton,
   VideoExportModal
-} from "./chunk-JGSJQZGU.js";
+} from "./chunk-RO52S6GO.js";
 import {
   CoverImageExportModal,
   coverImageFilename,
   validateCoverImageDimensions
-} from "./chunk-BRE3IRIM.js";
+} from "./chunk-M5AK4MMV.js";
 import "./chunk-3NJDHK62.js";
 import {
   DEFAULT_VIDEO_COVER_PRE_ROLL_SECONDS,
   resolveVideoCoverFramePlan,
   resolveVideoExportCover,
   useVideoExport
-} from "./chunk-BGS2NEYC.js";
+} from "./chunk-TUIVBMAK.js";
 import {
   useFrameCapture
-} from "./chunk-4NI2QIFE.js";
+} from "./chunk-2C4BEAWT.js";
+import "./chunk-4GFZ3GUE.js";
 import {
   createEncoder,
   supportsWebCodecs,
   supportsWebCodecsAac,
   supportsWebCodecsH264
-} from "./chunk-32QCPFXE.js";
+} from "./chunk-GBIYYDMY.js";
+import {
+  createMediaEditRenderManager,
+  createMediaEditRenderer,
+  useMediaEditRenders,
+  useMediaEditStatus,
+  useProcessedAudio
+} from "./chunk-SLLH2RTX.js";
+import "./chunk-TL2IMDIZ.js";
 import "./chunk-5MFQMJ5Z.js";
 export {
   CoverImageExportModal,
@@ -31,12 +40,17 @@ export {
   VideoExportModal,
   coverImageFilename,
   createEncoder,
+  createMediaEditRenderManager,
+  createMediaEditRenderer,
   resolveVideoCoverFramePlan,
   resolveVideoExportCover,
   supportsWebCodecs,
   supportsWebCodecsAac,
   supportsWebCodecsH264,
   useFrameCapture,
+  useMediaEditRenders,
+  useMediaEditStatus,
+  useProcessedAudio,
   useVideoExport,
   validateCoverImageDimensions
 };

package/dist/media-edit/index.d.ts

@@ -0,0 +1,29 @@
+import { j as MediaEditRenderStatus, e as MediaEditRenderManager } from '../mediaEditRenderManager-W_o6RRhT.js';
+export { M as MediaEditJobOptions, a as MediaEditPausesRequest, b as MediaEditPausesResult, c as MediaEditPreviewRequest, d as MediaEditPreviewResult, f as MediaEditRenderManagerOptions, g as MediaEditRenderRequest, h as MediaEditRenderResult, i as MediaEditRenderState, k as MediaEditRenderer, l as MediaEditRendererOptions, m as createMediaEditRenderManager, n as createMediaEditRenderer } from '../mediaEditRenderManager-W_o6RRhT.js';
+import { MediaClip, Doc } from '@bendyline/squisq/schemas';
+import '@bendyline/squisq/mediaEdit';
+
+/**
+ * React bindings for a {@link MediaEditRenderManager}.
+ *
+ * - {@link useProcessedAudio} re-renders only when the set of available
+ *   renders changes, so a `DocPlayer` or schedule memoized on it switches an
+ *   edited clip over the moment its render lands — and never churns on
+ *   progress ticks.
+ * - {@link useMediaEditStatus} tracks every change, for progress displays.
+ * - {@link useMediaEditRenders} combines both and, given the document, keeps
+ *   the manager synced — the one-call binding for hosts.
+ */
+
+interface MediaEditRendersView {
+    processedAudio: (clip: MediaClip) => string | undefined;
+    status: (clip: MediaClip) => MediaEditRenderStatus | null;
+}
+/** The processed-audio lookup; a new identity only when renders appear or vanish. */
+declare function useProcessedAudio(manager: MediaEditRenderManager | null | undefined): (clip: MediaClip) => string | undefined;
+/** Render status per clip; updates with progress. */
+declare function useMediaEditStatus(manager: MediaEditRenderManager | null | undefined): (clip: MediaClip) => MediaEditRenderStatus | null;
+/** Both views; with `doc`, also keeps the manager synced to it. */
+declare function useMediaEditRenders(manager: MediaEditRenderManager | null | undefined, doc?: Doc | null): MediaEditRendersView;
+
+export { MediaEditRenderManager, MediaEditRenderStatus, type MediaEditRendersView, useMediaEditRenders, useMediaEditStatus, useProcessedAudio };

package/dist/media-edit/index.js

@@ -0,0 +1,15 @@
+import {
+  createMediaEditRenderManager,
+  createMediaEditRenderer,
+  useMediaEditRenders,
+  useMediaEditStatus,
+  useProcessedAudio
+} from "../chunk-SLLH2RTX.js";
+import "../chunk-TL2IMDIZ.js";
+export {
+  createMediaEditRenderManager,
+  createMediaEditRenderer,
+  useMediaEditRenders,
+  useMediaEditStatus,
+  useProcessedAudio
+};

package/dist/mediaEditEngine-ZLG7D3TB.js

@@ -0,0 +1,13 @@
+import {
+  analyzeMediaEditAudio,
+  analyzeMediaEditPauses,
+  previewMediaEditAudio,
+  renderMediaEditAudio
+} from "./chunk-IFQJAW4V.js";
+import "./chunk-4GFZ3GUE.js";
+export {
+  analyzeMediaEditAudio,
+  analyzeMediaEditPauses,
+  previewMediaEditAudio,
+  renderMediaEditAudio
+};

package/dist/mediaEditRenderManager-W_o6RRhT.d.ts

@@ -0,0 +1,167 @@
+import { Doc, MediaClip, MediaProvider } from '@bendyline/squisq/schemas';
+import { DenoiserFactory, PauseTightenOptions, MediaCut, MediaFxAnalysis } from '@bendyline/squisq/mediaEdit';
+
+/**
+ * Encode the chain's output into the render file: Opus in WebM when
+ * WebCodecs can encode Opus, 16-bit WAV otherwise. Opus keeps renders small
+ * (~7 MB per 10 minutes at 96 kb/s mono) so they fit every surface's media
+ * transport; WAV is the always-available fallback.
+ */
+interface EncodedAudio {
+    bytes: ArrayBuffer;
+    mimeType: 'audio/webm' | 'audio/wav';
+    extension: 'webm' | 'wav';
+}
+
+/**
+ * Media-edit render engine (browser): decode → signal chain → encode.
+ *
+ * Realm-agnostic — runs in the media-edit worker, or on the main thread as a
+ * fallback. Every input is a Blob plus a canonical `fx` string, so requests
+ * cross a worker boundary without copying media bytes.
+ */
+
+interface MediaEditJobOptions {
+    onProgress?: (fraction: number) => void;
+    signal?: AbortSignal;
+    /** The denoiser the chain uses for `denoise`; without one the op is skipped. */
+    denoiser?: DenoiserFactory;
+}
+interface MediaEditRenderRequest {
+    source: Blob;
+    /** Canonical `fx` value. */
+    fx: string;
+}
+interface MediaEditRenderResult extends EncodedAudio {
+    analysis: MediaFxAnalysis;
+    ignoredOps: string[];
+    /** Duration of the source's audio track, seconds. */
+    sourceDuration: number;
+    engine: string;
+}
+interface MediaEditPreviewRequest extends MediaEditRenderRequest {
+    /** Media-time window to preview. */
+    startSec: number;
+    endSec: number;
+    /** Reusable whole-take analysis (breaths, loudness gain); computed locally when absent. */
+    analysis?: MediaFxAnalysis;
+}
+interface MediaEditPausesRequest {
+    source: Blob;
+    options?: PauseTightenOptions;
+}
+interface MediaEditPausesResult {
+    /** Proposed cuts in source seconds. */
+    cuts: MediaCut[];
+    /** Length of the audio track, seconds. */
+    durationSec: number;
+}
+interface MediaEditPreviewResult {
+    sampleRate: number;
+    startSec: number;
+    original: Float32Array[];
+    processed: Float32Array[];
+}
+
+/**
+ * Main-thread client for the media-edit engine.
+ *
+ * Jobs run in `workers/mediaEdit.worker.js` so a render never blocks the
+ * editor. If the worker cannot start (a CSP without `worker-src`, a bundler
+ * that dropped the asset), jobs fall back to the main thread with the same
+ * results — slower to the UI, never broken.
+ */
+
+interface MediaEditRenderer {
+    render(request: MediaEditRenderRequest, options?: MediaEditJobOptions): Promise<MediaEditRenderResult>;
+    analyze(request: MediaEditRenderRequest, options?: MediaEditJobOptions): Promise<MediaFxAnalysis | null>;
+    preview(request: MediaEditPreviewRequest, options?: MediaEditJobOptions): Promise<MediaEditPreviewResult>;
+    /** Propose cuts that shorten long pauses. */
+    pauses(request: MediaEditPausesRequest, options?: MediaEditJobOptions): Promise<MediaEditPausesResult>;
+    dispose(): void;
+}
+interface MediaEditRendererOptions {
+    /**
+     * Create the worker. Defaults to the packaged `workers/mediaEdit.worker.js`
+     * resolved beside this module; hosts whose bundler needs an explicit worker
+     * import pass their own. Return null to run on the main thread.
+     */
+    createWorker?: () => Worker | null;
+}
+declare function createMediaEditRenderer(options?: MediaEditRendererOptions): MediaEditRenderer;
+
+/**
+ * Keeps a document's processed-audio renders in step with its recipes.
+ *
+ * One manager per media scope (a document's `MediaProvider`). `sync(doc)`
+ * indexes the `.mediaEdits/` folder, finds every clip whose `fx` recipe has no
+ * current render, and renders them one at a time in the background through a
+ * {@link MediaEditRenderer}. Playback and export read `processedAudio(clip)`,
+ * which answers only with renders that exist — an edited clip plays its
+ * original audio until its render lands, never silence.
+ *
+ * Renders are written through the provider next to the document's other
+ * media, so they travel with it. A render is stale when its source changed
+ * size (a re-recorded take under the same name) or when it skipped ops this
+ * engine now knows; stale renders are replaced.
+ */
+
+type MediaEditRenderState = 'queued' | 'rendering' | 'ready' | 'failed';
+interface MediaEditRenderStatus {
+    key: string;
+    state: MediaEditRenderState;
+    /** 0…1 while rendering. */
+    progress?: number;
+    error?: string;
+}
+interface MediaEditRenderManager {
+    /** The engine client, shared for previews and analysis. */
+    readonly renderer: MediaEditRenderer;
+    /**
+     * Reconcile with a document: index renders and queue missing or stale ones.
+     * `extraClips` adds media the document model does not schedule itself —
+     * an editor passes body-embedded `<audio>`/`<video>` tags here. Omitted,
+     * the extras from the previous call carry over.
+     */
+    sync(doc: Doc, extraClips?: readonly MediaClip[]): void;
+    /** The render an edited clip should play, when one exists. */
+    processedAudio(clip: MediaClip): string | undefined;
+    /** Render status for a clip, or null when its recipe renders nothing. */
+    status(clip: MediaClip): MediaEditRenderStatus | null;
+    /** Resolves once every render the document needs is ready or has failed. */
+    whenReady(doc: Doc, signal?: AbortSignal): Promise<void>;
+    /** Re-render a clip even if a render exists (e.g. after a failure). */
+    retry(clip: MediaClip): void;
+    /** Load a media reference as a Blob (sources for previews). */
+    loadSource(src: string): Promise<Blob>;
+    /**
+     * Delete renders of this document's sources that no current recipe
+     * references and that are older than the GC age. Renders of other sources
+     * are never touched — a media folder can be shared by several documents.
+     * Returns the removed paths.
+     */
+    collectGarbage(doc: Doc, now?: Date): Promise<string[]>;
+    /** Change notifications (index, status, progress). Returns an unsubscribe. */
+    subscribe(listener: () => void): () => void;
+    /** Bumps on every change (status, progress, renders), for `useSyncExternalStore`. */
+    getVersion(): number;
+    /**
+     * Bumps only when the set of available renders changes — what
+     * {@link MediaEditRenderManager.processedAudio} answers. Progress ticks leave it alone,
+     * so playback schedules keyed on it do not churn while a render runs.
+     */
+    getIndexVersion(): number;
+    dispose(): void;
+}
+interface MediaEditRenderManagerOptions {
+    mediaProvider: MediaProvider;
+    /** Shared engine client; the manager creates (and disposes) its own when omitted. */
+    renderer?: MediaEditRenderer;
+    /** For tests; defaults to the global `fetch`. */
+    fetch?: typeof fetch;
+    /** Clock for manifests and GC; defaults to `new Date()`. */
+    now?: () => Date;
+}
+declare function createMediaEditRenderManager(options: MediaEditRenderManagerOptions): MediaEditRenderManager;
+
+export { type MediaEditJobOptions as M, type MediaEditPausesRequest as a, type MediaEditPausesResult as b, type MediaEditPreviewRequest as c, type MediaEditPreviewResult as d, type MediaEditRenderManager as e, type MediaEditRenderManagerOptions as f, type MediaEditRenderRequest as g, type MediaEditRenderResult as h, type MediaEditRenderState as i, type MediaEditRenderStatus as j, type MediaEditRenderer as k, type MediaEditRendererOptions as l, createMediaEditRenderManager as m, createMediaEditRenderer as n };

package/dist/{useVideoExport-B2eVCvTX.d.ts → useVideoExport-DsNDpjmO.d.ts}

@@ -1,4 +1,4 @@
-import { MediaProvider, Theme, VideoPresentation, VideoPipSize, VideoPipShape, VideoPipPosition, Doc } from '@bendyline/squisq/schemas';
+import { MediaScheduleOptions, MediaProvider, Theme, VideoPresentation, VideoPipSize, VideoPipShape, VideoPipPosition, Doc } from '@bendyline/squisq/schemas';
 import { ResourcePolicy } from '@bendyline/squisq/markdown';
 import { CoverSlidePlayback } from '@bendyline/squisq/doc';
 import { VideoQuality, VideoOrientation, FfmpegWasmLoadConfig } from '@bendyline/squisq-video';
@@ -37,6 +37,12 @@ interface VideoExportConfig {
      * degradation; `omit` intentionally skips audio.
      */
     audioPolicy?: VideoAudioPolicy;
+    /**
+     * Processed-audio lookup for media-edit recipes (`fx`): the mix uses an
+     * edited clip's render instead of its original audio. Hosts await pending
+     * renders before exporting; a clip without a render exports its original.
+     */
+    processedAudio?: MediaScheduleOptions['processedAudio'];
     /** Render authored animations and slide transitions (default: true for MP4, false for GIF). */
     animationsEnabled?: boolean;
     /** Encoding quality preset (default: 'normal') */

package/dist/workers/mediaEdit.worker.d.ts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/workers/mediaEdit.worker.js

@@ -0,0 +1,63 @@
+import {
+  analyzeMediaEditAudio,
+  analyzeMediaEditPauses,
+  previewMediaEditAudio,
+  renderMediaEditAudio
+} from "../chunk-IFQJAW4V.js";
+import "../chunk-4GFZ3GUE.js";
+import {
+  createRnnoiseDenoiserFactory
+} from "../chunk-TL2IMDIZ.js";
+
+// src/workers/mediaEdit.worker.ts
+import { Rnnoise } from "@shiguredo/rnnoise-wasm";
+var scope = self;
+var jobs = /* @__PURE__ */ new Map();
+var denoiser = createRnnoiseDenoiserFactory(() => Rnnoise.load());
+function isAbort(err) {
+  return err instanceof DOMException && err.name === "AbortError";
+}
+async function run(request) {
+  const controller = new AbortController();
+  jobs.set(request.id, controller);
+  const options = {
+    denoiser,
+    signal: controller.signal,
+    onProgress: (fraction) => scope.postMessage({ type: "progress", id: request.id, fraction })
+  };
+  try {
+    if (request.type === "render") {
+      const result = await renderMediaEditAudio(request, options);
+      scope.postMessage({ type: "rendered", id: request.id, result }, [result.bytes]);
+    } else if (request.type === "pauses") {
+      const result = await analyzeMediaEditPauses(request, options);
+      scope.postMessage({ type: "paused", id: request.id, result });
+    } else if (request.type === "analyze") {
+      const result = await analyzeMediaEditAudio(request, options);
+      scope.postMessage({ type: "analyzed", id: request.id, result });
+    } else {
+      const result = await previewMediaEditAudio(request, options);
+      const buffers = [...result.original, ...result.processed].map(
+        (ch) => ch.buffer
+      );
+      scope.postMessage({ type: "previewed", id: request.id, result }, buffers);
+    }
+  } catch (err) {
+    scope.postMessage({
+      type: "error",
+      id: request.id,
+      message: err instanceof Error ? err.message : String(err),
+      aborted: isAbort(err)
+    });
+  } finally {
+    jobs.delete(request.id);
+  }
+}
+scope.onmessage = (event) => {
+  const request = event.data;
+  if (request.type === "cancel") {
+    jobs.get(request.id)?.abort();
+    return;
+  }
+  void run(request);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bendyline/squisq-video-react",
-  "version": "2.4.11",
+  "version": "2.4.13",
   "description": "React components for browser-based MP4 and animated-GIF export of Squisq documents",
   "license": "MIT",
   "author": "Bendyline",
@@ -53,6 +53,10 @@
     "./encoder": {
       "types": "./dist/encoder/index.d.ts",
       "import": "./dist/encoder/index.js"
+    },
+    "./media-edit": {
+      "types": "./dist/media-edit/index.d.ts",
+      "import": "./dist/media-edit/index.js"
     }
   },
   "files": [
@@ -73,20 +77,22 @@
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@bendyline/squisq": "2.11.7",
-    "@bendyline/squisq-video": "2.3.10",
-    "@bendyline/squisq-react": "2.11.7",
+    "@bendyline/squisq": "2.11.8",
+    "@bendyline/squisq-video": "2.3.11",
+    "@bendyline/squisq-react": "2.11.9",
     "@ffmpeg/core": "0.12.9",
     "@ffmpeg/ffmpeg": "0.12.15",
     "@ffmpeg/util": "0.12.2",
+    "@shiguredo/rnnoise-wasm": "2025.1.5",
     "html2canvas": "1.4.1"
   },
   "devDependencies": {
     "@types/react": "18.3.28",
     "@types/react-dom": "18.3.7",
+    "mediabunny": "1.57.0",
+    "mp4-muxer": "5.2.2",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "mp4-muxer": "5.2.2",
     "tsup": "8.5.1",
     "typescript": "5.9.3"
   },