egaki 0.8.0 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,9 @@
1
1
  /**
2
- * AngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
2
+ * BasicAngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
3
+ *
4
+ * The shader-based version (true depth-of-field via WebGL) lives in
5
+ * angled-screen-shader.tsx and is exported as AngledScreen. This CSS version
6
+ * is kept as a lightweight fallback that works without HTML-in-canvas support.
3
7
  *
4
8
  * Wraps any children (images, videos, divs) in a 3D-transformed plane using
5
9
  * CSS `perspective` + `transform: rotateX/Y/Z`. Simulates depth-of-field
@@ -18,7 +22,7 @@
18
22
  * Set `debug` to visualize the mask gradient as green (sharp) / red (blur).
19
23
  */
20
24
  import { type CSSProperties, type ReactNode } from 'react';
21
- export interface AngledScreenProps {
25
+ export interface BasicAngledScreenProps {
22
26
  children: ReactNode;
23
27
  /** CSS perspective distance in px. Smaller = more dramatic. Default 1200. */
24
28
  perspective?: number;
@@ -53,5 +57,10 @@ export interface AngledScreenProps {
53
57
  /** Optional inline style on the outer container. */
54
58
  style?: CSSProperties;
55
59
  }
56
- export declare function AngledScreen(props: AngledScreenProps): import("react").JSX.Element;
60
+ /**
61
+ * @deprecated Use `AngledScreen` (angled-screen-shader.tsx) instead — the
62
+ * WebGL version with true depth-of-field. This CSS version only remains as
63
+ * the automatic fallback for browsers without HTML-in-canvas support.
64
+ */
65
+ export declare function BasicAngledScreen(props: BasicAngledScreenProps): import("react").JSX.Element;
57
66
  //# sourceMappingURL=angled-screen.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"angled-screen.d.ts","sourceRoot":"","sources":["../../src/vite/angled-screen.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAG1D,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,SAAS,CAAA;IAGnB,6EAA6E;IAC7E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;+EAC2E;IAC3E,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,2CAA2C;IAC3C,eAAe,CAAC,EAAE,MAAM,CAAA;IAGxB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gFAAgF;IAChF,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IACpD;4EACwE;IACxE,WAAW,CAAC,EAAE,MAAM,CAAA;IAGpB,oEAAoE;IACpE,eAAe,CAAC,EAAE,MAAM,CAAA;IAGxB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,oDAAoD;IACpD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB;AAwBD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAwHpD"}
1
+ {"version":3,"file":"angled-screen.d.ts","sourceRoot":"","sources":["../../src/vite/angled-screen.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAG1D,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,SAAS,CAAA;IAGnB,6EAA6E;IAC7E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;+EAC2E;IAC3E,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,2CAA2C;IAC3C,eAAe,CAAC,EAAE,MAAM,CAAA;IAGxB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gFAAgF;IAChF,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IACpD;4EACwE;IACxE,WAAW,CAAC,EAAE,MAAM,CAAA;IAGpB,oEAAoE;IACpE,eAAe,CAAC,EAAE,MAAM,CAAA;IAGxB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,oDAAoD;IACpD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAExB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB;AAwBD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,+BAwH9D"}
@@ -1,7 +1,11 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  /**
4
- * AngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
4
+ * BasicAngledScreen — CSS 3D perspective wrapper with fake bokeh depth-of-field.
5
+ *
6
+ * The shader-based version (true depth-of-field via WebGL) lives in
7
+ * angled-screen-shader.tsx and is exported as AngledScreen. This CSS version
8
+ * is kept as a lightweight fallback that works without HTML-in-canvas support.
5
9
  *
6
10
  * Wraps any children (images, videos, divs) in a 3D-transformed plane using
7
11
  * CSS `perspective` + `transform: rotateX/Y/Z`. Simulates depth-of-field
@@ -41,9 +45,14 @@ function autoDirection(rotateX, rotateY) {
41
45
  }
42
46
  return rotateX > 0 ? 'bottom' : 'top';
43
47
  }
44
- export function AngledScreen(props) {
48
+ /**
49
+ * @deprecated Use `AngledScreen` (angled-screen-shader.tsx) instead — the
50
+ * WebGL version with true depth-of-field. This CSS version only remains as
51
+ * the automatic fallback for browsers without HTML-in-canvas support.
52
+ */
53
+ export function BasicAngledScreen(props) {
45
54
  const { children, transformOrigin = '50% 50%', bokehDirection, backgroundColor = '#000000', width = '80%', height = 'auto', style, } = props;
46
- const tp = useTweakpane('AngledScreen', {
55
+ const tp = useTweakpane('BasicAngledScreen', {
47
56
  perspective: { value: props.perspective ?? 1200, min: 100, max: 3000, step: 10 },
48
57
  rotateX: { value: props.rotateX ?? 8, min: -90, max: 90, step: 0.5 },
49
58
  rotateY: { value: props.rotateY ?? -12, min: -90, max: 90, step: 0.5 },
@@ -14,7 +14,8 @@ import type { SafeMdxError } from 'safe-mdx';
14
14
  import type { EagerModules } from 'safe-mdx/parse';
15
15
  import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, type MdxSection, type SplitResult, type VideoFrontmatter } from './mdx-parse.ts';
16
16
  import { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep } from './components.tsx';
17
- import { AngledScreen } from './angled-screen.tsx';
17
+ import { BasicAngledScreen } from './angled-screen.tsx';
18
+ import { AngledScreen } from './angled-screen-shader.tsx';
18
19
  import { CodeBlock, CODE_THEMES } from './code-block.tsx';
19
20
  import { BandsShader } from './bands-shader.tsx';
20
21
  import { WaveGradientShader } from './wave-gradient-shader.tsx';
@@ -286,7 +287,7 @@ export { LayoutContainerContext, LayoutTransition, LayoutTransitionProvider, Lay
286
287
  import { LayoutTransition } from './layout-transition.tsx';
287
288
  import { Img, Audio, Video } from './media-components.tsx';
288
289
  export { ExportContext, useIsExporting, Img, Audio, Video } from './media-components.tsx';
289
- export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
290
+ export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, BasicAngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
290
291
  /** Built-in JSX names available in MDX without user imports. Shared by
291
292
  * client rendering (mdx-client.tsx) and <Server> slot rendering (app.tsx).
292
293
  * Add new presentation components here once — not in app.tsx / mdx-client. */
@@ -303,6 +304,7 @@ export declare const MDX_BUILTIN_COMPONENTS: {
303
304
  readonly Background: typeof Background;
304
305
  readonly LayoutTransition: typeof LayoutTransition;
305
306
  readonly AngledScreen: typeof AngledScreen;
307
+ readonly BasicAngledScreen: typeof BasicAngledScreen;
306
308
  readonly BandsShader: import("react").FC<import("./bands-shader.tsx").BandsShaderProps>;
307
309
  readonly WaveGradientShader: import("react").FC<import("./wave-gradient-shader.tsx").WaveGradientShaderProps>;
308
310
  readonly LiquidGradientShader: import("react").FC<import("./liquid-gradient-shader.tsx").LiquidGradientShaderProps>;
@@ -1 +1 @@
1
- {"version":3,"file":"mdx-video.d.ts","sourceRoot":"","sources":["../../src/vite/mdx-video.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"mdx-video.d.ts","sourceRoot":"","sources":["../../src/vite/mdx-video.tsx"],"names":[],"mappings":"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"}
@@ -14,7 +14,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
14
14
  import { createContext, useContext, useId, useInsertionEffect, useLayoutEffect } from 'react';
15
15
  import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, } from "./mdx-parse.js";
16
16
  import { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, } from "./components.js";
17
- import { AngledScreen } from "./angled-screen.js";
17
+ import { BasicAngledScreen } from "./angled-screen.js";
18
+ import { AngledScreen } from "./angled-screen-shader.js";
18
19
  import { CodeBlock, CODE_THEMES } from "./code-block.js";
19
20
  import { BandsShader } from "./bands-shader.js";
20
21
  import { WaveGradientShader } from "./wave-gradient-shader.js";
@@ -564,7 +565,7 @@ import { ExportContext, useIsExporting, Img, Audio, Video } from "./media-compon
564
565
  export { ExportContext, useIsExporting, Img, Audio, Video } from "./media-components.js";
565
566
  // Visual components and animations are re-exported so they're available
566
567
  // as named imports from this client module for MDX usage.
567
- export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
568
+ export { BlurReveal, MaskedSlideReveal, StaggeredFadeUp, ShimmerSweep, AngledScreen, BasicAngledScreen, CodeBlock, CODE_THEMES, BandsShader, WaveGradientShader, LiquidGradientShader, DispersionRingsShader, };
568
569
  function GeneratedImage(_props) { return null; }
569
570
  function GeneratedVideo(_props) { return null; }
570
571
  function GeneratedSpeech(_props) { return null; }
@@ -573,6 +574,7 @@ export const MDX_BUILTIN_COMPONENTS = {
573
574
  Background,
574
575
  LayoutTransition,
575
576
  AngledScreen,
577
+ BasicAngledScreen,
576
578
  BandsShader,
577
579
  WaveGradientShader,
578
580
  LiquidGradientShader,
@@ -25,6 +25,7 @@ describe('MDX_BUILTIN_COMPONENTS', () => {
25
25
  "Audio",
26
26
  "Background",
27
27
  "BandsShader",
28
+ "BasicAngledScreen",
28
29
  "Blur",
29
30
  "BlurReveal",
30
31
  "CodeBlock",
@@ -4,6 +4,33 @@
4
4
  * via @remotion/web-renderer's renderMediaOnWeb().
5
5
  */
6
6
  import React from 'react';
7
+ /**
8
+ * Wrap a composition for web-renderer entry points (export, screenshot,
9
+ * filmstrip). The scaffold wrapper is visibility:hidden and Chromium creates
10
+ * no paint records for hidden subtrees, which breaks captureElementImage()
11
+ * inside nested <HtmlInCanvas> (AngledScreen): onInit/onPaint silently never
12
+ * run and exports come out flat. visibility is overridable by descendants,
13
+ * so a visibility:visible div at the composition root restores paint records
14
+ * for the whole tree while deeper visibility:hidden ancestors (e.g.
15
+ * LayoutTransition's inactive instances) keep hiding their subtrees
16
+ * relative to this root.
17
+ *
18
+ * Tradeoff (accepted): the scaffold sits at z-index:-9999, painting above
19
+ * the page's root background but below all in-flow content — so the
20
+ * rendering composition can peek through wherever the page shows only the
21
+ * body background. Hiding it differently is not possible:
22
+ * - opacity:0 / filter:opacity(0) bake into captureElementImage pixels
23
+ * (verified: capture succeeds but frames come out fully transparent)
24
+ * - translate/clip-path/resize on the scaffold break the drawElementImage
25
+ * paint pipeline (black frames — learned June 2026, commit e501ca5)
26
+ * - visibility:hidden kills paint records entirely (the original bug)
27
+ * An opaque page background or full-viewport player UI fully occludes it.
28
+ *
29
+ * TODO: re-evaluate whether this wrapper is still needed once remotion
30
+ * fixes the HtmlInCanvas delayRender scoping / hidden-scaffold capture bug:
31
+ * https://github.com/remotion-dev/remotion/issues/9367
32
+ */
33
+ export declare function wrapForWebRenderer(component: React.FC): React.FC;
7
34
  export declare function renderInBrowser(options: {
8
35
  component: React.FC;
9
36
  durationInFrames: number;
@@ -1 +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"}
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;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"}
@@ -7,61 +7,57 @@ import { renderMediaOnWeb } from '@remotion/web-renderer';
7
7
  import { ExportContext } from "./mdx-video.js";
8
8
  import React from 'react';
9
9
  /**
10
- * Cover the web-renderer scaffold during export. The scaffold wrapper has
11
- * position:fixed + visibility:hidden + z-index:-9999, but allowHtmlInCanvas
12
- * sets visibility:visible on the inner layoutsubtree canvas, which can
13
- * make it peek through on the page.
10
+ * Wrap a composition for web-renderer entry points (export, screenshot,
11
+ * filmstrip). The scaffold wrapper is visibility:hidden and Chromium creates
12
+ * no paint records for hidden subtrees, which breaks captureElementImage()
13
+ * inside nested <HtmlInCanvas> (AngledScreen): onInit/onPaint silently never
14
+ * run and exports come out flat. visibility is overridable by descendants,
15
+ * so a visibility:visible div at the composition root restores paint records
16
+ * for the whole tree while deeper visibility:hidden ancestors (e.g.
17
+ * LayoutTransition's inactive instances) keep hiding their subtrees
18
+ * relative to this root.
14
19
  *
15
- * Do NOT modify the scaffold wrapper's own styles (translate, clip-path,
16
- * width/height, opacity). All of those break Chrome's drawElementImage
17
- * paint pipeline and produce black frames in the exported video. The
18
- * layout subtree canvas must remain at full size, in its original position,
19
- * with normal visibility for the capture to work.
20
+ * Tradeoff (accepted): the scaffold sits at z-index:-9999, painting above
21
+ * the page's root background but below all in-flow content — so the
22
+ * rendering composition can peek through wherever the page shows only the
23
+ * body background. Hiding it differently is not possible:
24
+ * - opacity:0 / filter:opacity(0) bake into captureElementImage pixels
25
+ * (verified: capture succeeds but frames come out fully transparent)
26
+ * - translate/clip-path/resize on the scaffold break the drawElementImage
27
+ * paint pipeline (black frames — learned June 2026, commit e501ca5)
28
+ * - visibility:hidden kills paint records entirely (the original bug)
29
+ * An opaque page background or full-viewport player UI fully occludes it.
20
30
  *
21
- * Instead we place an opaque overlay on top (z-index:-9998, one above the
22
- * scaffold's -9999) that visually hides the rendering without touching
23
- * the scaffold's layout or paint properties.
31
+ * TODO: re-evaluate whether this wrapper is still needed once remotion
32
+ * fixes the HtmlInCanvas delayRender scoping / hidden-scaffold capture bug:
33
+ * https://github.com/remotion-dev/remotion/issues/9367
24
34
  */
25
- function injectScaffoldCover() {
26
- const cover = document.createElement('div');
27
- cover.style.cssText = [
28
- 'position:fixed',
29
- 'inset:0',
30
- 'z-index:-9998',
31
- 'background:#050505',
32
- 'pointer-events:none',
33
- ].join(';');
34
- document.body.appendChild(cover);
35
- return () => cover.remove();
35
+ export function wrapForWebRenderer(component) {
36
+ const Wrapped = () => React.createElement('div', { style: { visibility: 'visible', position: 'relative', width: '100%', height: '100%' } }, React.createElement(component));
37
+ return Wrapped;
36
38
  }
37
39
  export async function renderInBrowser(options) {
38
- const removeCover = injectScaffoldCover();
39
40
  const ExportWrapped = () => React.createElement(ExportContext.Provider, { value: true }, React.createElement(options.component));
40
- try {
41
- const { getBlob } = await renderMediaOnWeb({
42
- composition: {
43
- component: ExportWrapped,
44
- durationInFrames: options.durationInFrames,
45
- fps: options.fps ?? 30,
46
- width: options.width ?? 1920,
47
- height: options.height ?? 1080,
48
- id: 'MdxVideo',
49
- calculateMetadata: null,
50
- },
51
- inputProps: {},
52
- container: 'mp4',
53
- videoCodec: 'h264',
54
- videoBitrate: 'high',
55
- allowHtmlInCanvas: true,
56
- scale: options.scale,
57
- signal: options.signal,
58
- onProgress: ({ progress }) => {
59
- options.onProgress?.(progress);
60
- },
61
- });
62
- return getBlob();
63
- }
64
- finally {
65
- removeCover();
66
- }
41
+ const { getBlob } = await renderMediaOnWeb({
42
+ composition: {
43
+ component: wrapForWebRenderer(ExportWrapped),
44
+ durationInFrames: options.durationInFrames,
45
+ fps: options.fps ?? 30,
46
+ width: options.width ?? 1920,
47
+ height: options.height ?? 1080,
48
+ id: 'MdxVideo',
49
+ calculateMetadata: null,
50
+ },
51
+ inputProps: {},
52
+ container: 'mp4',
53
+ videoCodec: 'h264',
54
+ videoBitrate: 'high',
55
+ allowHtmlInCanvas: true,
56
+ scale: options.scale,
57
+ signal: options.signal,
58
+ onProgress: ({ progress }) => {
59
+ options.onProgress?.(progress);
60
+ },
61
+ });
62
+ return getBlob();
67
63
  }
@@ -1 +1 @@
1
- {"version":3,"file":"sdk.d.ts","sourceRoot":"","sources":["../../src/vite/sdk.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sdk.d.ts","sourceRoot":"","sources":["../../src/vite/sdk.ts"],"names":[],"mappings":"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"}
package/dist/vite/sdk.js CHANGED
@@ -12,6 +12,7 @@
12
12
  */
13
13
  import React from 'react';
14
14
  import { renderStillOnWeb, renderMediaOnWeb } from '@remotion/web-renderer';
15
+ import { wrapForWebRenderer } from "./render-client.js";
15
16
  import { ExportContext } from "./mdx-video.js";
16
17
  // ---------------------------------------------------------------------------
17
18
  // Helper: blob → data URL
@@ -192,7 +193,7 @@ class EgakiSDK {
192
193
  const format = options.format ?? 'png';
193
194
  const still = await renderStillOnWeb({
194
195
  composition: {
195
- component: c.component,
196
+ component: wrapForWebRenderer(c.component),
196
197
  durationInFrames: c.totalDuration,
197
198
  fps: c.fps,
198
199
  width: c.width,
@@ -278,7 +279,7 @@ class EgakiSDK {
278
279
  for (let i = 0; i < framesToCapture.length; i++) {
279
280
  const still = await renderStillOnWeb({
280
281
  composition: {
281
- component: c.component,
282
+ component: wrapForWebRenderer(c.component),
282
283
  durationInFrames: c.totalDuration,
283
284
  fps: c.fps,
284
285
  width: c.width,
@@ -315,7 +316,7 @@ class EgakiSDK {
315
316
  const c = this.getConfig();
316
317
  const { getBlob } = await renderMediaOnWeb({
317
318
  composition: {
318
- component: this.wrapForExport(c.component),
319
+ component: wrapForWebRenderer(this.wrapForExport(c.component)),
319
320
  durationInFrames: c.totalDuration,
320
321
  fps: c.fps,
321
322
  width: c.width,
@@ -28,6 +28,10 @@ export interface ShaderConfig {
28
28
  /** Property controls that become uniforms and tweakpane sliders. */
29
29
  propertyControls: Record<string, PropertyControl>;
30
30
  }
31
+ /** Parse a hex color string (#RGB, #RRGGBB, #RRGGBBAA) to [r, g, b, a] in 0-1 range. */
32
+ export declare function parseHexColor(hex: string): [number, number, number, number];
33
+ export declare function compileGlShader(gl: WebGL2RenderingContext, type: number, source: string): WebGLShader;
34
+ export declare function linkGlProgram(gl: WebGL2RenderingContext, vs: WebGLShader, fs: WebGLShader): WebGLProgram;
31
35
  /**
32
36
  * Create a React component that renders a WebGL2 fragment shader full-screen.
33
37
  *
@@ -1 +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"}
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;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"}
@@ -33,7 +33,7 @@ import { useTweakpane } from "./tweakpane-hook.js";
33
33
  // Color parsing
34
34
  // ---------------------------------------------------------------------------
35
35
  /** Parse a hex color string (#RGB, #RRGGBB, #RRGGBBAA) to [r, g, b, a] in 0-1 range. */
36
- function parseHexColor(hex) {
36
+ export function parseHexColor(hex) {
37
37
  let h = hex.replace('#', '');
38
38
  if (h.length === 3 || h.length === 4) {
39
39
  h = h
@@ -112,7 +112,7 @@ function generateFragmentSource(body, controls) {
112
112
  // ---------------------------------------------------------------------------
113
113
  // WebGL helpers
114
114
  // ---------------------------------------------------------------------------
115
- function compileGlShader(gl, type, source) {
115
+ export function compileGlShader(gl, type, source) {
116
116
  const shader = gl.createShader(type);
117
117
  if (!shader)
118
118
  throw new Error('Failed to create shader');
@@ -125,7 +125,7 @@ function compileGlShader(gl, type, source) {
125
125
  }
126
126
  return shader;
127
127
  }
128
- function linkGlProgram(gl, vs, fs) {
128
+ export function linkGlProgram(gl, vs, fs) {
129
129
  const program = gl.createProgram();
130
130
  if (!program)
131
131
  throw new Error('Failed to create program');
@@ -71,6 +71,12 @@ export declare let TWEAKPANE_DISABLED: boolean;
71
71
  * Returns a reactive object with current values. Updating a control in the
72
72
  * pane immediately triggers a React re-render with fresh values.
73
73
  *
74
+ * Values follow live props: each key returns the schema value from the
75
+ * CURRENT render until the user touches that control in the pane, so
76
+ * animated props (e.g. `translateX={interpolate(frame, ...)}`) flow through
77
+ * every frame. Once touched, the user's pane value wins for that key until
78
+ * the component remounts.
79
+ *
74
80
  * On unmount the folder is disposed and removed from the pane.
75
81
  */
76
82
  export declare function useTweakpane<T extends ParamSchema>(label: string, schema: T): ResolvedValues<T>;
@@ -1 +1 @@
1
- {"version":3,"file":"tweakpane-hook.d.ts","sourceRoot":"","sources":["../../src/vite/tweakpane-hook.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tweakpane-hook.d.ts","sourceRoot":"","sources":["../../src/vite/tweakpane-hook.tsx"],"names":[],"mappings":"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"}