egaki 0.8.0 → 0.10.0

package/dist/vite/angled-screen.js

@@ -1,7 +1,11 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * AngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
+ * BasicAngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
+ *
+ * The shader-based version (true depth-of-field via WebGL) lives in
+ * angled-screen-shader.tsx and is exported as AngledScreen. This CSS version
+ * is kept as a lightweight fallback that works without HTML-in-canvas support.
  *
  * Wraps any children (images, videos, divs) in a 3D-transformed plane using
  * CSS `perspective` + `transform: rotateX/Y/Z`. Simulates depth-of-field
@@ -41,9 +45,14 @@ function autoDirection(rotateX, rotateY) {
     }
     return rotateX > 0 ? 'bottom' : 'top';
 }
-export function AngledScreen(props) {
+/**
+ * @deprecated Use `AngledScreen` (angled-screen-shader.tsx) instead — the
+ * WebGL version with true depth-of-field. This CSS version only remains as
+ * the automatic fallback for browsers without HTML-in-canvas support.
+ */
+export function BasicAngledScreen(props) {
     const { children, transformOrigin = '50% 50%', bokehDirection, backgroundColor = '#000000', width = '80%', height = 'auto', style, } = props;
-    const tp = useTweakpane('AngledScreen', {
+    const tp = useTweakpane('BasicAngledScreen', {
         perspective: { value: props.perspective ?? 1200, min: 100, max: 3000, step: 10 },
         rotateX: { value: props.rotateX ?? 8, min: -90, max: 90, step: 0.5 },
         rotateY: { value: props.rotateY ?? -12, min: -90, max: 90, step: 0.5 },

package/dist/vite/mdx-video.d.ts

@@ -14,7 +14,8 @@ import type { SafeMdxError } from 'safe-mdx';
 import type { EagerModules } from 'safe-mdx/parse';
 import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, type MdxSection, type SplitResult, type VideoFrontmatter } from './mdx-parse.ts';
 import { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep } from './components.tsx';
-import { AngledScreen } from './angled-screen.tsx';
+import { BasicAngledScreen } from './angled-screen.tsx';
+import { AngledScreen } from './angled-screen-shader.tsx';
 import { CodeBlock, CODE_THEMES } from './code-block.tsx';
 import { BandsShader } from './bands-shader.tsx';
 import { WaveGradientShader } from './wave-gradient-shader.tsx';
@@ -286,7 +287,7 @@ export { LayoutContainerContext, LayoutTransition, LayoutTransitionProvider, Lay
 import { LayoutTransition } from './layout-transition.tsx';
 import { Img, Audio, Video } from './media-components.tsx';
 export { ExportContext, useIsExporting, Img, Audio, Video } from './media-components.tsx';
-export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
+export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, BasicAngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
 /** Built-in JSX names available in MDX without user imports. Shared by
  *  client rendering (mdx-client.tsx) and <Server> slot rendering (app.tsx).
  *  Add new presentation components here once — not in app.tsx / mdx-client. */
@@ -303,6 +304,7 @@ export declare const MDX_BUILTIN_COMPONENTS: {
     readonly Background: typeof Background;
     readonly LayoutTransition: typeof LayoutTransition;
     readonly AngledScreen: typeof AngledScreen;
+    readonly BasicAngledScreen: typeof BasicAngledScreen;
     readonly BandsShader: import("react").FC<import("./bands-shader.tsx").BandsShaderProps>;
     readonly WaveGradientShader: import("react").FC<import("./wave-gradient-shader.tsx").WaveGradientShaderProps>;
     readonly LiquidGradientShader: import("react").FC<import("./liquid-gradient-shader.tsx").LiquidGradientShaderProps>;

package/dist/vite/mdx-video.d.ts.map

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

package/dist/vite/mdx-video.js

@@ -14,7 +14,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useContext, useId, useInsertionEffect, useLayoutEffect } from 'react';
 import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, } from "./mdx-parse.js";
 import { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, } from "./components.js";
-import { AngledScreen } from "./angled-screen.js";
+import { BasicAngledScreen } from "./angled-screen.js";
+import { AngledScreen } from "./angled-screen-shader.js";
 import { CodeBlock, CODE_THEMES } from "./code-block.js";
 import { BandsShader } from "./bands-shader.js";
 import { WaveGradientShader } from "./wave-gradient-shader.js";
@@ -564,7 +565,7 @@ import { ExportContext, useIsExporting, Img, Audio, Video } from "./media-compon
 export { ExportContext, useIsExporting, Img, Audio, Video } from "./media-components.js";
 // Visual components and animations are re-exported so they're available
 // as named imports from this client module for MDX usage.
-export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
+export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, BasicAngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
 function GeneratedImage(_props) { return null; }
 function GeneratedVideo(_props) { return null; }
 function GeneratedSpeech(_props) { return null; }
@@ -573,6 +574,7 @@ export const MDX_BUILTIN_COMPONENTS = {
     Background,
     LayoutTransition,
     AngledScreen,
+    BasicAngledScreen,
     BandsShader,
     WaveGradientShader,
     LiquidGradientShader,

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

@@ -25,6 +25,7 @@ describe('MDX_BUILTIN_COMPONENTS', () => {
         "Audio",
         "Background",
         "BandsShader",
+        "BasicAngledScreen",
         "Blur",
         "BlurReveal",
         "CodeBlock",

package/dist/vite/render-client.d.ts

@@ -4,6 +4,33 @@
  * via @remotion/web-renderer's renderMediaOnWeb().
  */
 import React from 'react';
+/**
+ * Wrap a composition for web-renderer entry points (export, screenshot,
+ * filmstrip). The scaffold wrapper is visibility:hidden and Chromium creates
+ * no paint records for hidden subtrees, which breaks captureElementImage()
+ * inside nested <HtmlInCanvas> (AngledScreen): onInit/onPaint silently never
+ * run and exports come out flat. visibility is overridable by descendants,
+ * so a visibility:visible div at the composition root restores paint records
+ * for the whole tree while deeper visibility:hidden ancestors (e.g.
+ * LayoutTransition's inactive instances) keep hiding their subtrees
+ * relative to this root.
+ *
+ * Tradeoff (accepted): the scaffold sits at z-index:-9999, painting above
+ * the page's root background but below all in-flow content — so the
+ * rendering composition can peek through wherever the page shows only the
+ * body background. Hiding it differently is not possible:
+ *   - opacity:0 / filter:opacity(0) bake into captureElementImage pixels
+ *     (verified: capture succeeds but frames come out fully transparent)
+ *   - translate/clip-path/resize on the scaffold break the drawElementImage
+ *     paint pipeline (black frames — learned June 2026, commit e501ca5)
+ *   - visibility:hidden kills paint records entirely (the original bug)
+ * An opaque page background or full-viewport player UI fully occludes it.
+ *
+ * TODO: re-evaluate whether this wrapper is still needed once remotion
+ * fixes the HtmlInCanvas delayRender scoping / hidden-scaffold capture bug:
+ * https://github.com/remotion-dev/remotion/issues/9367
+ */
+export declare function wrapForWebRenderer(component: React.FC): React.FC;
 export declare function renderInBrowser(options: {
     component: React.FC;
     durationInFrames: number;

package/dist/vite/render-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render-client.d.ts","sourceRoot":"","sources":["../../src/vite/render-client.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAA;AA+BzB,wBAAsB,eAAe,CAAC,OAAO,EAAE;IAC7C,SAAS,EAAE,KAAK,CAAC,EAAE,CAAA;IACnB,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,MAAM,CAAC,EAAE,WAAW,CAAA;CACrB,gBAkCA"}
+{"version":3,"file":"render-client.d.ts","sourceRoot":"","sources":["../../src/vite/render-client.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,GAAG,KAAK,CAAC,EAAE,CAQhE;AAED,wBAAsB,eAAe,CAAC,OAAO,EAAE;IAC7C,SAAS,EAAE,KAAK,CAAC,EAAE,CAAA;IACnB,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,MAAM,CAAC,EAAE,WAAW,CAAA;CACrB,gBA4BA"}

package/dist/vite/render-client.js

@@ -7,61 +7,57 @@ import { renderMediaOnWeb } from '@remotion/web-renderer';
 import { ExportContext } from "./mdx-video.js";
 import React from 'react';
 /**
- * Cover the web-renderer scaffold during export. The scaffold wrapper has
- * position:fixed + visibility:hidden + z-index:-9999, but allowHtmlInCanvas
- * sets visibility:visible on the inner layoutsubtree canvas, which can
- * make it peek through on the page.
+ * Wrap a composition for web-renderer entry points (export, screenshot,
+ * filmstrip). The scaffold wrapper is visibility:hidden and Chromium creates
+ * no paint records for hidden subtrees, which breaks captureElementImage()
+ * inside nested <HtmlInCanvas> (AngledScreen): onInit/onPaint silently never
+ * run and exports come out flat. visibility is overridable by descendants,
+ * so a visibility:visible div at the composition root restores paint records
+ * for the whole tree while deeper visibility:hidden ancestors (e.g.
+ * LayoutTransition's inactive instances) keep hiding their subtrees
+ * relative to this root.
  *
- * Do NOT modify the scaffold wrapper's own styles (translate, clip-path,
- * width/height, opacity). All of those break Chrome's drawElementImage
- * paint pipeline and produce black frames in the exported video. The
- * layout subtree canvas must remain at full size, in its original position,
- * with normal visibility for the capture to work.
+ * Tradeoff (accepted): the scaffold sits at z-index:-9999, painting above
+ * the page's root background but below all in-flow content — so the
+ * rendering composition can peek through wherever the page shows only the
+ * body background. Hiding it differently is not possible:
+ *   - opacity:0 / filter:opacity(0) bake into captureElementImage pixels
+ *     (verified: capture succeeds but frames come out fully transparent)
+ *   - translate/clip-path/resize on the scaffold break the drawElementImage
+ *     paint pipeline (black frames — learned June 2026, commit e501ca5)
+ *   - visibility:hidden kills paint records entirely (the original bug)
+ * An opaque page background or full-viewport player UI fully occludes it.
  *
- * Instead we place an opaque overlay on top (z-index:-9998, one above the
- * scaffold's -9999) that visually hides the rendering without touching
- * the scaffold's layout or paint properties.
+ * TODO: re-evaluate whether this wrapper is still needed once remotion
+ * fixes the HtmlInCanvas delayRender scoping / hidden-scaffold capture bug:
+ * https://github.com/remotion-dev/remotion/issues/9367
  */
-function injectScaffoldCover() {
-    const cover = document.createElement('div');
-    cover.style.cssText = [
-        'position:fixed',
-        'inset:0',
-        'z-index:-9998',
-        'background:#050505',
-        'pointer-events:none',
-    ].join(';');
-    document.body.appendChild(cover);
-    return () => cover.remove();
+export function wrapForWebRenderer(component) {
+    const Wrapped = () => React.createElement('div', { style: { visibility: 'visible', position: 'relative', width: '100%', height: '100%' } }, React.createElement(component));
+    return Wrapped;
 }
 export async function renderInBrowser(options) {
-    const removeCover = injectScaffoldCover();
     const ExportWrapped = () => React.createElement(ExportContext.Provider, { value: true }, React.createElement(options.component));
-    try {
-        const { getBlob } = await renderMediaOnWeb({
-            composition: {
-                component: ExportWrapped,
-                durationInFrames: options.durationInFrames,
-                fps: options.fps ?? 30,
-                width: options.width ?? 1920,
-                height: options.height ?? 1080,
-                id: 'MdxVideo',
-                calculateMetadata: null,
-            },
-            inputProps: {},
-            container: 'mp4',
-            videoCodec: 'h264',
-            videoBitrate: 'high',
-            allowHtmlInCanvas: true,
-            scale: options.scale,
-            signal: options.signal,
-            onProgress: ({ progress }) => {
-                options.onProgress?.(progress);
-            },
-        });
-        return getBlob();
-    }
-    finally {
-        removeCover();
-    }
+    const { getBlob } = await renderMediaOnWeb({
+        composition: {
+            component: wrapForWebRenderer(ExportWrapped),
+            durationInFrames: options.durationInFrames,
+            fps: options.fps ?? 30,
+            width: options.width ?? 1920,
+            height: options.height ?? 1080,
+            id: 'MdxVideo',
+            calculateMetadata: null,
+        },
+        inputProps: {},
+        container: 'mp4',
+        videoCodec: 'h264',
+        videoBitrate: 'high',
+        allowHtmlInCanvas: true,
+        scale: options.scale,
+        signal: options.signal,
+        onProgress: ({ progress }) => {
+            options.onProgress?.(progress);
+        },
+    });
+    return getBlob();
 }

package/dist/vite/sdk.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sdk.d.ts","sourceRoot":"","sources":["../../src/vite/sdk.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"sdk.d.ts","sourceRoot":"","sources":["../../src/vite/sdk.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,KAAK,EACV,UAAU,EACV,2BAA2B,EAC3B,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,kBAAkB,EAClB,+BAA+B,EAC/B,gCAAgC,EACjC,MAAM,wBAAwB,CAAA;AAG/B,YAAY,EACV,UAAU,EACV,2BAA2B,EAC3B,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,kBAAkB,EAClB,+BAA+B,EAC/B,gCAAgC,GACjC,CAAA;AAMD,UAAU,YAAY;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,eAAe,EAAE,MAAM,MAAM,CAAA;IAC7B,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,SAAS,EAAE,MAAM,OAAO,CAAA;CACzB;AAED,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,gBAAgB,EAAE,MAAM,CAAA;CACzB;AAED,UAAU,iBAAiB;IACzB,SAAS,EAAE,KAAK,CAAC,EAAE,CAAA;IACnB,aAAa,EAAE,MAAM,CAAA;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,4EAA4E;IAC5E,QAAQ,EAAE,iBAAiB,EAAE,CAAA;IAC7B,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE;QAAE,OAAO,EAAE,YAAY,GAAG,IAAI,CAAA;KAAE,CAAA;IAC3C,iFAAiF;IACjF,kBAAkB,EAAE;QAAE,OAAO,EAAE,WAAW,GAAG,IAAI,CAAA;KAAE,CAAA;CACpD;AAMD,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oCAAoC;IACpC,MAAM,CAAC,EAAE,2BAA2B,CAAA;IACpC,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,MAAM,WAAW,aAAa;IAC5B,sDAAsD;IACtD,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IAC9B,uCAAuC;IACvC,SAAS,CAAC,EAAE,oBAAoB,CAAA;IAChC,iDAAiD;IACjD,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC,mEAAmE;IACnE,YAAY,CAAC,EAAE,MAAM,GAAG,kBAAkB,CAAA;IAC1C,iDAAiD;IACjD,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,GAAG,kBAAkB,CAAA;IAC1C,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,kCAAkC;IAClC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,gEAAgE;IAChE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,yBAAyB,CAAC,EAAE,MAAM,CAAA;IAClC,wCAAwC;IACxC,oBAAoB,CAAC,EAAE,+BAA+B,CAAA;IACtD,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,8DAA8D;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,UAAU,CAAC,EAAE,gCAAgC,CAAA;CAC9C;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,gBAAgB,EAAE,MAAM,CAAA;IACxB,UAAU,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,eAAe;IAC9B,aAAa,EAAE,MAAM,CAAA;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,sEAAsE;IACtE,QAAQ,EAAE,WAAW,EAAE,CAAA;IACvB,0BAA0B;IAC1B,eAAe,EAAE,MAAM,CAAA;IACvB,qCAAqC;IACrC,YAAY,EAAE,MAAM,CAAA;IACpB,8CAA8C;IAC9C,SAAS,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,+BAA+B;IAC/B,MAAM,EAAE,MAAM,EAAE,CAAA;IAChB,sFAAsF;IACtF,cAAc,EAAE,MAAM,CAAA;IACtB,oCAAoC;IACpC,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,CAAA;IAChC,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,MAAM,WAAW,eAAe;IAC9B,4EAA4E;IAC5E,CAAC,EAAE,MAAM,CAAA;IACT,2EAA2E;IAC3E,CAAC,EAAE,MAAM,CAAA;IACT,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAA;IACb,2CAA2C;IAC3C,MAAM,EAAE,MAAM,CAAA;IACd,4DAA4D;IAC5D,QAAQ,EAAE,MAAM,CAAA;IAChB,6DAA6D;IAC7D,QAAQ,EAAE,MAAM,CAAA;IAChB,iEAAiE;IACjE,YAAY,EAAE,MAAM,CAAA;IACpB,mEAAmE;IACnE,aAAa,EAAE,MAAM,CAAA;IACrB,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,4DAA4D;IAC5D,cAAc,EAAE,MAAM,CAAA;IACtB,6DAA6D;IAC7D,cAAc,EAAE,MAAM,CAAA;CACvB;AA4BD,cAAM,QAAQ;IACZ,OAAO,CAAC,MAAM,CAAiC;IAE/C,oEAAoE;IACpE,QAAQ,CAAC,MAAM,EAAE,iBAAiB;IAIlC,OAAO,CAAC,SAAS;IAUjB,OAAO,CAAC,SAAS;IAcjB,uDAAuD;IACvD,MAAM,CAAC,KAAK,EAAE,MAAM;IAIpB,mEAAmE;IACnE,eAAe,IAAI,MAAM;IAIzB,sBAAsB;IACtB,IAAI;IAIJ,sBAAsB;IACtB,KAAK;IAIL,yBAAyB;IACzB,MAAM;IAIN,+CAA+C;IAC/C,SAAS,IAAI,OAAO;IAQpB,mDAAmD;IACnD,OAAO,CAAC,eAAe;IAevB,uEAAuE;IACvE,OAAO,IAAI,eAAe;IAoB1B;;;;;;;;;;OAUG;IACH,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,eAAe;IAkDrD,iEAAiE;IAC3D,sBAAsB,CAC1B,OAAO,GAAE,IAAI,CAAC,iBAAiB,EAAE,OAAO,CAAM,GAC7C,OAAO,CAAC,MAAM,CAAC;IAIlB;uEACmE;IACnE,OAAO,CAAC,aAAa;IAOrB;;;;mEAI+D;IACzD,UAAU,CAAC,OAAO,GAAE,iBAAsB,GAAG,OAAO,CAAC,MAAM,CAAC;IA0BlE;;;;;;;;;;;;OAYG;IACG,SAAS,CAAC,OAAO,EAAE,gBAAgB,GAAG,OAAO,CAAC,MAAM,CAAC;IAmG3D;8DAC0D;IACpD,MAAM,CAAC,OAAO,GAAE,aAAkB,GAAG,OAAO,CAAC,MAAM,CAAC;CAsC3D;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,QAAQ,EAAE,QAAQ,CAAA;KACnB;CACF;AAMD,eAAO,MAAM,QAAQ,UAAiB,CAAA"}

package/dist/vite/sdk.js

@@ -12,6 +12,7 @@
  */
 import React from 'react';
 import { renderStillOnWeb, renderMediaOnWeb } from '@remotion/web-renderer';
+import { wrapForWebRenderer } from "./render-client.js";
 import { ExportContext } from "./mdx-video.js";
 // ---------------------------------------------------------------------------
 // Helper: blob → data URL
@@ -192,7 +193,7 @@ class EgakiSDK {
         const format = options.format ?? 'png';
         const still = await renderStillOnWeb({
             composition: {
-                component: c.component,
+                component: wrapForWebRenderer(c.component),
                 durationInFrames: c.totalDuration,
                 fps: c.fps,
                 width: c.width,
@@ -278,7 +279,7 @@ class EgakiSDK {
         for (let i = 0; i < framesToCapture.length; i++) {
             const still = await renderStillOnWeb({
                 composition: {
-                    component: c.component,
+                    component: wrapForWebRenderer(c.component),
                     durationInFrames: c.totalDuration,
                     fps: c.fps,
                     width: c.width,
@@ -315,7 +316,7 @@ class EgakiSDK {
         const c = this.getConfig();
         const { getBlob } = await renderMediaOnWeb({
             composition: {
-                component: this.wrapForExport(c.component),
+                component: wrapForWebRenderer(this.wrapForExport(c.component)),
                 durationInFrames: c.totalDuration,
                 fps: c.fps,
                 width: c.width,

package/dist/vite/shader-renderer.d.ts

@@ -28,6 +28,10 @@ export interface ShaderConfig {
     /** Property controls that become uniforms and tweakpane sliders. */
     propertyControls: Record<string, PropertyControl>;
 }
+/** Parse a hex color string (#RGB, #RRGGBB, #RRGGBBAA) to [r, g, b, a] in 0-1 range. */
+export declare function parseHexColor(hex: string): [number, number, number, number];
+export declare function compileGlShader(gl: WebGL2RenderingContext, type: number, source: string): WebGLShader;
+export declare function linkGlProgram(gl: WebGL2RenderingContext, vs: WebGLShader, fs: WebGLShader): WebGLProgram;
 /**
  * Create a React component that renders a WebGL2 fragment shader full-screen.
  *

package/dist/vite/shader-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shader-renderer.d.ts","sourceRoot":"","sources":["../../src/vite/shader-renderer.tsx"],"names":[],"mappings":"AA8BA,OAAO,EAA2B,KAAK,aAAa,EAAE,MAAM,OAAO,CAAA;AAOnE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,QAAQ,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,OAAO,CAAA;IACb,OAAO,EAAE;QAAE,IAAI,EAAE,OAAO,CAAA;KAAE,CAAA;IAC1B,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,EAAE,MAAM,EAAE,CAAA;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG,iBAAiB,CAAA;AAE/D,MAAM,WAAW,YAAY;IAC3B,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,QAAQ,EAAE,MAAM,CAAA;IAChB,oEAAoE;IACpE,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;CAClD;AAoLD;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY;YAsEtC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG;QAAE,KAAK,CAAC,EAAE,aAAa,CAAA;KAAE;;EA+MzD"}
+{"version":3,"file":"shader-renderer.d.ts","sourceRoot":"","sources":["../../src/vite/shader-renderer.tsx"],"names":[],"mappings":"AA8BA,OAAO,EAA2B,KAAK,aAAa,EAAE,MAAM,OAAO,CAAA;AAOnE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,QAAQ,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,OAAO,CAAA;IACb,OAAO,EAAE;QAAE,IAAI,EAAE,OAAO,CAAA;KAAE,CAAA;IAC1B,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,EAAE,MAAM,EAAE,CAAA;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG,iBAAiB,CAAA;AAE/D,MAAM,WAAW,YAAY;IAC3B,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,QAAQ,EAAE,MAAM,CAAA;IAChB,oEAAoE;IACpE,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;CAClD;AAMD,wFAAwF;AACxF,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAa3E;AAwFD,wBAAgB,eAAe,CAC7B,EAAE,EAAE,sBAAsB,EAC1B,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,GACb,WAAW,CAWb;AAED,wBAAgB,aAAa,CAC3B,EAAE,EAAE,sBAAsB,EAC1B,EAAE,EAAE,WAAW,EACf,EAAE,EAAE,WAAW,GACd,YAAY,CAYd;AAuCD;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY;YAsEtC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG;QAAE,KAAK,CAAC,EAAE,aAAa,CAAA;KAAE;;EA+MzD"}

package/dist/vite/shader-renderer.js

@@ -33,7 +33,7 @@ import { useTweakpane } from "./tweakpane-hook.js";
 // Color parsing
 // ---------------------------------------------------------------------------
 /** Parse a hex color string (#RGB, #RRGGBB, #RRGGBBAA) to [r, g, b, a] in 0-1 range. */
-function parseHexColor(hex) {
+export function parseHexColor(hex) {
     let h = hex.replace('#', '');
     if (h.length === 3 || h.length === 4) {
         h = h
@@ -112,7 +112,7 @@ function generateFragmentSource(body, controls) {
 // ---------------------------------------------------------------------------
 // WebGL helpers
 // ---------------------------------------------------------------------------
-function compileGlShader(gl, type, source) {
+export function compileGlShader(gl, type, source) {
     const shader = gl.createShader(type);
     if (!shader)
         throw new Error('Failed to create shader');
@@ -125,7 +125,7 @@ function compileGlShader(gl, type, source) {
     }
     return shader;
 }
-function linkGlProgram(gl, vs, fs) {
+export function linkGlProgram(gl, vs, fs) {
     const program = gl.createProgram();
     if (!program)
         throw new Error('Failed to create program');

package/dist/vite/tweakpane-hook.d.ts

@@ -71,6 +71,12 @@ export declare let TWEAKPANE_DISABLED: boolean;
  * Returns a reactive object with current values. Updating a control in the
  * pane immediately triggers a React re-render with fresh values.
  *
+ * Values follow live props: each key returns the schema value from the
+ * CURRENT render until the user touches that control in the pane, so
+ * animated props (e.g. `translateX={interpolate(frame, ...)}`) flow through
+ * every frame. Once touched, the user's pane value wins for that key until
+ * the component remounts.
+ *
  * On unmount the folder is disposed and removed from the pane.
  */
 export declare function useTweakpane<T extends ParamSchema>(label: string, schema: T): ResolvedValues<T>;

package/dist/vite/tweakpane-hook.d.ts.map

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

package/dist/vite/tweakpane-hook.js

@@ -18,6 +18,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * Tweakpane is pure DOM (no React dependency), so there are no dual-React
  * or SSR issues. During SSR (typeof window === 'undefined') the hook
  * returns the raw default values and skips all DOM work.
+ *
+ * Live props vs user overrides: each param follows the LIVE schema value
+ * passed on every render (so animated props like translateX={interpolate(...)}
+ * work) until the user touches that control in the pane. Once touched, the
+ * user's value wins for that key until the component remounts. Untouched
+ * controls are refreshed in the pane every render so animated values are
+ * visible while playing. Programmatic refreshes are guarded so tweakpane's
+ * change events (which fire on refresh() too) don't mark keys as touched.
  */
 import { useCallback, useEffect, useRef, useState, useSyncExternalStore, createContext, useContext } from 'react';
 import { LayoutContainerContext, useIsPremounting } from "./mdx-video.js";
@@ -59,6 +67,22 @@ function cloneValue(value) {
         return { ...value };
     return value;
 }
+/** Deep-equal for param values: primitives, small arrays (bezier tuples),
+ *  and flat objects (range {min, max}). */
+function valuesEqual(a, b) {
+    if (a === b)
+        return true;
+    if (Array.isArray(a) && Array.isArray(b)) {
+        return a.length === b.length && a.every((x, i) => x === b[i]);
+    }
+    if (typeof a === 'object' && a !== null && typeof b === 'object' && b !== null) {
+        const ra = a;
+        const rb = b;
+        const ka = Object.keys(ra);
+        return ka.length === Object.keys(rb).length && ka.every((k) => ra[k] === rb[k]);
+    }
+    return false;
+}
 function resolveDefault(v) {
     if (isCubicBezierParam(v))
         return [...v.value];
@@ -178,7 +202,10 @@ function serializeTweakpanePrompt(ctx) {
         const changed = [];
         for (const [key, current] of Object.entries(entry.params)) {
             const def = entry.defaults[key];
-            if (current !== def) {
+            // Only user-touched keys count as changed. Untouched keys mirror live
+            // (possibly animated) props, so comparing them to mount-time defaults
+            // would produce false positives on every playing frame.
+            if (entry.touched.has(key) && !valuesEqual(current, def)) {
                 changed.push(`  ${key}: ${formatValue(current)}`);
             }
         }
@@ -261,6 +288,12 @@ function CopyChangesButton() {
  * Returns a reactive object with current values. Updating a control in the
  * pane immediately triggers a React re-render with fresh values.
  *
+ * Values follow live props: each key returns the schema value from the
+ * CURRENT render until the user touches that control in the pane, so
+ * animated props (e.g. `translateX={interpolate(frame, ...)}`) flow through
+ * every frame. Once touched, the user's pane value wins for that key until
+ * the component remounts.
+ *
  * On unmount the folder is disposed and removed from the pane.
  */
 export function useTweakpane(label, schema) {
@@ -283,6 +316,21 @@ export function useTweakpane(label, schema) {
     // Track the schema for updates
     const schemaRef = useRef(schema);
     schemaRef.current = schema;
+    // Keys the user changed via the pane UI. Untouched keys follow the live
+    // schema value on every render (so animated props work); touched keys keep
+    // the user's pane value until remount.
+    const touchedRef = useRef(new Set());
+    // Latest user override values, mirrored from state so the mount effect can
+    // seed rebuilt folders without re-running on every pane change.
+    const valuesRef = useRef(values);
+    valuesRef.current = values;
+    // Live handles to the mounted folder + bound params, used by the per-render
+    // sync effect below to push animated prop values into the pane.
+    const liveRef = useRef(null);
+    // True while we call folder.refresh() programmatically. tweakpane emits
+    // change events on refresh() too, so handlers must ignore those or every
+    // animated frame would mark keys as user-touched.
+    const refreshingRef = useRef(false);
     // Stable ID for this hook instance
     const idRef = useRef(`${label}-${Math.random().toString(36).slice(2, 8)}`);
     useEffect(() => {
@@ -299,7 +347,10 @@ export function useTweakpane(label, schema) {
             const def = resolveDefault(param);
             // Clone object/array values so tweakpane's in-place mutations on params
             // don't corrupt the defaults (used by "Copy changes" diffing).
-            params[key] = cloneValue(def);
+            // Touched keys keep the user's override when the folder is rebuilt
+            // (e.g. premount → active transition re-runs this effect).
+            const touched = touchedRef.current.has(key);
+            params[key] = cloneValue(touched ? valuesRef.current[key] : def);
             defaults[key] = cloneValue(def);
         }
         let folder = null;
@@ -320,6 +371,8 @@ export function useTweakpane(label, schema) {
                         picker: 'inline',
                     });
                     blade.on('change', (ev) => {
+                        if (refreshingRef.current)
+                            return;
                         const val = ev.value;
                         const tuple = [
                             Math.round(val.x1 * 1000) / 1000,
@@ -328,6 +381,7 @@ export function useTweakpane(label, schema) {
                             Math.round(val.y2 * 1000) / 1000,
                         ];
                         params[key] = tuple;
+                        touchedRef.current.add(key);
                         setValues((prev) => ({ ...prev, [key]: tuple }));
                     });
                     continue;
@@ -339,7 +393,10 @@ export function useTweakpane(label, schema) {
                         max: param.max,
                         step: param.step,
                     }).on('change', (ev) => {
+                        if (refreshingRef.current)
+                            return;
                         const val = ev.value;
+                        touchedRef.current.add(key);
                         setValues((prev) => ({ ...prev, [key]: { min: val.min, max: val.max } }));
                     });
                     continue;
@@ -384,15 +441,20 @@ export function useTweakpane(label, schema) {
                     }
                 }
                 folder.addBinding(params, key, opts).on('change', (ev) => {
+                    if (refreshingRef.current)
+                        return;
+                    touchedRef.current.add(key);
                     setValues((prev) => ({ ...prev, [key]: ev.value }));
                 });
             }
+            liveRef.current = { folder, params };
             // Register for copy prompt
-            activeFolders.set(id, { label, params, defaults });
+            activeFolders.set(id, { label, params, defaults, touched: touchedRef.current });
             notifyFolderListeners();
         })();
         return () => {
             disposed = true;
+            liveRef.current = null;
             if (folder) {
                 folder.dispose();
                 folder = null;
@@ -405,7 +467,42 @@ export function useTweakpane(label, schema) {
             }
         };
     }, [label, skip]);
-    return values;
+    // Push live (possibly animated) prop values into the pane for untouched
+    // keys. Runs after every render — during playback the component re-renders
+    // each frame, so animated values are visible moving in the pane UI.
+    // folder.refresh() emits change events; refreshingRef makes handlers
+    // ignore them so refreshes never mark keys as touched.
+    useEffect(() => {
+        const live = liveRef.current;
+        if (!live)
+            return;
+        let dirty = false;
+        for (const [key, param] of Object.entries(schemaRef.current)) {
+            if (touchedRef.current.has(key))
+                continue;
+            // Bezier blades are not bindings — refresh() won't read params for
+            // them. The returned value still follows live props below.
+            if (isCubicBezierParam(param))
+                continue;
+            const liveVal = resolveDefault(param);
+            if (!valuesEqual(live.params[key], liveVal)) {
+                live.params[key] = cloneValue(liveVal);
+                dirty = true;
+            }
+        }
+        if (dirty) {
+            refreshingRef.current = true;
+            live.folder.refresh();
+            refreshingRef.current = false;
+        }
+    });
+    // Merge: user-touched keys return the pane value, untouched keys follow
+    // the live schema value so animated props work without any extra wiring.
+    const merged = {};
+    for (const [key, param] of Object.entries(schema)) {
+        merged[key] = touchedRef.current.has(key) ? values[key] : resolveDefault(param);
+    }
+    return merged;
 }
 // ---------------------------------------------------------------------------
 // TweakpaneRoot — sidebar container for the tweakpane pane

package/dist/vite/vite-plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vite-plugin.d.ts","sourceRoot":"","sources":["../../src/vite/vite-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAMH,OAAO,KAAK,EAAU,YAAY,EAAE,MAAM,MAAM,CAAA;AA4BhD,MAAM,WAAW,kBAAkB;IACjC;;wEAEoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAiDD,wBAAgB,KAAK,CAAC,OAAO,CAAC,EAAE,kBAAkB,GAAG,YAAY,EAAE,CAoYlE"}
+{"version":3,"file":"vite-plugin.d.ts","sourceRoot":"","sources":["../../src/vite/vite-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAMH,OAAO,KAAK,EAAU,YAAY,EAAE,MAAM,MAAM,CAAA;AAgDhD,MAAM,WAAW,kBAAkB;IACjC;;wEAEoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAiDD,wBAAgB,KAAK,CAAC,OAAO,CAAC,EAAE,kBAAkB,GAAG,YAAY,EAAE,CA4dlE"}