@editframe/elements 0.37.3-beta → 0.38.1

package/dist/elements/EFTextSegment.js

@@ -17,13 +17,13 @@ let EFTextSegment = class EFTextSegment$1 extends EFTemporal(LitElement) {
 	static {
 		this.styles = [css`
       :host {
+        display: inline;
+      }
+      :host([data-animated]) {
         display: inline-block;
-        white-space: pre;
-        line-height: 1;
       }
       :host([data-line-segment]) {
         display: block;
-        white-space: normal;
       }
       :host([hidden]) {
         opacity: 0;
@@ -95,9 +95,13 @@ let EFTextSegment = class EFTextSegment$1 extends EFTemporal(LitElement) {
 		return (this.closest("ef-text")?.startTimeMs || 0) + (this.segmentStartMs || 0);
 	}
 	get endTimeMs() {
-		return (this.closest("ef-text")?.startTimeMs || 0) + (this.segmentEndMs || 0);
+		const parentText = this.closest("ef-text");
+		if (parentText) return parentText.startTimeMs + parentText.durationMs;
+		return this.segmentEndMs || 0;
 	}
 	get durationMs() {
+		const parentText = this.closest("ef-text");
+		if (parentText) return parentText.durationMs;
 		return this.segmentEndMs - this.segmentStartMs;
 	}
 };

package/dist/elements/EFTextSegment.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTextSegment.js","names":["EFTextSegment"],"sources":["../../src/elements/EFTextSegment.ts"],"sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { EFTemporal, type TemporalMixinInterface } from \"./EFTemporal.ts\";\nimport { EFText } from \"./EFText.js\";\n\n// Global registry for animation stylesheets shared across all text segments\nconst globalAnimationSheets = new Map<string, CSSStyleSheet>();\n\n@customElement(\"ef-text-segment\")\nexport class EFTextSegment extends EFTemporal(LitElement) {\n  static styles = [\n    css`\n      :host {\n        display: inline-block;\n        white-space: pre;\n        line-height: 1;\n      }\n      :host([data-line-segment]) {\n        display: block;\n        white-space: normal;\n      }\n      :host([hidden]) {\n        opacity: 0;\n        pointer-events: none;\n      }\n    `,\n  ];\n\n  /**\n   * Registers animation styles that should be shared across all text segments.\n   * This is the correct way to inject animation styles for segments - not via innerHTML.\n   *\n   * @param id Unique identifier for this stylesheet (e.g., \"my-animations\")\n   * @param cssText The CSS rules to inject\n   *\n   * @example\n   * EFTextSegment.registerAnimations(\"bounceIn\", `\n   *   @keyframes bounceIn {\n   *     from { transform: scale(0); }\n   *     to { transform: scale(1); }\n   *   }\n   *   .bounce-in {\n   *     animation: bounceIn 0.5s ease-out;\n   *   }\n   * `);\n   */\n  static registerAnimations(id: string, cssText: string): void {\n    if (globalAnimationSheets.has(id)) {\n      // Already registered\n      return;\n    }\n\n    const sheet = new CSSStyleSheet();\n    sheet.replaceSync(cssText);\n    globalAnimationSheets.set(id, sheet);\n\n    // Apply to all existing instances\n    document.querySelectorAll(\"ef-text-segment\").forEach((segment) => {\n      if (segment.shadowRoot) {\n        const adoptedSheets = segment.shadowRoot.adoptedStyleSheets;\n        if (!adoptedSheets.includes(sheet)) {\n          segment.shadowRoot.adoptedStyleSheets = [...adoptedSheets, sheet];\n        }\n      }\n    });\n  }\n\n  /**\n   * Unregisters previously registered animation styles.\n   *\n   * @param id The identifier of the stylesheet to remove\n   */\n  static unregisterAnimations(id: string): void {\n    const sheet = globalAnimationSheets.get(id);\n    if (!sheet) {\n      return;\n    }\n\n    globalAnimationSheets.delete(id);\n\n    // Remove from all existing instances\n    document.querySelectorAll(\"ef-text-segment\").forEach((segment) => {\n      if (segment.shadowRoot) {\n        segment.shadowRoot.adoptedStyleSheets =\n          segment.shadowRoot.adoptedStyleSheets.filter((s) => s !== sheet);\n      }\n    });\n  }\n\n  render() {\n    // Set CSS variables in render() to ensure they're always set\n    // This is necessary because Lit may clear inline styles during updates\n    this.setCSSVariables();\n    return html`${this.segmentText}`;\n  }\n\n  private setCSSVariables(): void {\n    // Set deterministic --ef-seed value based on segment index\n    const seed = (this.segmentIndex * 9007) % 233; // Prime numbers for better distribution\n    const seedValue = seed / 233; // Normalize to 0-1 range\n    this.style.setProperty(\"--ef-seed\", seedValue.toString());\n\n    // Set stagger offset CSS variable\n    // staggerOffsetMs is always set (defaults to 0), so we can always set the CSS variable\n    const offsetMs = this.staggerOffsetMs ?? 0;\n    this.style.setProperty(\"--ef-stagger-offset\", `${offsetMs}ms`);\n\n    // Set index CSS variable\n    this.style.setProperty(\"--ef-index\", this.segmentIndex.toString());\n  }\n\n  protected firstUpdated(): void {\n    this.setCSSVariables();\n  }\n\n  protected updated(): void {\n    this.setCSSVariables();\n  }\n\n  @property({ type: String, attribute: false })\n  segmentText = \"\";\n\n  @property({ type: Number, attribute: false })\n  segmentIndex = 0;\n\n  @property({ type: Number, attribute: false })\n  staggerOffsetMs?: number;\n\n  @property({ type: Number, attribute: false })\n  segmentStartMs = 0;\n\n  @property({ type: Number, attribute: false })\n  segmentEndMs = 0;\n\n  @property({ type: Boolean, reflect: true })\n  hidden = false;\n\n  get startTimeMs() {\n    // Get parent text element's absolute start time, then add our local offset\n    const parentText = this.closest(\"ef-text\") as EFText;\n    const parentStartTime = parentText?.startTimeMs || 0;\n    return parentStartTime + (this.segmentStartMs || 0);\n  }\n\n  get endTimeMs() {\n    const parentText = this.closest(\"ef-text\") as EFText;\n    const parentStartTime = parentText?.startTimeMs || 0;\n    return parentStartTime + (this.segmentEndMs || 0);\n  }\n\n  get durationMs(): number {\n    return this.segmentEndMs - this.segmentStartMs;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-text-segment\": EFTextSegment;\n  }\n}\n"],"mappings":";;;;;;AAMA,MAAM,wCAAwB,IAAI,KAA4B;AAGvD,0BAAMA,wBAAsB,WAAW,WAAW,CAAC;;;qBA+G1C;sBAGC;wBAME;sBAGF;gBAGN;;;gBA7HO,CACd,GAAG;;;;;;;;;;;;;;MAeJ;;;;;;;;;;;;;;;;;;;;CAoBD,OAAO,mBAAmB,IAAY,SAAuB;AAC3D,MAAI,sBAAsB,IAAI,GAAG,CAE/B;EAGF,MAAM,QAAQ,IAAI,eAAe;AACjC,QAAM,YAAY,QAAQ;AAC1B,wBAAsB,IAAI,IAAI,MAAM;AAGpC,WAAS,iBAAiB,kBAAkB,CAAC,SAAS,YAAY;AAChE,OAAI,QAAQ,YAAY;IACtB,MAAM,gBAAgB,QAAQ,WAAW;AACzC,QAAI,CAAC,cAAc,SAAS,MAAM,CAChC,SAAQ,WAAW,qBAAqB,CAAC,GAAG,eAAe,MAAM;;IAGrE;;;;;;;CAQJ,OAAO,qBAAqB,IAAkB;EAC5C,MAAM,QAAQ,sBAAsB,IAAI,GAAG;AAC3C,MAAI,CAAC,MACH;AAGF,wBAAsB,OAAO,GAAG;AAGhC,WAAS,iBAAiB,kBAAkB,CAAC,SAAS,YAAY;AAChE,OAAI,QAAQ,WACV,SAAQ,WAAW,qBACjB,QAAQ,WAAW,mBAAmB,QAAQ,MAAM,MAAM,MAAM;IAEpE;;CAGJ,SAAS;AAGP,OAAK,iBAAiB;AACtB,SAAO,IAAI,GAAG,KAAK;;CAGrB,AAAQ,kBAAwB;EAG9B,MAAM,YADQ,KAAK,eAAe,OAAQ,MACjB;AACzB,OAAK,MAAM,YAAY,aAAa,UAAU,UAAU,CAAC;EAIzD,MAAM,WAAW,KAAK,mBAAmB;AACzC,OAAK,MAAM,YAAY,uBAAuB,GAAG,SAAS,IAAI;AAG9D,OAAK,MAAM,YAAY,cAAc,KAAK,aAAa,UAAU,CAAC;;CAGpE,AAAU,eAAqB;AAC7B,OAAK,iBAAiB;;CAGxB,AAAU,UAAgB;AACxB,OAAK,iBAAiB;;CAqBxB,IAAI,cAAc;AAIhB,UAFmB,KAAK,QAAQ,UAAU,EACN,eAAe,MACzB,KAAK,kBAAkB;;CAGnD,IAAI,YAAY;AAGd,UAFmB,KAAK,QAAQ,UAAU,EACN,eAAe,MACzB,KAAK,gBAAgB;;CAGjD,IAAI,aAAqB;AACvB,SAAO,KAAK,eAAe,KAAK;;;YAhCjC,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;4BA9H5C,cAAc,kBAAkB"}
+{"version":3,"file":"EFTextSegment.js","names":["EFTextSegment"],"sources":["../../src/elements/EFTextSegment.ts"],"sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { EFTemporal } from \"./EFTemporal.ts\";\nimport { EFText } from \"./EFText.js\";\n\n// Global registry for animation stylesheets shared across all text segments\nconst globalAnimationSheets = new Map<string, CSSStyleSheet>();\n\n@customElement(\"ef-text-segment\")\nexport class EFTextSegment extends EFTemporal(LitElement) {\n  static styles = [\n    css`\n      :host {\n        display: inline;\n      }\n      :host([data-animated]) {\n        display: inline-block;\n      }\n      :host([data-line-segment]) {\n        display: block;\n      }\n      :host([hidden]) {\n        opacity: 0;\n        pointer-events: none;\n      }\n    `,\n  ];\n\n  /**\n   * Registers animation styles that should be shared across all text segments.\n   * This is the correct way to inject animation styles for segments - not via innerHTML.\n   *\n   * @param id Unique identifier for this stylesheet (e.g., \"my-animations\")\n   * @param cssText The CSS rules to inject\n   *\n   * @example\n   * EFTextSegment.registerAnimations(\"bounceIn\", `\n   *   @keyframes bounceIn {\n   *     from { transform: scale(0); }\n   *     to { transform: scale(1); }\n   *   }\n   *   .bounce-in {\n   *     animation: bounceIn 0.5s ease-out;\n   *   }\n   * `);\n   */\n  static registerAnimations(id: string, cssText: string): void {\n    if (globalAnimationSheets.has(id)) {\n      // Already registered\n      return;\n    }\n\n    const sheet = new CSSStyleSheet();\n    sheet.replaceSync(cssText);\n    globalAnimationSheets.set(id, sheet);\n\n    // Apply to all existing instances\n    document.querySelectorAll(\"ef-text-segment\").forEach((segment) => {\n      if (segment.shadowRoot) {\n        const adoptedSheets = segment.shadowRoot.adoptedStyleSheets;\n        if (!adoptedSheets.includes(sheet)) {\n          segment.shadowRoot.adoptedStyleSheets = [...adoptedSheets, sheet];\n        }\n      }\n    });\n  }\n\n  /**\n   * Unregisters previously registered animation styles.\n   *\n   * @param id The identifier of the stylesheet to remove\n   */\n  static unregisterAnimations(id: string): void {\n    const sheet = globalAnimationSheets.get(id);\n    if (!sheet) {\n      return;\n    }\n\n    globalAnimationSheets.delete(id);\n\n    // Remove from all existing instances\n    document.querySelectorAll(\"ef-text-segment\").forEach((segment) => {\n      if (segment.shadowRoot) {\n        segment.shadowRoot.adoptedStyleSheets =\n          segment.shadowRoot.adoptedStyleSheets.filter((s) => s !== sheet);\n      }\n    });\n  }\n\n  render() {\n    // Set CSS variables in render() to ensure they're always set\n    // This is necessary because Lit may clear inline styles during updates\n    this.setCSSVariables();\n    return html`${this.segmentText}`;\n  }\n\n  private setCSSVariables(): void {\n    // Set deterministic --ef-seed value based on segment index\n    const seed = (this.segmentIndex * 9007) % 233; // Prime numbers for better distribution\n    const seedValue = seed / 233; // Normalize to 0-1 range\n    this.style.setProperty(\"--ef-seed\", seedValue.toString());\n\n    // Set stagger offset CSS variable\n    // staggerOffsetMs is always set (defaults to 0), so we can always set the CSS variable\n    const offsetMs = this.staggerOffsetMs ?? 0;\n    this.style.setProperty(\"--ef-stagger-offset\", `${offsetMs}ms`);\n\n    // Set index CSS variable\n    this.style.setProperty(\"--ef-index\", this.segmentIndex.toString());\n  }\n\n  protected firstUpdated(): void {\n    this.setCSSVariables();\n  }\n\n  protected updated(): void {\n    this.setCSSVariables();\n  }\n\n  @property({ type: String, attribute: false })\n  segmentText = \"\";\n\n  @property({ type: Number, attribute: false })\n  segmentIndex = 0;\n\n  @property({ type: Number, attribute: false })\n  staggerOffsetMs?: number;\n\n  @property({ type: Number, attribute: false })\n  segmentStartMs = 0;\n\n  @property({ type: Number, attribute: false })\n  segmentEndMs = 0;\n\n  @property({ type: Boolean, reflect: true })\n  hidden = false;\n\n  get startTimeMs() {\n    const parentText = this.closest(\"ef-text\") as EFText;\n    const parentStartTime = parentText?.startTimeMs || 0;\n    return parentStartTime + (this.segmentStartMs || 0);\n  }\n\n  get endTimeMs() {\n    // Derive from parent's live durationMs rather than the snapshot stored in segmentEndMs.\n    // This ensures segments track changes when the parent's duration updates\n    // (e.g., a contain-mode timegroup whose duration changes after a video loads).\n    const parentText = this.closest(\"ef-text\") as EFText;\n    if (parentText) {\n      return parentText.startTimeMs + parentText.durationMs;\n    }\n    return this.segmentEndMs || 0;\n  }\n\n  get durationMs(): number {\n    const parentText = this.closest(\"ef-text\") as EFText;\n    if (parentText) {\n      return parentText.durationMs;\n    }\n    return this.segmentEndMs - this.segmentStartMs;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-text-segment\": EFTextSegment;\n  }\n}\n"],"mappings":";;;;;;AAMA,MAAM,wCAAwB,IAAI,KAA4B;AAGvD,0BAAMA,wBAAsB,WAAW,WAAW,CAAC;;;qBA+G1C;sBAGC;wBAME;sBAGF;gBAGN;;;gBA7HO,CACd,GAAG;;;;;;;;;;;;;;MAeJ;;;;;;;;;;;;;;;;;;;;CAoBD,OAAO,mBAAmB,IAAY,SAAuB;AAC3D,MAAI,sBAAsB,IAAI,GAAG,CAE/B;EAGF,MAAM,QAAQ,IAAI,eAAe;AACjC,QAAM,YAAY,QAAQ;AAC1B,wBAAsB,IAAI,IAAI,MAAM;AAGpC,WAAS,iBAAiB,kBAAkB,CAAC,SAAS,YAAY;AAChE,OAAI,QAAQ,YAAY;IACtB,MAAM,gBAAgB,QAAQ,WAAW;AACzC,QAAI,CAAC,cAAc,SAAS,MAAM,CAChC,SAAQ,WAAW,qBAAqB,CAAC,GAAG,eAAe,MAAM;;IAGrE;;;;;;;CAQJ,OAAO,qBAAqB,IAAkB;EAC5C,MAAM,QAAQ,sBAAsB,IAAI,GAAG;AAC3C,MAAI,CAAC,MACH;AAGF,wBAAsB,OAAO,GAAG;AAGhC,WAAS,iBAAiB,kBAAkB,CAAC,SAAS,YAAY;AAChE,OAAI,QAAQ,WACV,SAAQ,WAAW,qBACjB,QAAQ,WAAW,mBAAmB,QAAQ,MAAM,MAAM,MAAM;IAEpE;;CAGJ,SAAS;AAGP,OAAK,iBAAiB;AACtB,SAAO,IAAI,GAAG,KAAK;;CAGrB,AAAQ,kBAAwB;EAG9B,MAAM,YADQ,KAAK,eAAe,OAAQ,MACjB;AACzB,OAAK,MAAM,YAAY,aAAa,UAAU,UAAU,CAAC;EAIzD,MAAM,WAAW,KAAK,mBAAmB;AACzC,OAAK,MAAM,YAAY,uBAAuB,GAAG,SAAS,IAAI;AAG9D,OAAK,MAAM,YAAY,cAAc,KAAK,aAAa,UAAU,CAAC;;CAGpE,AAAU,eAAqB;AAC7B,OAAK,iBAAiB;;CAGxB,AAAU,UAAgB;AACxB,OAAK,iBAAiB;;CAqBxB,IAAI,cAAc;AAGhB,UAFmB,KAAK,QAAQ,UAAU,EACN,eAAe,MACzB,KAAK,kBAAkB;;CAGnD,IAAI,YAAY;EAId,MAAM,aAAa,KAAK,QAAQ,UAAU;AAC1C,MAAI,WACF,QAAO,WAAW,cAAc,WAAW;AAE7C,SAAO,KAAK,gBAAgB;;CAG9B,IAAI,aAAqB;EACvB,MAAM,aAAa,KAAK,QAAQ,UAAU;AAC1C,MAAI,WACF,QAAO,WAAW;AAEpB,SAAO,KAAK,eAAe,KAAK;;;YAxCjC,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAO,CAAC;YAG5C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;4BA9H5C,cAAc,kBAAkB"}

package/dist/elements/EFTimegroup.d.ts

@@ -1,10 +1,10 @@
 import { FrameController, FrameRenderable, FrameState } from "../preview/FrameController.js";
+import { QualityUpgradeScheduler } from "../preview/QualityUpgradeScheduler.js";
 import { TemporalMixinInterface } from "./EFTemporal.js";
 import { EFMedia } from "./EFMedia.js";
 import { ContainerInfo } from "./ContainerInfo.js";
 import { ElementPositionInfo } from "./ElementPositionInfo.js";
-import { CaptureBatchOptions, CaptureOptions } from "../preview/renderTimegroupToCanvas.js";
-import { RenderToVideoOptions } from "../preview/renderTimegroupToVideo.js";
+import { RenderToVideoOptions } from "../preview/renderTimegroupToVideo.types.js";
 import "./EFPanZoom.js";
 import "../canvas/EFCanvas.js";
 import "../gui/hierarchy/EFHierarchy.js";
@@ -40,8 +40,9 @@ interface RenderCloneResult {
  *
  * CONSTRAINTS:
  * - MUST be synchronous (no async/await, no Promise return)
- * - MUST complete in <100ms (error) or <10ms (warning)
+ * - MUST complete in <2000ms (error) or <100ms (warning)
  * - Should only register callbacks and set up behavior, not do expensive work
+ * - GPU operations (WebGL context creation, shader compilation) may take up to ~1s
  */
 type TimegroupInitializer = (timegroup: EFTimegroup) => void;
 /**
@@ -61,10 +62,11 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
   _timeGroupContext: this;
   /** @internal */
   efContext: this;
-  /** @public */
-  mode: TimeMode;
-  /** @public */
-  overlapMs: number;
+  shouldAutoReady(): boolean;
+  get mode(): TimeMode;
+  set mode(value: TimeMode);
+  get overlapMs(): number;
+  set overlapMs(value: number);
   /**
    * Initializer function for setting up JavaScript behavior on this timegroup.
    * This function is called ONCE per instance - on the prime timeline when first connected,
@@ -97,12 +99,6 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
    */
   get initializer(): TimegroupInitializer | undefined;
   set initializer(fn: TimegroupInitializer | undefined);
-  /**
-   * Public accessor for initializer completion promise.
-   * Allows createRenderClone to wait for initializer before rendering.
-   * @internal
-   */
-  get initializerComplete(): Promise<void> | undefined;
   /** @public */
   fps: number;
   /**
@@ -130,6 +126,11 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
    * @public
    */
   get frameController(): FrameController;
+  /**
+   * Get the quality upgrade scheduler for background segment fetching.
+   * @public
+   */
+  get qualityUpgradeScheduler(): QualityUpgradeScheduler;
   /**
    * Query timegroup's readiness state for a given time.
    * Timegroups are always ready (no async preparation needed).
@@ -168,6 +169,16 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
    * @public
    */
   incrementContentEpoch(): void;
+  /**
+   * Request a frame re-render at the current time.
+   *
+   * Use this when the source-to-timeline mapping has changed (e.g., sourcein/sourceout)
+   * but currentTimeMs hasn't. The FrameController only re-renders when currentTimeMs
+   * or durationMs change, so this provides a way for child elements to request a
+   * re-render when their internal state changes the visual output.
+   * @public
+   */
+  requestFrameRender(): void;
   /** @public */
   set currentTime(time: number);
   /** @public */
@@ -262,33 +273,13 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
   didBecomeRoot(): void;
   protected updated(changedProperties: PropertyValues): void;
   disconnectedCallback(): void;
-  /**
-   * Capture the timegroup at a specific timestamp as a canvas.
-   * Does NOT modify currentTimeMs - captures are rendered independently.
-   *
-   * @param options - Capture options including timeMs, scale, contentReadyMode
-   * @returns Promise resolving to an HTMLCanvasElement with the captured frame
-   * @public
-   */
-  captureAtTime(options: CaptureOptions): Promise<HTMLCanvasElement>;
-  /**
-   * Capture multiple timestamps as canvas thumbnails in a single batch.
-   *
-   * CLONE-TIMELINE ARCHITECTURE:
-   * Creates a single render clone and reuses it across all captures.
-   * Prime-timeline is NEVER seeked - user can continue previewing/editing during capture.
-   *
-   * @param timestamps - Array of timestamps (in milliseconds) to capture
-   * @param options - Capture options (scale, contentReadyMode, blockingTimeoutMs)
-   * @returns Promise resolving to array of HTMLCanvasElements
-   * @public
-   */
-  captureBatch(timestamps: number[], options?: CaptureBatchOptions): Promise<HTMLCanvasElement[]>;
   /**
    * Render the timegroup to an MP4 video file and trigger download.
    * Captures each frame at the specified fps, encodes using WebCodecs via
    * MediaBunny, and downloads the resulting video.
    *
+   * Uses dynamic import to only load render utilities in browser context.
+   *
    * @param options - Rendering options (fps, codec, bitrate, filename, etc.)
    * @returns Promise that resolves when video is downloaded
    * @public
@@ -321,8 +312,6 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
   /** @public */
   get durationMs(): number;
   /** @internal */
-  waitForFrameTasks(signal?: AbortSignal): Promise<void>;
-  /** @internal */
   waitForMediaDurations(signal?: AbortSignal): Promise<void>;
   /** @internal */
   get childTemporals(): TemporalMixinInterface[];
@@ -354,12 +343,6 @@ declare class EFTimegroup extends EFTimegroup_base implements FrameRenderable {
    * @internal
    */
   renderAudio(fromMs: number, toMs: number, signal?: AbortSignal): Promise<AudioBuffer>;
-  static readonly TIMEGROUP_FRAME_TASK_THRESHOLD = 100;
-  static readonly TIMEGROUP_FRAME_TASK_RESET_MS = 1000;
-  frameTask: {
-    run(): void | Promise<void>;
-    taskComplete: Promise<void>;
-  };
   seekTask: {
     run(): void | Promise<number | undefined>;
     taskComplete: Promise<number | undefined>;