@bendyline/squisq-video-react 2.1.0 → 2.2.0

package/dist/useVideoExport-NtqZVgaz.d.ts

@@ -0,0 +1,115 @@
+import { MediaProvider, Doc } from '@bendyline/squisq/schemas';
+import { ResourcePolicy } from '@bendyline/squisq/markdown';
+import { VideoQuality, VideoOrientation, FfmpegWasmLoadConfig } from '@bendyline/squisq-video';
+import { CaptionMode } from '@bendyline/squisq-react';
+
+/**
+ * useVideoExport — Main orchestration hook for browser video export.
+ *
+ * Coordinates frame capture (hidden iframe + html2canvas) with
+ * main-thread WebCodecs encoding via mp4-muxer. Manages the full
+ * lifecycle: prepare → capture + encode → download.
+ *
+ * Encoding runs on the main thread because frame capture via html2canvas
+ * (~100-200ms per frame) is the bottleneck, not encoding (~1ms per frame
+ * with hardware-accelerated WebCodecs). Worker offloading would add
+ * complexity with minimal benefit.
+ *
+ * Usage:
+ *   const { state, progress, phase, startExport, cancel, downloadUrl } = useVideoExport();
+ *   <button onClick={() => startExport(doc, options)}>Export</button>
+ */
+
+type VideoExportState = 'idle' | 'preparing' | 'capturing' | 'encoding' | 'complete' | 'error';
+/** Browser export container format. */
+type VideoOutputFormat = 'mp4' | 'gif';
+type VideoAudioPolicy = 'require' | 'best-effort' | 'omit';
+interface VideoExportConfig {
+    /** Output container (default: 'mp4') */
+    outputFormat?: VideoOutputFormat;
+    /**
+     * How authored MP4 audio is handled. `require` (default) fails before
+     * capture when audio cannot be loaded/decoded and fails the export if later
+     * encoding or muxing fails. `best-effort` explicitly permits video-only
+     * degradation; `omit` intentionally skips audio.
+     */
+    audioPolicy?: VideoAudioPolicy;
+    /** Render authored animations and slide transitions (default: true for MP4, false for GIF). */
+    animationsEnabled?: boolean;
+    /** Encoding quality preset (default: 'normal') */
+    quality?: VideoQuality;
+    /** Frames per second (default: 30) */
+    fps?: number;
+    /** Viewport orientation (default: 'landscape') */
+    orientation?: VideoOrientation;
+    /** Explicit output width. GIF defaults to 960 landscape / 540 portrait. */
+    width?: number;
+    /** Explicit output height. GIF defaults to 540 landscape / 960 portrait. */
+    height?: number;
+    /**
+     * Map of relative image paths to binary data.
+     * Used to embed images into the render HTML.
+     */
+    images?: Map<string, ArrayBuffer>;
+    /**
+     * Map of audio segment names to binary data.
+     * Used to embed audio into the render HTML.
+     */
+    audio?: Map<string, ArrayBuffer>;
+    /** MediaProvider to resolve media URLs (alternative to passing images directly) */
+    mediaProvider?: MediaProvider;
+    /** Policy and byte/time limits for MediaProvider URLs. */
+    resourcePolicy?: ResourcePolicy;
+    /** Caption mode for the exported video (default: 'off') */
+    captionMode?: CaptionMode;
+    /** Player IIFE bundle (unused in browser export, kept for CLI/Playwright path) */
+    playerScript?: string;
+    /** Optional self-hosted ffmpeg.wasm core URLs for fallback/offline/CSP use. */
+    ffmpegWasm?: FfmpegWasmLoadConfig;
+}
+interface VideoExportResult {
+    /** Current export state */
+    state: VideoExportState;
+    /** 0–100 progress percentage */
+    progress: number;
+    /** Human-readable description of the current phase */
+    phase: string;
+    /** Video duration detected from the doc (seconds) */
+    duration: number;
+    /** Effective output format for the current or most recent export. */
+    outputFormat: VideoOutputFormat;
+    /** Encoder backend ('webcodecs' when WebCodecs H.264 active, 'ffmpeg-wasm' when worker fallback active, null when idle) */
+    backend: 'webcodecs' | 'ffmpeg-wasm' | null;
+    /** Blob download URL (populated when state === 'complete') */
+    downloadUrl: string | null;
+    /** File size in bytes (populated when state === 'complete') */
+    fileSize: number;
+    /**
+     * Whether an audio track was muxed into the exported MP4 (populated when
+     * state === 'complete'). False when the doc had no audio or when audio was
+     * skipped/degraded — see {@link audioSkippedReason}.
+     */
+    audioIncluded: boolean;
+    /**
+     * Why audio is absent, when `audioIncluded` is false. `null` means the doc
+     * simply had no audio (not a failure); a non-null string explains a genuine
+     * capability shortfall or runtime failure. Audio problems never fail the
+     * export — the video always completes.
+     */
+    audioSkippedReason: string | null;
+    /** Error message (populated when state === 'error') */
+    error: string | null;
+    /** Seconds elapsed since export started */
+    elapsed: number;
+    /** Estimated seconds remaining (0 when idle or complete) */
+    estimatedRemaining: number;
+    /** Start a new export */
+    startExport: (doc: Doc, config: VideoExportConfig) => Promise<void>;
+    /** Cancel an in-progress export */
+    cancel: () => void;
+    /** Reset state back to idle (e.g., after complete or error) */
+    reset: () => void;
+}
+declare function useVideoExport(): VideoExportResult;
+
+export { type VideoAudioPolicy as V, type VideoExportConfig as a, type VideoExportResult as b, type VideoExportState as c, type VideoOutputFormat as d, useVideoExport as u };

package/dist/workers/encode.worker.js

@@ -1,6 +1,6 @@
 import {
   createMp4Muxer
-} from "../chunk-2PGWBGAT.js";
+} from "../chunk-VI5AIVOQ.js";
 
 // src/workers/encode.worker.ts
 import {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bendyline/squisq-video-react",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "React components for browser-based MP4 and animated-GIF export of Squisq documents",
   "license": "MIT",
   "author": "Bendyline",
@@ -23,6 +23,9 @@
     "access": "public"
   },
   "type": "module",
+  "engines": {
+    "node": ">=22.14.0"
+  },
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -30,6 +33,18 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
       "default": "./dist/index.js"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.js"
+    },
+    "./hooks": {
+      "types": "./dist/hooks/index.d.ts",
+      "import": "./dist/hooks/index.js"
+    },
+    "./encoder": {
+      "types": "./dist/encoder/index.d.ts",
+      "import": "./dist/encoder/index.js"
     }
   },
   "files": [
@@ -40,7 +55,7 @@
     "COPYING.GPL-2.0.txt"
   ],
   "scripts": {
-    "build": "tsup",
+    "build": "tsup && node ../../scripts/remove-empty-chunks.mjs dist",
     "dev": "concurrently -n js,dts -c blue,gray -r \"tsup --watch --no-dts --no-clean\" \"tsup --watch --dts-only --no-clean\"",
     "typecheck": "tsc --noEmit"
   },
@@ -49,20 +64,20 @@
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@bendyline/squisq": "2.2.0",
-    "@bendyline/squisq-video": "2.1.0",
-    "@bendyline/squisq-react": "2.2.0",
+    "@bendyline/squisq": "2.3.0",
+    "@bendyline/squisq-video": "2.2.0",
+    "@bendyline/squisq-react": "2.3.0",
     "@ffmpeg/core": "0.12.9",
     "@ffmpeg/ffmpeg": "0.12.15",
     "@ffmpeg/util": "0.12.2",
-    "html2canvas": "1.4.1",
-    "mp4-muxer": "5.2.2"
+    "html2canvas": "1.4.1"
   },
   "devDependencies": {
     "@types/react": "18.3.28",
     "@types/react-dom": "18.3.7",
     "react": "18.3.1",
     "react-dom": "18.3.1",
+    "mp4-muxer": "5.2.2",
     "tsup": "8.5.1",
     "typescript": "5.9.3"
   },

package/dist/chunk-2PGWBGAT.js

@@ -1,46 +0,0 @@
-// src/mp4Mux.ts
-import { Muxer, ArrayBufferTarget } from "mp4-muxer";
-function createMp4Muxer(options) {
-  const target = new ArrayBufferTarget();
-  const muxer = new Muxer({
-    target,
-    video: {
-      codec: "avc",
-      width: options.width,
-      height: options.height
-    },
-    // Only declare the audio track when requested so the video-only
-    // configuration stays byte-identical to the historical output.
-    ...options.audio ? {
-      audio: {
-        codec: "aac",
-        numberOfChannels: options.audio.numberOfChannels,
-        sampleRate: options.audio.sampleRate
-      }
-    } : {},
-    fastStart: "in-memory"
-  });
-  return {
-    hasAudioTrack: options.audio !== void 0,
-    addVideoChunk(chunk, meta) {
-      muxer.addVideoChunk(chunk, meta);
-    },
-    addVideoChunkRaw(data, type, timestampMicros, durationMicros, meta) {
-      muxer.addVideoChunkRaw(data, type, timestampMicros, durationMicros, meta);
-    },
-    addAudioChunk(chunk, meta) {
-      muxer.addAudioChunk(chunk, meta);
-    },
-    addAudioChunkRaw(data, type, timestampMicros, durationMicros, meta) {
-      muxer.addAudioChunkRaw(data, type, timestampMicros, durationMicros, meta);
-    },
-    finalize() {
-      muxer.finalize();
-      return target.buffer;
-    }
-  };
-}
-
-export {
-  createMp4Muxer
-};