@editframe/elements 0.25.1-beta.0 → 0.26.1-beta.0

package/dist/elements/EFMedia/videoTasks/makeVideoBufferTask.js.map

@@ -1 +1 @@
-{"version":3,"file":"makeVideoBufferTask.js","names":["currentState: VideoBufferState"],"sources":["../../../../src/elements/EFMedia/videoTasks/makeVideoBufferTask.ts"],"sourcesContent":["import { Task } from \"@lit/task\";\n\nimport { EF_INTERACTIVE } from \"../../../EF_INTERACTIVE\";\nimport { EF_RENDERING } from \"../../../EF_RENDERING\";\nimport type { VideoRendition } from \"../../../transcoding/types\";\nimport type { EFVideo } from \"../../EFVideo\";\nimport {\n  type MediaBufferConfig,\n  type MediaBufferState,\n  manageMediaBuffer,\n} from \"../shared/BufferUtils\";\nimport { getLatestMediaEngine } from \"../tasks/makeMediaEngineTask\";\n\n/**\n * Configuration for video buffering - extends the generic interface\n */\nexport interface VideoBufferConfig extends MediaBufferConfig {}\n\n/**\n * State of the video buffer - uses the generic interface\n */\nexport interface VideoBufferState extends MediaBufferState {}\n\ntype VideoBufferTask = Task<readonly [number], VideoBufferState>;\nexport const makeVideoBufferTask = (host: EFVideo): VideoBufferTask => {\n  let currentState: VideoBufferState = {\n    currentSeekTimeMs: 0,\n    requestedSegments: new Set(),\n    activeRequests: new Set(),\n    requestQueue: [],\n  };\n\n  return new Task(host, {\n    autoRun: EF_INTERACTIVE, // Make lazy - only run when element becomes timeline-active\n    args: () => [host.desiredSeekTimeMs] as const,\n    onError: (error) => {\n      console.error(\"videoBufferTask error\", error);\n    },\n    onComplete: (value) => {\n      currentState = value;\n    },\n    task: async ([seekTimeMs], { signal }) => {\n      // Skip buffering entirely in rendering mode\n      if (EF_RENDERING()) {\n        return currentState; // Return existing state without any buffering activity\n      }\n\n      // Get media engine to potentially override buffer configuration\n      const mediaEngine = await getLatestMediaEngine(host, signal);\n\n      // Use media engine's buffer config, falling back to host properties\n      const engineConfig = mediaEngine.getBufferConfig();\n      const bufferDurationMs = engineConfig.videoBufferDurationMs;\n      const maxParallelFetches = engineConfig.maxVideoBufferFetches;\n\n      const currentConfig: VideoBufferConfig = {\n        bufferDurationMs,\n        maxParallelFetches,\n        enableBuffering: host.enableVideoBuffering,\n      };\n\n      return manageMediaBuffer<VideoRendition>(\n        seekTimeMs,\n        currentConfig,\n        currentState,\n        (host as any).intrinsicDurationMs || 10000,\n        signal,\n        {\n          computeSegmentId: async (timeMs, rendition) => {\n            // Use media engine's computeSegmentId\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            return mediaEngine.computeSegmentId(timeMs, rendition);\n          },\n          prefetchSegment: async (segmentId, rendition) => {\n            // Trigger prefetch through BaseMediaEngine - let it handle caching\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            await mediaEngine.fetchMediaSegment(segmentId, rendition);\n            // Don't return data - just ensure it's cached in BaseMediaEngine\n          },\n          isSegmentCached: (segmentId, rendition) => {\n            // Check if segment is already cached in BaseMediaEngine\n            const mediaEngine = host.mediaEngineTask.value;\n            if (!mediaEngine) return false;\n\n            return mediaEngine.isSegmentCached(segmentId, rendition);\n          },\n          getRendition: async () => {\n            // Get real video rendition from media engine\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            return mediaEngine.getVideoRendition();\n          },\n          logError: console.error,\n        },\n      );\n    },\n  });\n};\n"],"mappings":";;;;;;;AAwBA,MAAa,uBAAuB,SAAmC;CACrE,IAAIA,eAAiC;EACnC,mBAAmB;EACnB,mCAAmB,IAAI,KAAK;EAC5B,gCAAgB,IAAI,KAAK;EACzB,cAAc,EAAE;EACjB;AAED,QAAO,IAAI,KAAK,MAAM;EACpB,SAAS;EACT,YAAY,CAAC,KAAK,kBAAkB;EACpC,UAAU,UAAU;AAClB,WAAQ,MAAM,yBAAyB,MAAM;;EAE/C,aAAa,UAAU;AACrB,kBAAe;;EAEjB,MAAM,OAAO,CAAC,aAAa,EAAE,aAAa;AAExC,OAAI,cAAc,CAChB,QAAO;GAOT,MAAM,gBAHc,MAAM,qBAAqB,MAAM,OAAO,EAG3B,iBAAiB;AAUlD,UAAO,kBACL,YAPuC;IACvC,kBAJuB,aAAa;IAKpC,oBAJyB,aAAa;IAKtC,iBAAiB,KAAK;IACvB,EAKC,cACC,KAAa,uBAAuB,KACrC,QACA;IACE,kBAAkB,OAAO,QAAQ,cAAc;AAG7C,aADoB,MAAM,qBAAqB,MAAM,OAAO,EACzC,iBAAiB,QAAQ,UAAU;;IAExD,iBAAiB,OAAO,WAAW,cAAc;AAG/C,YADoB,MAAM,qBAAqB,MAAM,OAAO,EAC1C,kBAAkB,WAAW,UAAU;;IAG3D,kBAAkB,WAAW,cAAc;KAEzC,MAAM,cAAc,KAAK,gBAAgB;AACzC,SAAI,CAAC,YAAa,QAAO;AAEzB,YAAO,YAAY,gBAAgB,WAAW,UAAU;;IAE1D,cAAc,YAAY;AAGxB,aADoB,MAAM,qBAAqB,MAAM,OAAO,EACzC,mBAAmB;;IAExC,UAAU,QAAQ;IACnB,CACF;;EAEJ,CAAC"}
+{"version":3,"file":"makeVideoBufferTask.js","names":["currentState: VideoBufferState","currentConfig: VideoBufferConfig"],"sources":["../../../../src/elements/EFMedia/videoTasks/makeVideoBufferTask.ts"],"sourcesContent":["import { Task } from \"@lit/task\";\n\nimport { EF_INTERACTIVE } from \"../../../EF_INTERACTIVE\";\nimport { EF_RENDERING } from \"../../../EF_RENDERING\";\nimport type { VideoRendition } from \"../../../transcoding/types\";\nimport type { EFVideo } from \"../../EFVideo\";\nimport {\n  type MediaBufferConfig,\n  type MediaBufferState,\n  manageMediaBuffer,\n} from \"../shared/BufferUtils\";\nimport { getLatestMediaEngine } from \"../tasks/makeMediaEngineTask\";\n\n/**\n * Configuration for video buffering - extends the generic interface\n */\nexport interface VideoBufferConfig extends MediaBufferConfig {}\n\n/**\n * State of the video buffer - uses the generic interface\n */\nexport interface VideoBufferState extends MediaBufferState {}\n\ntype VideoBufferTask = Task<readonly [number], VideoBufferState>;\nexport const makeVideoBufferTask = (host: EFVideo): VideoBufferTask => {\n  let currentState: VideoBufferState = {\n    currentSeekTimeMs: 0,\n    requestedSegments: new Set(),\n    activeRequests: new Set(),\n    requestQueue: [],\n  };\n\n  return new Task(host, {\n    autoRun: EF_INTERACTIVE, // Make lazy - only run when element becomes timeline-active\n    args: () => [host.desiredSeekTimeMs] as const,\n    onError: (error) => {\n      console.error(\"videoBufferTask error\", error);\n    },\n    onComplete: (value) => {\n      currentState = value;\n    },\n    task: async ([seekTimeMs], { signal }) => {\n      // Skip buffering entirely in rendering mode\n      if (EF_RENDERING()) {\n        return currentState; // Return existing state without any buffering activity\n      }\n\n      // Get media engine to potentially override buffer configuration\n      const mediaEngine = await getLatestMediaEngine(host, signal);\n\n      // Use media engine's buffer config, falling back to host properties\n      const engineConfig = mediaEngine.getBufferConfig();\n      const bufferDurationMs = engineConfig.videoBufferDurationMs;\n      const maxParallelFetches = engineConfig.maxVideoBufferFetches;\n\n      const currentConfig: VideoBufferConfig = {\n        bufferDurationMs,\n        maxParallelFetches,\n        enableBuffering: host.enableVideoBuffering,\n        bufferThresholdMs: engineConfig.bufferThresholdMs,\n      };\n\n      // Timeline context for priority-based buffering\n      const timelineContext =\n        host.rootTimegroup?.currentTimeMs !== undefined\n          ? {\n              elementStartMs: host.startTimeMs,\n              elementEndMs: host.endTimeMs,\n              playheadMs: host.rootTimegroup.currentTimeMs,\n            }\n          : undefined;\n\n      return manageMediaBuffer<VideoRendition>(\n        seekTimeMs,\n        currentConfig,\n        currentState,\n        (host as any).intrinsicDurationMs || 10000,\n        signal,\n        {\n          computeSegmentId: async (timeMs, rendition) => {\n            // Use media engine's computeSegmentId\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            return mediaEngine.computeSegmentId(timeMs, rendition);\n          },\n          prefetchSegment: async (segmentId, rendition) => {\n            // Trigger prefetch through BaseMediaEngine - let it handle caching\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            await mediaEngine.fetchMediaSegment(segmentId, rendition);\n            // Don't return data - just ensure it's cached in BaseMediaEngine\n          },\n          isSegmentCached: (segmentId, rendition) => {\n            // Check if segment is already cached in BaseMediaEngine\n            const mediaEngine = host.mediaEngineTask.value;\n            if (!mediaEngine) return false;\n\n            return mediaEngine.isSegmentCached(segmentId, rendition);\n          },\n          getRendition: async () => {\n            // Get real video rendition from media engine\n            const mediaEngine = await getLatestMediaEngine(host, signal);\n            return mediaEngine.getVideoRendition();\n          },\n          logError: console.error,\n        },\n        timelineContext,\n      );\n    },\n  });\n};\n"],"mappings":";;;;;;;AAwBA,MAAa,uBAAuB,SAAmC;CACrE,IAAIA,eAAiC;EACnC,mBAAmB;EACnB,mCAAmB,IAAI,KAAK;EAC5B,gCAAgB,IAAI,KAAK;EACzB,cAAc,EAAE;EACjB;AAED,QAAO,IAAI,KAAK,MAAM;EACpB,SAAS;EACT,YAAY,CAAC,KAAK,kBAAkB;EACpC,UAAU,UAAU;AAClB,WAAQ,MAAM,yBAAyB,MAAM;;EAE/C,aAAa,UAAU;AACrB,kBAAe;;EAEjB,MAAM,OAAO,CAAC,aAAa,EAAE,aAAa;AAExC,OAAI,cAAc,CAChB,QAAO;GAOT,MAAM,gBAHc,MAAM,qBAAqB,MAAM,OAAO,EAG3B,iBAAiB;GAIlD,MAAMC,gBAAmC;IACvC,kBAJuB,aAAa;IAKpC,oBAJyB,aAAa;IAKtC,iBAAiB,KAAK;IACtB,mBAAmB,aAAa;IACjC;GAGD,MAAM,kBACJ,KAAK,eAAe,kBAAkB,SAClC;IACE,gBAAgB,KAAK;IACrB,cAAc,KAAK;IACnB,YAAY,KAAK,cAAc;IAChC,GACD;AAEN,UAAO,kBACL,YACA,eACA,cACC,KAAa,uBAAuB,KACrC,QACA;IACE,kBAAkB,OAAO,QAAQ,cAAc;AAG7C,aADoB,MAAM,qBAAqB,MAAM,OAAO,EACzC,iBAAiB,QAAQ,UAAU;;IAExD,iBAAiB,OAAO,WAAW,cAAc;AAG/C,YADoB,MAAM,qBAAqB,MAAM,OAAO,EAC1C,kBAAkB,WAAW,UAAU;;IAG3D,kBAAkB,WAAW,cAAc;KAEzC,MAAM,cAAc,KAAK,gBAAgB;AACzC,SAAI,CAAC,YAAa,QAAO;AAEzB,YAAO,YAAY,gBAAgB,WAAW,UAAU;;IAE1D,cAAc,YAAY;AAGxB,aADoB,MAAM,qBAAqB,MAAM,OAAO,EACzC,mBAAmB;;IAExC,UAAU,QAAQ;IACnB,EACD,gBACD;;EAEJ,CAAC"}

package/dist/elements/EFMedia.d.ts

@@ -9,7 +9,7 @@ import { AudioBufferState } from "./EFMedia/audioTasks/makeAudioBufferTask.js";
 import { ControllableInterface } from "../gui/Controllable.js";
 import { UrlGenerator } from "../transcoding/utils/UrlGenerator.js";
 import * as _lit_task0 from "@lit/task";
-import * as lit2 from "lit";
+import * as lit1 from "lit";
 import { LitElement, PropertyValueMap } from "lit";
 import * as mediabunny0 from "mediabunny";
 
@@ -23,7 +23,7 @@ declare class EFMedia extends EFMedia_base {
   static readonly VIDEO_SAMPLE_BUFFER_SIZE = 30;
   static readonly AUDIO_SAMPLE_BUFFER_SIZE = 120;
   static get observedAttributes(): string[];
-  static styles: lit2.CSSResult[];
+  static styles: lit1.CSSResult[];
   /**
    * Duration in milliseconds for audio buffering ahead of current time
    * @domAttribute "audio-buffer-duration"

package/dist/elements/EFSurface.d.ts

@@ -1,18 +1,18 @@
 import { ContextMixinInterface } from "../gui/ContextMixin.js";
 import { Task } from "@lit/task";
-import * as lit20 from "lit";
+import * as lit24 from "lit";
 import { LitElement } from "lit";
-import * as lit_html17 from "lit-html";
+import * as lit_html21 from "lit-html";
 import * as lit_html_directives_ref5 from "lit-html/directives/ref";
 
 //#region src/elements/EFSurface.d.ts
 declare class EFSurface extends LitElement {
   #private;
-  static styles: lit20.CSSResult[];
+  static styles: lit24.CSSResult[];
   canvasRef: lit_html_directives_ref5.Ref<HTMLCanvasElement>;
   targetElement: ContextMixinInterface | null;
   target: string;
-  render(): lit_html17.TemplateResult<1>;
+  render(): lit_html21.TemplateResult<1>;
   get rootTimegroup(): any;
   get currentTimeMs(): number;
   get durationMs(): number;

package/dist/elements/EFTemporal.js

@@ -25,9 +25,16 @@ const deepGetElementsWithFrameTasks = (element, elements = []) => {
 	return elements;
 };
 let temporalCache;
+let temporalCacheResetScheduled = false;
 const resetTemporalCache = () => {
 	temporalCache = /* @__PURE__ */ new Map();
-	if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(resetTemporalCache);
+	if (typeof requestAnimationFrame !== "undefined" && !temporalCacheResetScheduled) {
+		temporalCacheResetScheduled = true;
+		requestAnimationFrame(() => {
+			temporalCacheResetScheduled = false;
+			resetTemporalCache();
+		});
+	}
 };
 resetTemporalCache();
 const shallowGetTemporalElements = (element, temporals = []) => {
@@ -52,9 +59,16 @@ var OwnCurrentTimeController = class {
 	}
 };
 let startTimeMsCache = /* @__PURE__ */ new WeakMap();
+let startTimeMsCacheResetScheduled = false;
 const resetStartTimeMsCache = () => {
 	startTimeMsCache = /* @__PURE__ */ new WeakMap();
-	if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(resetStartTimeMsCache);
+	if (typeof requestAnimationFrame !== "undefined" && !startTimeMsCacheResetScheduled) {
+		startTimeMsCacheResetScheduled = true;
+		requestAnimationFrame(() => {
+			startTimeMsCacheResetScheduled = false;
+			resetStartTimeMsCache();
+		});
+	}
 };
 resetStartTimeMsCache();
 const flushStartTimeMsCache = () => {

package/dist/elements/EFTemporal.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTemporal.js","names":["temporalCache: Map<Element, TemporalMixinInterface[]>","host: EFTimegroup","temporal: TemporalMixinInterface & LitElement","#parentTimegroup","#loop","#currentTimeMs"],"sources":["../../src/elements/EFTemporal.ts"],"sourcesContent":["import { consume, createContext } from \"@lit/context\";\nimport { Task } from \"@lit/task\";\nimport type { LitElement, ReactiveController } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { PlaybackController } from \"../gui/PlaybackController.js\";\nimport { durationConverter } from \"./durationConverter.js\";\nimport type { EFTimegroup } from \"./EFTimegroup.js\";\n\nexport const timegroupContext = createContext<EFTimegroup>(\n  Symbol(\"timeGroupContext\"),\n);\n\nexport declare class TemporalMixinInterface {\n  playbackController?: PlaybackController;\n  playing: boolean;\n  loop: boolean;\n  play(): void;\n  pause(): void;\n\n  get hasOwnDuration(): boolean;\n  /**\n   * Whether the element has a duration set as an attribute.\n   */\n  get hasExplicitDuration(): boolean;\n\n  get sourceStartMs(): number;\n\n  /**\n   * Used to trim the start of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `trimstart=\"10s\"` is equivalent to `trimstart=\"10000ms\"`.\n   *\n   * @domAttribute \"trimstart\"\n   */\n  get trimStartMs(): number | undefined;\n\n  /**\n   * Used to trim the end of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `trimend=\"10s\"` is equivalent to `trimend=\"10000ms\"`.\n   *\n   * @domAttribute \"trimend\"\n   */\n  get trimEndMs(): number;\n\n  set trimStartMs(value: number | undefined);\n  set trimEndMs(value: number | undefined);\n  set trimstart(value: string | undefined);\n  set trimend(value: string | undefined);\n\n  /**\n   * The source in time of the element.\n   *\n   * This is an amount of time to trim off the beginning of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `sourcein=\"10s\"` is equivalent to `sourcein=\"10000ms\"`.\n   *\n   * If the sourcein time is greater than the duration of the media, the media\n   * will not be played.\n   *\n   * If the media is 20 seconds long, and the `sourcein` value is set to `10s`, the\n   * media will play for 10 seconds, starting at the 10 second mark.\n   *\n   * Can be used in conjunction with `sourceout` to create a trimmed media.\n   *\n   * @domAttribute \"sourcein\"\n   */\n  get sourceInMs(): number | undefined;\n\n  /**\n   * The source out time of the element.\n   *\n   * This is the point in time in the media that will be treated as the end of\n   * the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `sourceout=\"10s\"` is equivalent to `sourceout=\"10000ms\"`.\n   *\n   * If the sourceout time is greater than the duration of the media, the media\n   * will play until the end of the media.\n   *\n   * If the media is 20 seconds long, and the `sourceout` value is set to `10s`,\n   * the media will play for 10 seconds, starting at zero seconds and ending at\n   * the 10 second mark.\n   *\n   * Can be used in conjunction with `sourcein` to create a trimmed media.\n   *\n   * @domAttribute \"sourceout\"\n   */\n  get sourceOutMs(): number | undefined;\n\n  set sourceInMs(value: number | undefined);\n  set sourceOutMs(value: number | undefined);\n  set sourcein(value: string | undefined);\n  set sourceout(value: string | undefined);\n\n  /**\n   * @domAttribute \"duration\"\n   */\n  get durationMs(): number;\n\n  get explicitDurationMs(): number | undefined;\n\n  get intrinsicDurationMs(): number | undefined;\n\n  /**\n   * The start time of the element within its root timegroup in milliseconds.\n   *\n   * This is an absolute time according to the highest scoped timegroup the media element is contained within.\n   *\n   * The calculated value will depend on the mode of the timegroup and the offset of the media element.\n   *\n   * If the parent time group is in `sequence` mode, the start time will be the\n   * start time of the previous sibling element plus the previous sibling's duration\n   * minus the overlap of the previous sibling and the current sibling.\n   *\n   * If the parent time group is in `contain` or `fixed` mode, the start time will be\n   * the start time of the parent time group plus the offset of the media element.\n   */\n  get startTimeMs(): number;\n  /**\n   * The end time of the element within its root timegroup in milliseconds.\n   *\n   * This is an absolute time according to the highest scoped timegroup the media\n   * element is contained within. Computed by adding the media's duration to its\n   * start time.\n   *\n   * If the media element has been trimmed, its end time will be calculated according it\n   * its trimmed duration, not its original duration.\n   */\n  get endTimeMs(): number;\n  /**\n   * The start time of the element within its parent timegroup in milliseconds.\n   *\n   * This is a relative time according to the closest timegroup the media element\n   * is contained within. Unless the media element has been given any kind of specific offset\n   * it is common for this time to be zero.\n   */\n  get startTimeWithinParentMs(): number;\n\n  /**\n   * The current time of the element in milliseconds.\n   *\n   * This is a relative time according to the closest timegroup the media element\n   * is contained within.\n   *\n   * This is suitable for determining the percentage of the media that has been\n   * played.\n   */\n  get ownCurrentTimeMs(): number;\n\n  /**\n   * Element's current time for progress calculation.\n   * For timegroups: their timeline currentTimeMs\n   * For other temporal elements: their ownCurrentTimeMs\n   */\n  get currentTimeMs(): number;\n  set currentTimeMs(value: number);\n  /**\n   * The current time of the element in milliseconds, adjusted for trimming.\n   *\n   * This is suitable for mapping to internal media time codes for audio/video\n   * elements.\n   *\n   * For example, if the media has a `sourcein` value of 10s, when `ownCurrentTimeMs` is 0s,\n   * `currentSourceTimeMs` will be 10s.\n   *\n   *            sourcein=10s     sourceout=10s\n   * /         /                /\n   * |--------|=================|---------|\n   *          ^\n   *          |_\n   *            currentSourceTimeMs === 10s\n   *          |_\n   *            ownCurrentTimeMs === 0s\n   */\n  get currentSourceTimeMs(): number;\n\n  set duration(value: string);\n  get duration(): string;\n\n  /**\n   * The offset of the element within its parent timegroup in milliseconds.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `offset=\"10s\"` is equivalent to `offset=\"10000ms\"`.\n   *\n   * This can be used to create a negative or positive offset for the start time of the media.\n   *\n   * This will change the start time of the media relative to it's otherwise normal start time.\n   *\n   * The duration of the element, or it's parent, or the start and end time of it's temporal siblings will not\n   * be affected by this offset.\n   *\n   * @domAttribute \"offset\"\n   */\n  set offset(value: string);\n  get offset(): string;\n\n  /**\n   * A convenience property for getting the nearest containing timegroup of the media element.\n   */\n  parentTimegroup?: EFTimegroup;\n\n  /**\n   * A convenience property for getting the root timegroup of the media element.\n   */\n  rootTimegroup?: EFTimegroup;\n\n  frameTask: Task<readonly unknown[], unknown>;\n\n  didBecomeRoot(): void;\n  didBecomeChild(): void;\n\n  updateComplete: Promise<boolean>;\n}\n\nexport const isEFTemporal = (obj: any): obj is TemporalMixinInterface =>\n  obj[EF_TEMPORAL];\n\nconst EF_TEMPORAL = Symbol(\"EF_TEMPORAL\");\n\nexport const deepGetTemporalElements = (\n  element: Element,\n  temporals: Array<TemporalMixinInterface & HTMLElement> = [],\n) => {\n  for (const child of element.children) {\n    if (isEFTemporal(child)) {\n      temporals.push(child as TemporalMixinInterface & HTMLElement);\n    }\n    deepGetTemporalElements(child, temporals);\n  }\n  return temporals;\n};\n\nexport const deepGetElementsWithFrameTasks = (\n  element: Element,\n  elements: Array<TemporalMixinInterface & HTMLElement> = [],\n) => {\n  for (const child of element.children) {\n    if (\"frameTask\" in child && child.frameTask instanceof Task) {\n      elements.push(child as TemporalMixinInterface & HTMLElement);\n    }\n    deepGetElementsWithFrameTasks(child, elements);\n  }\n  return elements;\n};\n\nlet temporalCache: Map<Element, TemporalMixinInterface[]>;\nexport const resetTemporalCache = () => {\n  temporalCache = new Map();\n  if (typeof requestAnimationFrame !== \"undefined\") {\n    requestAnimationFrame(resetTemporalCache);\n  }\n};\nresetTemporalCache();\n\nexport const shallowGetTemporalElements = (\n  element: Element,\n  temporals: TemporalMixinInterface[] = [],\n) => {\n  const cachedResult = temporalCache.get(element);\n  if (cachedResult) {\n    return cachedResult;\n  }\n  for (const child of element.children) {\n    if (isEFTemporal(child)) {\n      temporals.push(child);\n    } else {\n      shallowGetTemporalElements(child, temporals);\n    }\n  }\n  temporalCache.set(element, temporals);\n  return temporals;\n};\n\nexport class OwnCurrentTimeController implements ReactiveController {\n  constructor(\n    private host: EFTimegroup,\n    private temporal: TemporalMixinInterface & LitElement,\n  ) {\n    host.addController(this);\n  }\n\n  hostUpdated() {\n    this.temporal.requestUpdate(\"ownCurrentTimeMs\");\n  }\n\n  remove() {\n    this.host.removeController(this);\n  }\n}\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nlet startTimeMsCache = new WeakMap<Element, number>();\nconst resetStartTimeMsCache = () => {\n  startTimeMsCache = new WeakMap();\n  if (typeof requestAnimationFrame !== \"undefined\") {\n    requestAnimationFrame(resetStartTimeMsCache);\n  }\n};\nresetStartTimeMsCache();\n\nexport const flushStartTimeMsCache = () => {\n  startTimeMsCache = new WeakMap();\n};\n\nexport const EFTemporal = <T extends Constructor<LitElement>>(\n  superClass: T,\n) => {\n  class TemporalMixinClass extends superClass {\n    ownCurrentTimeController?: OwnCurrentTimeController;\n\n    #parentTimegroup?: EFTimegroup;\n    @consume({ context: timegroupContext, subscribe: true })\n    set parentTimegroup(value: EFTimegroup | undefined) {\n      const oldParent = this.#parentTimegroup;\n      this.#parentTimegroup = value;\n\n      this.ownCurrentTimeController?.remove();\n      this.rootTimegroup = this.getRootTimegroup();\n      if (this.rootTimegroup) {\n        this.ownCurrentTimeController = new OwnCurrentTimeController(\n          this.rootTimegroup,\n          this as InstanceType<Constructor<TemporalMixinInterface> & T>,\n        );\n      }\n\n      // Only trigger callbacks if parent status actually changed\n      if (oldParent !== value) {\n        if (!value) {\n          this.didBecomeRoot();\n        } else {\n          this.didBecomeChild();\n        }\n      }\n    }\n\n    disconnectedCallback() {\n      super.disconnectedCallback();\n      this.ownCurrentTimeController?.remove();\n\n      if (this.playbackController) {\n        this.playbackController.remove();\n        this.playbackController = undefined;\n      }\n    }\n\n    connectedCallback() {\n      super.connectedCallback();\n      // Initialize playback controller for root elements\n      // The parentTimegroup setter may have already called this, but the guard prevents double-creation\n      if (!this.parentTimegroup) {\n        this.didBecomeRoot();\n      }\n    }\n\n    get parentTimegroup() {\n      return this.#parentTimegroup;\n    }\n\n    playbackController?: PlaybackController;\n\n    get playing(): boolean {\n      if (!this.playbackController) {\n        return false;\n      }\n      return this.playbackController.playing;\n    }\n\n    set playing(value: boolean) {\n      if (!this.playbackController) {\n        console.warn(\"Cannot set playing on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.setPlaying(value);\n    }\n\n    play(): void {\n      if (!this.playbackController) {\n        console.warn(\"play() called on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.play();\n    }\n\n    pause(): void {\n      if (!this.playbackController) {\n        console.warn(\"pause() called on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.pause();\n    }\n\n    @property({ type: Boolean, reflect: true, attribute: \"loop\" })\n    get loop(): boolean {\n      return this.playbackController?.loop ?? this.#loop;\n    }\n\n    set loop(value: boolean) {\n      const oldValue = this.#loop;\n      this.#loop = value;\n      if (this.playbackController) {\n        this.playbackController.setLoop(value);\n      }\n      this.requestUpdate(\"loop\", oldValue);\n    }\n\n    @property({\n      type: String,\n      attribute: \"offset\",\n      converter: durationConverter,\n    })\n    private _offsetMs = 0;\n\n    @property({\n      type: Number,\n      attribute: \"duration\",\n      converter: durationConverter,\n    })\n    private _durationMs?: number;\n\n    set duration(value: string | undefined) {\n      if (value !== undefined) {\n        this.setAttribute(\"duration\", value);\n      } else {\n        this.removeAttribute(\"duration\");\n      }\n    }\n\n    @property({\n      type: Number,\n      attribute: \"trimstart\",\n      converter: durationConverter,\n    })\n    _trimStartMs: number | undefined = undefined;\n\n    get trimStartMs() {\n      if (this._trimStartMs === undefined) {\n        return undefined;\n      }\n      return Math.min(\n        Math.max(this._trimStartMs, 0),\n        this.intrinsicDurationMs ?? 0,\n      );\n    }\n\n    set trimStartMs(value: number | undefined) {\n      this._trimStartMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"trimend\",\n      converter: durationConverter,\n    })\n    _trimEndMs: number | undefined = undefined;\n\n    get trimEndMs() {\n      if (this._trimEndMs === undefined) {\n        return undefined;\n      }\n      return Math.min(this._trimEndMs, this.intrinsicDurationMs ?? 0);\n    }\n\n    set trimEndMs(value: number | undefined) {\n      this._trimEndMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"sourcein\",\n      converter: durationConverter,\n    })\n    _sourceInMs: number | undefined = undefined;\n\n    get sourceInMs() {\n      if (this._sourceInMs === undefined) {\n        return undefined;\n      }\n      return Math.max(this._sourceInMs, 0);\n    }\n\n    set sourceInMs(value: number | undefined) {\n      this._sourceInMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"sourceout\",\n      converter: durationConverter,\n    })\n    _sourceOutMs: number | undefined = undefined;\n\n    get sourceOutMs() {\n      if (this._sourceOutMs === undefined) {\n        return undefined;\n      }\n      if (\n        this.intrinsicDurationMs &&\n        this._sourceOutMs > this.intrinsicDurationMs\n      ) {\n        return this.intrinsicDurationMs;\n      }\n      return Math.max(this._sourceOutMs, 0);\n    }\n\n    set sourceOutMs(value: number | undefined) {\n      this._sourceOutMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"startoffset\",\n      converter: durationConverter,\n    })\n    private _startOffsetMs = 0;\n    public get startOffsetMs(): number {\n      return this._startOffsetMs;\n    }\n\n    @state()\n    rootTimegroup?: EFTimegroup = this.getRootTimegroup();\n\n    private getRootTimegroup(): EFTimegroup | undefined {\n      let parent =\n        this.tagName === \"EF-TIMEGROUP\" ? this : this.parentTimegroup;\n      while (parent?.parentTimegroup) {\n        parent = parent.parentTimegroup;\n      }\n      return parent as EFTimegroup | undefined;\n    }\n\n    get hasExplicitDuration() {\n      return this._durationMs !== undefined;\n    }\n\n    get explicitDurationMs() {\n      if (this.hasExplicitDuration) {\n        return this._durationMs;\n      }\n      return undefined;\n    }\n\n    get hasOwnDuration() {\n      return this.intrinsicDurationMs !== undefined || this.hasExplicitDuration;\n    }\n\n    get intrinsicDurationMs() {\n      return undefined;\n    }\n\n    get durationMs() {\n      // Get the base duration - either intrinsic or explicit\n      const baseDurationMs =\n        this.intrinsicDurationMs ??\n        this._durationMs ??\n        this.parentTimegroup?.durationMs ??\n        0;\n\n      if (baseDurationMs === 0) {\n        return 0;\n      }\n\n      // Apply trimming logic to any duration source\n      if (this.trimStartMs || this.trimEndMs) {\n        const trimmedDurationMs =\n          baseDurationMs - (this.trimStartMs ?? 0) - (this.trimEndMs ?? 0);\n        if (trimmedDurationMs < 0) {\n          return 0;\n        }\n        return trimmedDurationMs;\n      }\n\n      if (this.sourceInMs || this.sourceOutMs) {\n        const sourceInMs = this.sourceInMs ?? 0;\n        const sourceOutMs = this.sourceOutMs ?? baseDurationMs;\n        if (sourceInMs >= sourceOutMs) {\n          return 0;\n        }\n        return sourceOutMs - sourceInMs;\n      }\n\n      return baseDurationMs;\n    }\n\n    get sourceStartMs() {\n      return this.trimStartMs ?? this.sourceInMs ?? 0;\n    }\n\n    get offsetMs() {\n      return this._offsetMs || 0;\n    }\n\n    get parentTemporal() {\n      let parent = this.parentElement;\n      while (parent && !isEFTemporal(parent)) {\n        parent = parent.parentElement;\n      }\n      return parent;\n    }\n\n    /**\n     * The start time of the element within its parent timegroup.\n     */\n    get startTimeWithinParentMs() {\n      if (!this.parentTemporal) {\n        return 0;\n      }\n      return this.startTimeMs - this.parentTemporal.startTimeMs;\n    }\n\n    #loop = false;\n\n    get startTimeMs(): number {\n      const cachedStartTime = startTimeMsCache.get(this);\n      if (cachedStartTime !== undefined) {\n        return cachedStartTime;\n      }\n      const parentTimegroup = this.parentTimegroup;\n      if (!parentTimegroup) {\n        startTimeMsCache.set(this, 0);\n        return 0;\n      }\n      switch (parentTimegroup.mode) {\n        case \"sequence\": {\n          const siblingTemorals = shallowGetTemporalElements(parentTimegroup);\n          const ownIndex = siblingTemorals?.indexOf(\n            this as InstanceType<Constructor<TemporalMixinInterface> & T>,\n          );\n          if (ownIndex === -1) {\n            return 0;\n          }\n          if (ownIndex === 0) {\n            startTimeMsCache.set(this, parentTimegroup.startTimeMs);\n            return parentTimegroup.startTimeMs;\n          }\n          const previous = siblingTemorals?.[(ownIndex ?? 0) - 1];\n          if (!previous) {\n            console.error(\"Previous temporal element not found\", {\n              ownIndex,\n              siblingTemorals,\n            });\n            throw new Error(\"Previous temporal element not found\");\n          }\n          startTimeMsCache.set(\n            this,\n            previous.startTimeMs +\n              previous.durationMs -\n              parentTimegroup.overlapMs,\n          );\n          return (\n            previous.startTimeMs +\n            previous.durationMs -\n            parentTimegroup.overlapMs\n          );\n        }\n        case \"fit\":\n        case \"contain\":\n        case \"fixed\":\n          startTimeMsCache.set(\n            this,\n            parentTimegroup.startTimeMs + this.offsetMs,\n          );\n          return parentTimegroup.startTimeMs + this.offsetMs;\n        default:\n          throw new Error(`Invalid time mode: ${parentTimegroup.mode}`);\n      }\n    }\n\n    get endTimeMs(): number {\n      return this.startTimeMs + this.durationMs;\n    }\n\n    #currentTimeMs = 0;\n\n    /**\n     * The current time of the element within itself.\n     * Compare with `currentTimeMs` to see the current time with respect to the root timegroup\n     */\n    get ownCurrentTimeMs(): number {\n      // If we have a playback controller, read from it\n      if (this.playbackController) {\n        return Math.min(\n          Math.max(0, this.playbackController.currentTimeMs),\n          this.durationMs,\n        );\n      }\n\n      if (\n        this.rootTimegroup &&\n        this.rootTimegroup !== (this as any as EFTimegroup)\n      ) {\n        return Math.min(\n          Math.max(0, this.rootTimegroup.currentTimeMs - this.startTimeMs),\n          this.durationMs,\n        );\n      }\n      // We are the root (or no root), use stored time\n      return Math.min(Math.max(0, this.#currentTimeMs), this.durationMs);\n    }\n\n    /**\n     * Element's current time for progress calculation.\n     * Non-timegroup temporal elements use their local time (ownCurrentTimeMs)\n     */\n    get currentTimeMs() {\n      return this.ownCurrentTimeMs;\n    }\n\n    set currentTimeMs(value: number) {\n      // If we have a playback controller, delegate to it\n      if (this.playbackController) {\n        this.playbackController.currentTime = value / 1000;\n        return;\n      }\n\n      // If we have a root timegroup, delegate to it\n      if (\n        this.rootTimegroup &&\n        this.rootTimegroup !== (this as any as EFTimegroup)\n      ) {\n        this.rootTimegroup.currentTimeMs = value;\n      } else {\n        // We are the root, store the time locally\n        this.#currentTimeMs = value;\n        this.requestUpdate(\"currentTimeMs\");\n      }\n    }\n\n    /**\n     * Used to calculate the internal currentTimeMs of the element. This is useful\n     * for mapping to internal media time codes for audio/video elements.\n     */\n    get currentSourceTimeMs() {\n      const leadingTrimMs = this.sourceInMs || this.trimStartMs || 0;\n      return this.ownCurrentTimeMs + leadingTrimMs;\n    }\n\n    frameTask = new Task(this, {\n      autoRun: EF_INTERACTIVE,\n      args: () => [this.ownCurrentTimeMs] as const,\n      task: async ([], { signal: _signal }) => {\n        let fullyUpdated = await this.updateComplete;\n        while (!fullyUpdated) {\n          fullyUpdated = await this.updateComplete;\n        }\n      },\n    });\n\n    didBecomeRoot() {\n      if (!this.playbackController) {\n        this.playbackController = new PlaybackController(this as any);\n        if (this.#loop) {\n          this.playbackController.setLoop(this.#loop);\n        }\n      }\n    }\n\n    didBecomeChild() {\n      if (this.playbackController) {\n        this.playbackController.remove();\n        this.playbackController = undefined;\n      }\n    }\n  }\n\n  Object.defineProperty(TemporalMixinClass.prototype, EF_TEMPORAL, {\n    value: true,\n  });\n\n  return TemporalMixinClass as unknown as Constructor<TemporalMixinInterface> &\n    T;\n};\n"],"mappings":"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"}
+{"version":3,"file":"EFTemporal.js","names":["temporalCache: Map<Element, TemporalMixinInterface[]>","host: EFTimegroup","temporal: TemporalMixinInterface & LitElement","#parentTimegroup","#loop","#currentTimeMs"],"sources":["../../src/elements/EFTemporal.ts"],"sourcesContent":["import { consume, createContext } from \"@lit/context\";\nimport { Task } from \"@lit/task\";\nimport type { LitElement, ReactiveController } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { PlaybackController } from \"../gui/PlaybackController.js\";\nimport { durationConverter } from \"./durationConverter.js\";\nimport type { EFTimegroup } from \"./EFTimegroup.js\";\n\nexport const timegroupContext = createContext<EFTimegroup>(\n  Symbol(\"timeGroupContext\"),\n);\n\nexport declare class TemporalMixinInterface {\n  playbackController?: PlaybackController;\n  playing: boolean;\n  loop: boolean;\n  play(): void;\n  pause(): void;\n\n  get hasOwnDuration(): boolean;\n  /**\n   * Whether the element has a duration set as an attribute.\n   */\n  get hasExplicitDuration(): boolean;\n\n  get sourceStartMs(): number;\n\n  /**\n   * Used to trim the start of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `trimstart=\"10s\"` is equivalent to `trimstart=\"10000ms\"`.\n   *\n   * @domAttribute \"trimstart\"\n   */\n  get trimStartMs(): number | undefined;\n\n  /**\n   * Used to trim the end of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `trimend=\"10s\"` is equivalent to `trimend=\"10000ms\"`.\n   *\n   * @domAttribute \"trimend\"\n   */\n  get trimEndMs(): number;\n\n  set trimStartMs(value: number | undefined);\n  set trimEndMs(value: number | undefined);\n  set trimstart(value: string | undefined);\n  set trimend(value: string | undefined);\n\n  /**\n   * The source in time of the element.\n   *\n   * This is an amount of time to trim off the beginning of the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `sourcein=\"10s\"` is equivalent to `sourcein=\"10000ms\"`.\n   *\n   * If the sourcein time is greater than the duration of the media, the media\n   * will not be played.\n   *\n   * If the media is 20 seconds long, and the `sourcein` value is set to `10s`, the\n   * media will play for 10 seconds, starting at the 10 second mark.\n   *\n   * Can be used in conjunction with `sourceout` to create a trimmed media.\n   *\n   * @domAttribute \"sourcein\"\n   */\n  get sourceInMs(): number | undefined;\n\n  /**\n   * The source out time of the element.\n   *\n   * This is the point in time in the media that will be treated as the end of\n   * the media.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `sourceout=\"10s\"` is equivalent to `sourceout=\"10000ms\"`.\n   *\n   * If the sourceout time is greater than the duration of the media, the media\n   * will play until the end of the media.\n   *\n   * If the media is 20 seconds long, and the `sourceout` value is set to `10s`,\n   * the media will play for 10 seconds, starting at zero seconds and ending at\n   * the 10 second mark.\n   *\n   * Can be used in conjunction with `sourcein` to create a trimmed media.\n   *\n   * @domAttribute \"sourceout\"\n   */\n  get sourceOutMs(): number | undefined;\n\n  set sourceInMs(value: number | undefined);\n  set sourceOutMs(value: number | undefined);\n  set sourcein(value: string | undefined);\n  set sourceout(value: string | undefined);\n\n  /**\n   * @domAttribute \"duration\"\n   */\n  get durationMs(): number;\n\n  get explicitDurationMs(): number | undefined;\n\n  get intrinsicDurationMs(): number | undefined;\n\n  /**\n   * The start time of the element within its root timegroup in milliseconds.\n   *\n   * This is an absolute time according to the highest scoped timegroup the media element is contained within.\n   *\n   * The calculated value will depend on the mode of the timegroup and the offset of the media element.\n   *\n   * If the parent time group is in `sequence` mode, the start time will be the\n   * start time of the previous sibling element plus the previous sibling's duration\n   * minus the overlap of the previous sibling and the current sibling.\n   *\n   * If the parent time group is in `contain` or `fixed` mode, the start time will be\n   * the start time of the parent time group plus the offset of the media element.\n   */\n  get startTimeMs(): number;\n  /**\n   * The end time of the element within its root timegroup in milliseconds.\n   *\n   * This is an absolute time according to the highest scoped timegroup the media\n   * element is contained within. Computed by adding the media's duration to its\n   * start time.\n   *\n   * If the media element has been trimmed, its end time will be calculated according it\n   * its trimmed duration, not its original duration.\n   */\n  get endTimeMs(): number;\n  /**\n   * The start time of the element within its parent timegroup in milliseconds.\n   *\n   * This is a relative time according to the closest timegroup the media element\n   * is contained within. Unless the media element has been given any kind of specific offset\n   * it is common for this time to be zero.\n   */\n  get startTimeWithinParentMs(): number;\n\n  /**\n   * The current time of the element in milliseconds.\n   *\n   * This is a relative time according to the closest timegroup the media element\n   * is contained within.\n   *\n   * This is suitable for determining the percentage of the media that has been\n   * played.\n   */\n  get ownCurrentTimeMs(): number;\n\n  /**\n   * Element's current time for progress calculation.\n   * For timegroups: their timeline currentTimeMs\n   * For other temporal elements: their ownCurrentTimeMs\n   */\n  get currentTimeMs(): number;\n  set currentTimeMs(value: number);\n  /**\n   * The current time of the element in milliseconds, adjusted for trimming.\n   *\n   * This is suitable for mapping to internal media time codes for audio/video\n   * elements.\n   *\n   * For example, if the media has a `sourcein` value of 10s, when `ownCurrentTimeMs` is 0s,\n   * `currentSourceTimeMs` will be 10s.\n   *\n   *            sourcein=10s     sourceout=10s\n   * /         /                /\n   * |--------|=================|---------|\n   *          ^\n   *          |_\n   *            currentSourceTimeMs === 10s\n   *          |_\n   *            ownCurrentTimeMs === 0s\n   */\n  get currentSourceTimeMs(): number;\n\n  set duration(value: string);\n  get duration(): string;\n\n  /**\n   * The offset of the element within its parent timegroup in milliseconds.\n   *\n   * This can be set in either seconds or milliseconds.\n   *\n   * For example, `offset=\"10s\"` is equivalent to `offset=\"10000ms\"`.\n   *\n   * This can be used to create a negative or positive offset for the start time of the media.\n   *\n   * This will change the start time of the media relative to it's otherwise normal start time.\n   *\n   * The duration of the element, or it's parent, or the start and end time of it's temporal siblings will not\n   * be affected by this offset.\n   *\n   * @domAttribute \"offset\"\n   */\n  set offset(value: string);\n  get offset(): string;\n\n  /**\n   * A convenience property for getting the nearest containing timegroup of the media element.\n   */\n  parentTimegroup?: EFTimegroup;\n\n  /**\n   * A convenience property for getting the root timegroup of the media element.\n   */\n  rootTimegroup?: EFTimegroup;\n\n  frameTask: Task<readonly unknown[], unknown>;\n\n  didBecomeRoot(): void;\n  didBecomeChild(): void;\n\n  updateComplete: Promise<boolean>;\n}\n\nexport const isEFTemporal = (obj: any): obj is TemporalMixinInterface =>\n  obj[EF_TEMPORAL];\n\nconst EF_TEMPORAL = Symbol(\"EF_TEMPORAL\");\n\nexport const deepGetTemporalElements = (\n  element: Element,\n  temporals: Array<TemporalMixinInterface & HTMLElement> = [],\n) => {\n  for (const child of element.children) {\n    if (isEFTemporal(child)) {\n      temporals.push(child as TemporalMixinInterface & HTMLElement);\n    }\n    deepGetTemporalElements(child, temporals);\n  }\n  return temporals;\n};\n\nexport const deepGetElementsWithFrameTasks = (\n  element: Element,\n  elements: Array<TemporalMixinInterface & HTMLElement> = [],\n) => {\n  for (const child of element.children) {\n    if (\"frameTask\" in child && child.frameTask instanceof Task) {\n      elements.push(child as TemporalMixinInterface & HTMLElement);\n    }\n    deepGetElementsWithFrameTasks(child, elements);\n  }\n  return elements;\n};\n\nlet temporalCache: Map<Element, TemporalMixinInterface[]>;\nlet temporalCacheResetScheduled = false;\nexport const resetTemporalCache = () => {\n  temporalCache = new Map();\n  if (\n    typeof requestAnimationFrame !== \"undefined\" &&\n    !temporalCacheResetScheduled\n  ) {\n    temporalCacheResetScheduled = true;\n    requestAnimationFrame(() => {\n      temporalCacheResetScheduled = false;\n      resetTemporalCache();\n    });\n  }\n};\nresetTemporalCache();\n\nexport const shallowGetTemporalElements = (\n  element: Element,\n  temporals: TemporalMixinInterface[] = [],\n) => {\n  const cachedResult = temporalCache.get(element);\n  if (cachedResult) {\n    return cachedResult;\n  }\n  for (const child of element.children) {\n    if (isEFTemporal(child)) {\n      temporals.push(child);\n    } else {\n      shallowGetTemporalElements(child, temporals);\n    }\n  }\n  temporalCache.set(element, temporals);\n  return temporals;\n};\n\nexport class OwnCurrentTimeController implements ReactiveController {\n  constructor(\n    private host: EFTimegroup,\n    private temporal: TemporalMixinInterface & LitElement,\n  ) {\n    host.addController(this);\n  }\n\n  hostUpdated() {\n    this.temporal.requestUpdate(\"ownCurrentTimeMs\");\n  }\n\n  remove() {\n    this.host.removeController(this);\n  }\n}\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nlet startTimeMsCache = new WeakMap<Element, number>();\nlet startTimeMsCacheResetScheduled = false;\nconst resetStartTimeMsCache = () => {\n  startTimeMsCache = new WeakMap();\n  if (\n    typeof requestAnimationFrame !== \"undefined\" &&\n    !startTimeMsCacheResetScheduled\n  ) {\n    startTimeMsCacheResetScheduled = true;\n    requestAnimationFrame(() => {\n      startTimeMsCacheResetScheduled = false;\n      resetStartTimeMsCache();\n    });\n  }\n};\nresetStartTimeMsCache();\n\nexport const flushStartTimeMsCache = () => {\n  startTimeMsCache = new WeakMap();\n};\n\nexport const EFTemporal = <T extends Constructor<LitElement>>(\n  superClass: T,\n) => {\n  class TemporalMixinClass extends superClass {\n    ownCurrentTimeController?: OwnCurrentTimeController;\n\n    #parentTimegroup?: EFTimegroup;\n    @consume({ context: timegroupContext, subscribe: true })\n    set parentTimegroup(value: EFTimegroup | undefined) {\n      const oldParent = this.#parentTimegroup;\n      this.#parentTimegroup = value;\n\n      this.ownCurrentTimeController?.remove();\n      this.rootTimegroup = this.getRootTimegroup();\n      if (this.rootTimegroup) {\n        this.ownCurrentTimeController = new OwnCurrentTimeController(\n          this.rootTimegroup,\n          this as InstanceType<Constructor<TemporalMixinInterface> & T>,\n        );\n      }\n\n      // Only trigger callbacks if parent status actually changed\n      if (oldParent !== value) {\n        if (!value) {\n          this.didBecomeRoot();\n        } else {\n          this.didBecomeChild();\n        }\n      }\n    }\n\n    disconnectedCallback() {\n      super.disconnectedCallback();\n      this.ownCurrentTimeController?.remove();\n\n      if (this.playbackController) {\n        this.playbackController.remove();\n        this.playbackController = undefined;\n      }\n    }\n\n    connectedCallback() {\n      super.connectedCallback();\n      // Initialize playback controller for root elements\n      // The parentTimegroup setter may have already called this, but the guard prevents double-creation\n      if (!this.parentTimegroup) {\n        this.didBecomeRoot();\n      }\n    }\n\n    get parentTimegroup() {\n      return this.#parentTimegroup;\n    }\n\n    playbackController?: PlaybackController;\n\n    get playing(): boolean {\n      if (!this.playbackController) {\n        return false;\n      }\n      return this.playbackController.playing;\n    }\n\n    set playing(value: boolean) {\n      if (!this.playbackController) {\n        console.warn(\"Cannot set playing on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.setPlaying(value);\n    }\n\n    play(): void {\n      if (!this.playbackController) {\n        console.warn(\"play() called on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.play();\n    }\n\n    pause(): void {\n      if (!this.playbackController) {\n        console.warn(\"pause() called on non-root temporal element\", this);\n        return;\n      }\n      this.playbackController.pause();\n    }\n\n    @property({ type: Boolean, reflect: true, attribute: \"loop\" })\n    get loop(): boolean {\n      return this.playbackController?.loop ?? this.#loop;\n    }\n\n    set loop(value: boolean) {\n      const oldValue = this.#loop;\n      this.#loop = value;\n      if (this.playbackController) {\n        this.playbackController.setLoop(value);\n      }\n      this.requestUpdate(\"loop\", oldValue);\n    }\n\n    @property({\n      type: String,\n      attribute: \"offset\",\n      converter: durationConverter,\n    })\n    private _offsetMs = 0;\n\n    @property({\n      type: Number,\n      attribute: \"duration\",\n      converter: durationConverter,\n    })\n    private _durationMs?: number;\n\n    set duration(value: string | undefined) {\n      if (value !== undefined) {\n        this.setAttribute(\"duration\", value);\n      } else {\n        this.removeAttribute(\"duration\");\n      }\n    }\n\n    @property({\n      type: Number,\n      attribute: \"trimstart\",\n      converter: durationConverter,\n    })\n    _trimStartMs: number | undefined = undefined;\n\n    get trimStartMs() {\n      if (this._trimStartMs === undefined) {\n        return undefined;\n      }\n      return Math.min(\n        Math.max(this._trimStartMs, 0),\n        this.intrinsicDurationMs ?? 0,\n      );\n    }\n\n    set trimStartMs(value: number | undefined) {\n      this._trimStartMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"trimend\",\n      converter: durationConverter,\n    })\n    _trimEndMs: number | undefined = undefined;\n\n    get trimEndMs() {\n      if (this._trimEndMs === undefined) {\n        return undefined;\n      }\n      return Math.min(this._trimEndMs, this.intrinsicDurationMs ?? 0);\n    }\n\n    set trimEndMs(value: number | undefined) {\n      this._trimEndMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"sourcein\",\n      converter: durationConverter,\n    })\n    _sourceInMs: number | undefined = undefined;\n\n    get sourceInMs() {\n      if (this._sourceInMs === undefined) {\n        return undefined;\n      }\n      return Math.max(this._sourceInMs, 0);\n    }\n\n    set sourceInMs(value: number | undefined) {\n      this._sourceInMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"sourceout\",\n      converter: durationConverter,\n    })\n    _sourceOutMs: number | undefined = undefined;\n\n    get sourceOutMs() {\n      if (this._sourceOutMs === undefined) {\n        return undefined;\n      }\n      if (\n        this.intrinsicDurationMs &&\n        this._sourceOutMs > this.intrinsicDurationMs\n      ) {\n        return this.intrinsicDurationMs;\n      }\n      return Math.max(this._sourceOutMs, 0);\n    }\n\n    set sourceOutMs(value: number | undefined) {\n      this._sourceOutMs = value;\n    }\n\n    @property({\n      type: Number,\n      attribute: \"startoffset\",\n      converter: durationConverter,\n    })\n    private _startOffsetMs = 0;\n    public get startOffsetMs(): number {\n      return this._startOffsetMs;\n    }\n\n    @state()\n    rootTimegroup?: EFTimegroup = this.getRootTimegroup();\n\n    private getRootTimegroup(): EFTimegroup | undefined {\n      let parent =\n        this.tagName === \"EF-TIMEGROUP\" ? this : this.parentTimegroup;\n      while (parent?.parentTimegroup) {\n        parent = parent.parentTimegroup;\n      }\n      return parent as EFTimegroup | undefined;\n    }\n\n    get hasExplicitDuration() {\n      return this._durationMs !== undefined;\n    }\n\n    get explicitDurationMs() {\n      if (this.hasExplicitDuration) {\n        return this._durationMs;\n      }\n      return undefined;\n    }\n\n    get hasOwnDuration() {\n      return this.intrinsicDurationMs !== undefined || this.hasExplicitDuration;\n    }\n\n    get intrinsicDurationMs() {\n      return undefined;\n    }\n\n    get durationMs() {\n      // Get the base duration - either intrinsic or explicit\n      const baseDurationMs =\n        this.intrinsicDurationMs ??\n        this._durationMs ??\n        this.parentTimegroup?.durationMs ??\n        0;\n\n      if (baseDurationMs === 0) {\n        return 0;\n      }\n\n      // Apply trimming logic to any duration source\n      if (this.trimStartMs || this.trimEndMs) {\n        const trimmedDurationMs =\n          baseDurationMs - (this.trimStartMs ?? 0) - (this.trimEndMs ?? 0);\n        if (trimmedDurationMs < 0) {\n          return 0;\n        }\n        return trimmedDurationMs;\n      }\n\n      if (this.sourceInMs || this.sourceOutMs) {\n        const sourceInMs = this.sourceInMs ?? 0;\n        const sourceOutMs = this.sourceOutMs ?? baseDurationMs;\n        if (sourceInMs >= sourceOutMs) {\n          return 0;\n        }\n        return sourceOutMs - sourceInMs;\n      }\n\n      return baseDurationMs;\n    }\n\n    get sourceStartMs() {\n      return this.trimStartMs ?? this.sourceInMs ?? 0;\n    }\n\n    get offsetMs() {\n      return this._offsetMs || 0;\n    }\n\n    get parentTemporal() {\n      let parent = this.parentElement;\n      while (parent && !isEFTemporal(parent)) {\n        parent = parent.parentElement;\n      }\n      return parent;\n    }\n\n    /**\n     * The start time of the element within its parent timegroup.\n     */\n    get startTimeWithinParentMs() {\n      if (!this.parentTemporal) {\n        return 0;\n      }\n      return this.startTimeMs - this.parentTemporal.startTimeMs;\n    }\n\n    #loop = false;\n\n    get startTimeMs(): number {\n      const cachedStartTime = startTimeMsCache.get(this);\n      if (cachedStartTime !== undefined) {\n        return cachedStartTime;\n      }\n      const parentTimegroup = this.parentTimegroup;\n      if (!parentTimegroup) {\n        startTimeMsCache.set(this, 0);\n        return 0;\n      }\n      switch (parentTimegroup.mode) {\n        case \"sequence\": {\n          const siblingTemorals = shallowGetTemporalElements(parentTimegroup);\n          const ownIndex = siblingTemorals?.indexOf(\n            this as InstanceType<Constructor<TemporalMixinInterface> & T>,\n          );\n          if (ownIndex === -1) {\n            return 0;\n          }\n          if (ownIndex === 0) {\n            startTimeMsCache.set(this, parentTimegroup.startTimeMs);\n            return parentTimegroup.startTimeMs;\n          }\n          const previous = siblingTemorals?.[(ownIndex ?? 0) - 1];\n          if (!previous) {\n            console.error(\"Previous temporal element not found\", {\n              ownIndex,\n              siblingTemorals,\n            });\n            throw new Error(\"Previous temporal element not found\");\n          }\n          startTimeMsCache.set(\n            this,\n            previous.startTimeMs +\n              previous.durationMs -\n              parentTimegroup.overlapMs,\n          );\n          return (\n            previous.startTimeMs +\n            previous.durationMs -\n            parentTimegroup.overlapMs\n          );\n        }\n        case \"fit\":\n        case \"contain\":\n        case \"fixed\":\n          startTimeMsCache.set(\n            this,\n            parentTimegroup.startTimeMs + this.offsetMs,\n          );\n          return parentTimegroup.startTimeMs + this.offsetMs;\n        default:\n          throw new Error(`Invalid time mode: ${parentTimegroup.mode}`);\n      }\n    }\n\n    get endTimeMs(): number {\n      return this.startTimeMs + this.durationMs;\n    }\n\n    #currentTimeMs = 0;\n\n    /**\n     * The current time of the element within itself.\n     * Compare with `currentTimeMs` to see the current time with respect to the root timegroup\n     */\n    get ownCurrentTimeMs(): number {\n      // If we have a playback controller, read from it\n      if (this.playbackController) {\n        return Math.min(\n          Math.max(0, this.playbackController.currentTimeMs),\n          this.durationMs,\n        );\n      }\n\n      if (\n        this.rootTimegroup &&\n        this.rootTimegroup !== (this as any as EFTimegroup)\n      ) {\n        return Math.min(\n          Math.max(0, this.rootTimegroup.currentTimeMs - this.startTimeMs),\n          this.durationMs,\n        );\n      }\n      // We are the root (or no root), use stored time\n      return Math.min(Math.max(0, this.#currentTimeMs), this.durationMs);\n    }\n\n    /**\n     * Element's current time for progress calculation.\n     * Non-timegroup temporal elements use their local time (ownCurrentTimeMs)\n     */\n    get currentTimeMs() {\n      return this.ownCurrentTimeMs;\n    }\n\n    set currentTimeMs(value: number) {\n      // If we have a playback controller, delegate to it\n      if (this.playbackController) {\n        this.playbackController.currentTime = value / 1000;\n        return;\n      }\n\n      // If we have a root timegroup, delegate to it\n      if (\n        this.rootTimegroup &&\n        this.rootTimegroup !== (this as any as EFTimegroup)\n      ) {\n        this.rootTimegroup.currentTimeMs = value;\n      } else {\n        // We are the root, store the time locally\n        this.#currentTimeMs = value;\n        this.requestUpdate(\"currentTimeMs\");\n      }\n    }\n\n    /**\n     * Used to calculate the internal currentTimeMs of the element. This is useful\n     * for mapping to internal media time codes for audio/video elements.\n     */\n    get currentSourceTimeMs() {\n      const leadingTrimMs = this.sourceInMs || this.trimStartMs || 0;\n      return this.ownCurrentTimeMs + leadingTrimMs;\n    }\n\n    frameTask = new Task(this, {\n      autoRun: EF_INTERACTIVE,\n      args: () => [this.ownCurrentTimeMs] as const,\n      task: async ([], { signal: _signal }) => {\n        let fullyUpdated = await this.updateComplete;\n        while (!fullyUpdated) {\n          fullyUpdated = await this.updateComplete;\n        }\n      },\n    });\n\n    didBecomeRoot() {\n      if (!this.playbackController) {\n        this.playbackController = new PlaybackController(this as any);\n        if (this.#loop) {\n          this.playbackController.setLoop(this.#loop);\n        }\n      }\n    }\n\n    didBecomeChild() {\n      if (this.playbackController) {\n        this.playbackController.remove();\n        this.playbackController = undefined;\n      }\n    }\n  }\n\n  Object.defineProperty(TemporalMixinClass.prototype, EF_TEMPORAL, {\n    value: true,\n  });\n\n  return TemporalMixinClass as unknown as Constructor<TemporalMixinInterface> &\n    T;\n};\n"],"mappings":"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"}

package/dist/elements/EFThumbnailStrip.d.ts

@@ -1,12 +1,12 @@
 import { EFVideo } from "./EFVideo.js";
-import * as lit22 from "lit";
+import * as lit25 from "lit";
 import { LitElement } from "lit";
-import * as lit_html19 from "lit-html";
+import * as lit_html22 from "lit-html";
 import * as lit_html_directives_ref6 from "lit-html/directives/ref";
 
 //#region src/elements/EFThumbnailStrip.d.ts
 declare class EFThumbnailStrip extends LitElement {
-  static styles: lit22.CSSResult[];
+  static styles: lit25.CSSResult[];
   canvasRef: lit_html_directives_ref6.Ref<HTMLCanvasElement>;
   private _targetController;
   private _targetElement;
@@ -82,7 +82,7 @@ declare class EFThumbnailStrip extends LitElement {
    * Convert Canvas to ImageData for caching
    */
   private canvasToImageData;
-  render(): lit_html19.TemplateResult<1>;
+  render(): lit_html22.TemplateResult<1>;
 }
 declare global {
   interface HTMLElementTagNameMap {

package/dist/elements/EFTimegroup.d.ts

@@ -10,6 +10,13 @@ import * as lit_html0 from "lit-html";
 declare global {
   var EF_DEV_WORKBENCH: boolean | undefined;
 }
+type FrameTaskCallback = (info: {
+  ownCurrentTimeMs: number;
+  currentTimeMs: number;
+  durationMs: number;
+  percentComplete: number;
+  element: EFTimegroup;
+}) => void | Promise<void>;
 declare const EFTimegroup_base: (new (...args: any[]) => TemporalMixinInterface) & typeof LitElement;
 declare class EFTimegroup extends EFTimegroup_base {
   #private;
@@ -51,6 +58,21 @@ declare class EFTimegroup extends EFTimegroup_base {
    * Determines if this is a root timegroup (no parent timegroups)
    */
   get isRootTimegroup(): boolean;
+  /**
+   * Register a custom frame task callback that will be executed during frame rendering.
+   * The callback receives timing information and can be async or sync.
+   * Multiple callbacks can be registered and will execute in parallel.
+   *
+   * @param callback - Function to execute on each frame
+   * @returns A cleanup function that removes the callback when called
+   */
+  addFrameTask(callback: FrameTaskCallback): () => void;
+  /**
+   * Remove a previously registered custom frame task callback.
+   *
+   * @param callback - The callback function to remove
+   */
+  removeFrameTask(callback: FrameTaskCallback): void;
   saveTimeToLocalStorage(time: number): void;
   render(): lit_html0.TemplateResult<1>;
   loadTimeFromLocalStorage(): number | undefined;

package/dist/elements/EFTimegroup.js

@@ -53,8 +53,10 @@ let EFTimegroup = class EFTimegroup$1 extends EFTargetable(EFTemporal(TWMixin(Li
 					currentTimeMs
 				}, void 0, async () => {
 					await this.waitForFrameTasks();
+					await this.#executeCustomFrameTasks();
 					updateAnimations(this);
 				});
+				else await this.#executeCustomFrameTasks();
 			}
 		});
 		this.seekTask = new Task(this, {
@@ -124,6 +126,7 @@ let EFTimegroup = class EFTimegroup$1 extends EFTargetable(EFTemporal(TWMixin(Li
 	#seekInProgress = false;
 	#pendingSeekTime;
 	#processingPendingSeek = false;
+	#customFrameTasks = /* @__PURE__ */ new Set();
 	/**
 	* Get the effective FPS for this timegroup.
 	* During rendering, uses the render options FPS if available.
@@ -215,6 +218,29 @@ let EFTimegroup = class EFTimegroup$1 extends EFTargetable(EFTemporal(TWMixin(Li
 	get isRootTimegroup() {
 		return !this.parentTimegroup;
 	}
+	/**
+	* Register a custom frame task callback that will be executed during frame rendering.
+	* The callback receives timing information and can be async or sync.
+	* Multiple callbacks can be registered and will execute in parallel.
+	*
+	* @param callback - Function to execute on each frame
+	* @returns A cleanup function that removes the callback when called
+	*/
+	addFrameTask(callback) {
+		if (typeof callback !== "function") throw new Error("Frame task callback must be a function");
+		this.#customFrameTasks.add(callback);
+		return () => {
+			this.#customFrameTasks.delete(callback);
+		};
+	}
+	/**
+	* Remove a previously registered custom frame task callback.
+	*
+	* @param callback - The callback function to remove
+	*/
+	removeFrameTask(callback) {
+		this.#customFrameTasks.delete(callback);
+	}
 	saveTimeToLocalStorage(time) {
 		try {
 			if (this.id && this.isConnected && !Number.isNaN(time)) localStorage.setItem(this.storageKey, time.toString());
@@ -472,6 +498,19 @@ let EFTimegroup = class EFTimegroup$1 extends EFTargetable(EFTemporal(TWMixin(Li
 			if ("productionSrc" in el && el.productionSrc instanceof Function) el.setAttribute("src", el.productionSrc());
 		});
 	}
+	async #executeCustomFrameTasks() {
+		if (this.#customFrameTasks.size > 0) {
+			const percentComplete = this.durationMs > 0 ? this.ownCurrentTimeMs / this.durationMs : 0;
+			const frameInfo = {
+				ownCurrentTimeMs: this.ownCurrentTimeMs,
+				currentTimeMs: this.currentTimeMs,
+				durationMs: this.durationMs,
+				percentComplete,
+				element: this
+			};
+			await Promise.all(Array.from(this.#customFrameTasks).map((callback) => Promise.resolve(callback(frameInfo))));
+		}
+	}
 };
 __decorate([provide({ context: timegroupContext })], EFTimegroup.prototype, "_timeGroupContext", void 0);
 __decorate([provide({ context: efContext })], EFTimegroup.prototype, "efContext", void 0);

package/dist/elements/EFTimegroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTimegroup.js","names":["sequenceDurationCache: WeakMap<EFTimegroup, number>","EFTimegroup","#pendingSeekTime","#currentTime","#seekInProgress","#processingPendingSeek","#handleSlotChange","#previousDurationMs","#resizeObserver","#waitForMediaDurations","loaderTasks: Promise<any>[]"],"sources":["../../src/elements/EFTimegroup.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { Task, TaskStatus } from \"@lit/task\";\nimport debug from \"debug\";\nimport { css, html, LitElement, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\n\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { EF_RENDERING } from \"../EF_RENDERING.js\";\nimport { isContextMixin } from \"../gui/ContextMixin.js\";\nimport { efContext } from \"../gui/efContext.js\";\nimport { TWMixin } from \"../gui/TWMixin.js\";\nimport { isTracingEnabled, withSpan } from \"../otel/tracingHelpers.js\";\nimport { deepGetMediaElements, type EFMedia } from \"./EFMedia.js\";\nimport {\n  deepGetElementsWithFrameTasks,\n  EFTemporal,\n  flushStartTimeMsCache,\n  resetTemporalCache,\n  shallowGetTemporalElements,\n  timegroupContext,\n} from \"./EFTemporal.js\";\nimport { parseTimeToMs } from \"./parseTimeToMs.js\";\nimport { renderTemporalAudio } from \"./renderTemporalAudio.js\";\nimport { EFTargetable } from \"./TargetController.js\";\nimport { TimegroupController } from \"./TimegroupController.js\";\nimport {\n  evaluateTemporalStateForAnimation,\n  updateAnimations,\n} from \"./updateAnimations.ts\";\n\ndeclare global {\n  var EF_DEV_WORKBENCH: boolean | undefined;\n}\n\nconst log = debug(\"ef:elements:EFTimegroup\");\n\n// Cache for sequence mode duration calculations to avoid O(n) recalculation\nlet sequenceDurationCache: WeakMap<EFTimegroup, number> = new WeakMap();\n\nexport const flushSequenceDurationCache = () => {\n  sequenceDurationCache = new WeakMap();\n};\n\nexport const shallowGetTimegroups = (\n  element: Element,\n  groups: EFTimegroup[] = [],\n) => {\n  for (const child of Array.from(element.children)) {\n    if (child instanceof EFTimegroup) {\n      groups.push(child);\n    } else {\n      shallowGetTimegroups(child, groups);\n    }\n  }\n  return groups;\n};\n\n@customElement(\"ef-timegroup\")\nexport class EFTimegroup extends EFTargetable(EFTemporal(TWMixin(LitElement))) {\n  static get observedAttributes(): string[] {\n    // biome-ignore lint/complexity/noThisInStatic: It's okay to use this here\n    const parentAttributes = super.observedAttributes || [];\n    return [\n      ...parentAttributes,\n      \"mode\",\n      \"overlap\",\n      \"currenttime\",\n      \"fit\",\n      \"fps\",\n    ];\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n      position: relative;\n      overflow: hidden;\n    }\n\n    ::slotted(ef-timegroup) {\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      left: 0;\n      overflow: initial;\n    }\n  `;\n\n  @provide({ context: timegroupContext })\n  _timeGroupContext = this;\n\n  @provide({ context: efContext })\n  efContext = this;\n\n  mode: \"fit\" | \"fixed\" | \"sequence\" | \"contain\" = \"contain\";\n  overlapMs = 0;\n\n  @property({ type: Number })\n  fps = 30;\n\n  attributeChangedCallback(\n    name: string,\n    old: string | null,\n    value: string | null,\n  ): void {\n    if (name === \"mode\" && value) {\n      this.mode = value as typeof this.mode;\n    }\n    if (name === \"overlap\" && value) {\n      this.overlapMs = parseTimeToMs(value);\n    }\n    if (name === \"fps\" && value) {\n      this.fps = Number.parseFloat(value);\n    }\n    super.attributeChangedCallback(name, old, value);\n  }\n\n  @property({ type: String })\n  fit: \"none\" | \"contain\" | \"cover\" = \"none\";\n\n  #resizeObserver?: ResizeObserver;\n\n  #currentTime: number | undefined = undefined;\n  #seekInProgress = false;\n  #pendingSeekTime: number | undefined;\n  #processingPendingSeek = false;\n\n  /**\n   * Get the effective FPS for this timegroup.\n   * During rendering, uses the render options FPS if available.\n   * Otherwise uses the configured fps property.\n   */\n  get effectiveFps(): number {\n    // During rendering, prefer the render options FPS\n    if (typeof window !== \"undefined\" && window.EF_FRAMEGEN?.renderOptions) {\n      return window.EF_FRAMEGEN.renderOptions.encoderOptions.video.framerate;\n    }\n    return this.fps;\n  }\n\n  /**\n   * Quantize a time value to the nearest frame boundary based on effectiveFps.\n   * @param timeSeconds - Time in seconds\n   * @returns Time quantized to frame boundaries in seconds\n   */\n  private quantizeToFrameTime(timeSeconds: number): number {\n    const fps = this.effectiveFps;\n    if (!fps || fps <= 0) return timeSeconds;\n    const frameDurationS = 1 / fps;\n    return Math.round(timeSeconds / frameDurationS) * frameDurationS;\n  }\n\n  private async runThrottledFrameTask(): Promise<void> {\n    if (this.playbackController) {\n      return this.playbackController.runThrottledFrameTask();\n    }\n    await this.frameTask.run();\n  }\n\n  @property({ type: Number, attribute: \"currenttime\" })\n  set currentTime(time: number) {\n    // Quantize time to frame boundaries based on fps\n    // Do this BEFORE delegating to playbackController to ensure consistency\n    time = this.quantizeToFrameTime(time);\n\n    if (this.playbackController) {\n      this.playbackController.currentTime = time;\n      return;\n    }\n\n    time = Math.max(0, Math.min(this.durationMs / 1000, time));\n    if (!this.isRootTimegroup) {\n      return;\n    }\n    if (Number.isNaN(time)) {\n      return;\n    }\n    if (time === this.#currentTime && !this.#processingPendingSeek) {\n      return;\n    }\n    if (this.#pendingSeekTime === time) {\n      return;\n    }\n\n    if (this.#seekInProgress) {\n      this.#pendingSeekTime = time;\n      this.#currentTime = time;\n      return;\n    }\n\n    this.#currentTime = time;\n    this.#seekInProgress = true;\n\n    this.seekTask.run().finally(() => {\n      if (\n        this.#pendingSeekTime !== undefined &&\n        this.#pendingSeekTime !== time\n      ) {\n        const pendingTime = this.#pendingSeekTime;\n        this.#pendingSeekTime = undefined;\n        this.#processingPendingSeek = true;\n        try {\n          this.currentTime = pendingTime;\n        } finally {\n          this.#processingPendingSeek = false;\n        }\n      } else {\n        this.#pendingSeekTime = undefined;\n      }\n    });\n  }\n\n  get currentTime() {\n    if (this.playbackController) {\n      return this.playbackController.currentTime;\n    }\n    return this.#currentTime ?? 0;\n  }\n\n  set currentTimeMs(ms: number) {\n    this.currentTime = ms / 1000;\n  }\n\n  get currentTimeMs() {\n    return this.currentTime * 1000;\n  }\n\n  /**\n   * Seek to a specific time and wait for all frames to be ready.\n   * This is the recommended way to seek in tests and programmatic control.\n   *\n   * @param timeMs - Time in milliseconds to seek to\n   * @returns Promise that resolves when the seek is complete and all visible children are ready\n   */\n  async seek(timeMs: number): Promise<void> {\n    this.currentTimeMs = timeMs;\n    await this.seekTask.taskComplete;\n\n    // Handle localStorage when playbackController delegates seek\n    if (this.playbackController) {\n      this.saveTimeToLocalStorage(this.currentTime);\n    }\n\n    await this.frameTask.taskComplete;\n\n    // Ensure all visible elements have completed their reactive update cycles AND frame rendering\n    // waitForFrameTasks() calls frameTask.run() on children, but this may happen before child\n    // elements have processed property changes from requestUpdate(). To ensure frame data is\n    // accurate, we wait for updateComplete first, then ensure the frameTask has run with the\n    // updated properties. Elements like EFVideo provide waitForFrameReady() for this pattern.\n    const temporalElements = deepGetElementsWithFrameTasks(this);\n    const visibleElements = temporalElements.filter((element) => {\n      const animationState = evaluateTemporalStateForAnimation(element);\n      return animationState.isVisible;\n    });\n\n    await Promise.all(\n      visibleElements.map(async (element) => {\n        if (\n          \"waitForFrameReady\" in element &&\n          typeof element.waitForFrameReady === \"function\"\n        ) {\n          await (element as any).waitForFrameReady();\n        } else {\n          await element.updateComplete;\n        }\n      }),\n    );\n  }\n\n  /**\n   * Determines if this is a root timegroup (no parent timegroups)\n   */\n  get isRootTimegroup(): boolean {\n    return !this.parentTimegroup;\n  }\n\n  saveTimeToLocalStorage(time: number) {\n    try {\n      if (this.id && this.isConnected && !Number.isNaN(time)) {\n        localStorage.setItem(this.storageKey, time.toString());\n      }\n    } catch (error) {\n      log(\"Failed to save time to localStorage\", error);\n    }\n  }\n\n  render() {\n    return html`<slot @slotchange=${this.#handleSlotChange}></slot> `;\n  }\n\n  #handleSlotChange = () => {\n    // Invalidate caches when slot content changes\n    resetTemporalCache();\n    flushSequenceDurationCache();\n    flushStartTimeMsCache();\n\n    // Request update to trigger recalculation of dependent properties\n    this.requestUpdate();\n  };\n\n  loadTimeFromLocalStorage(): number | undefined {\n    if (this.id) {\n      try {\n        const storedValue = localStorage.getItem(this.storageKey);\n        if (storedValue === null) {\n          return undefined;\n        }\n        return Number.parseFloat(storedValue);\n      } catch (error) {\n        log(\"Failed to load time from localStorage\", error);\n      }\n    }\n    return undefined;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (!this.playbackController) {\n      this.waitForMediaDurations().then(() => {\n        if (this.id) {\n          const maybeLoadedTime = this.loadTimeFromLocalStorage();\n          if (maybeLoadedTime !== undefined) {\n            this.currentTime = maybeLoadedTime;\n          }\n        }\n        if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) {\n          this.seekTask.run();\n        }\n      });\n    }\n\n    if (this.parentTimegroup) {\n      new TimegroupController(this.parentTimegroup, this);\n    }\n\n    if (this.shouldWrapWithWorkbench()) {\n      this.wrapWithWorkbench();\n    }\n  }\n\n  #previousDurationMs = 0;\n\n  protected updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n\n    if (changedProperties.has(\"mode\") || changedProperties.has(\"overlapMs\")) {\n      sequenceDurationCache.delete(this);\n    }\n\n    if (this.#previousDurationMs !== this.durationMs) {\n      this.#previousDurationMs = this.durationMs;\n      this.runThrottledFrameTask();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#resizeObserver?.disconnect();\n  }\n\n  get storageKey() {\n    if (!this.id) {\n      throw new Error(\"Timegroup must have an id to use localStorage.\");\n    }\n    return `ef-timegroup-${this.id}`;\n  }\n\n  get intrinsicDurationMs() {\n    if (this.hasExplicitDuration) {\n      return this.explicitDurationMs;\n    }\n    return undefined;\n  }\n\n  get hasOwnDuration() {\n    return (\n      this.mode === \"contain\" ||\n      this.mode === \"sequence\" ||\n      (this.mode === \"fixed\" && this.hasExplicitDuration)\n    );\n  }\n\n  get durationMs(): number {\n    switch (this.mode) {\n      case \"fit\": {\n        if (!this.parentTimegroup) {\n          return 0;\n        }\n        return this.parentTimegroup.durationMs;\n      }\n      case \"fixed\":\n        return super.durationMs;\n      case \"sequence\": {\n        // Check cache first to avoid expensive O(n) recalculation\n        const cachedDuration = sequenceDurationCache.get(this);\n        if (cachedDuration !== undefined) {\n          return cachedDuration;\n        }\n\n        let duration = 0;\n        this.childTemporals.forEach((child, index) => {\n          if (child instanceof EFTimegroup && child.mode === \"fit\") {\n            return;\n          }\n          if (index > 0) {\n            duration -= this.overlapMs;\n          }\n          duration += child.durationMs;\n        });\n\n        // Cache the calculated duration\n        sequenceDurationCache.set(this, duration);\n        return duration;\n      }\n      case \"contain\": {\n        let maxDuration = 0;\n        for (const child of this.childTemporals) {\n          // fit timegroups look \"up\" to their parent timegroup for their duration\n          // so we need to skip them to avoid an infinite loop\n          if (child instanceof EFTimegroup && child.mode === \"fit\") {\n            continue;\n          }\n          if (!child.hasOwnDuration) {\n            continue;\n          }\n          maxDuration = Math.max(maxDuration, child.durationMs);\n        }\n        return maxDuration;\n      }\n      default:\n        throw new Error(`Invalid time mode: ${this.mode}`);\n    }\n  }\n\n  async getPendingFrameTasks(signal?: AbortSignal) {\n    await this.waitForNestedUpdates(signal);\n    signal?.throwIfAborted();\n    const temporals = deepGetElementsWithFrameTasks(this);\n\n    // Filter to only include temporally visible elements for frame processing\n    // (but keep all elements for duration calculations)\n    // Use the target timeline time if we're in the middle of seeking\n    const timelineTimeMs =\n      (this.#pendingSeekTime ?? this.#currentTime ?? 0) * 1000;\n    const activeTemporals = temporals.filter((temporal) => {\n      // Skip timeline filtering if temporal doesn't have timeline position info\n      if (!(\"startTimeMs\" in temporal) || !(\"endTimeMs\" in temporal)) {\n        return true; // Keep non-temporal elements\n      }\n\n      // Only process frame tasks for elements that overlap the current timeline\n      // Use same epsilon logic as seek task for consistency\n      const epsilon = 0.001; // 1µs offset to break ties at boundaries\n      const startTimeMs = (temporal as any).startTimeMs as number;\n      const endTimeMs = (temporal as any).endTimeMs as number;\n      const elementStartsBeforeEnd = startTimeMs <= timelineTimeMs + epsilon;\n      // Root timegroups should remain visible at exact end time, but other elements use exclusive end for clean transitions\n      const isRootTimegroup =\n        temporal.tagName.toLowerCase() === \"ef-timegroup\" &&\n        !(temporal as any).parentTimegroup;\n      const useInclusiveEnd = isRootTimegroup;\n      const elementEndsAfterStart = useInclusiveEnd\n        ? endTimeMs >= timelineTimeMs\n        : endTimeMs > timelineTimeMs;\n      return elementStartsBeforeEnd && elementEndsAfterStart;\n    });\n\n    const frameTasks = activeTemporals.map((temporal) => temporal.frameTask);\n    frameTasks.forEach((task) => {\n      task.run();\n    });\n\n    return frameTasks.filter((task) => task.status < TaskStatus.COMPLETE);\n  }\n\n  async waitForNestedUpdates(signal?: AbortSignal) {\n    const limit = 10;\n    let steps = 0;\n    let isComplete = true;\n    while (true) {\n      steps++;\n      if (steps > limit) {\n        throw new Error(\"Reached update depth limit.\");\n      }\n      isComplete = await this.updateComplete;\n      signal?.throwIfAborted();\n      if (isComplete) {\n        break;\n      }\n    }\n  }\n\n  async waitForFrameTasks() {\n    const result = await withSpan(\n      \"timegroup.waitForFrameTasks\",\n      {\n        timegroupId: this.id || \"unknown\",\n        mode: this.mode,\n      },\n      undefined,\n      async (span) => {\n        const innerStart = performance.now();\n\n        const temporalElements = deepGetElementsWithFrameTasks(this);\n        if (isTracingEnabled()) {\n          span.setAttribute(\"temporalElementsCount\", temporalElements.length);\n        }\n\n        // Filter to only include temporally visible elements for frame processing\n        // Use animation-friendly visibility to prevent animation jumps at exact boundaries\n        const visibleElements = temporalElements.filter((element) => {\n          const animationState = evaluateTemporalStateForAnimation(element);\n          return animationState.isVisible;\n        });\n        if (isTracingEnabled()) {\n          span.setAttribute(\"visibleElementsCount\", visibleElements.length);\n        }\n\n        const promiseStart = performance.now();\n\n        await Promise.all(\n          visibleElements.map((element) => element.frameTask.run()),\n        );\n        const promiseEnd = performance.now();\n\n        const innerEnd = performance.now();\n        if (isTracingEnabled()) {\n          span.setAttribute(\"actualInnerMs\", innerEnd - innerStart);\n          span.setAttribute(\"promiseAwaitMs\", promiseEnd - promiseStart);\n        }\n      },\n    );\n\n    return result;\n  }\n\n  mediaDurationsPromise: Promise<void> | undefined = undefined;\n\n  async waitForMediaDurations() {\n    if (!this.mediaDurationsPromise) {\n      this.mediaDurationsPromise = this.#waitForMediaDurations();\n    }\n    return this.mediaDurationsPromise;\n  }\n\n  /**\n   * Wait for all media elements to load their initial segments.\n   * Ideally we would only need the extracted index json data, but\n   * that caused issues with constructing audio data. We had negative durations\n   * in calculations and it was not clear why.\n   */\n  async #waitForMediaDurations() {\n    return withSpan(\n      \"timegroup.waitForMediaDurations\",\n      {\n        timegroupId: this.id || \"unknown\",\n        mode: this.mode,\n      },\n      undefined,\n      async (span) => {\n        // We must await updateComplete to ensure all media elements inside this are connected\n        // and will match deepGetMediaElements\n        await this.updateComplete;\n        const mediaElements = deepGetMediaElements(this);\n        if (isTracingEnabled()) {\n          span.setAttribute(\"mediaElementsCount\", mediaElements.length);\n        }\n\n        // Then, we must await the fragmentIndexTask to ensure all media elements have their\n        // fragment index loaded, which is where their duration is parsed from.\n        await Promise.all(\n          mediaElements.map((m) =>\n            m.mediaEngineTask.value\n              ? Promise.resolve()\n              : m.mediaEngineTask.run(),\n          ),\n        );\n\n        // After waiting for durations, we must force some updates to cascade and ensure all temporal elements\n        // have correct durations and start times. It is not ideal that we have to do this inside here,\n        // but it is the best current way to ensure that all temporal elements have correct durations and start times.\n\n        // Next, we must flush the startTimeMs cache to ensure all media elements have their\n        // startTimeMs parsed fresh, otherwise the startTimeMs is cached per animation frame.\n        flushStartTimeMsCache();\n\n        // Flush duration cache since child durations may have changed\n        flushSequenceDurationCache();\n\n        // Request an update to the currentTime of this group, ensuring that time updates will cascade\n        // down to children, forcing sequence groups to arrange correctly.\n        // This also makes the filmstrip update correctly.\n        this.requestUpdate(\"currentTime\");\n        // Finally, we must await updateComplete to ensure all temporal elements have their\n        // currentTime updated and all animations have run.\n\n        await this.updateComplete;\n      },\n    );\n  }\n\n  get childTemporals() {\n    return shallowGetTemporalElements(this);\n  }\n\n  get contextProvider() {\n    let parent = this.parentNode;\n    while (parent) {\n      if (isContextMixin(parent)) {\n        return parent;\n      }\n      parent = parent.parentNode;\n    }\n    return null;\n  }\n\n  /**\n   * Returns true if the timegroup should be wrapped with a workbench.\n   *\n   * A timegroup should be wrapped with a workbench if:\n   * - It's being rendered (EF_RENDERING), OR\n   * - It's in interactive mode (EF_INTERACTIVE) with the dev workbench flag set\n   *\n   * If the timegroup is already wrapped in a context provider like ef-preview,\n   * it should NOT be wrapped in a workbench.\n   */\n  shouldWrapWithWorkbench() {\n    const isRendering = EF_RENDERING?.() === true;\n\n    // During rendering, always wrap with workbench (needed by EF_FRAMEGEN)\n    if (isRendering) {\n      return (\n        this.closest(\"ef-timegroup\") === this &&\n        this.closest(\"ef-preview\") === null &&\n        this.closest(\"ef-workbench\") === null &&\n        this.closest(\"test-context\") === null\n      );\n    }\n\n    // During interactive mode, respect the dev workbench flag\n    if (!globalThis.EF_DEV_WORKBENCH) {\n      return false;\n    }\n\n    return (\n      EF_INTERACTIVE &&\n      this.closest(\"ef-timegroup\") === this &&\n      this.closest(\"ef-preview\") === null &&\n      this.closest(\"ef-workbench\") === null &&\n      this.closest(\"test-context\") === null\n    );\n  }\n\n  wrapWithWorkbench() {\n    const workbench = document.createElement(\"ef-workbench\");\n    this.parentElement?.append(workbench);\n    if (!this.hasAttribute(\"id\")) {\n      this.setAttribute(\"id\", \"root-this\");\n    }\n    this.setAttribute(\"slot\", \"canvas\");\n    workbench.append(this as unknown as Element);\n\n    const filmstrip = document.createElement(\"ef-filmstrip\");\n    filmstrip.setAttribute(\"slot\", \"timeline\");\n    filmstrip.setAttribute(\"target\", this.id);\n    workbench.append(filmstrip);\n  }\n\n  get efElements() {\n    return Array.from(\n      this.querySelectorAll(\n        \"ef-audio, ef-video, ef-image, ef-captions, ef-waveform\",\n      ),\n    );\n  }\n\n  /**\n   * Returns media elements for playback audio rendering\n   * For standalone media, returns [this]; for timegroups, returns all descendants\n   * Used by PlaybackController for audio-driven playback\n   */\n  getMediaElements(): EFMedia[] {\n    return deepGetMediaElements(this);\n  }\n\n  /**\n   * Render audio buffer for playback\n   * Called by PlaybackController during live playback\n   * Delegates to shared renderTemporalAudio utility for consistent behavior\n   */\n  async renderAudio(fromMs: number, toMs: number): Promise<AudioBuffer> {\n    return renderTemporalAudio(this, fromMs, toMs);\n  }\n\n  /**\n   * TEMPORARY TEST METHOD: Renders audio and immediately plays it back\n   * Usage: timegroup.testPlayAudio(0, 5000) // Play first 5 seconds\n   */\n  async testPlayAudio(fromMs: number, toMs: number) {\n    // Render the audio using the existing renderAudio method\n    const renderedBuffer = await this.renderAudio(fromMs, toMs);\n\n    // Create a regular AudioContext for playback\n    const playbackContext = new AudioContext();\n\n    // Create a buffer source and connect it\n    const bufferSource = playbackContext.createBufferSource();\n    bufferSource.buffer = renderedBuffer;\n    bufferSource.connect(playbackContext.destination);\n\n    // Start playback immediately\n    bufferSource.start(0);\n\n    // Return a promise that resolves when playback ends\n    return new Promise<void>((resolve) => {\n      bufferSource.onended = () => {\n        playbackContext.close();\n        resolve();\n      };\n    });\n  }\n\n  async loadMd5Sums() {\n    const efElements = this.efElements;\n    const loaderTasks: Promise<any>[] = [];\n    for (const el of efElements) {\n      const md5SumLoader = (el as any).md5SumLoader;\n      if (md5SumLoader instanceof Task) {\n        md5SumLoader.run();\n        loaderTasks.push(md5SumLoader.taskComplete);\n      }\n    }\n\n    await Promise.all(loaderTasks);\n\n    efElements.forEach((el) => {\n      if (\"productionSrc\" in el && el.productionSrc instanceof Function) {\n        el.setAttribute(\"src\", el.productionSrc());\n      }\n    });\n  }\n\n  frameTask = new Task(this, {\n    // autoRun: EF_INTERACTIVE,\n    autoRun: false,\n    args: () => [this.ownCurrentTimeMs, this.currentTimeMs] as const,\n    task: async ([ownCurrentTimeMs, currentTimeMs]) => {\n      if (this.isRootTimegroup) {\n        await withSpan(\n          \"timegroup.frameTask\",\n          {\n            timegroupId: this.id || \"unknown\",\n            ownCurrentTimeMs,\n            currentTimeMs,\n          },\n          undefined,\n          async () => {\n            await this.waitForFrameTasks();\n            updateAnimations(this);\n          },\n        );\n      }\n    },\n  });\n\n  seekTask = new Task(this, {\n    autoRun: false,\n    args: () => [this.#pendingSeekTime ?? this.#currentTime] as const,\n    onComplete: () => {},\n    task: async ([targetTime]) => {\n      if (this.playbackController) {\n        await this.playbackController.seekTask.taskComplete;\n        return this.currentTime;\n      }\n\n      if (!this.isRootTimegroup) {\n        return;\n      }\n      return withSpan(\n        \"timegroup.seekTask\",\n        {\n          timegroupId: this.id || \"unknown\",\n          targetTime: targetTime ?? 0,\n          durationMs: this.durationMs,\n        },\n        undefined,\n        async (span) => {\n          await this.waitForMediaDurations();\n          const newTime = Math.max(\n            0,\n            Math.min(targetTime ?? 0, this.durationMs / 1000),\n          );\n          if (isTracingEnabled()) {\n            span.setAttribute(\"newTime\", newTime);\n          }\n          // Apply the clamped time back to currentTime\n\n          this.#currentTime = newTime;\n          this.requestUpdate(\"currentTime\");\n          await this.runThrottledFrameTask();\n          this.saveTimeToLocalStorage(this.#currentTime);\n          this.#seekInProgress = false;\n          return newTime;\n        },\n      );\n    },\n  });\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-timegroup\": EFTimegroup & Element;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"EFTimegroup.js","names":["sequenceDurationCache: WeakMap<EFTimegroup, number>","EFTimegroup","#executeCustomFrameTasks","#pendingSeekTime","#currentTime","#seekInProgress","#processingPendingSeek","#customFrameTasks","#handleSlotChange","#previousDurationMs","#resizeObserver","#waitForMediaDurations","loaderTasks: Promise<any>[]"],"sources":["../../src/elements/EFTimegroup.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { Task, TaskStatus } from \"@lit/task\";\nimport debug from \"debug\";\nimport { css, html, LitElement, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\n\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { EF_RENDERING } from \"../EF_RENDERING.js\";\nimport { isContextMixin } from \"../gui/ContextMixin.js\";\nimport { efContext } from \"../gui/efContext.js\";\nimport { TWMixin } from \"../gui/TWMixin.js\";\nimport { isTracingEnabled, withSpan } from \"../otel/tracingHelpers.js\";\nimport { deepGetMediaElements, type EFMedia } from \"./EFMedia.js\";\nimport {\n  deepGetElementsWithFrameTasks,\n  EFTemporal,\n  flushStartTimeMsCache,\n  resetTemporalCache,\n  shallowGetTemporalElements,\n  timegroupContext,\n} from \"./EFTemporal.js\";\nimport { parseTimeToMs } from \"./parseTimeToMs.js\";\nimport { renderTemporalAudio } from \"./renderTemporalAudio.js\";\nimport { EFTargetable } from \"./TargetController.js\";\nimport { TimegroupController } from \"./TimegroupController.js\";\nimport {\n  evaluateTemporalStateForAnimation,\n  updateAnimations,\n} from \"./updateAnimations.ts\";\n\ndeclare global {\n  var EF_DEV_WORKBENCH: boolean | undefined;\n}\n\nconst log = debug(\"ef:elements:EFTimegroup\");\n\n// Custom frame task callback type\nexport type FrameTaskCallback = (info: {\n  ownCurrentTimeMs: number;\n  currentTimeMs: number;\n  durationMs: number;\n  percentComplete: number;\n  element: EFTimegroup;\n}) => void | Promise<void>;\n\n// Cache for sequence mode duration calculations to avoid O(n) recalculation\nlet sequenceDurationCache: WeakMap<EFTimegroup, number> = new WeakMap();\n\nexport const flushSequenceDurationCache = () => {\n  sequenceDurationCache = new WeakMap();\n};\n\nexport const shallowGetTimegroups = (\n  element: Element,\n  groups: EFTimegroup[] = [],\n) => {\n  for (const child of Array.from(element.children)) {\n    if (child instanceof EFTimegroup) {\n      groups.push(child);\n    } else {\n      shallowGetTimegroups(child, groups);\n    }\n  }\n  return groups;\n};\n\n@customElement(\"ef-timegroup\")\nexport class EFTimegroup extends EFTargetable(EFTemporal(TWMixin(LitElement))) {\n  static get observedAttributes(): string[] {\n    // biome-ignore lint/complexity/noThisInStatic: It's okay to use this here\n    const parentAttributes = super.observedAttributes || [];\n    return [\n      ...parentAttributes,\n      \"mode\",\n      \"overlap\",\n      \"currenttime\",\n      \"fit\",\n      \"fps\",\n    ];\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n      position: relative;\n      overflow: hidden;\n    }\n\n    ::slotted(ef-timegroup) {\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      left: 0;\n      overflow: initial;\n    }\n  `;\n\n  @provide({ context: timegroupContext })\n  _timeGroupContext = this;\n\n  @provide({ context: efContext })\n  efContext = this;\n\n  mode: \"fit\" | \"fixed\" | \"sequence\" | \"contain\" = \"contain\";\n  overlapMs = 0;\n\n  @property({ type: Number })\n  fps = 30;\n\n  attributeChangedCallback(\n    name: string,\n    old: string | null,\n    value: string | null,\n  ): void {\n    if (name === \"mode\" && value) {\n      this.mode = value as typeof this.mode;\n    }\n    if (name === \"overlap\" && value) {\n      this.overlapMs = parseTimeToMs(value);\n    }\n    if (name === \"fps\" && value) {\n      this.fps = Number.parseFloat(value);\n    }\n    super.attributeChangedCallback(name, old, value);\n  }\n\n  @property({ type: String })\n  fit: \"none\" | \"contain\" | \"cover\" = \"none\";\n\n  #resizeObserver?: ResizeObserver;\n\n  #currentTime: number | undefined = undefined;\n  #seekInProgress = false;\n  #pendingSeekTime: number | undefined;\n  #processingPendingSeek = false;\n  #customFrameTasks: Set<FrameTaskCallback> = new Set();\n\n  /**\n   * Get the effective FPS for this timegroup.\n   * During rendering, uses the render options FPS if available.\n   * Otherwise uses the configured fps property.\n   */\n  get effectiveFps(): number {\n    // During rendering, prefer the render options FPS\n    if (typeof window !== \"undefined\" && window.EF_FRAMEGEN?.renderOptions) {\n      return window.EF_FRAMEGEN.renderOptions.encoderOptions.video.framerate;\n    }\n    return this.fps;\n  }\n\n  /**\n   * Quantize a time value to the nearest frame boundary based on effectiveFps.\n   * @param timeSeconds - Time in seconds\n   * @returns Time quantized to frame boundaries in seconds\n   */\n  private quantizeToFrameTime(timeSeconds: number): number {\n    const fps = this.effectiveFps;\n    if (!fps || fps <= 0) return timeSeconds;\n    const frameDurationS = 1 / fps;\n    return Math.round(timeSeconds / frameDurationS) * frameDurationS;\n  }\n\n  private async runThrottledFrameTask(): Promise<void> {\n    if (this.playbackController) {\n      return this.playbackController.runThrottledFrameTask();\n    }\n    await this.frameTask.run();\n  }\n\n  @property({ type: Number, attribute: \"currenttime\" })\n  set currentTime(time: number) {\n    // Quantize time to frame boundaries based on fps\n    // Do this BEFORE delegating to playbackController to ensure consistency\n    time = this.quantizeToFrameTime(time);\n\n    if (this.playbackController) {\n      this.playbackController.currentTime = time;\n      return;\n    }\n\n    time = Math.max(0, Math.min(this.durationMs / 1000, time));\n    if (!this.isRootTimegroup) {\n      return;\n    }\n    if (Number.isNaN(time)) {\n      return;\n    }\n    if (time === this.#currentTime && !this.#processingPendingSeek) {\n      return;\n    }\n    if (this.#pendingSeekTime === time) {\n      return;\n    }\n\n    if (this.#seekInProgress) {\n      this.#pendingSeekTime = time;\n      this.#currentTime = time;\n      return;\n    }\n\n    this.#currentTime = time;\n    this.#seekInProgress = true;\n\n    this.seekTask.run().finally(() => {\n      if (\n        this.#pendingSeekTime !== undefined &&\n        this.#pendingSeekTime !== time\n      ) {\n        const pendingTime = this.#pendingSeekTime;\n        this.#pendingSeekTime = undefined;\n        this.#processingPendingSeek = true;\n        try {\n          this.currentTime = pendingTime;\n        } finally {\n          this.#processingPendingSeek = false;\n        }\n      } else {\n        this.#pendingSeekTime = undefined;\n      }\n    });\n  }\n\n  get currentTime() {\n    if (this.playbackController) {\n      return this.playbackController.currentTime;\n    }\n    return this.#currentTime ?? 0;\n  }\n\n  set currentTimeMs(ms: number) {\n    this.currentTime = ms / 1000;\n  }\n\n  get currentTimeMs() {\n    return this.currentTime * 1000;\n  }\n\n  /**\n   * Seek to a specific time and wait for all frames to be ready.\n   * This is the recommended way to seek in tests and programmatic control.\n   *\n   * @param timeMs - Time in milliseconds to seek to\n   * @returns Promise that resolves when the seek is complete and all visible children are ready\n   */\n  async seek(timeMs: number): Promise<void> {\n    this.currentTimeMs = timeMs;\n    await this.seekTask.taskComplete;\n\n    // Handle localStorage when playbackController delegates seek\n    if (this.playbackController) {\n      this.saveTimeToLocalStorage(this.currentTime);\n    }\n\n    await this.frameTask.taskComplete;\n\n    // Ensure all visible elements have completed their reactive update cycles AND frame rendering\n    // waitForFrameTasks() calls frameTask.run() on children, but this may happen before child\n    // elements have processed property changes from requestUpdate(). To ensure frame data is\n    // accurate, we wait for updateComplete first, then ensure the frameTask has run with the\n    // updated properties. Elements like EFVideo provide waitForFrameReady() for this pattern.\n    const temporalElements = deepGetElementsWithFrameTasks(this);\n    const visibleElements = temporalElements.filter((element) => {\n      const animationState = evaluateTemporalStateForAnimation(element);\n      return animationState.isVisible;\n    });\n\n    await Promise.all(\n      visibleElements.map(async (element) => {\n        if (\n          \"waitForFrameReady\" in element &&\n          typeof element.waitForFrameReady === \"function\"\n        ) {\n          await (element as any).waitForFrameReady();\n        } else {\n          await element.updateComplete;\n        }\n      }),\n    );\n  }\n\n  /**\n   * Determines if this is a root timegroup (no parent timegroups)\n   */\n  get isRootTimegroup(): boolean {\n    return !this.parentTimegroup;\n  }\n\n  /**\n   * Register a custom frame task callback that will be executed during frame rendering.\n   * The callback receives timing information and can be async or sync.\n   * Multiple callbacks can be registered and will execute in parallel.\n   *\n   * @param callback - Function to execute on each frame\n   * @returns A cleanup function that removes the callback when called\n   */\n  addFrameTask(callback: FrameTaskCallback): () => void {\n    if (typeof callback !== \"function\") {\n      throw new Error(\"Frame task callback must be a function\");\n    }\n    this.#customFrameTasks.add(callback);\n    return () => {\n      this.#customFrameTasks.delete(callback);\n    };\n  }\n\n  /**\n   * Remove a previously registered custom frame task callback.\n   *\n   * @param callback - The callback function to remove\n   */\n  removeFrameTask(callback: FrameTaskCallback): void {\n    this.#customFrameTasks.delete(callback);\n  }\n\n  saveTimeToLocalStorage(time: number) {\n    try {\n      if (this.id && this.isConnected && !Number.isNaN(time)) {\n        localStorage.setItem(this.storageKey, time.toString());\n      }\n    } catch (error) {\n      log(\"Failed to save time to localStorage\", error);\n    }\n  }\n\n  render() {\n    return html`<slot @slotchange=${this.#handleSlotChange}></slot> `;\n  }\n\n  #handleSlotChange = () => {\n    // Invalidate caches when slot content changes\n    resetTemporalCache();\n    flushSequenceDurationCache();\n    flushStartTimeMsCache();\n\n    // Request update to trigger recalculation of dependent properties\n    this.requestUpdate();\n  };\n\n  loadTimeFromLocalStorage(): number | undefined {\n    if (this.id) {\n      try {\n        const storedValue = localStorage.getItem(this.storageKey);\n        if (storedValue === null) {\n          return undefined;\n        }\n        return Number.parseFloat(storedValue);\n      } catch (error) {\n        log(\"Failed to load time from localStorage\", error);\n      }\n    }\n    return undefined;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (!this.playbackController) {\n      this.waitForMediaDurations().then(() => {\n        if (this.id) {\n          const maybeLoadedTime = this.loadTimeFromLocalStorage();\n          if (maybeLoadedTime !== undefined) {\n            this.currentTime = maybeLoadedTime;\n          }\n        }\n        if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) {\n          this.seekTask.run();\n        }\n      });\n    }\n\n    if (this.parentTimegroup) {\n      new TimegroupController(this.parentTimegroup, this);\n    }\n\n    if (this.shouldWrapWithWorkbench()) {\n      this.wrapWithWorkbench();\n    }\n  }\n\n  #previousDurationMs = 0;\n\n  protected updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n\n    if (changedProperties.has(\"mode\") || changedProperties.has(\"overlapMs\")) {\n      sequenceDurationCache.delete(this);\n    }\n\n    if (this.#previousDurationMs !== this.durationMs) {\n      this.#previousDurationMs = this.durationMs;\n      this.runThrottledFrameTask();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#resizeObserver?.disconnect();\n  }\n\n  get storageKey() {\n    if (!this.id) {\n      throw new Error(\"Timegroup must have an id to use localStorage.\");\n    }\n    return `ef-timegroup-${this.id}`;\n  }\n\n  get intrinsicDurationMs() {\n    if (this.hasExplicitDuration) {\n      return this.explicitDurationMs;\n    }\n    return undefined;\n  }\n\n  get hasOwnDuration() {\n    return (\n      this.mode === \"contain\" ||\n      this.mode === \"sequence\" ||\n      (this.mode === \"fixed\" && this.hasExplicitDuration)\n    );\n  }\n\n  get durationMs(): number {\n    switch (this.mode) {\n      case \"fit\": {\n        if (!this.parentTimegroup) {\n          return 0;\n        }\n        return this.parentTimegroup.durationMs;\n      }\n      case \"fixed\":\n        return super.durationMs;\n      case \"sequence\": {\n        // Check cache first to avoid expensive O(n) recalculation\n        const cachedDuration = sequenceDurationCache.get(this);\n        if (cachedDuration !== undefined) {\n          return cachedDuration;\n        }\n\n        let duration = 0;\n        this.childTemporals.forEach((child, index) => {\n          if (child instanceof EFTimegroup && child.mode === \"fit\") {\n            return;\n          }\n          if (index > 0) {\n            duration -= this.overlapMs;\n          }\n          duration += child.durationMs;\n        });\n\n        // Cache the calculated duration\n        sequenceDurationCache.set(this, duration);\n        return duration;\n      }\n      case \"contain\": {\n        let maxDuration = 0;\n        for (const child of this.childTemporals) {\n          // fit timegroups look \"up\" to their parent timegroup for their duration\n          // so we need to skip them to avoid an infinite loop\n          if (child instanceof EFTimegroup && child.mode === \"fit\") {\n            continue;\n          }\n          if (!child.hasOwnDuration) {\n            continue;\n          }\n          maxDuration = Math.max(maxDuration, child.durationMs);\n        }\n        return maxDuration;\n      }\n      default:\n        throw new Error(`Invalid time mode: ${this.mode}`);\n    }\n  }\n\n  async getPendingFrameTasks(signal?: AbortSignal) {\n    await this.waitForNestedUpdates(signal);\n    signal?.throwIfAborted();\n    const temporals = deepGetElementsWithFrameTasks(this);\n\n    // Filter to only include temporally visible elements for frame processing\n    // (but keep all elements for duration calculations)\n    // Use the target timeline time if we're in the middle of seeking\n    const timelineTimeMs =\n      (this.#pendingSeekTime ?? this.#currentTime ?? 0) * 1000;\n    const activeTemporals = temporals.filter((temporal) => {\n      // Skip timeline filtering if temporal doesn't have timeline position info\n      if (!(\"startTimeMs\" in temporal) || !(\"endTimeMs\" in temporal)) {\n        return true; // Keep non-temporal elements\n      }\n\n      // Only process frame tasks for elements that overlap the current timeline\n      // Use same epsilon logic as seek task for consistency\n      const epsilon = 0.001; // 1µs offset to break ties at boundaries\n      const startTimeMs = (temporal as any).startTimeMs as number;\n      const endTimeMs = (temporal as any).endTimeMs as number;\n      const elementStartsBeforeEnd = startTimeMs <= timelineTimeMs + epsilon;\n      // Root timegroups should remain visible at exact end time, but other elements use exclusive end for clean transitions\n      const isRootTimegroup =\n        temporal.tagName.toLowerCase() === \"ef-timegroup\" &&\n        !(temporal as any).parentTimegroup;\n      const useInclusiveEnd = isRootTimegroup;\n      const elementEndsAfterStart = useInclusiveEnd\n        ? endTimeMs >= timelineTimeMs\n        : endTimeMs > timelineTimeMs;\n      return elementStartsBeforeEnd && elementEndsAfterStart;\n    });\n\n    const frameTasks = activeTemporals.map((temporal) => temporal.frameTask);\n    frameTasks.forEach((task) => {\n      task.run();\n    });\n\n    return frameTasks.filter((task) => task.status < TaskStatus.COMPLETE);\n  }\n\n  async waitForNestedUpdates(signal?: AbortSignal) {\n    const limit = 10;\n    let steps = 0;\n    let isComplete = true;\n    while (true) {\n      steps++;\n      if (steps > limit) {\n        throw new Error(\"Reached update depth limit.\");\n      }\n      isComplete = await this.updateComplete;\n      signal?.throwIfAborted();\n      if (isComplete) {\n        break;\n      }\n    }\n  }\n\n  async waitForFrameTasks() {\n    const result = await withSpan(\n      \"timegroup.waitForFrameTasks\",\n      {\n        timegroupId: this.id || \"unknown\",\n        mode: this.mode,\n      },\n      undefined,\n      async (span) => {\n        const innerStart = performance.now();\n\n        const temporalElements = deepGetElementsWithFrameTasks(this);\n        if (isTracingEnabled()) {\n          span.setAttribute(\"temporalElementsCount\", temporalElements.length);\n        }\n\n        // Filter to only include temporally visible elements for frame processing\n        // Use animation-friendly visibility to prevent animation jumps at exact boundaries\n        const visibleElements = temporalElements.filter((element) => {\n          const animationState = evaluateTemporalStateForAnimation(element);\n          return animationState.isVisible;\n        });\n        if (isTracingEnabled()) {\n          span.setAttribute(\"visibleElementsCount\", visibleElements.length);\n        }\n\n        const promiseStart = performance.now();\n\n        await Promise.all(\n          visibleElements.map((element) => element.frameTask.run()),\n        );\n        const promiseEnd = performance.now();\n\n        const innerEnd = performance.now();\n        if (isTracingEnabled()) {\n          span.setAttribute(\"actualInnerMs\", innerEnd - innerStart);\n          span.setAttribute(\"promiseAwaitMs\", promiseEnd - promiseStart);\n        }\n      },\n    );\n\n    return result;\n  }\n\n  mediaDurationsPromise: Promise<void> | undefined = undefined;\n\n  async waitForMediaDurations() {\n    if (!this.mediaDurationsPromise) {\n      this.mediaDurationsPromise = this.#waitForMediaDurations();\n    }\n    return this.mediaDurationsPromise;\n  }\n\n  /**\n   * Wait for all media elements to load their initial segments.\n   * Ideally we would only need the extracted index json data, but\n   * that caused issues with constructing audio data. We had negative durations\n   * in calculations and it was not clear why.\n   */\n  async #waitForMediaDurations() {\n    return withSpan(\n      \"timegroup.waitForMediaDurations\",\n      {\n        timegroupId: this.id || \"unknown\",\n        mode: this.mode,\n      },\n      undefined,\n      async (span) => {\n        // We must await updateComplete to ensure all media elements inside this are connected\n        // and will match deepGetMediaElements\n        await this.updateComplete;\n        const mediaElements = deepGetMediaElements(this);\n        if (isTracingEnabled()) {\n          span.setAttribute(\"mediaElementsCount\", mediaElements.length);\n        }\n\n        // Then, we must await the fragmentIndexTask to ensure all media elements have their\n        // fragment index loaded, which is where their duration is parsed from.\n        await Promise.all(\n          mediaElements.map((m) =>\n            m.mediaEngineTask.value\n              ? Promise.resolve()\n              : m.mediaEngineTask.run(),\n          ),\n        );\n\n        // After waiting for durations, we must force some updates to cascade and ensure all temporal elements\n        // have correct durations and start times. It is not ideal that we have to do this inside here,\n        // but it is the best current way to ensure that all temporal elements have correct durations and start times.\n\n        // Next, we must flush the startTimeMs cache to ensure all media elements have their\n        // startTimeMs parsed fresh, otherwise the startTimeMs is cached per animation frame.\n        flushStartTimeMsCache();\n\n        // Flush duration cache since child durations may have changed\n        flushSequenceDurationCache();\n\n        // Request an update to the currentTime of this group, ensuring that time updates will cascade\n        // down to children, forcing sequence groups to arrange correctly.\n        // This also makes the filmstrip update correctly.\n        this.requestUpdate(\"currentTime\");\n        // Finally, we must await updateComplete to ensure all temporal elements have their\n        // currentTime updated and all animations have run.\n\n        await this.updateComplete;\n      },\n    );\n  }\n\n  get childTemporals() {\n    return shallowGetTemporalElements(this);\n  }\n\n  get contextProvider() {\n    let parent = this.parentNode;\n    while (parent) {\n      if (isContextMixin(parent)) {\n        return parent;\n      }\n      parent = parent.parentNode;\n    }\n    return null;\n  }\n\n  /**\n   * Returns true if the timegroup should be wrapped with a workbench.\n   *\n   * A timegroup should be wrapped with a workbench if:\n   * - It's being rendered (EF_RENDERING), OR\n   * - It's in interactive mode (EF_INTERACTIVE) with the dev workbench flag set\n   *\n   * If the timegroup is already wrapped in a context provider like ef-preview,\n   * it should NOT be wrapped in a workbench.\n   */\n  shouldWrapWithWorkbench() {\n    const isRendering = EF_RENDERING?.() === true;\n\n    // During rendering, always wrap with workbench (needed by EF_FRAMEGEN)\n    if (isRendering) {\n      return (\n        this.closest(\"ef-timegroup\") === this &&\n        this.closest(\"ef-preview\") === null &&\n        this.closest(\"ef-workbench\") === null &&\n        this.closest(\"test-context\") === null\n      );\n    }\n\n    // During interactive mode, respect the dev workbench flag\n    if (!globalThis.EF_DEV_WORKBENCH) {\n      return false;\n    }\n\n    return (\n      EF_INTERACTIVE &&\n      this.closest(\"ef-timegroup\") === this &&\n      this.closest(\"ef-preview\") === null &&\n      this.closest(\"ef-workbench\") === null &&\n      this.closest(\"test-context\") === null\n    );\n  }\n\n  wrapWithWorkbench() {\n    const workbench = document.createElement(\"ef-workbench\");\n    this.parentElement?.append(workbench);\n    if (!this.hasAttribute(\"id\")) {\n      this.setAttribute(\"id\", \"root-this\");\n    }\n    this.setAttribute(\"slot\", \"canvas\");\n    workbench.append(this as unknown as Element);\n\n    const filmstrip = document.createElement(\"ef-filmstrip\");\n    filmstrip.setAttribute(\"slot\", \"timeline\");\n    filmstrip.setAttribute(\"target\", this.id);\n    workbench.append(filmstrip);\n  }\n\n  get efElements() {\n    return Array.from(\n      this.querySelectorAll(\n        \"ef-audio, ef-video, ef-image, ef-captions, ef-waveform\",\n      ),\n    );\n  }\n\n  /**\n   * Returns media elements for playback audio rendering\n   * For standalone media, returns [this]; for timegroups, returns all descendants\n   * Used by PlaybackController for audio-driven playback\n   */\n  getMediaElements(): EFMedia[] {\n    return deepGetMediaElements(this);\n  }\n\n  /**\n   * Render audio buffer for playback\n   * Called by PlaybackController during live playback\n   * Delegates to shared renderTemporalAudio utility for consistent behavior\n   */\n  async renderAudio(fromMs: number, toMs: number): Promise<AudioBuffer> {\n    return renderTemporalAudio(this, fromMs, toMs);\n  }\n\n  /**\n   * TEMPORARY TEST METHOD: Renders audio and immediately plays it back\n   * Usage: timegroup.testPlayAudio(0, 5000) // Play first 5 seconds\n   */\n  async testPlayAudio(fromMs: number, toMs: number) {\n    // Render the audio using the existing renderAudio method\n    const renderedBuffer = await this.renderAudio(fromMs, toMs);\n\n    // Create a regular AudioContext for playback\n    const playbackContext = new AudioContext();\n\n    // Create a buffer source and connect it\n    const bufferSource = playbackContext.createBufferSource();\n    bufferSource.buffer = renderedBuffer;\n    bufferSource.connect(playbackContext.destination);\n\n    // Start playback immediately\n    bufferSource.start(0);\n\n    // Return a promise that resolves when playback ends\n    return new Promise<void>((resolve) => {\n      bufferSource.onended = () => {\n        playbackContext.close();\n        resolve();\n      };\n    });\n  }\n\n  async loadMd5Sums() {\n    const efElements = this.efElements;\n    const loaderTasks: Promise<any>[] = [];\n    for (const el of efElements) {\n      const md5SumLoader = (el as any).md5SumLoader;\n      if (md5SumLoader instanceof Task) {\n        md5SumLoader.run();\n        loaderTasks.push(md5SumLoader.taskComplete);\n      }\n    }\n\n    await Promise.all(loaderTasks);\n\n    efElements.forEach((el) => {\n      if (\"productionSrc\" in el && el.productionSrc instanceof Function) {\n        el.setAttribute(\"src\", el.productionSrc());\n      }\n    });\n  }\n\n  frameTask = new Task(this, {\n    // autoRun: EF_INTERACTIVE,\n    autoRun: false,\n    args: () => [this.ownCurrentTimeMs, this.currentTimeMs] as const,\n    task: async ([ownCurrentTimeMs, currentTimeMs]) => {\n      if (this.isRootTimegroup) {\n        await withSpan(\n          \"timegroup.frameTask\",\n          {\n            timegroupId: this.id || \"unknown\",\n            ownCurrentTimeMs,\n            currentTimeMs,\n          },\n          undefined,\n          async () => {\n            await this.waitForFrameTasks();\n            await this.#executeCustomFrameTasks();\n            updateAnimations(this);\n          },\n        );\n      } else {\n        // Non-root timegroups execute their custom frame tasks when called\n        await this.#executeCustomFrameTasks();\n      }\n    },\n  });\n\n  async #executeCustomFrameTasks() {\n    if (this.#customFrameTasks.size > 0) {\n      const percentComplete =\n        this.durationMs > 0 ? this.ownCurrentTimeMs / this.durationMs : 0;\n      const frameInfo = {\n        ownCurrentTimeMs: this.ownCurrentTimeMs,\n        currentTimeMs: this.currentTimeMs,\n        durationMs: this.durationMs,\n        percentComplete,\n        element: this,\n      };\n\n      await Promise.all(\n        Array.from(this.#customFrameTasks).map((callback) =>\n          Promise.resolve(callback(frameInfo)),\n        ),\n      );\n    }\n  }\n\n  seekTask = new Task(this, {\n    autoRun: false,\n    args: () => [this.#pendingSeekTime ?? this.#currentTime] as const,\n    onComplete: () => {},\n    task: async ([targetTime]) => {\n      if (this.playbackController) {\n        await this.playbackController.seekTask.taskComplete;\n        return this.currentTime;\n      }\n\n      if (!this.isRootTimegroup) {\n        return;\n      }\n      return withSpan(\n        \"timegroup.seekTask\",\n        {\n          timegroupId: this.id || \"unknown\",\n          targetTime: targetTime ?? 0,\n          durationMs: this.durationMs,\n        },\n        undefined,\n        async (span) => {\n          await this.waitForMediaDurations();\n          const newTime = Math.max(\n            0,\n            Math.min(targetTime ?? 0, this.durationMs / 1000),\n          );\n          if (isTracingEnabled()) {\n            span.setAttribute(\"newTime\", newTime);\n          }\n          // Apply the clamped time back to currentTime\n\n          this.#currentTime = newTime;\n          this.requestUpdate(\"currentTime\");\n          await this.runThrottledFrameTask();\n          this.saveTimeToLocalStorage(this.#currentTime);\n          this.#seekInProgress = false;\n          return newTime;\n        },\n      );\n    },\n  });\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-timegroup\": EFTimegroup & Element;\n  }\n}\n"],"mappings":"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"}

package/dist/elements/EFVideo.d.ts

@@ -4,10 +4,10 @@ import { MediaEngine } from "../transcoding/types/index.js";
 import { EFMedia } from "./EFMedia.js";
 import { VideoBufferState } from "./EFMedia/videoTasks/makeVideoBufferTask.js";
 import { Task } from "@lit/task";
-import * as lit3 from "lit";
+import * as lit2 from "lit";
 import { PropertyValueMap } from "lit";
 import * as mediabunny0 from "mediabunny";
-import * as lit_html3 from "lit-html";
+import * as lit_html2 from "lit-html";
 import * as lit_html_directives_ref0 from "lit-html/directives/ref";
 
 //#region src/elements/EFVideo.d.ts
@@ -21,7 +21,7 @@ interface LoadingState {
 }
 declare const EFVideo_base: typeof EFMedia;
 declare class EFVideo extends EFVideo_base {
-  static styles: lit3.CSSResult[];
+  static styles: lit2.CSSResult[];
   canvasRef: lit_html_directives_ref0.Ref<HTMLCanvasElement>;
   /**
    * Duration in milliseconds for video buffering ahead of current time
@@ -60,7 +60,7 @@ declare class EFVideo extends EFVideo_base {
   };
   constructor();
   protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
-  render(): lit_html3.TemplateResult<1>;
+  render(): lit_html2.TemplateResult<1>;
   get canvasElement(): HTMLCanvasElement | undefined;
   frameTask: Task<readonly [number], void>;
   /**

package/dist/elements/EFWaveform.d.ts

@@ -3,21 +3,21 @@ import { EFAudio } from "./EFAudio.js";
 import { EFVideo } from "./EFVideo.js";
 import { TargetController } from "./TargetController.js";
 import { Task } from "@lit/task";
-import * as lit9 from "lit";
+import * as lit8 from "lit";
 import { LitElement, PropertyValueMap } from "lit";
 import { Ref } from "lit/directives/ref.js";
-import * as lit_html9 from "lit-html";
+import * as lit_html8 from "lit-html";
 
 //#region src/elements/EFWaveform.d.ts
 declare const EFWaveform_base: (new (...args: any[]) => TemporalMixinInterface) & typeof LitElement;
 declare class EFWaveform extends EFWaveform_base {
-  static styles: lit9.CSSResult;
+  static styles: lit8.CSSResult;
   canvasRef: Ref<HTMLCanvasElement>;
   private ctx;
   private styleObserver;
   private resizeObserver?;
   private mutationObserver?;
-  render(): lit_html9.TemplateResult<1>;
+  render(): lit_html8.TemplateResult<1>;
   mode: "roundBars" | "bars" | "bricks" | "line" | "curve" | "pixel" | "wave" | "spikes";
   color: string;
   target: string;