@videojs/spf 10.0.0-beta.11 → 10.0.0-beta.13

package/dist/default/dom/features/sync-selected-text-track-from-dom.js

@@ -1,5 +1,6 @@
+import { effect } from "../../core/signals/effect.js";
+import { computed, update } from "../../core/signals/primitives.js";
 import { listen } from "@videojs/utils/dom";
-
 //#region src/dom/features/sync-selected-text-track-from-dom.ts
 /**
 * Sync selectedTextTrackId from DOM text track mode changes.
@@ -24,40 +25,30 @@ import { listen } from "@videojs/utils/dom";
 * const cleanup = syncSelectedTextTrackFromDom({ state, owners });
 */
 function syncSelectedTextTrackFromDom({ state, owners }) {
-	let lastMediaElement;
-	let removeListener = null;
-	const unsubscribe = owners.subscribe((currentOwners) => {
-		const { mediaElement } = currentOwners;
-		if (mediaElement === lastMediaElement) return;
-		removeListener?.();
-		removeListener = null;
-		lastMediaElement = mediaElement;
-		if (!mediaElement) return;
-		const sync = () => {
-			const newId = Array.from(mediaElement.textTracks).find((t) => t.mode === "showing" && (t.kind === "subtitles" || t.kind === "captions"))?.id || void 0;
-			const current = state.current;
+	const mediaElement = computed(() => owners.get().mediaElement);
+	return effect(() => {
+		const el = mediaElement.get();
+		if (!el) return;
+		return listen(el.textTracks, "change", () => {
+			const newId = Array.from(el.textTracks).find((t) => t.mode === "showing" && (t.kind === "subtitles" || t.kind === "captions"))?.id || void 0;
+			const current = state.get();
 			if (current.selectedTextTrackId === newId) return;
-			if (newId) state.patch({ selectedTextTrackId: newId });
+			if (newId) update(state, { selectedTextTrackId: newId });
 			else {
 				const prevId = current.selectedTextTrackId;
 				if (prevId && current.textBufferState?.[prevId]) {
 					const next = { ...current.textBufferState };
 					delete next[prevId];
-					state.patch({
+					update(state, {
 						selectedTextTrackId: void 0,
 						textBufferState: next
 					});
-				} else state.patch({ selectedTextTrackId: void 0 });
+				} else update(state, { selectedTextTrackId: void 0 });
 			}
-		};
-		removeListener = listen(mediaElement.textTracks, "change", sync);
+		});
 	});
-	return () => {
-		removeListener?.();
-		unsubscribe();
-	};
 }
-
 //#endregion
 export { syncSelectedTextTrackFromDom };
+
 //# sourceMappingURL=sync-selected-text-track-from-dom.js.map

package/dist/default/dom/features/sync-selected-text-track-from-dom.js.map

@@ -1 +1 @@
-{"version":3,"file":"sync-selected-text-track-from-dom.js","names":[],"sources":["../../../../src/dom/features/sync-selected-text-track-from-dom.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport type { WritableState } from '../../core/state/create-state';\nimport type { TextTrackBufferState } from './load-text-track-cues';\n\n/**\n * State shape for DOM-driven text track selection.\n */\nexport interface SelectedTextTrackFromDomState {\n  selectedTextTrackId?: string | undefined;\n  textBufferState?: TextTrackBufferState | undefined;\n}\n\n/**\n * Owners shape for DOM-driven text track selection.\n */\nexport interface SelectedTextTrackFromDomOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Sync selectedTextTrackId from DOM text track mode changes.\n *\n * Listens to the `change` event on `media.textTracks` and updates\n * `selectedTextTrackId` when external code (e.g. the captions button via\n * `toggleSubtitles()`) changes a subtitle/caption track mode to 'showing'.\n *\n * This bridges the core store's `toggleSubtitles()` with SPF's reactive text\n * track pipeline (`syncTextTrackModes`, `loadTextTrackCues`). Without this\n * bridge, direct DOM mode changes would be immediately overridden by\n * `syncTextTrackModes` on the next SPF state update.\n *\n * When a subtitle/caption track's mode is 'showing', its DOM `id` — which\n * matches the SPF track ID set by `setupTextTracks` — is written to\n * `selectedTextTrackId`. When no subtitle/caption track is 'showing',\n * `selectedTextTrackId` is cleared along with the deselected track's\n * `textBufferState` entry — setting mode to 'disabled' clears native cues from\n * the track element, so the buffer must be reset to re-fetch cues on re-enable.\n *\n * @example\n * const cleanup = syncSelectedTextTrackFromDom({ state, owners });\n */\nexport function syncSelectedTextTrackFromDom({\n  state,\n  owners,\n}: {\n  state: WritableState<SelectedTextTrackFromDomState>;\n  owners: WritableState<SelectedTextTrackFromDomOwners>;\n}): () => void {\n  let lastMediaElement: HTMLMediaElement | undefined;\n  let removeListener: (() => void) | null = null;\n\n  const unsubscribe = owners.subscribe((currentOwners) => {\n    const { mediaElement } = currentOwners;\n\n    if (mediaElement === lastMediaElement) return;\n\n    removeListener?.();\n    removeListener = null;\n    lastMediaElement = mediaElement;\n\n    if (!mediaElement) return;\n\n    const sync = () => {\n      const showingTrack = Array.from(mediaElement.textTracks).find(\n        (t) => t.mode === 'showing' && (t.kind === 'subtitles' || t.kind === 'captions')\n      );\n\n      // showingTrack.id is set from the SPF presentation track ID by setupTextTracks.\n      // Fall back to undefined for empty-string IDs (non-SPF-managed tracks).\n      const newId = showingTrack?.id || undefined;\n      const current = state.current;\n\n      // Guard against redundant patches — e.g. syncTextTrackModes confirming the\n      // current selection, which would otherwise create a feedback loop.\n      if (current.selectedTextTrackId === newId) return;\n\n      if (newId) {\n        state.patch({ selectedTextTrackId: newId });\n      } else {\n        // When deselecting, clear the textBufferState entry for the previous track.\n        // Setting mode to 'disabled' (as toggleSubtitles() does) clears native cues\n        // from the track element, so the buffer must be reset to allow re-fetching\n        // on re-enable.\n        const prevId = current.selectedTextTrackId;\n        if (prevId && current.textBufferState?.[prevId]) {\n          const next = { ...current.textBufferState };\n          delete next[prevId];\n          state.patch({ selectedTextTrackId: undefined, textBufferState: next });\n        } else {\n          state.patch({ selectedTextTrackId: undefined });\n        }\n      }\n    };\n\n    removeListener = listen(mediaElement.textTracks, 'change', sync);\n  });\n\n  return () => {\n    removeListener?.();\n    unsubscribe();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,SAAgB,6BAA6B,EAC3C,OACA,UAIa;CACb,IAAI;CACJ,IAAI,iBAAsC;CAE1C,MAAM,cAAc,OAAO,WAAW,kBAAkB;EACtD,MAAM,EAAE,iBAAiB;AAEzB,MAAI,iBAAiB,iBAAkB;AAEvC,oBAAkB;AAClB,mBAAiB;AACjB,qBAAmB;AAEnB,MAAI,CAAC,aAAc;EAEnB,MAAM,aAAa;GAOjB,MAAM,QANe,MAAM,KAAK,aAAa,WAAW,CAAC,MACtD,MAAM,EAAE,SAAS,cAAc,EAAE,SAAS,eAAe,EAAE,SAAS,YACtE,EAI2B,MAAM;GAClC,MAAM,UAAU,MAAM;AAItB,OAAI,QAAQ,wBAAwB,MAAO;AAE3C,OAAI,MACF,OAAM,MAAM,EAAE,qBAAqB,OAAO,CAAC;QACtC;IAKL,MAAM,SAAS,QAAQ;AACvB,QAAI,UAAU,QAAQ,kBAAkB,SAAS;KAC/C,MAAM,OAAO,EAAE,GAAG,QAAQ,iBAAiB;AAC3C,YAAO,KAAK;AACZ,WAAM,MAAM;MAAE,qBAAqB;MAAW,iBAAiB;MAAM,CAAC;UAEtE,OAAM,MAAM,EAAE,qBAAqB,QAAW,CAAC;;;AAKrD,mBAAiB,OAAO,aAAa,YAAY,UAAU,KAAK;GAChE;AAEF,cAAa;AACX,oBAAkB;AAClB,eAAa"}
+{"version":3,"file":"sync-selected-text-track-from-dom.js","names":[],"sources":["../../../../src/dom/features/sync-selected-text-track-from-dom.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport { effect } from '../../core/signals/effect';\nimport { computed, type Signal, update } from '../../core/signals/primitives';\nimport type { TextTrackBufferState } from './load-text-track-cues';\n\n/**\n * State shape for DOM-driven text track selection.\n */\nexport interface SelectedTextTrackFromDomState {\n  selectedTextTrackId?: string | undefined;\n  textBufferState?: TextTrackBufferState | undefined;\n}\n\n/**\n * Owners shape for DOM-driven text track selection.\n */\nexport interface SelectedTextTrackFromDomOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Sync selectedTextTrackId from DOM text track mode changes.\n *\n * Listens to the `change` event on `media.textTracks` and updates\n * `selectedTextTrackId` when external code (e.g. the captions button via\n * `toggleSubtitles()`) changes a subtitle/caption track mode to 'showing'.\n *\n * This bridges the core store's `toggleSubtitles()` with SPF's reactive text\n * track pipeline (`syncTextTrackModes`, `loadTextTrackCues`). Without this\n * bridge, direct DOM mode changes would be immediately overridden by\n * `syncTextTrackModes` on the next SPF state update.\n *\n * When a subtitle/caption track's mode is 'showing', its DOM `id` — which\n * matches the SPF track ID set by `setupTextTracks` — is written to\n * `selectedTextTrackId`. When no subtitle/caption track is 'showing',\n * `selectedTextTrackId` is cleared along with the deselected track's\n * `textBufferState` entry — setting mode to 'disabled' clears native cues from\n * the track element, so the buffer must be reset to re-fetch cues on re-enable.\n *\n * @example\n * const cleanup = syncSelectedTextTrackFromDom({ state, owners });\n */\nexport function syncSelectedTextTrackFromDom<\n  S extends SelectedTextTrackFromDomState,\n  O extends SelectedTextTrackFromDomOwners,\n>({ state, owners }: { state: Signal<S>; owners: Signal<O> }): () => void {\n  const mediaElement = computed(() => owners.get().mediaElement);\n\n  return effect(() => {\n    const el = mediaElement.get();\n    if (!el) return;\n\n    return listen(el.textTracks, 'change', () => {\n      const showingTrack = Array.from(el.textTracks).find(\n        (t) => t.mode === 'showing' && (t.kind === 'subtitles' || t.kind === 'captions')\n      );\n\n      // showingTrack.id is set from the SPF presentation track ID by setupTextTracks.\n      // Fall back to undefined for empty-string IDs (non-SPF-managed tracks).\n      const newId = showingTrack?.id || undefined;\n      const current = state.get();\n\n      // Guard against redundant writes — e.g. syncTextTrackModes confirming the\n      // current selection, which would otherwise create a feedback loop.\n      if (current.selectedTextTrackId === newId) return;\n\n      if (newId) {\n        const patch: Partial<SelectedTextTrackFromDomState> = { selectedTextTrackId: newId };\n        update(state, patch);\n      } else {\n        // When deselecting, clear the textBufferState entry for the previous track.\n        // Setting mode to 'disabled' (as toggleSubtitles() does) clears native cues\n        // from the track element, so the buffer must be reset to allow re-fetching\n        // on re-enable.\n        const prevId = current.selectedTextTrackId;\n        if (prevId && current.textBufferState?.[prevId]) {\n          const next = { ...current.textBufferState };\n          delete next[prevId];\n          const patch: Partial<SelectedTextTrackFromDomState> = {\n            selectedTextTrackId: undefined,\n            textBufferState: next,\n          };\n          update(state, patch);\n        } else {\n          const patch: Partial<SelectedTextTrackFromDomState> = { selectedTextTrackId: undefined };\n          update(state, patch);\n        }\n      }\n    });\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,SAAgB,6BAGd,EAAE,OAAO,UAA+D;CACxE,MAAM,eAAe,eAAe,OAAO,KAAK,CAAC,aAAa;AAE9D,QAAO,aAAa;EAClB,MAAM,KAAK,aAAa,KAAK;AAC7B,MAAI,CAAC,GAAI;AAET,SAAO,OAAO,GAAG,YAAY,gBAAgB;GAO3C,MAAM,QANe,MAAM,KAAK,GAAG,WAAW,CAAC,MAC5C,MAAM,EAAE,SAAS,cAAc,EAAE,SAAS,eAAe,EAAE,SAAS,YACtE,EAI2B,MAAM,KAAA;GAClC,MAAM,UAAU,MAAM,KAAK;AAI3B,OAAI,QAAQ,wBAAwB,MAAO;AAE3C,OAAI,MAEF,QAAO,OAD+C,EAAE,qBAAqB,OAAO,CAChE;QACf;IAKL,MAAM,SAAS,QAAQ;AACvB,QAAI,UAAU,QAAQ,kBAAkB,SAAS;KAC/C,MAAM,OAAO,EAAE,GAAG,QAAQ,iBAAiB;AAC3C,YAAO,KAAK;AAKZ,YAAO,OAJ+C;MACpD,qBAAqB,KAAA;MACrB,iBAAiB;MAClB,CACmB;UAGpB,QAAO,OAD+C,EAAE,qBAAqB,KAAA,GAAW,CACpE;;IAGxB;GACF"}

package/dist/default/dom/features/sync-text-track-modes.js

@@ -1,16 +1,7 @@
-import { combineLatest } from "../../core/reactive/combine-latest.js";
-
+import { effect } from "../../core/signals/effect.js";
+import { computed } from "../../core/signals/primitives.js";
 //#region src/dom/features/sync-text-track-modes.ts
 /**
-* Check if we can sync text track modes.
-*
-* Requires:
-* - textTracks map exists (track elements created)
-*/
-function canSyncTextTrackModes(owners) {
-	return !!owners.textTracks && owners.textTracks.size > 0;
-}
-/**
 * Sync text track modes orchestration.
 *
 * Manages track element modes based on selectedTextTrackId:
@@ -25,14 +16,18 @@ function canSyncTextTrackModes(owners) {
 * const cleanup = syncTextTrackModes({ state, owners });
 */
 function syncTextTrackModes({ state, owners }) {
-	return combineLatest([state, owners]).subscribe(([s, o]) => {
-		if (!canSyncTextTrackModes(o)) return;
-		const selectedId = s.selectedTextTrackId;
-		for (const [trackId, trackElement] of o.textTracks) if (trackId === selectedId) trackElement.track.mode = "showing";
-		else trackElement.track.mode = "hidden";
+	const textTracksSignal = computed(() => owners.get().textTracks);
+	const selectedTextTrackIdSignal = computed(() => state.get().selectedTextTrackId);
+	const canSyncTextTrackModes = computed(() => !!textTracksSignal.get()?.size);
+	return effect(() => {
+		if (!canSyncTextTrackModes.get()) return;
+		/** @TODO refactor TextTracks owners model. Should simply use id. Also should use corresponding TextTrack (JS) element if possible (CJP) */
+		const textTracks = textTracksSignal.get();
+		const selectedTextTrackId = selectedTextTrackIdSignal.get();
+		for (const [trackId, trackElement] of textTracks) trackElement.track.mode = trackId === selectedTextTrackId ? "showing" : "hidden";
 	});
 }
-
 //#endregion
 export { syncTextTrackModes };
+
 //# sourceMappingURL=sync-text-track-modes.js.map

package/dist/default/dom/features/sync-text-track-modes.js.map

@@ -1 +1 @@
-{"version":3,"file":"sync-text-track-modes.js","names":[],"sources":["../../../../src/dom/features/sync-text-track-modes.ts"],"sourcesContent":["import { combineLatest } from '../../core/reactive/combine-latest';\nimport type { WritableState } from '../../core/state/create-state';\n\n/**\n * State shape for text track mode synchronization.\n */\nexport interface TextTrackModeState {\n  selectedTextTrackId?: string | undefined;\n}\n\n/**\n * Owners shape for text track mode synchronization.\n */\nexport interface TextTrackModeOwners {\n  textTracks?: Map<string, HTMLTrackElement>;\n}\n\n/**\n * Check if we can sync text track modes.\n *\n * Requires:\n * - textTracks map exists (track elements created)\n */\nexport function canSyncTextTrackModes(owners: TextTrackModeOwners): boolean {\n  return !!owners.textTracks && owners.textTracks.size > 0;\n}\n\n/**\n * Sync text track modes orchestration.\n *\n * Manages track element modes based on selectedTextTrackId:\n * - Selected track: mode = \"showing\"\n * - Other tracks: mode = \"hidden\"\n * - No selection: all tracks mode = \"hidden\"\n *\n * Note: Uses \"hidden\" instead of \"disabled\" for non-selected tracks\n * so they remain available in the browser's track menu.\n *\n * @example\n * const cleanup = syncTextTrackModes({ state, owners });\n */\nexport function syncTextTrackModes({\n  state,\n  owners,\n}: {\n  state: WritableState<TextTrackModeState>;\n  owners: WritableState<TextTrackModeOwners>;\n}): () => void {\n  return combineLatest([state, owners]).subscribe(([s, o]: [TextTrackModeState, TextTrackModeOwners]) => {\n    // Check orchestration conditions\n    if (!canSyncTextTrackModes(o)) return;\n\n    const selectedId = s.selectedTextTrackId;\n\n    // Update all track element modes\n    for (const [trackId, trackElement] of o.textTracks!) {\n      if (trackId === selectedId) {\n        // Selected track: show it\n        trackElement.track.mode = 'showing';\n      } else {\n        // Other tracks: hide them (but keep available in menu)\n        trackElement.track.mode = 'hidden';\n      }\n    }\n  });\n}\n"],"mappings":";;;;;;;;;AAuBA,SAAgB,sBAAsB,QAAsC;AAC1E,QAAO,CAAC,CAAC,OAAO,cAAc,OAAO,WAAW,OAAO;;;;;;;;;;;;;;;;AAiBzD,SAAgB,mBAAmB,EACjC,OACA,UAIa;AACb,QAAO,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,GAAG,OAAkD;AAErG,MAAI,CAAC,sBAAsB,EAAE,CAAE;EAE/B,MAAM,aAAa,EAAE;AAGrB,OAAK,MAAM,CAAC,SAAS,iBAAiB,EAAE,WACtC,KAAI,YAAY,WAEd,cAAa,MAAM,OAAO;MAG1B,cAAa,MAAM,OAAO;GAG9B"}
+{"version":3,"file":"sync-text-track-modes.js","names":[],"sources":["../../../../src/dom/features/sync-text-track-modes.ts"],"sourcesContent":["import { effect } from '../../core/signals/effect';\nimport { computed, type Signal } from '../../core/signals/primitives';\n\n/**\n * State shape for text track mode synchronization.\n */\nexport interface TextTrackModeState {\n  selectedTextTrackId?: string | undefined;\n}\n\n/**\n * Owners shape for text track mode synchronization.\n */\nexport interface TextTrackModeOwners {\n  textTracks?: Map<string, HTMLTrackElement>;\n}\n\n/**\n * Sync text track modes orchestration.\n *\n * Manages track element modes based on selectedTextTrackId:\n * - Selected track: mode = \"showing\"\n * - Other tracks: mode = \"hidden\"\n * - No selection: all tracks mode = \"hidden\"\n *\n * Note: Uses \"hidden\" instead of \"disabled\" for non-selected tracks\n * so they remain available in the browser's track menu.\n *\n * @example\n * const cleanup = syncTextTrackModes({ state, owners });\n */\nexport function syncTextTrackModes<S extends TextTrackModeState, O extends TextTrackModeOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  const textTracksSignal = computed(() => owners.get().textTracks);\n  const selectedTextTrackIdSignal = computed(() => state.get().selectedTextTrackId);\n\n  const canSyncTextTrackModes = computed(() => !!textTracksSignal.get()?.size);\n\n  return effect(() => {\n    if (!canSyncTextTrackModes.get()) return;\n    /** @TODO refactor TextTracks owners model. Should simply use id. Also should use corresponding TextTrack (JS) element if possible (CJP) */\n    const textTracks = textTracksSignal.get() as Map<string, HTMLTrackElement>;\n    const selectedTextTrackId = selectedTextTrackIdSignal.get() as string;\n\n    for (const [trackId, trackElement] of textTracks) {\n      trackElement.track.mode = trackId === selectedTextTrackId ? 'showing' : 'hidden';\n    }\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AA+BA,SAAgB,mBAAgF,EAC9F,OACA,UAIa;CACb,MAAM,mBAAmB,eAAe,OAAO,KAAK,CAAC,WAAW;CAChE,MAAM,4BAA4B,eAAe,MAAM,KAAK,CAAC,oBAAoB;CAEjF,MAAM,wBAAwB,eAAe,CAAC,CAAC,iBAAiB,KAAK,EAAE,KAAK;AAE5E,QAAO,aAAa;AAClB,MAAI,CAAC,sBAAsB,KAAK,CAAE;;EAElC,MAAM,aAAa,iBAAiB,KAAK;EACzC,MAAM,sBAAsB,0BAA0B,KAAK;AAE3D,OAAK,MAAM,CAAC,SAAS,iBAAiB,WACpC,cAAa,MAAM,OAAO,YAAY,sBAAsB,YAAY;GAE1E"}

package/dist/default/dom/features/track-current-time.js

@@ -1,5 +1,6 @@
+import { effect } from "../../core/signals/effect.js";
+import { update } from "../../core/signals/primitives.js";
 import { listen } from "@videojs/utils/dom";
-
 //#region src/dom/features/track-current-time.ts
 /**
 * Track current playback position from the media element.
@@ -19,15 +20,17 @@ import { listen } from "@videojs/utils/dom";
 function trackCurrentTime({ state, owners }) {
 	let lastMediaElement;
 	let removeListeners = null;
-	const unsubscribe = owners.subscribe((currentOwners) => {
-		const { mediaElement } = currentOwners;
+	const cleanupEffect = effect(() => {
+		const { mediaElement } = owners.get();
 		if (mediaElement === lastMediaElement) return;
 		removeListeners?.();
 		removeListeners = null;
 		lastMediaElement = mediaElement;
 		if (!mediaElement) return;
-		state.patch({ currentTime: mediaElement.currentTime });
-		const sync = () => state.patch({ currentTime: mediaElement.currentTime });
+		const sync = () => {
+			update(state, { currentTime: mediaElement.currentTime });
+		};
+		sync();
 		const removeTimeupdate = listen(mediaElement, "timeupdate", sync);
 		const removeSeeking = listen(mediaElement, "seeking", sync);
 		removeListeners = () => {
@@ -37,10 +40,10 @@ function trackCurrentTime({ state, owners }) {
 	});
 	return () => {
 		removeListeners?.();
-		unsubscribe();
+		cleanupEffect();
 	};
 }
-
 //#endregion
 export { trackCurrentTime };
+
 //# sourceMappingURL=track-current-time.js.map

package/dist/default/dom/features/track-current-time.js.map

@@ -1 +1 @@
-{"version":3,"file":"track-current-time.js","names":[],"sources":["../../../../src/dom/features/track-current-time.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport type { WritableState } from '../../core/state/create-state';\n\n/**\n * State shape for current time tracking.\n */\nexport interface CurrentTimeState {\n  currentTime?: number;\n}\n\n/**\n * Owners shape for current time tracking.\n */\nexport interface CurrentTimeOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Check if we can track current time.\n *\n * Requires:\n * - mediaElement exists in owners\n */\nexport function canTrackCurrentTime(owners: CurrentTimeOwners): boolean {\n  return !!owners.mediaElement;\n}\n\n/**\n * Track current playback position from the media element.\n *\n * Mirrors `mediaElement.currentTime` into reactive state on:\n * - `timeupdate` — fires during playback (~4 Hz)\n * - `seeking` — fires when a seek begins; per spec, `currentTime` is\n *   already at the new position when this event dispatches, so buffer\n *   management can react immediately rather than waiting for `timeupdate`,\n *   which does not fire while paused.\n *\n * Also syncs immediately when a media element becomes available.\n *\n * @example\n * const cleanup = trackCurrentTime({ state, owners });\n */\nexport function trackCurrentTime({\n  state,\n  owners,\n}: {\n  state: WritableState<CurrentTimeState>;\n  owners: WritableState<CurrentTimeOwners>;\n}): () => void {\n  let lastMediaElement: HTMLMediaElement | undefined;\n  let removeListeners: (() => void) | null = null;\n\n  const unsubscribe = owners.subscribe((currentOwners) => {\n    const { mediaElement } = currentOwners;\n\n    if (mediaElement === lastMediaElement) return;\n\n    removeListeners?.();\n    removeListeners = null;\n    lastMediaElement = mediaElement;\n\n    if (!mediaElement) return;\n\n    // Sync immediately so consumers don't wait for the first event\n    state.patch({ currentTime: mediaElement.currentTime });\n\n    const sync = () => state.patch({ currentTime: mediaElement.currentTime });\n    const removeTimeupdate = listen(mediaElement, 'timeupdate', sync);\n    const removeSeeking = listen(mediaElement, 'seeking', sync);\n    removeListeners = () => {\n      removeTimeupdate();\n      removeSeeking();\n    };\n  });\n\n  return () => {\n    removeListeners?.();\n    unsubscribe();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA0CA,SAAgB,iBAAiB,EAC/B,OACA,UAIa;CACb,IAAI;CACJ,IAAI,kBAAuC;CAE3C,MAAM,cAAc,OAAO,WAAW,kBAAkB;EACtD,MAAM,EAAE,iBAAiB;AAEzB,MAAI,iBAAiB,iBAAkB;AAEvC,qBAAmB;AACnB,oBAAkB;AAClB,qBAAmB;AAEnB,MAAI,CAAC,aAAc;AAGnB,QAAM,MAAM,EAAE,aAAa,aAAa,aAAa,CAAC;EAEtD,MAAM,aAAa,MAAM,MAAM,EAAE,aAAa,aAAa,aAAa,CAAC;EACzE,MAAM,mBAAmB,OAAO,cAAc,cAAc,KAAK;EACjE,MAAM,gBAAgB,OAAO,cAAc,WAAW,KAAK;AAC3D,0BAAwB;AACtB,qBAAkB;AAClB,kBAAe;;GAEjB;AAEF,cAAa;AACX,qBAAmB;AACnB,eAAa"}
+{"version":3,"file":"track-current-time.js","names":[],"sources":["../../../../src/dom/features/track-current-time.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport { effect } from '../../core/signals/effect';\nimport { type Signal, update } from '../../core/signals/primitives';\n\n/**\n * State shape for current time tracking.\n */\nexport interface CurrentTimeState {\n  currentTime?: number;\n}\n\n/**\n * Owners shape for current time tracking.\n */\nexport interface CurrentTimeOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Check if we can track current time.\n *\n * Requires:\n * - mediaElement exists in owners\n */\nexport function canTrackCurrentTime(owners: CurrentTimeOwners): boolean {\n  return !!owners.mediaElement;\n}\n\n/**\n * Track current playback position from the media element.\n *\n * Mirrors `mediaElement.currentTime` into reactive state on:\n * - `timeupdate` — fires during playback (~4 Hz)\n * - `seeking` — fires when a seek begins; per spec, `currentTime` is\n *   already at the new position when this event dispatches, so buffer\n *   management can react immediately rather than waiting for `timeupdate`,\n *   which does not fire while paused.\n *\n * Also syncs immediately when a media element becomes available.\n *\n * @example\n * const cleanup = trackCurrentTime({ state, owners });\n */\nexport function trackCurrentTime<S extends CurrentTimeState, O extends CurrentTimeOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  let lastMediaElement: HTMLMediaElement | undefined;\n  let removeListeners: (() => void) | null = null;\n\n  const cleanupEffect = effect(() => {\n    const { mediaElement } = owners.get();\n\n    if (mediaElement === lastMediaElement) return;\n\n    removeListeners?.();\n    removeListeners = null;\n    lastMediaElement = mediaElement;\n\n    if (!mediaElement) return;\n\n    const sync = () => {\n      const patch: Partial<CurrentTimeState> = { currentTime: mediaElement.currentTime };\n      update(state, patch);\n    };\n\n    // Sync immediately so consumers don't wait for the first event\n    sync();\n    const removeTimeupdate = listen(mediaElement, 'timeupdate', sync);\n    const removeSeeking = listen(mediaElement, 'seeking', sync);\n    removeListeners = () => {\n      removeTimeupdate();\n      removeSeeking();\n    };\n  });\n\n  return () => {\n    removeListeners?.();\n    cleanupEffect();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA2CA,SAAgB,iBAA0E,EACxF,OACA,UAIa;CACb,IAAI;CACJ,IAAI,kBAAuC;CAE3C,MAAM,gBAAgB,aAAa;EACjC,MAAM,EAAE,iBAAiB,OAAO,KAAK;AAErC,MAAI,iBAAiB,iBAAkB;AAEvC,qBAAmB;AACnB,oBAAkB;AAClB,qBAAmB;AAEnB,MAAI,CAAC,aAAc;EAEnB,MAAM,aAAa;AAEjB,UAAO,OADkC,EAAE,aAAa,aAAa,aAAa,CAC9D;;AAItB,QAAM;EACN,MAAM,mBAAmB,OAAO,cAAc,cAAc,KAAK;EACjE,MAAM,gBAAgB,OAAO,cAAc,WAAW,KAAK;AAC3D,0BAAwB;AACtB,qBAAkB;AAClB,kBAAe;;GAEjB;AAEF,cAAa;AACX,qBAAmB;AACnB,iBAAe"}

package/dist/default/dom/features/track-playback-initiated.js

@@ -1,55 +1,53 @@
+import { effect } from "../../core/signals/effect.js";
+import { computed, signal, update } from "../../core/signals/primitives.js";
 import { listen } from "@videojs/utils/dom";
-
 //#region src/dom/features/track-playback-initiated.ts
 /**
-* Track whether playback has been initiated by the user.
-*
-* Sets `state.playbackInitiated = true` when the media element fires a `play`
-* event (via `element.play()`, native controls, or autoplay) and simultaneously
-* dispatches `{ type: 'play' }` to the event stream so `resolvePresentation`
-* can react.
+* Track whether playback has been initiated for the current presentation URL.
 *
-* Resets `state.playbackInitiated = false` when `presentation.url` changes,
-* so a new source with `preload="none"` won't load segments until play is
-* triggered again.
+* Uses a local intermediate signal written by two effect streams:
+* - false stream: resets on URL change
+* - true stream: sets on play event
 *
-* This flag is used by `shouldLoadSegments` to allow segment loading after
-* play is initiated regardless of the initial `preload` setting — `preload`
-* is a startup hint, not a runtime gate.
+* A third merge effect reads the local signal and writes to state, reading
+* `state.get()` at merge time so the spread uses the up-to-date value after
+* the async forward bridge has run.
 *
 * @example
 * const cleanup = trackPlaybackInitiated({ state, owners, events });
 */
-function trackPlaybackInitiated({ state, owners, events }) {
-	let lastMediaElement;
-	let removeListener = null;
+function trackPlaybackInitiated({ state, owners }) {
+	const presentationUrl = computed(() => state.get().presentation?.url);
+	const mediaElement = computed(() => owners.get().mediaElement);
+	const playbackInitiated = signal(void 0);
 	let lastPresentationUrl;
-	const unsubscribeState = state.subscribe((currentState) => {
-		const url = currentState.presentation?.url;
-		if (url !== lastPresentationUrl) {
-			if (lastPresentationUrl !== void 0) state.patch({ playbackInitiated: false });
-			lastPresentationUrl = url;
-		}
+	let lastMediaElement;
+	const cleanupResetEffect = effect(() => {
+		const url = presentationUrl.get();
+		const el = mediaElement.get();
+		if (url !== lastPresentationUrl && lastPresentationUrl !== void 0 || el !== lastMediaElement && lastMediaElement !== void 0) playbackInitiated.set(false);
+		lastPresentationUrl = url;
+		lastMediaElement = el;
 	});
-	const unsubscribeOwners = owners.subscribe((currentOwners) => {
-		const { mediaElement } = currentOwners;
-		if (mediaElement === lastMediaElement) return;
-		removeListener?.();
-		removeListener = null;
-		lastMediaElement = mediaElement;
-		if (!mediaElement) return;
-		removeListener = listen(mediaElement, "play", () => {
-			state.patch({ playbackInitiated: true });
-			events.dispatch({ type: "play" });
+	const cleanupPlayEffect = effect(() => {
+		const el = mediaElement.get();
+		if (!el) return;
+		return listen(el, "play", () => {
+			playbackInitiated.set(true);
 		});
 	});
+	const cleanupMergeEffect = effect(() => {
+		const pi = playbackInitiated.get();
+		if (pi === void 0) return;
+		if (state.get().playbackInitiated !== pi) update(state, { playbackInitiated: pi });
+	});
 	return () => {
-		removeListener?.();
-		unsubscribeState();
-		unsubscribeOwners();
+		cleanupResetEffect();
+		cleanupPlayEffect();
+		cleanupMergeEffect();
 	};
 }
-
 //#endregion
 export { trackPlaybackInitiated };
+
 //# sourceMappingURL=track-playback-initiated.js.map

package/dist/default/dom/features/track-playback-initiated.js.map

@@ -1 +1 @@
-{"version":3,"file":"track-playback-initiated.js","names":[],"sources":["../../../../src/dom/features/track-playback-initiated.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport type { EventStream } from '../../core/events/create-event-stream';\nimport type { PresentationAction } from '../../core/features/resolve-presentation';\nimport type { WritableState } from '../../core/state/create-state';\n\n/**\n * State shape for playback initiation tracking.\n */\nexport interface PlaybackInitiatedState {\n  /** True once the user has initiated playback (play event fired). */\n  playbackInitiated?: boolean;\n  /** Current presentation — watched for URL changes to reset playbackInitiated. */\n  presentation?: { url?: string };\n}\n\n/**\n * Owners shape for playback initiation tracking.\n */\nexport interface PlaybackInitiatedOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Track whether playback has been initiated by the user.\n *\n * Sets `state.playbackInitiated = true` when the media element fires a `play`\n * event (via `element.play()`, native controls, or autoplay) and simultaneously\n * dispatches `{ type: 'play' }` to the event stream so `resolvePresentation`\n * can react.\n *\n * Resets `state.playbackInitiated = false` when `presentation.url` changes,\n * so a new source with `preload=\"none\"` won't load segments until play is\n * triggered again.\n *\n * This flag is used by `shouldLoadSegments` to allow segment loading after\n * play is initiated regardless of the initial `preload` setting — `preload`\n * is a startup hint, not a runtime gate.\n *\n * @example\n * const cleanup = trackPlaybackInitiated({ state, owners, events });\n */\nexport function trackPlaybackInitiated({\n  state,\n  owners,\n  events,\n}: {\n  state: WritableState<PlaybackInitiatedState>;\n  owners: WritableState<PlaybackInitiatedOwners>;\n  events: EventStream<PresentationAction>;\n}): () => void {\n  let lastMediaElement: HTMLMediaElement | undefined;\n  let removeListener: (() => void) | null = null;\n  let lastPresentationUrl: string | undefined;\n\n  // Watch for presentation URL changes to reset playbackInitiated\n  const unsubscribeState = state.subscribe((currentState) => {\n    const url = currentState.presentation?.url;\n    if (url !== lastPresentationUrl) {\n      if (lastPresentationUrl !== undefined) {\n        // URL changed to a new value — reset so new source requires play again\n        state.patch({ playbackInitiated: false });\n      }\n      lastPresentationUrl = url;\n    }\n  });\n\n  // Bridge media element play event → state flag + event stream\n  const unsubscribeOwners = owners.subscribe((currentOwners) => {\n    const { mediaElement } = currentOwners;\n\n    if (mediaElement === lastMediaElement) return;\n\n    removeListener?.();\n    removeListener = null;\n    lastMediaElement = mediaElement;\n\n    if (!mediaElement) return;\n\n    removeListener = listen(mediaElement, 'play', () => {\n      state.patch({ playbackInitiated: true });\n      events.dispatch({ type: 'play' });\n    });\n  });\n\n  return () => {\n    removeListener?.();\n    unsubscribeState();\n    unsubscribeOwners();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAyCA,SAAgB,uBAAuB,EACrC,OACA,QACA,UAKa;CACb,IAAI;CACJ,IAAI,iBAAsC;CAC1C,IAAI;CAGJ,MAAM,mBAAmB,MAAM,WAAW,iBAAiB;EACzD,MAAM,MAAM,aAAa,cAAc;AACvC,MAAI,QAAQ,qBAAqB;AAC/B,OAAI,wBAAwB,OAE1B,OAAM,MAAM,EAAE,mBAAmB,OAAO,CAAC;AAE3C,yBAAsB;;GAExB;CAGF,MAAM,oBAAoB,OAAO,WAAW,kBAAkB;EAC5D,MAAM,EAAE,iBAAiB;AAEzB,MAAI,iBAAiB,iBAAkB;AAEvC,oBAAkB;AAClB,mBAAiB;AACjB,qBAAmB;AAEnB,MAAI,CAAC,aAAc;AAEnB,mBAAiB,OAAO,cAAc,cAAc;AAClD,SAAM,MAAM,EAAE,mBAAmB,MAAM,CAAC;AACxC,UAAO,SAAS,EAAE,MAAM,QAAQ,CAAC;IACjC;GACF;AAEF,cAAa;AACX,oBAAkB;AAClB,oBAAkB;AAClB,qBAAmB"}
+{"version":3,"file":"track-playback-initiated.js","names":[],"sources":["../../../../src/dom/features/track-playback-initiated.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport { effect } from '../../core/signals/effect';\nimport { computed, type Signal, signal, update } from '../../core/signals/primitives';\n\n/**\n * State shape for playback initiation tracking.\n */\nexport interface PlaybackInitiatedState {\n  /** True once play has been requested for the current presentation URL. */\n  playbackInitiated?: boolean;\n  /** Current presentation — URL is used to detect source changes. */\n  presentation?: { url?: string };\n}\n\n/**\n * Owners shape for playback initiation tracking.\n */\nexport interface PlaybackInitiatedOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Track whether playback has been initiated for the current presentation URL.\n *\n * Uses a local intermediate signal written by two effect streams:\n * - false stream: resets on URL change\n * - true stream: sets on play event\n *\n * A third merge effect reads the local signal and writes to state, reading\n * `state.get()` at merge time so the spread uses the up-to-date value after\n * the async forward bridge has run.\n *\n * @example\n * const cleanup = trackPlaybackInitiated({ state, owners, events });\n */\nexport function trackPlaybackInitiated<S extends PlaybackInitiatedState, O extends PlaybackInitiatedOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  const presentationUrl = computed(() => state.get().presentation?.url);\n  const mediaElement = computed(() => owners.get().mediaElement);\n\n  // Local signal: written by the URL effect (false) and the play listener (true).\n  // undefined = not yet initialized (suppresses the merge effect on startup).\n  const playbackInitiated = signal<boolean | undefined>(undefined);\n\n  let lastPresentationUrl: string | undefined;\n  let lastMediaElement: HTMLMediaElement | undefined;\n\n  // False stream: reset on URL change or element swap.\n  const cleanupResetEffect = effect(() => {\n    const url = presentationUrl.get();\n    const el = mediaElement.get();\n\n    const urlChanged = url !== lastPresentationUrl;\n    const elChanged = el !== lastMediaElement;\n\n    if ((urlChanged && lastPresentationUrl !== undefined) || (elChanged && lastMediaElement !== undefined)) {\n      playbackInitiated.set(false);\n    }\n\n    lastPresentationUrl = url;\n    lastMediaElement = el;\n  });\n\n  // True stream: set on play event. Cleanup return removes the listener on element swap.\n  const cleanupPlayEffect = effect(() => {\n    const el = mediaElement.get();\n    if (!el) return;\n    return listen(el, 'play', () => {\n      playbackInitiated.set(true);\n    });\n  });\n\n  // Merge effect: bridge local signal → state.\n  // Reads state.get() at merge time (after the async forward bridge has flushed)\n  // so the spread captures the current value rather than a stale event-time snapshot.\n  // The guard makes the write idempotent.\n  const cleanupMergeEffect = effect(() => {\n    const pi = playbackInitiated.get();\n    if (pi === undefined) return;\n    const current = state.get();\n    if (current.playbackInitiated !== pi) {\n      const patch: Partial<PlaybackInitiatedState> = { playbackInitiated: pi };\n      update(state, patch);\n    }\n  });\n\n  return () => {\n    cleanupResetEffect();\n    cleanupPlayEffect();\n    cleanupMergeEffect();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAmCA,SAAgB,uBAA4F,EAC1G,OACA,UAIa;CACb,MAAM,kBAAkB,eAAe,MAAM,KAAK,CAAC,cAAc,IAAI;CACrE,MAAM,eAAe,eAAe,OAAO,KAAK,CAAC,aAAa;CAI9D,MAAM,oBAAoB,OAA4B,KAAA,EAAU;CAEhE,IAAI;CACJ,IAAI;CAGJ,MAAM,qBAAqB,aAAa;EACtC,MAAM,MAAM,gBAAgB,KAAK;EACjC,MAAM,KAAK,aAAa,KAAK;AAK7B,MAHmB,QAAQ,uBAGR,wBAAwB,KAAA,KAFzB,OAAO,oBAE8C,qBAAqB,KAAA,EAC1F,mBAAkB,IAAI,MAAM;AAG9B,wBAAsB;AACtB,qBAAmB;GACnB;CAGF,MAAM,oBAAoB,aAAa;EACrC,MAAM,KAAK,aAAa,KAAK;AAC7B,MAAI,CAAC,GAAI;AACT,SAAO,OAAO,IAAI,cAAc;AAC9B,qBAAkB,IAAI,KAAK;IAC3B;GACF;CAMF,MAAM,qBAAqB,aAAa;EACtC,MAAM,KAAK,kBAAkB,KAAK;AAClC,MAAI,OAAO,KAAA,EAAW;AAEtB,MADgB,MAAM,KAAK,CACf,sBAAsB,GAEhC,QAAO,OADwC,EAAE,mBAAmB,IAAI,CACpD;GAEtB;AAEF,cAAa;AACX,sBAAoB;AACpB,qBAAmB;AACnB,sBAAoB"}

package/dist/default/dom/features/track-playback-rate.js

@@ -1,5 +1,6 @@
+import { effect } from "../../core/signals/effect.js";
+import { computed, update } from "../../core/signals/primitives.js";
 import { listen } from "@videojs/utils/dom";
-
 //#region src/dom/features/track-playback-rate.ts
 /**
 * Track playback rate from the media element.
@@ -11,26 +12,21 @@ import { listen } from "@videojs/utils/dom";
 * const cleanup = trackPlaybackRate({ state, owners });
 */
 function trackPlaybackRate({ state, owners }) {
-	let lastMediaElement;
-	let removeListener = null;
-	const unsubscribe = owners.subscribe((currentOwners) => {
-		const { mediaElement } = currentOwners;
-		if (mediaElement === lastMediaElement) return;
-		removeListener?.();
-		removeListener = null;
-		lastMediaElement = mediaElement;
-		if (!mediaElement) return;
-		state.patch({ playbackRate: mediaElement.playbackRate });
-		removeListener = listen(mediaElement, "ratechange", () => {
-			state.patch({ playbackRate: mediaElement.playbackRate });
+	const mediaElementSignal = computed(() => owners.get().mediaElement);
+	const canTrackPlaybackRate = computed(() => !!mediaElementSignal.get());
+	const cleanupEffect = effect(() => {
+		if (!canTrackPlaybackRate.get()) return;
+		const mediaElement = mediaElementSignal.get();
+		update(state, { playbackRate: mediaElement.playbackRate });
+		return listen(mediaElement, "ratechange", () => {
+			update(state, { playbackRate: mediaElement.playbackRate });
 		});
 	});
 	return () => {
-		removeListener?.();
-		unsubscribe();
+		cleanupEffect();
 	};
 }
-
 //#endregion
 export { trackPlaybackRate };
+
 //# sourceMappingURL=track-playback-rate.js.map

package/dist/default/dom/features/track-playback-rate.js.map

@@ -1 +1 @@
-{"version":3,"file":"track-playback-rate.js","names":[],"sources":["../../../../src/dom/features/track-playback-rate.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport type { WritableState } from '../../core/state/create-state';\n\n/**\n * State shape for playback rate tracking.\n */\nexport interface PlaybackRateState {\n  playbackRate?: number;\n}\n\n/**\n * Owners shape for playback rate tracking.\n */\nexport interface PlaybackRateOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Check if we can track playback rate.\n *\n * Requires:\n * - mediaElement exists in owners\n */\nexport function canTrackPlaybackRate(owners: PlaybackRateOwners): boolean {\n  return !!owners.mediaElement;\n}\n\n/**\n * Track playback rate from the media element.\n *\n * Mirrors `mediaElement.playbackRate` into reactive state on each `ratechange`\n * event. Also syncs immediately when a media element becomes available.\n *\n * @example\n * const cleanup = trackPlaybackRate({ state, owners });\n */\nexport function trackPlaybackRate({\n  state,\n  owners,\n}: {\n  state: WritableState<PlaybackRateState>;\n  owners: WritableState<PlaybackRateOwners>;\n}): () => void {\n  let lastMediaElement: HTMLMediaElement | undefined;\n  let removeListener: (() => void) | null = null;\n\n  const unsubscribe = owners.subscribe((currentOwners) => {\n    const { mediaElement } = currentOwners;\n\n    if (mediaElement === lastMediaElement) return;\n\n    removeListener?.();\n    removeListener = null;\n    lastMediaElement = mediaElement;\n\n    if (!mediaElement) return;\n\n    state.patch({ playbackRate: mediaElement.playbackRate });\n\n    removeListener = listen(mediaElement, 'ratechange', () => {\n      state.patch({ playbackRate: mediaElement.playbackRate });\n    });\n  });\n\n  return () => {\n    removeListener?.();\n    unsubscribe();\n  };\n}\n"],"mappings":";;;;;;;;;;;;AAoCA,SAAgB,kBAAkB,EAChC,OACA,UAIa;CACb,IAAI;CACJ,IAAI,iBAAsC;CAE1C,MAAM,cAAc,OAAO,WAAW,kBAAkB;EACtD,MAAM,EAAE,iBAAiB;AAEzB,MAAI,iBAAiB,iBAAkB;AAEvC,oBAAkB;AAClB,mBAAiB;AACjB,qBAAmB;AAEnB,MAAI,CAAC,aAAc;AAEnB,QAAM,MAAM,EAAE,cAAc,aAAa,cAAc,CAAC;AAExD,mBAAiB,OAAO,cAAc,oBAAoB;AACxD,SAAM,MAAM,EAAE,cAAc,aAAa,cAAc,CAAC;IACxD;GACF;AAEF,cAAa;AACX,oBAAkB;AAClB,eAAa"}
+{"version":3,"file":"track-playback-rate.js","names":[],"sources":["../../../../src/dom/features/track-playback-rate.ts"],"sourcesContent":["import { listen } from '@videojs/utils/dom';\nimport { effect } from '../../core/signals/effect';\nimport { computed, type Signal, update } from '../../core/signals/primitives';\n\n/**\n * State shape for playback rate tracking.\n */\nexport interface PlaybackRateState {\n  playbackRate?: number;\n}\n\n/**\n * Owners shape for playback rate tracking.\n */\nexport interface PlaybackRateOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n}\n\n/**\n * Track playback rate from the media element.\n *\n * Mirrors `mediaElement.playbackRate` into reactive state on each `ratechange`\n * event. Also syncs immediately when a media element becomes available.\n *\n * @example\n * const cleanup = trackPlaybackRate({ state, owners });\n */\nexport function trackPlaybackRate<O extends PlaybackRateOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<PlaybackRateState>;\n  owners: Signal<O>;\n}): () => void {\n  const mediaElementSignal = computed(() => owners.get().mediaElement);\n  const canTrackPlaybackRate = computed(() => !!mediaElementSignal.get());\n\n  const cleanupEffect = effect(() => {\n    if (!canTrackPlaybackRate.get()) return;\n    const mediaElement = mediaElementSignal.get() as HTMLMediaElement;\n\n    update(state, { playbackRate: mediaElement.playbackRate });\n\n    return listen(mediaElement, 'ratechange', () => {\n      update(state, { playbackRate: mediaElement.playbackRate });\n    });\n  });\n\n  return () => {\n    cleanupEffect();\n  };\n}\n"],"mappings":";;;;;;;;;;;;;AA2BA,SAAgB,kBAAgD,EAC9D,OACA,UAIa;CACb,MAAM,qBAAqB,eAAe,OAAO,KAAK,CAAC,aAAa;CACpE,MAAM,uBAAuB,eAAe,CAAC,CAAC,mBAAmB,KAAK,CAAC;CAEvE,MAAM,gBAAgB,aAAa;AACjC,MAAI,CAAC,qBAAqB,KAAK,CAAE;EACjC,MAAM,eAAe,mBAAmB,KAAK;AAE7C,SAAO,OAAO,EAAE,cAAc,aAAa,cAAc,CAAC;AAE1D,SAAO,OAAO,cAAc,oBAAoB;AAC9C,UAAO,OAAO,EAAE,cAAc,aAAa,cAAc,CAAC;IAC1D;GACF;AAEF,cAAa;AACX,iBAAe"}

package/dist/default/dom/features/update-duration.js

@@ -1,6 +1,5 @@
+import { effect } from "../../core/signals/effect.js";
 import { hasPresentationDuration } from "../../core/types/index.js";
-import { combineLatest } from "../../core/reactive/combine-latest.js";
-
 //#region src/dom/features/update-duration.ts
 /**
 * Check if we can update MediaSource duration (have required data).
@@ -30,7 +29,7 @@ function shouldUpdateDuration(state, owners) {
 	if (!canUpdateDuration(state, owners)) return false;
 	const { mediaSource } = owners;
 	const { presentation } = state;
-	if (mediaSource.readyState !== "open") return false;
+	if ((owners.mediaSourceReadyState?.get() ?? owners.mediaSource?.readyState) !== "open") return false;
 	const duration = presentation.duration;
 	if (!Number.isFinite(duration) || Number.isNaN(duration) || duration <= 0) return false;
 	return Number.isNaN(mediaSource.duration);
@@ -51,22 +50,29 @@ function waitForSourceBuffersReady(owners) {
 */
 function updateDuration({ state, owners }) {
 	let destroyed = false;
-	const unsubscribe = combineLatest([state, owners]).subscribe(async ([currentState, currentOwners]) => {
-		if (!shouldUpdateDuration(currentState, currentOwners)) return;
+	let running = false;
+	const cleanupEffect = effect(() => {
+		const currentState = state.get();
+		const currentOwners = owners.get();
+		if (!shouldUpdateDuration(currentState, currentOwners) || running) return;
 		const { mediaSource } = currentOwners;
-		await waitForSourceBuffersReady(currentOwners);
-		if (destroyed || mediaSource.readyState !== "open") return;
-		let duration = currentState.presentation.duration;
-		const maxBufferedEnd = getMaxBufferedEnd(currentOwners);
-		if (maxBufferedEnd > duration) duration = maxBufferedEnd;
-		mediaSource.duration = duration;
+		running = true;
+		waitForSourceBuffersReady(currentOwners).then(() => {
+			if (destroyed || mediaSource.readyState !== "open") return;
+			let duration = currentState.presentation.duration;
+			const maxBufferedEnd = getMaxBufferedEnd(currentOwners);
+			if (maxBufferedEnd > duration) duration = maxBufferedEnd;
+			mediaSource.duration = duration;
+		}).finally(() => {
+			running = false;
+		});
 	});
 	return () => {
 		destroyed = true;
-		unsubscribe();
+		cleanupEffect();
 	};
 }
-
 //#endregion
 export { updateDuration };
+
 //# sourceMappingURL=update-duration.js.map

package/dist/default/dom/features/update-duration.js.map

@@ -1 +1 @@
-{"version":3,"file":"update-duration.js","names":[],"sources":["../../../../src/dom/features/update-duration.ts"],"sourcesContent":["import { combineLatest } from '../../core/reactive/combine-latest';\nimport type { WritableState } from '../../core/state/create-state';\nimport type { Presentation } from '../../core/types';\nimport { hasPresentationDuration } from '../../core/types';\n\nexport interface DurationUpdateState {\n  presentation?: Presentation;\n}\n\nexport interface DurationUpdateOwners {\n  mediaSource?: MediaSource;\n  videoSourceBuffer?: SourceBuffer;\n  audioSourceBuffer?: SourceBuffer;\n}\n\n/**\n * Check if we can update MediaSource duration (have required data).\n */\nexport function canUpdateDuration(state: DurationUpdateState, owners: DurationUpdateOwners): boolean {\n  return !!(owners.mediaSource && state.presentation && hasPresentationDuration(state.presentation));\n}\n\n/**\n * Get the maximum buffered end time across all SourceBuffers.\n */\nexport function getMaxBufferedEnd(owners: DurationUpdateOwners): number {\n  let maxEnd = 0;\n\n  const buffers = [owners.videoSourceBuffer, owners.audioSourceBuffer].filter(\n    (buf): buf is SourceBuffer => buf !== undefined\n  );\n\n  for (const buffer of buffers) {\n    const { buffered } = buffer;\n    if (buffered.length > 0) {\n      const end = buffered.end(buffered.length - 1);\n      if (end > maxEnd) {\n        maxEnd = end;\n      }\n    }\n  }\n\n  return maxEnd;\n}\n\n/**\n * Check if we should update MediaSource duration (conditions met).\n */\nexport function shouldUpdateDuration(state: DurationUpdateState, owners: DurationUpdateOwners): boolean {\n  if (!canUpdateDuration(state, owners)) return false;\n\n  const { mediaSource } = owners;\n  const { presentation } = state;\n\n  // MediaSource must be open\n  if (mediaSource!.readyState !== 'open') return false;\n\n  const duration = presentation!.duration!;\n\n  // Validate duration: finite, positive, not NaN\n  if (!Number.isFinite(duration) || Number.isNaN(duration) || duration <= 0) return false;\n\n  // Only set duration on initial MediaSource setup, when it hasn't been set yet.\n  // A freshly opened MediaSource has duration === NaN. Once set (either by this\n  // task or by endOfStreamTask from buffered.end()), we leave it alone — attempting\n  // to re-sync a slight drift between mediaSource.duration and presentation.duration\n  // races with concurrent appendBuffer() calls from loadSegmentsTask.\n  return Number.isNaN(mediaSource!.duration);\n}\n\n/**\n * Wait for all currently-updating SourceBuffers to finish.\n *\n * The MSE spec forbids setting MediaSource.duration while any attached\n * SourceBuffer has updating === true. This defers until all are idle.\n */\nfunction waitForSourceBuffersReady(owners: DurationUpdateOwners): Promise<void> {\n  const updating = [owners.videoSourceBuffer, owners.audioSourceBuffer].filter(\n    (buf): buf is SourceBuffer => buf?.updating === true\n  );\n\n  if (updating.length === 0) return Promise.resolve();\n\n  return Promise.all(\n    updating.map(\n      (buf) => new Promise<void>((resolve) => buf.addEventListener('updateend', () => resolve(), { once: true }))\n    )\n  ).then(() => undefined);\n}\n\n/**\n * Update MediaSource duration when presentation duration becomes available.\n */\nexport function updateDuration({\n  state,\n  owners,\n}: {\n  state: WritableState<DurationUpdateState>;\n  owners: WritableState<DurationUpdateOwners>;\n}): () => void {\n  let destroyed = false;\n\n  const unsubscribe = combineLatest([state, owners]).subscribe(\n    async ([currentState, currentOwners]: [DurationUpdateState, DurationUpdateOwners]) => {\n      if (!shouldUpdateDuration(currentState, currentOwners)) return;\n\n      const { mediaSource } = currentOwners;\n\n      // MSE spec: duration cannot be set while any SourceBuffer is updating\n      await waitForSourceBuffersReady(currentOwners);\n\n      // Re-check after async wait: destroyed, or readyState changed (e.g. endOfStream\n      // already called endOfStream(), transitioning 'open' → 'ended').\n      if (destroyed || mediaSource!.readyState !== 'open') return;\n\n      let duration = currentState.presentation!.duration!;\n\n      // Get max buffered end time across all SourceBuffers\n      const maxBufferedEnd = getMaxBufferedEnd(currentOwners);\n\n      // MSE spec: duration cannot be less than any buffered range\n      // If buffered ranges exceed calculated duration, extend to match\n      if (maxBufferedEnd > duration) {\n        duration = maxBufferedEnd;\n      }\n\n      // Set duration on MediaSource\n      mediaSource!.duration = duration;\n    }\n  );\n\n  return () => {\n    destroyed = true;\n    unsubscribe();\n  };\n}\n"],"mappings":";;;;;;;AAkBA,SAAgB,kBAAkB,OAA4B,QAAuC;AACnG,QAAO,CAAC,EAAE,OAAO,eAAe,MAAM,gBAAgB,wBAAwB,MAAM,aAAa;;;;;AAMnG,SAAgB,kBAAkB,QAAsC;CACtE,IAAI,SAAS;CAEb,MAAM,UAAU,CAAC,OAAO,mBAAmB,OAAO,kBAAkB,CAAC,QAClE,QAA6B,QAAQ,OACvC;AAED,MAAK,MAAM,UAAU,SAAS;EAC5B,MAAM,EAAE,aAAa;AACrB,MAAI,SAAS,SAAS,GAAG;GACvB,MAAM,MAAM,SAAS,IAAI,SAAS,SAAS,EAAE;AAC7C,OAAI,MAAM,OACR,UAAS;;;AAKf,QAAO;;;;;AAMT,SAAgB,qBAAqB,OAA4B,QAAuC;AACtG,KAAI,CAAC,kBAAkB,OAAO,OAAO,CAAE,QAAO;CAE9C,MAAM,EAAE,gBAAgB;CACxB,MAAM,EAAE,iBAAiB;AAGzB,KAAI,YAAa,eAAe,OAAQ,QAAO;CAE/C,MAAM,WAAW,aAAc;AAG/B,KAAI,CAAC,OAAO,SAAS,SAAS,IAAI,OAAO,MAAM,SAAS,IAAI,YAAY,EAAG,QAAO;AAOlF,QAAO,OAAO,MAAM,YAAa,SAAS;;;;;;;;AAS5C,SAAS,0BAA0B,QAA6C;CAC9E,MAAM,WAAW,CAAC,OAAO,mBAAmB,OAAO,kBAAkB,CAAC,QACnE,QAA6B,KAAK,aAAa,KACjD;AAED,KAAI,SAAS,WAAW,EAAG,QAAO,QAAQ,SAAS;AAEnD,QAAO,QAAQ,IACb,SAAS,KACN,QAAQ,IAAI,SAAe,YAAY,IAAI,iBAAiB,mBAAmB,SAAS,EAAE,EAAE,MAAM,MAAM,CAAC,CAAC,CAC5G,CACF,CAAC,WAAW,OAAU;;;;;AAMzB,SAAgB,eAAe,EAC7B,OACA,UAIa;CACb,IAAI,YAAY;CAEhB,MAAM,cAAc,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,UACjD,OAAO,CAAC,cAAc,mBAAgE;AACpF,MAAI,CAAC,qBAAqB,cAAc,cAAc,CAAE;EAExD,MAAM,EAAE,gBAAgB;AAGxB,QAAM,0BAA0B,cAAc;AAI9C,MAAI,aAAa,YAAa,eAAe,OAAQ;EAErD,IAAI,WAAW,aAAa,aAAc;EAG1C,MAAM,iBAAiB,kBAAkB,cAAc;AAIvD,MAAI,iBAAiB,SACnB,YAAW;AAIb,cAAa,WAAW;GAE3B;AAED,cAAa;AACX,cAAY;AACZ,eAAa"}
+{"version":3,"file":"update-duration.js","names":[],"sources":["../../../../src/dom/features/update-duration.ts"],"sourcesContent":["import { effect } from '../../core/signals/effect';\nimport type { ReadonlySignal, Signal } from '../../core/signals/primitives';\nimport type { Presentation } from '../../core/types';\nimport { hasPresentationDuration } from '../../core/types';\n\nexport interface DurationUpdateState {\n  presentation?: Presentation;\n}\n\nexport interface DurationUpdateOwners {\n  mediaSource?: MediaSource;\n  /** Reactive mirror of `mediaSource.readyState` — updated via DOM events. */\n  mediaSourceReadyState?: ReadonlySignal<MediaSource['readyState']>;\n  videoSourceBuffer?: SourceBuffer;\n  audioSourceBuffer?: SourceBuffer;\n}\n\n/**\n * Check if we can update MediaSource duration (have required data).\n */\nexport function canUpdateDuration(state: DurationUpdateState, owners: DurationUpdateOwners): boolean {\n  return !!(owners.mediaSource && state.presentation && hasPresentationDuration(state.presentation));\n}\n\n/**\n * Get the maximum buffered end time across all SourceBuffers.\n */\nexport function getMaxBufferedEnd(owners: DurationUpdateOwners): number {\n  let maxEnd = 0;\n\n  const buffers = [owners.videoSourceBuffer, owners.audioSourceBuffer].filter(\n    (buf): buf is SourceBuffer => buf !== undefined\n  );\n\n  for (const buffer of buffers) {\n    const { buffered } = buffer;\n    if (buffered.length > 0) {\n      const end = buffered.end(buffered.length - 1);\n      if (end > maxEnd) {\n        maxEnd = end;\n      }\n    }\n  }\n\n  return maxEnd;\n}\n\n/**\n * Check if we should update MediaSource duration (conditions met).\n */\nexport function shouldUpdateDuration(state: DurationUpdateState, owners: DurationUpdateOwners): boolean {\n  if (!canUpdateDuration(state, owners)) return false;\n\n  const { mediaSource } = owners;\n  const { presentation } = state;\n\n  // MediaSource must be open — use reactive readyState signal when available\n  // so the effect re-evaluates when readyState changes from 'closed' to 'open'.\n  const readyState = owners.mediaSourceReadyState?.get() ?? owners.mediaSource?.readyState;\n  if (readyState !== 'open') return false;\n\n  const duration = presentation!.duration!;\n\n  // Validate duration: finite, positive, not NaN\n  if (!Number.isFinite(duration) || Number.isNaN(duration) || duration <= 0) return false;\n\n  // Only set duration on initial MediaSource setup, when it hasn't been set yet.\n  // A freshly opened MediaSource has duration === NaN. Once set (either by this\n  // task or by endOfStreamTask from buffered.end()), we leave it alone — attempting\n  // to re-sync a slight drift between mediaSource.duration and presentation.duration\n  // races with concurrent appendBuffer() calls from loadSegmentsTask.\n  return Number.isNaN(mediaSource!.duration);\n}\n\n/**\n * Wait for all currently-updating SourceBuffers to finish.\n *\n * The MSE spec forbids setting MediaSource.duration while any attached\n * SourceBuffer has updating === true. This defers until all are idle.\n */\nfunction waitForSourceBuffersReady(owners: DurationUpdateOwners): Promise<void> {\n  const updating = [owners.videoSourceBuffer, owners.audioSourceBuffer].filter(\n    (buf): buf is SourceBuffer => buf?.updating === true\n  );\n\n  if (updating.length === 0) return Promise.resolve();\n\n  return Promise.all(\n    updating.map(\n      (buf) => new Promise<void>((resolve) => buf.addEventListener('updateend', () => resolve(), { once: true }))\n    )\n  ).then(() => undefined);\n}\n\n/**\n * Update MediaSource duration when presentation duration becomes available.\n */\nexport function updateDuration<S extends DurationUpdateState, O extends DurationUpdateOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  let destroyed = false;\n  let running = false;\n\n  const cleanupEffect = effect(() => {\n    const currentState = state.get();\n    const currentOwners = owners.get();\n\n    if (!shouldUpdateDuration(currentState, currentOwners) || running) return;\n\n    const { mediaSource } = currentOwners;\n    running = true;\n\n    // MSE spec: duration cannot be set while any SourceBuffer is updating.\n    // Capture the snapshot; the async helper does not read signals.\n    waitForSourceBuffersReady(currentOwners)\n      .then(() => {\n        // Re-check after async wait: destroyed, or readyState changed (e.g. endOfStream\n        // already called endOfStream(), transitioning 'open' → 'ended').\n        if (destroyed || mediaSource!.readyState !== 'open') return;\n\n        let duration = currentState.presentation!.duration!;\n\n        // MSE spec: duration cannot be less than any buffered range.\n        // If buffered ranges exceed calculated duration, extend to match.\n        const maxBufferedEnd = getMaxBufferedEnd(currentOwners);\n        if (maxBufferedEnd > duration) {\n          duration = maxBufferedEnd;\n        }\n\n        mediaSource!.duration = duration;\n      })\n      .finally(() => {\n        running = false;\n      });\n  });\n\n  return () => {\n    destroyed = true;\n    cleanupEffect();\n  };\n}\n"],"mappings":";;;;;;AAoBA,SAAgB,kBAAkB,OAA4B,QAAuC;AACnG,QAAO,CAAC,EAAE,OAAO,eAAe,MAAM,gBAAgB,wBAAwB,MAAM,aAAa;;;;;AAMnG,SAAgB,kBAAkB,QAAsC;CACtE,IAAI,SAAS;CAEb,MAAM,UAAU,CAAC,OAAO,mBAAmB,OAAO,kBAAkB,CAAC,QAClE,QAA6B,QAAQ,KAAA,EACvC;AAED,MAAK,MAAM,UAAU,SAAS;EAC5B,MAAM,EAAE,aAAa;AACrB,MAAI,SAAS,SAAS,GAAG;GACvB,MAAM,MAAM,SAAS,IAAI,SAAS,SAAS,EAAE;AAC7C,OAAI,MAAM,OACR,UAAS;;;AAKf,QAAO;;;;;AAMT,SAAgB,qBAAqB,OAA4B,QAAuC;AACtG,KAAI,CAAC,kBAAkB,OAAO,OAAO,CAAE,QAAO;CAE9C,MAAM,EAAE,gBAAgB;CACxB,MAAM,EAAE,iBAAiB;AAKzB,MADmB,OAAO,uBAAuB,KAAK,IAAI,OAAO,aAAa,gBAC3D,OAAQ,QAAO;CAElC,MAAM,WAAW,aAAc;AAG/B,KAAI,CAAC,OAAO,SAAS,SAAS,IAAI,OAAO,MAAM,SAAS,IAAI,YAAY,EAAG,QAAO;AAOlF,QAAO,OAAO,MAAM,YAAa,SAAS;;;;;;;;AAS5C,SAAS,0BAA0B,QAA6C;CAC9E,MAAM,WAAW,CAAC,OAAO,mBAAmB,OAAO,kBAAkB,CAAC,QACnE,QAA6B,KAAK,aAAa,KACjD;AAED,KAAI,SAAS,WAAW,EAAG,QAAO,QAAQ,SAAS;AAEnD,QAAO,QAAQ,IACb,SAAS,KACN,QAAQ,IAAI,SAAe,YAAY,IAAI,iBAAiB,mBAAmB,SAAS,EAAE,EAAE,MAAM,MAAM,CAAC,CAAC,CAC5G,CACF,CAAC,WAAW,KAAA,EAAU;;;;;AAMzB,SAAgB,eAA8E,EAC5F,OACA,UAIa;CACb,IAAI,YAAY;CAChB,IAAI,UAAU;CAEd,MAAM,gBAAgB,aAAa;EACjC,MAAM,eAAe,MAAM,KAAK;EAChC,MAAM,gBAAgB,OAAO,KAAK;AAElC,MAAI,CAAC,qBAAqB,cAAc,cAAc,IAAI,QAAS;EAEnE,MAAM,EAAE,gBAAgB;AACxB,YAAU;AAIV,4BAA0B,cAAc,CACrC,WAAW;AAGV,OAAI,aAAa,YAAa,eAAe,OAAQ;GAErD,IAAI,WAAW,aAAa,aAAc;GAI1C,MAAM,iBAAiB,kBAAkB,cAAc;AACvD,OAAI,iBAAiB,SACnB,YAAW;AAGb,eAAa,WAAW;IACxB,CACD,cAAc;AACb,aAAU;IACV;GACJ;AAEF,cAAa;AACX,cAAY;AACZ,iBAAe"}

package/dist/default/dom/media/append-segment.js

@@ -54,7 +54,7 @@ async function appendChunk(sourceBuffer, data) {
 		}
 	});
 }
-
 //#endregion
 export { appendSegment };
+
 //# sourceMappingURL=append-segment.js.map

package/dist/default/dom/media/buffer-flusher.js

@@ -49,7 +49,7 @@ async function flushBuffer(sourceBuffer, start, end) {
 		}
 	});
 }
-
 //#endregion
 export { flushBuffer };
+
 //# sourceMappingURL=buffer-flusher.js.map

package/dist/default/dom/media/mediasource-setup.js

@@ -1,3 +1,4 @@
+import { signal } from "../../core/signals/primitives.js";
 //#region src/dom/media/mediasource-setup.ts
 /**
 * MediaSource Setup
@@ -50,7 +51,6 @@ function createMediaSource(options = {}) {
 * @example
 * const mediaSource = createMediaSource();
 * const { detach } = attachMediaSource(mediaSource, videoElement);
-* await waitForSourceOpen(mediaSource);
 * // Use mediaSource...
 * // Later, to clean up:
 * detach();
@@ -81,42 +81,6 @@ function attachMediaSource(mediaSource, mediaElement) {
 	};
 }
 /**
-* Wait for a MediaSource to reach the 'open' state.
-* Resolves immediately if already open.
-*
-* @param mediaSource - The MediaSource to wait for
-* @param signal - Optional AbortSignal for cancellation
-* @returns Promise that resolves when the MediaSource is open
-*
-* @example
-* const mediaSource = createMediaSource();
-* attachMediaSource(mediaSource, videoElement);
-* await waitForSourceOpen(mediaSource);
-* // MediaSource is now ready for SourceBuffer creation
-*/
-function waitForSourceOpen(mediaSource, signal) {
-	return new Promise((resolve, reject) => {
-		if (mediaSource.readyState === "open") {
-			resolve();
-			return;
-		}
-		if (signal?.aborted) {
-			reject(new DOMException("Aborted", "AbortError"));
-			return;
-		}
-		const controller = new AbortController();
-		const options = { signal: controller.signal };
-		mediaSource.addEventListener("sourceopen", () => {
-			controller.abort();
-			resolve();
-		}, options);
-		signal?.addEventListener("abort", () => {
-			controller.abort();
-			reject(new DOMException("Aborted", "AbortError"));
-		}, options);
-	});
-}
-/**
 * Create a SourceBuffer on a MediaSource.
 *
 * @param mediaSource - The MediaSource (must be in 'open' state)
@@ -125,7 +89,6 @@ function waitForSourceOpen(mediaSource, signal) {
 * @throws Error if MediaSource is not open or codec is unsupported
 *
 * @example
-* await waitForSourceOpen(mediaSource);
 * const buffer = createSourceBuffer(mediaSource, 'video/mp4; codecs="avc1.42E01E"');
 */
 function createSourceBuffer(mediaSource, mimeCodec) {
@@ -148,7 +111,36 @@ function isCodecSupported(mimeCodec) {
 	if (!supportsMediaSource()) return false;
 	return MediaSource.isTypeSupported(mimeCodec);
 }
-
+/**
+* Create a reactive signal that mirrors `mediaSource.readyState`.
+*
+* Listens to `sourceopen`, `sourceended`, and `sourceclose` events and updates
+* the signal accordingly, making readyState visible to the TC39 signal graph.
+* Listeners are automatically removed when `signal` is aborted.
+*
+* @param mediaSource - The MediaSource to observe
+* @param signal - AbortSignal that controls listener lifetime
+* @returns A `Signal.ReadonlyState` that reflects the current `readyState`
+*
+* @example
+* const controller = new AbortController();
+* const readyState = observeMediaSourceReadyState(mediaSource, controller.signal);
+* effect(() => {
+*   if (readyState.get() === 'open') { ... }
+* });
+* // Later:
+* controller.abort();
+*/
+function observeMediaSourceReadyState(mediaSource, abortSignal) {
+	const readyState = signal(mediaSource.readyState);
+	const update = () => readyState.set(mediaSource.readyState);
+	const options = { signal: abortSignal };
+	mediaSource.addEventListener("sourceopen", update, options);
+	mediaSource.addEventListener("sourceended", update, options);
+	mediaSource.addEventListener("sourceclose", update, options);
+	return readyState;
+}
 //#endregion
-export { attachMediaSource, createMediaSource, createSourceBuffer, isCodecSupported, supportsManagedMediaSource, supportsMediaSource, waitForSourceOpen };
+export { attachMediaSource, createMediaSource, createSourceBuffer, observeMediaSourceReadyState };
+
 //# sourceMappingURL=mediasource-setup.js.map