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

package/dist/dev/dom/features/setup-sourcebuffer.js

@@ -1,11 +1,14 @@
+import { effect } from "../../core/signals/effect.js";
+import { computed, update } from "../../core/signals/primitives.js";
 import { isResolvedTrack } from "../../core/types/index.js";
+import { BufferKeyByType, getSelectedTrack } from "../../core/utils/track-selection.js";
 import { createSourceBuffer } from "../media/mediasource-setup.js";
-import { combineLatest } from "../../core/reactive/combine-latest.js";
-import { getSelectedTrack } from "../../core/utils/track-selection.js";
 import { createSourceBufferActor } from "../media/source-buffer-actor.js";
-import "@videojs/utils/predicate";
-
 //#region src/dom/features/setup-sourcebuffer.ts
+const ActorKeyByType = {
+	video: "videoBufferActor",
+	audio: "audioBufferActor"
+};
 /**
 * Build MIME codec string from track metadata.
 *
@@ -23,48 +26,53 @@ function buildMimeCodec(track) {
 /**
 * Setup all needed SourceBuffers as a single coordinated operation.
 *
-* Waits until ALL selected tracks (video and/or audio) are resolved with
-* codecs, then creates every SourceBuffer in one synchronous block before
-* patching owners. This guarantees that downstream consumers (e.g.
-* loadSegments) never see a partial set of SourceBuffers — preventing the
-* Firefox bug where appending to a video SourceBuffer before the audio
-* SourceBuffer exists causes mozHasAudio to be permanently false.
+* Waits until ALL media tracks in the presentation are resolved with codecs,
+* then creates every SourceBuffer in one synchronous block before setting
+* owners. This guarantees that downstream consumers (e.g. loadSegments) never
+* see a partial set of SourceBuffers — preventing the Firefox bug where
+* appending to a video SourceBuffer before the audio SourceBuffer exists
+* causes mozHasAudio to be permanently false.
 *
 * Handles video-only, audio-only, and combined presentations correctly:
-* only the tracks that are actually selected are waited on and created.
+* track types are derived from the presentation rather than hardcoded.
 *
 * @example
 * const cleanup = setupSourceBuffers({ state, owners });
 */
 function setupSourceBuffers({ state, owners }) {
-	let setupDone = false;
-	return combineLatest([state, owners]).subscribe(async ([currentState, currentOwners]) => {
-		if (setupDone) return;
-		if (!currentOwners.mediaSource) return;
-		const videoSelected = !!currentState.selectedVideoTrackId;
-		const audioSelected = !!currentState.selectedAudioTrackId;
-		if (!videoSelected && !audioSelected) return;
-		const videoTrack = videoSelected ? getSelectedTrack(currentState, "video") : null;
-		const audioTrack = audioSelected ? getSelectedTrack(currentState, "audio") : null;
-		if (videoSelected && (!videoTrack || !isResolvedTrack(videoTrack) || !videoTrack.codecs?.length)) return;
-		if (audioSelected && (!audioTrack || !isResolvedTrack(audioTrack) || !audioTrack.codecs?.length)) return;
-		setupDone = true;
+	const presentationTypesSignal = computed(() => {
+		const { presentation } = state.get();
+		if (!presentation || !("selectionSets" in presentation)) return [];
+		return presentation.selectionSets.map(({ type }) => type).filter((type) => type === "video" || type === "audio");
+	});
+	const canSetupSignal = computed(() => {
+		const types = presentationTypesSignal.get();
+		if (!owners.get().mediaSource || types.length === 0) return false;
+		const s = state.get();
+		return types.every((type) => {
+			const track = getSelectedTrack(s, type);
+			return track && isResolvedTrack(track) && !!track.codecs?.length;
+		});
+	});
+	const shouldSetupSignal = computed(() => {
+		const o = owners.get();
+		return presentationTypesSignal.get().every((type) => !o[BufferKeyByType[type]]);
+	});
+	return effect(() => {
+		if (!canSetupSignal.get() || !shouldSetupSignal.get()) return;
+		const s = state.get();
+		const o = owners.get();
 		const patch = {};
-		if (videoSelected && videoTrack && isResolvedTrack(videoTrack)) {
-			const buffer = createSourceBuffer(currentOwners.mediaSource, buildMimeCodec(videoTrack));
-			patch.videoBuffer = buffer;
-			patch.videoBufferActor = createSourceBufferActor(buffer);
+		for (const type of presentationTypesSignal.get()) {
+			const track = getSelectedTrack(s, type);
+			const buffer = createSourceBuffer(o.mediaSource, buildMimeCodec(track));
+			patch[BufferKeyByType[type]] = buffer;
+			patch[ActorKeyByType[type]] = createSourceBufferActor(buffer);
 		}
-		if (audioSelected && audioTrack && isResolvedTrack(audioTrack)) {
-			const buffer = createSourceBuffer(currentOwners.mediaSource, buildMimeCodec(audioTrack));
-			patch.audioBuffer = buffer;
-			patch.audioBufferActor = createSourceBufferActor(buffer);
-		}
-		owners.patch(patch);
-		await new Promise((resolve) => requestAnimationFrame(resolve));
+		update(owners, patch);
 	});
 }
-
 //#endregion
 export { setupSourceBuffers };
+
 //# sourceMappingURL=setup-sourcebuffer.js.map

package/dist/dev/dom/features/setup-sourcebuffer.js.map

@@ -1 +1 @@
-{"version":3,"file":"setup-sourcebuffer.js","names":[],"sources":["../../../../src/dom/features/setup-sourcebuffer.ts"],"sourcesContent":["import { isUndefined } from '@videojs/utils/predicate';\nimport { combineLatest } from '../../core/reactive/combine-latest';\nimport type { WritableState } from '../../core/state/create-state';\nimport type { Presentation, ResolvedTrack } from '../../core/types';\nimport { isResolvedTrack } from '../../core/types';\nimport { BufferKeyByType, getSelectedTrack, type TrackSelectionState } from '../../core/utils/track-selection';\nimport { createSourceBuffer } from '../media/mediasource-setup';\nimport { createSourceBufferActor, type SourceBufferActor } from '../media/source-buffer-actor';\n\n/**\n * Media track type for SourceBuffer setup.\n * Text tracks are excluded as they don't use MSE SourceBuffers.\n */\nexport type MediaTrackType = 'video' | 'audio';\n\n/**\n * State shape for SourceBuffer setup.\n */\nexport interface SourceBufferState extends TrackSelectionState {\n  presentation?: Presentation;\n  selectedVideoTrackId?: string;\n  selectedAudioTrackId?: string;\n}\n\n/**\n * Owners shape for SourceBuffer setup.\n */\nexport interface SourceBufferOwners {\n  mediaSource?: MediaSource;\n  videoBuffer?: SourceBuffer;\n  audioBuffer?: SourceBuffer;\n  videoBufferActor?: SourceBufferActor;\n  audioBufferActor?: SourceBufferActor;\n}\n\n/**\n * Build MIME codec string from track metadata.\n *\n * @param track - Resolved track with mimeType and codecs\n * @returns MIME codec string (e.g., 'video/mp4; codecs=\"avc1.42E01E,mp4a.40.2\"')\n *\n * @example\n * buildMimeCodec({ mimeType: 'video/mp4', codecs: ['avc1.42E01E'] })\n * // => 'video/mp4; codecs=\"avc1.42E01E\"'\n */\nexport function buildMimeCodec(track: ResolvedTrack): string {\n  const codecString = track.codecs?.join(',') ?? '';\n  return `${track.mimeType}; codecs=\"${codecString}\"`;\n}\n\n/**\n * Check if we can setup SourceBuffer for track type.\n *\n * Requires:\n * - MediaSource exists in owners\n * - Track is selected\n *\n * Note: We don't check mediaSource.readyState because owners holds references\n * to mutable objects. Changes to properties on those objects won't trigger\n * observations. Instead, setupMediaSource only patches owners.mediaSource after\n * it's already open, so if it exists in owners, it's ready to use.\n *\n * Note: Track does not need to be resolved yet. The orchestration will wait\n * for the track to be resolved (via resolveTrack) before creating the SourceBuffer.\n */\nexport function canSetupBuffer(state: SourceBufferState, owners: SourceBufferOwners, type: MediaTrackType): boolean {\n  // MediaSource exists (already open - see note above)\n  if (!owners.mediaSource) {\n    return false;\n  }\n\n  // Need selected track (doesn't need to be resolved yet)\n  const track = getSelectedTrack(state, type);\n  if (!track) {\n    return false;\n  }\n\n  return true;\n}\n\n/**\n * Check if we should create SourceBuffer (not already created).\n */\nexport function shouldSetupBuffer(owners: SourceBufferOwners, type: MediaTrackType): boolean {\n  const bufferKey = BufferKeyByType[type];\n  return isUndefined(owners[bufferKey]);\n}\n\n/**\n * Setup all needed SourceBuffers as a single coordinated operation.\n *\n * Waits until ALL selected tracks (video and/or audio) are resolved with\n * codecs, then creates every SourceBuffer in one synchronous block before\n * patching owners. This guarantees that downstream consumers (e.g.\n * loadSegments) never see a partial set of SourceBuffers — preventing the\n * Firefox bug where appending to a video SourceBuffer before the audio\n * SourceBuffer exists causes mozHasAudio to be permanently false.\n *\n * Handles video-only, audio-only, and combined presentations correctly:\n * only the tracks that are actually selected are waited on and created.\n *\n * @example\n * const cleanup = setupSourceBuffers({ state, owners });\n */\nexport function setupSourceBuffers({\n  state,\n  owners,\n}: {\n  state: WritableState<SourceBufferState>;\n  owners: WritableState<SourceBufferOwners>;\n}): () => void {\n  let setupDone = false;\n\n  const cleanup = combineLatest([state, owners]).subscribe(\n    async ([currentState, currentOwners]: [SourceBufferState, SourceBufferOwners]) => {\n      if (setupDone) return;\n      if (!currentOwners.mediaSource) return;\n\n      const videoSelected = !!currentState.selectedVideoTrackId;\n      const audioSelected = !!currentState.selectedAudioTrackId;\n\n      if (!videoSelected && !audioSelected) return;\n\n      const videoTrack = videoSelected ? getSelectedTrack(currentState, 'video') : null;\n      const audioTrack = audioSelected ? getSelectedTrack(currentState, 'audio') : null;\n\n      // Wait until every selected track is resolved with codecs before\n      // creating any SourceBuffer. This is the coordination guarantee.\n      if (videoSelected && (!videoTrack || !isResolvedTrack(videoTrack) || !videoTrack.codecs?.length)) return;\n      if (audioSelected && (!audioTrack || !isResolvedTrack(audioTrack) || !audioTrack.codecs?.length)) return;\n\n      setupDone = true;\n\n      // Create all SourceBuffers synchronously — no await between addSourceBuffer\n      // calls — then patch owners once so subscribers see all buffers simultaneously.\n      const patch: Partial<SourceBufferOwners> = {};\n\n      if (videoSelected && videoTrack && isResolvedTrack(videoTrack)) {\n        const buffer = createSourceBuffer(currentOwners.mediaSource!, buildMimeCodec(videoTrack));\n        patch.videoBuffer = buffer;\n        patch.videoBufferActor = createSourceBufferActor(buffer);\n      }\n\n      if (audioSelected && audioTrack && isResolvedTrack(audioTrack)) {\n        const buffer = createSourceBuffer(currentOwners.mediaSource!, buildMimeCodec(audioTrack));\n        patch.audioBuffer = buffer;\n        patch.audioBufferActor = createSourceBufferActor(buffer);\n      }\n\n      owners.patch(patch);\n\n      // Wait a frame to allow async state updates to flush before downstream\n      // orchestrations (loadSegments) begin reacting to the new owners.\n      await new Promise((resolve) => requestAnimationFrame(resolve));\n    }\n  );\n\n  return cleanup;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA6CA,SAAgB,eAAe,OAA8B;CAC3D,MAAM,cAAc,MAAM,QAAQ,KAAK,IAAI,IAAI;AAC/C,QAAO,GAAG,MAAM,SAAS,YAAY,YAAY;;;;;;;;;;;;;;;;;;AAyDnD,SAAgB,mBAAmB,EACjC,OACA,UAIa;CACb,IAAI,YAAY;AA8ChB,QA5CgB,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,UAC7C,OAAO,CAAC,cAAc,mBAA4D;AAChF,MAAI,UAAW;AACf,MAAI,CAAC,cAAc,YAAa;EAEhC,MAAM,gBAAgB,CAAC,CAAC,aAAa;EACrC,MAAM,gBAAgB,CAAC,CAAC,aAAa;AAErC,MAAI,CAAC,iBAAiB,CAAC,cAAe;EAEtC,MAAM,aAAa,gBAAgB,iBAAiB,cAAc,QAAQ,GAAG;EAC7E,MAAM,aAAa,gBAAgB,iBAAiB,cAAc,QAAQ,GAAG;AAI7E,MAAI,kBAAkB,CAAC,cAAc,CAAC,gBAAgB,WAAW,IAAI,CAAC,WAAW,QAAQ,QAAS;AAClG,MAAI,kBAAkB,CAAC,cAAc,CAAC,gBAAgB,WAAW,IAAI,CAAC,WAAW,QAAQ,QAAS;AAElG,cAAY;EAIZ,MAAM,QAAqC,EAAE;AAE7C,MAAI,iBAAiB,cAAc,gBAAgB,WAAW,EAAE;GAC9D,MAAM,SAAS,mBAAmB,cAAc,aAAc,eAAe,WAAW,CAAC;AACzF,SAAM,cAAc;AACpB,SAAM,mBAAmB,wBAAwB,OAAO;;AAG1D,MAAI,iBAAiB,cAAc,gBAAgB,WAAW,EAAE;GAC9D,MAAM,SAAS,mBAAmB,cAAc,aAAc,eAAe,WAAW,CAAC;AACzF,SAAM,cAAc;AACpB,SAAM,mBAAmB,wBAAwB,OAAO;;AAG1D,SAAO,MAAM,MAAM;AAInB,QAAM,IAAI,SAAS,YAAY,sBAAsB,QAAQ,CAAC;GAEjE"}
+{"version":3,"file":"setup-sourcebuffer.js","names":[],"sources":["../../../../src/dom/features/setup-sourcebuffer.ts"],"sourcesContent":["import { effect } from '../../core/signals/effect';\nimport { computed, type Signal, update } from '../../core/signals/primitives';\nimport type { Presentation, ResolvedTrack } from '../../core/types';\nimport { isResolvedTrack } from '../../core/types';\nimport { BufferKeyByType, getSelectedTrack, type TrackSelectionState } from '../../core/utils/track-selection';\nimport { createSourceBuffer } from '../media/mediasource-setup';\nimport { createSourceBufferActor, type SourceBufferActor } from '../media/source-buffer-actor';\n\n/**\n * Media track type for SourceBuffer setup.\n * Text tracks are excluded as they don't use MSE SourceBuffers.\n */\nexport type MediaTrackType = 'video' | 'audio';\n\nconst ActorKeyByType = {\n  video: 'videoBufferActor',\n  audio: 'audioBufferActor',\n} as const satisfies Record<MediaTrackType, keyof SourceBufferOwners>;\n\n/**\n * State shape for SourceBuffer setup.\n */\nexport interface SourceBufferState extends TrackSelectionState {\n  presentation?: Presentation;\n  selectedVideoTrackId?: string;\n  selectedAudioTrackId?: string;\n}\n\n/**\n * Owners shape for SourceBuffer setup.\n */\nexport interface SourceBufferOwners {\n  mediaSource?: MediaSource;\n  videoBuffer?: SourceBuffer;\n  audioBuffer?: SourceBuffer;\n  videoBufferActor?: SourceBufferActor;\n  audioBufferActor?: SourceBufferActor;\n}\n\n/**\n * Build MIME codec string from track metadata.\n *\n * @param track - Resolved track with mimeType and codecs\n * @returns MIME codec string (e.g., 'video/mp4; codecs=\"avc1.42E01E,mp4a.40.2\"')\n *\n * @example\n * buildMimeCodec({ mimeType: 'video/mp4', codecs: ['avc1.42E01E'] })\n * // => 'video/mp4; codecs=\"avc1.42E01E\"'\n */\nexport function buildMimeCodec(track: ResolvedTrack): string {\n  const codecString = track.codecs?.join(',') ?? '';\n  return `${track.mimeType}; codecs=\"${codecString}\"`;\n}\n\n/**\n * Setup all needed SourceBuffers as a single coordinated operation.\n *\n * Waits until ALL media tracks in the presentation are resolved with codecs,\n * then creates every SourceBuffer in one synchronous block before setting\n * owners. This guarantees that downstream consumers (e.g. loadSegments) never\n * see a partial set of SourceBuffers — preventing the Firefox bug where\n * appending to a video SourceBuffer before the audio SourceBuffer exists\n * causes mozHasAudio to be permanently false.\n *\n * Handles video-only, audio-only, and combined presentations correctly:\n * track types are derived from the presentation rather than hardcoded.\n *\n * @example\n * const cleanup = setupSourceBuffers({ state, owners });\n */\nexport function setupSourceBuffers<S extends SourceBufferState, O extends SourceBufferOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  // Derive which media track types this presentation actually contains\n  const presentationTypesSignal = computed((): MediaTrackType[] => {\n    const { presentation } = state.get();\n    if (!presentation || !('selectionSets' in presentation)) return [];\n    return presentation.selectionSets\n      .map(({ type }) => type)\n      .filter((type): type is MediaTrackType => type === 'video' || type === 'audio');\n  });\n\n  // All presentation track types must have a selected, resolved track with codecs\n  const canSetupSignal = computed(() => {\n    const types = presentationTypesSignal.get();\n    if (!owners.get().mediaSource || types.length === 0) return false;\n    const s = state.get();\n    return types.every((type) => {\n      const track = getSelectedTrack(s, type);\n      return track && isResolvedTrack(track) && !!track.codecs?.length;\n    });\n  });\n\n  // DOM-observable \"already done\" guard — once all presentation buffers exist in owners, setup has run\n  const shouldSetupSignal = computed(() => {\n    const o = owners.get();\n    return presentationTypesSignal.get().every((type) => !o[BufferKeyByType[type]]);\n  });\n\n  const cleanupEffect = effect(() => {\n    if (!canSetupSignal.get() || !shouldSetupSignal.get()) return;\n\n    const s = state.get();\n    const o = owners.get();\n\n    // Create all SourceBuffers synchronously — no await between addSourceBuffer\n    // calls — then set owners once so subscribers see all buffers simultaneously.\n    const patch: Partial<SourceBufferOwners> = {};\n\n    for (const type of presentationTypesSignal.get()) {\n      const track = getSelectedTrack(s, type) as ResolvedTrack;\n      const buffer = createSourceBuffer(o.mediaSource!, buildMimeCodec(track));\n      patch[BufferKeyByType[type]] = buffer;\n      patch[ActorKeyByType[type]] = createSourceBufferActor(buffer);\n    }\n\n    update(owners, patch);\n  });\n\n  return cleanupEffect;\n}\n"],"mappings":";;;;;;;AAcA,MAAM,iBAAiB;CACrB,OAAO;CACP,OAAO;CACR;;;;;;;;;;;AAgCD,SAAgB,eAAe,OAA8B;CAC3D,MAAM,cAAc,MAAM,QAAQ,KAAK,IAAI,IAAI;AAC/C,QAAO,GAAG,MAAM,SAAS,YAAY,YAAY;;;;;;;;;;;;;;;;;;AAmBnD,SAAgB,mBAA8E,EAC5F,OACA,UAIa;CAEb,MAAM,0BAA0B,eAAiC;EAC/D,MAAM,EAAE,iBAAiB,MAAM,KAAK;AACpC,MAAI,CAAC,gBAAgB,EAAE,mBAAmB,cAAe,QAAO,EAAE;AAClE,SAAO,aAAa,cACjB,KAAK,EAAE,WAAW,KAAK,CACvB,QAAQ,SAAiC,SAAS,WAAW,SAAS,QAAQ;GACjF;CAGF,MAAM,iBAAiB,eAAe;EACpC,MAAM,QAAQ,wBAAwB,KAAK;AAC3C,MAAI,CAAC,OAAO,KAAK,CAAC,eAAe,MAAM,WAAW,EAAG,QAAO;EAC5D,MAAM,IAAI,MAAM,KAAK;AACrB,SAAO,MAAM,OAAO,SAAS;GAC3B,MAAM,QAAQ,iBAAiB,GAAG,KAAK;AACvC,UAAO,SAAS,gBAAgB,MAAM,IAAI,CAAC,CAAC,MAAM,QAAQ;IAC1D;GACF;CAGF,MAAM,oBAAoB,eAAe;EACvC,MAAM,IAAI,OAAO,KAAK;AACtB,SAAO,wBAAwB,KAAK,CAAC,OAAO,SAAS,CAAC,EAAE,gBAAgB,OAAO;GAC/E;AAsBF,QApBsB,aAAa;AACjC,MAAI,CAAC,eAAe,KAAK,IAAI,CAAC,kBAAkB,KAAK,CAAE;EAEvD,MAAM,IAAI,MAAM,KAAK;EACrB,MAAM,IAAI,OAAO,KAAK;EAItB,MAAM,QAAqC,EAAE;AAE7C,OAAK,MAAM,QAAQ,wBAAwB,KAAK,EAAE;GAChD,MAAM,QAAQ,iBAAiB,GAAG,KAAK;GACvC,MAAM,SAAS,mBAAmB,EAAE,aAAc,eAAe,MAAM,CAAC;AACxE,SAAM,gBAAgB,SAAS;AAC/B,SAAM,eAAe,SAAS,wBAAwB,OAAO;;AAG/D,SAAO,QAAQ,MAAM;GACrB"}

package/dist/dev/dom/features/setup-text-tracks.js

@@ -1,32 +1,7 @@
-import { combineLatest } from "../../core/reactive/combine-latest.js";
-
+import { effect } from "../../core/signals/effect.js";
+import { computed, update } from "../../core/signals/primitives.js";
 //#region src/dom/features/setup-text-tracks.ts
 /**
-* Get all text tracks from presentation.
-*/
-function getTextTracks(presentation) {
-	if (!presentation?.selectionSets) return [];
-	const textSet = presentation.selectionSets.find((set) => set.type === "text");
-	if (!textSet?.switchingSets?.[0]?.tracks) return [];
-	return textSet.switchingSets[0].tracks;
-}
-/**
-* Check if we can setup text tracks.
-*
-* Requires:
-* - mediaElement exists
-* - presentation has text tracks to setup
-*/
-function canSetupTextTracks(state, owners) {
-	return !!owners.mediaElement && !!getTextTracks(state.presentation).length;
-}
-/**
-* Check if we should setup text tracks (not already set up).
-*/
-function shouldSetupTextTracks(owners) {
-	return !owners.textTracks;
-}
-/**
 * Create a track element for a text track.
 *
 * Note: We use DOM <track> elements instead of the TextTrack JS API
@@ -59,30 +34,34 @@ function createTrackElement(track) {
 * const cleanup = setupTextTracks({ state, owners });
 */
 function setupTextTracks({ state, owners }) {
-	let hasSetup = false;
-	let createdTracks = [];
-	const unsubscribe = combineLatest([state, owners]).subscribe(([s, o]) => {
-		if (hasSetup) return;
-		if (!canSetupTextTracks(s, o) || !shouldSetupTextTracks(o)) return;
-		hasSetup = true;
-		const textTracks = getTextTracks(s.presentation);
-		if (textTracks.length === 0) return;
+	const modelTextTracksSignal = computed(() => state.get().presentation?.selectionSets?.find((selectionSet) => selectionSet.type === "text")?.switchingSets[0]?.tracks, { equals(prevTextTracks, nextTextTracks) {
+		if (prevTextTracks === nextTextTracks) return true;
+		if (typeof prevTextTracks !== typeof nextTextTracks) return false;
+		if (prevTextTracks?.length !== nextTextTracks?.length) return false;
+		return !!nextTextTracks && nextTextTracks.every((nextTextTrack) => prevTextTracks?.some((prevTextTrack) => prevTextTrack.id === nextTextTrack.id));
+	} });
+	const ownerTextTracksSignal = computed(() => owners.get().textTracks);
+	const mediaElementSignal = computed(() => owners.get().mediaElement);
+	const canSetupTextTracksSignal = computed(() => !!mediaElementSignal.get() && modelTextTracksSignal.get()?.length);
+	const shouldSetupTextTracksSignal = computed(() => !ownerTextTracksSignal.get());
+	const cleanupEffect = effect(() => {
+		if (!canSetupTextTracksSignal.get() || !shouldSetupTextTracksSignal.get()) return;
+		const mediaElement = mediaElementSignal.get();
+		const modelTextTracks = modelTextTracksSignal.get();
 		const trackMap = /* @__PURE__ */ new Map();
-		for (const track of textTracks) {
-			const trackElement = createTrackElement(track);
-			o.mediaElement.appendChild(trackElement);
-			trackMap.set(track.id, trackElement);
-			createdTracks.push(trackElement);
-		}
-		owners.patch({ textTracks: trackMap });
+		modelTextTracks.forEach((modelTextTrack) => {
+			const trackElement = createTrackElement(modelTextTrack);
+			mediaElement.appendChild(trackElement);
+			trackMap.set(modelTextTrack.id, trackElement);
+		});
+		if (trackMap.size) update(owners, { textTracks: trackMap });
 	});
 	return () => {
-		for (const trackElement of createdTracks) trackElement.remove();
-		createdTracks = [];
-		unsubscribe();
+		owners.get().textTracks?.forEach((trackElement) => trackElement.remove());
+		cleanupEffect();
 	};
 }
-
 //#endregion
 export { setupTextTracks };
+
 //# sourceMappingURL=setup-text-tracks.js.map

package/dist/dev/dom/features/setup-text-tracks.js.map

@@ -1 +1 @@
-{"version":3,"file":"setup-text-tracks.js","names":[],"sources":["../../../../src/dom/features/setup-text-tracks.ts"],"sourcesContent":["import { combineLatest } from '../../core/reactive/combine-latest';\nimport type { WritableState } from '../../core/state/create-state';\nimport type { PartiallyResolvedTextTrack, Presentation } from '../../core/types';\n\n/**\n * State shape for text track setup.\n */\nexport interface TextTrackState {\n  presentation?: Presentation | undefined;\n  selectedTextTrackId?: string | undefined;\n}\n\n/**\n * Owners shape for text track setup.\n */\nexport interface TextTrackOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n  textTracks?: Map<string, HTMLTrackElement>;\n}\n\n/**\n * Get all text tracks from presentation.\n */\nfunction getTextTracks(presentation?: Presentation): PartiallyResolvedTextTrack[] {\n  if (!presentation?.selectionSets) return [];\n\n  const textSet = presentation.selectionSets.find((set) => set.type === 'text');\n  if (!textSet?.switchingSets?.[0]?.tracks) return [];\n\n  return textSet.switchingSets[0].tracks as PartiallyResolvedTextTrack[];\n}\n\n/**\n * Check if we can setup text tracks.\n *\n * Requires:\n * - mediaElement exists\n * - presentation has text tracks to setup\n */\nexport function canSetupTextTracks(state: TextTrackState, owners: TextTrackOwners): boolean {\n  return !!owners.mediaElement && !!getTextTracks(state.presentation).length;\n}\n\n/**\n * Check if we should setup text tracks (not already set up).\n */\nexport function shouldSetupTextTracks(owners: TextTrackOwners): boolean {\n  return !owners.textTracks;\n}\n\n/**\n * Create a track element for a text track.\n *\n * Note: We use DOM <track> elements instead of the TextTrack JS API\n * because there's no way to remove TextTracks added via addTextTrack().\n */\nfunction createTrackElement(track: PartiallyResolvedTextTrack): HTMLTrackElement {\n  const trackElement = document.createElement('track');\n\n  trackElement.id = track.id;\n  trackElement.kind = track.kind;\n  trackElement.label = track.label;\n\n  if (track.language) {\n    trackElement.srclang = track.language;\n  }\n\n  if (track.default) {\n    trackElement.default = true;\n  }\n\n  // Set src to track URL\n  trackElement.src = track.url;\n\n  return trackElement;\n}\n\n/**\n * Setup text tracks orchestration.\n *\n * Triggers when:\n * - mediaElement exists\n * - presentation is resolved (has text tracks)\n *\n * Creates <track> elements for all text tracks and adds them as children\n * to the media element. This allows the browser's native text track rendering.\n *\n * Note: Uses DOM track elements instead of TextTrack API because tracks\n * added via addTextTrack() cannot be removed.\n *\n * @example\n * const cleanup = setupTextTracks({ state, owners });\n */\nexport function setupTextTracks({\n  state,\n  owners,\n}: {\n  state: WritableState<TextTrackState>;\n  owners: WritableState<TextTrackOwners>;\n}): () => void {\n  let hasSetup = false;\n  let createdTracks: HTMLTrackElement[] = [];\n\n  const unsubscribe = combineLatest([state, owners]).subscribe(([s, o]: [TextTrackState, TextTrackOwners]) => {\n    // Check orchestration conditions\n    if (hasSetup) return; // Only run once\n    if (!canSetupTextTracks(s, o) || !shouldSetupTextTracks(o)) return;\n\n    // Mark as setup before doing any work to prevent re-entry\n    hasSetup = true;\n\n    const textTracks = getTextTracks(s.presentation);\n    if (textTracks.length === 0) return;\n\n    const trackMap = new Map<string, HTMLTrackElement>();\n\n    // Create track elements for all text tracks\n    for (const track of textTracks) {\n      const trackElement = createTrackElement(track);\n      o.mediaElement!.appendChild(trackElement);\n      trackMap.set(track.id, trackElement);\n      createdTracks.push(trackElement);\n    }\n\n    // Update owners with track element map\n    owners.patch({ textTracks: trackMap });\n  });\n\n  // Return cleanup function\n  return () => {\n    // Remove all created track elements\n    for (const trackElement of createdTracks) {\n      trackElement.remove();\n    }\n    createdTracks = [];\n    unsubscribe();\n  };\n}\n"],"mappings":";;;;;;AAuBA,SAAS,cAAc,cAA2D;AAChF,KAAI,CAAC,cAAc,cAAe,QAAO,EAAE;CAE3C,MAAM,UAAU,aAAa,cAAc,MAAM,QAAQ,IAAI,SAAS,OAAO;AAC7E,KAAI,CAAC,SAAS,gBAAgB,IAAI,OAAQ,QAAO,EAAE;AAEnD,QAAO,QAAQ,cAAc,GAAG;;;;;;;;;AAUlC,SAAgB,mBAAmB,OAAuB,QAAkC;AAC1F,QAAO,CAAC,CAAC,OAAO,gBAAgB,CAAC,CAAC,cAAc,MAAM,aAAa,CAAC;;;;;AAMtE,SAAgB,sBAAsB,QAAkC;AACtE,QAAO,CAAC,OAAO;;;;;;;;AASjB,SAAS,mBAAmB,OAAqD;CAC/E,MAAM,eAAe,SAAS,cAAc,QAAQ;AAEpD,cAAa,KAAK,MAAM;AACxB,cAAa,OAAO,MAAM;AAC1B,cAAa,QAAQ,MAAM;AAE3B,KAAI,MAAM,SACR,cAAa,UAAU,MAAM;AAG/B,KAAI,MAAM,QACR,cAAa,UAAU;AAIzB,cAAa,MAAM,MAAM;AAEzB,QAAO;;;;;;;;;;;;;;;;;;AAmBT,SAAgB,gBAAgB,EAC9B,OACA,UAIa;CACb,IAAI,WAAW;CACf,IAAI,gBAAoC,EAAE;CAE1C,MAAM,cAAc,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,GAAG,OAA0C;AAE1G,MAAI,SAAU;AACd,MAAI,CAAC,mBAAmB,GAAG,EAAE,IAAI,CAAC,sBAAsB,EAAE,CAAE;AAG5D,aAAW;EAEX,MAAM,aAAa,cAAc,EAAE,aAAa;AAChD,MAAI,WAAW,WAAW,EAAG;EAE7B,MAAM,2BAAW,IAAI,KAA+B;AAGpD,OAAK,MAAM,SAAS,YAAY;GAC9B,MAAM,eAAe,mBAAmB,MAAM;AAC9C,KAAE,aAAc,YAAY,aAAa;AACzC,YAAS,IAAI,MAAM,IAAI,aAAa;AACpC,iBAAc,KAAK,aAAa;;AAIlC,SAAO,MAAM,EAAE,YAAY,UAAU,CAAC;GACtC;AAGF,cAAa;AAEX,OAAK,MAAM,gBAAgB,cACzB,cAAa,QAAQ;AAEvB,kBAAgB,EAAE;AAClB,eAAa"}
+{"version":3,"file":"setup-text-tracks.js","names":[],"sources":["../../../../src/dom/features/setup-text-tracks.ts"],"sourcesContent":["import { effect } from '../../core/signals/effect';\nimport { computed, type Signal, update } from '../../core/signals/primitives';\nimport type { PartiallyResolvedTextTrack, Presentation, TextTrack } from '../../core/types';\n\n/**\n * State shape for text track setup.\n */\nexport interface TextTrackState {\n  presentation?: Presentation | undefined;\n  selectedTextTrackId?: string | undefined;\n}\n\n/**\n * Owners shape for text track setup.\n */\nexport interface TextTrackOwners {\n  mediaElement?: HTMLMediaElement | undefined;\n  textTracks?: Map<string, HTMLTrackElement>;\n}\n\n/**\n * Create a track element for a text track.\n *\n * Note: We use DOM <track> elements instead of the TextTrack JS API\n * because there's no way to remove TextTracks added via addTextTrack().\n */\nfunction createTrackElement(track: PartiallyResolvedTextTrack | TextTrack): HTMLTrackElement {\n  const trackElement = document.createElement('track');\n\n  trackElement.id = track.id;\n  trackElement.kind = track.kind;\n  trackElement.label = track.label;\n\n  if (track.language) {\n    trackElement.srclang = track.language;\n  }\n\n  if (track.default) {\n    trackElement.default = true;\n  }\n\n  // Set src to track URL\n  trackElement.src = track.url;\n\n  return trackElement;\n}\n\n/**\n * Setup text tracks orchestration.\n *\n * Triggers when:\n * - mediaElement exists\n * - presentation is resolved (has text tracks)\n *\n * Creates <track> elements for all text tracks and adds them as children\n * to the media element. This allows the browser's native text track rendering.\n *\n * Note: Uses DOM track elements instead of TextTrack API because tracks\n * added via addTextTrack() cannot be removed.\n *\n * @example\n * const cleanup = setupTextTracks({ state, owners });\n */\nexport function setupTextTracks<S extends TextTrackState, O extends TextTrackOwners>({\n  state,\n  owners,\n}: {\n  state: Signal<S>;\n  owners: Signal<O>;\n}): () => void {\n  const modelTextTracksSignal = computed(\n    // NOTE: This assumes exactly one selection set and switching set for TextTracks (CJP)\n    () =>\n      state.get().presentation?.selectionSets?.find((selectionSet) => selectionSet.type === 'text')?.switchingSets[0]\n        ?.tracks,\n    {\n      /** @TODO Make generic and abstract away for Array<T> | undefined (CJP) */\n      equals(prevTextTracks, nextTextTracks) {\n        if (prevTextTracks === nextTextTracks) return true;\n        if (typeof prevTextTracks !== typeof nextTextTracks) return false;\n        if (prevTextTracks?.length !== nextTextTracks?.length) return false;\n        // NOTE: This could probably be optimized, but the set should generally be small (CJP)\n        return (\n          !!nextTextTracks &&\n          nextTextTracks.every((nextTextTrack) =>\n            prevTextTracks?.some((prevTextTrack) => prevTextTrack.id === nextTextTrack.id)\n          )\n        );\n      },\n    }\n  );\n  const ownerTextTracksSignal = computed(() => owners.get().textTracks);\n  const mediaElementSignal = computed(() => owners.get().mediaElement);\n\n  const canSetupTextTracksSignal = computed(() => !!mediaElementSignal.get() && modelTextTracksSignal.get()?.length);\n  const shouldSetupTextTracksSignal = computed(() => !ownerTextTracksSignal.get());\n\n  const cleanupEffect = effect(() => {\n    if (!canSetupTextTracksSignal.get() || !shouldSetupTextTracksSignal.get()) return;\n    const mediaElement = mediaElementSignal.get();\n    const modelTextTracks = modelTextTracksSignal.get() as TextTrack[];\n\n    const trackMap = new Map<string, HTMLTrackElement>();\n    modelTextTracks.forEach((modelTextTrack) => {\n      const trackElement = createTrackElement(modelTextTrack);\n      mediaElement!.appendChild(trackElement);\n      trackMap.set(modelTextTrack.id, trackElement);\n    });\n\n    if (trackMap.size) {\n      const patch: Partial<TextTrackOwners> = { textTracks: trackMap };\n      update(owners, patch);\n    }\n  });\n\n  return () => {\n    owners.get().textTracks?.forEach((trackElement) => trackElement.remove());\n    cleanupEffect();\n  };\n}\n"],"mappings":";;;;;;;;;AA0BA,SAAS,mBAAmB,OAAiE;CAC3F,MAAM,eAAe,SAAS,cAAc,QAAQ;AAEpD,cAAa,KAAK,MAAM;AACxB,cAAa,OAAO,MAAM;AAC1B,cAAa,QAAQ,MAAM;AAE3B,KAAI,MAAM,SACR,cAAa,UAAU,MAAM;AAG/B,KAAI,MAAM,QACR,cAAa,UAAU;AAIzB,cAAa,MAAM,MAAM;AAEzB,QAAO;;;;;;;;;;;;;;;;;;AAmBT,SAAgB,gBAAqE,EACnF,OACA,UAIa;CACb,MAAM,wBAAwB,eAG1B,MAAM,KAAK,CAAC,cAAc,eAAe,MAAM,iBAAiB,aAAa,SAAS,OAAO,EAAE,cAAc,IACzG,QACN,EAEE,OAAO,gBAAgB,gBAAgB;AACrC,MAAI,mBAAmB,eAAgB,QAAO;AAC9C,MAAI,OAAO,mBAAmB,OAAO,eAAgB,QAAO;AAC5D,MAAI,gBAAgB,WAAW,gBAAgB,OAAQ,QAAO;AAE9D,SACE,CAAC,CAAC,kBACF,eAAe,OAAO,kBACpB,gBAAgB,MAAM,kBAAkB,cAAc,OAAO,cAAc,GAAG,CAC/E;IAGN,CACF;CACD,MAAM,wBAAwB,eAAe,OAAO,KAAK,CAAC,WAAW;CACrE,MAAM,qBAAqB,eAAe,OAAO,KAAK,CAAC,aAAa;CAEpE,MAAM,2BAA2B,eAAe,CAAC,CAAC,mBAAmB,KAAK,IAAI,sBAAsB,KAAK,EAAE,OAAO;CAClH,MAAM,8BAA8B,eAAe,CAAC,sBAAsB,KAAK,CAAC;CAEhF,MAAM,gBAAgB,aAAa;AACjC,MAAI,CAAC,yBAAyB,KAAK,IAAI,CAAC,4BAA4B,KAAK,CAAE;EAC3E,MAAM,eAAe,mBAAmB,KAAK;EAC7C,MAAM,kBAAkB,sBAAsB,KAAK;EAEnD,MAAM,2BAAW,IAAI,KAA+B;AACpD,kBAAgB,SAAS,mBAAmB;GAC1C,MAAM,eAAe,mBAAmB,eAAe;AACvD,gBAAc,YAAY,aAAa;AACvC,YAAS,IAAI,eAAe,IAAI,aAAa;IAC7C;AAEF,MAAI,SAAS,KAEX,QAAO,QADiC,EAAE,YAAY,UAAU,CAC3C;GAEvB;AAEF,cAAa;AACX,SAAO,KAAK,CAAC,YAAY,SAAS,iBAAiB,aAAa,QAAQ,CAAC;AACzE,iBAAe"}

package/dist/dev/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/dev/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/dev/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/dev/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/dev/dom/features/track-current-time.d.ts

@@ -1,4 +1,4 @@
-import { WritableState } from "../../core/state/create-state.js";
+import { Signal } from "../../core/signals/primitives.js";
 
 //#region src/dom/features/track-current-time.d.ts
 /**
@@ -28,12 +28,12 @@ interface CurrentTimeOwners {
  * @example
  * const cleanup = trackCurrentTime({ state, owners });
  */
-declare function trackCurrentTime({
+declare function trackCurrentTime<S extends CurrentTimeState, O extends CurrentTimeOwners>({
   state,
   owners
 }: {
-  state: WritableState<CurrentTimeState>;
-  owners: WritableState<CurrentTimeOwners>;
+  state: Signal<S>;
+  owners: Signal<O>;
 }): () => void;
 //#endregion
 export { CurrentTimeOwners, CurrentTimeState, trackCurrentTime };

package/dist/dev/dom/features/track-current-time.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"track-current-time.d.ts","names":[],"sources":["../../../../src/dom/features/track-current-time.ts"],"mappings":";;;;;AAMA;UAAiB,gBAAA;EACf,WAAA;AAAA;;AAMF;;UAAiB,iBAAA;EACf,YAAA,GAAe,gBAAA;AAAA;;;;;;;;;;;;;;;;iBA4BD,gBAAA,CAAA;EACd,KAAA;EACA;AAAA;EAEA,KAAA,EAAO,aAAA,CAAc,gBAAA;EACrB,MAAA,EAAQ,aAAA,CAAc,iBAAA;AAAA"}
+{"version":3,"file":"track-current-time.d.ts","names":[],"sources":["../../../../src/dom/features/track-current-time.ts"],"mappings":";;;;;AAOA;UAAiB,gBAAA;EACf,WAAA;AAAA;;AAMF;;UAAiB,iBAAA;EACf,YAAA,GAAe,gBAAA;AAAA;;;;;;;;;;;;;;;;iBA4BD,gBAAA,WAA2B,gBAAA,YAA4B,iBAAA,CAAA,CAAA;EACrE,KAAA;EACA;AAAA;EAEA,KAAA,EAAO,MAAA,CAAO,CAAA;EACd,MAAA,EAAQ,MAAA,CAAO,CAAA;AAAA"}

package/dist/dev/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/dev/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/dev/dom/features/track-playback-initiated.d.ts

@@ -1,15 +1,13 @@
-import { WritableState } from "../../core/state/create-state.js";
-import { EventStream } from "../../core/events/create-event-stream.js";
-import { PresentationAction } from "../../core/features/resolve-presentation.js";
+import { Signal } from "../../core/signals/primitives.js";
 
 //#region src/dom/features/track-playback-initiated.d.ts
 /**
  * State shape for playback initiation tracking.
  */
 interface PlaybackInitiatedState {
-  /** True once the user has initiated playback (play event fired). */
+  /** True once play has been requested for the current presentation URL. */
   playbackInitiated?: boolean;
-  /** Current presentation — watched for URL changes to reset playbackInitiated. */
+  /** Current presentation — URL is used to detect source changes. */
   presentation?: {
     url?: string;
   };
@@ -21,32 +19,25 @@ interface PlaybackInitiatedOwners {
   mediaElement?: HTMLMediaElement | undefined;
 }
 /**
- * Track whether playback has been initiated by the user.
+ * Track whether playback has been initiated for the current presentation URL.
  *
- * 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.
+ * Uses a local intermediate signal written by two effect streams:
+ * - false stream: resets on URL change
+ * - true stream: sets on play event
  *
- * Resets `state.playbackInitiated = false` when `presentation.url` changes,
- * so a new source with `preload="none"` won't load segments until play is
- * triggered again.
- *
- * 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 });
  */
-declare function trackPlaybackInitiated({
+declare function trackPlaybackInitiated<S extends PlaybackInitiatedState, O extends PlaybackInitiatedOwners>({
   state,
-  owners,
-  events
+  owners
 }: {
-  state: WritableState<PlaybackInitiatedState>;
-  owners: WritableState<PlaybackInitiatedOwners>;
-  events: EventStream<PresentationAction>;
+  state: Signal<S>;
+  owners: Signal<O>;
 }): () => void;
 //#endregion
 export { PlaybackInitiatedOwners, PlaybackInitiatedState, trackPlaybackInitiated };

package/dist/dev/dom/features/track-playback-initiated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"track-playback-initiated.d.ts","names":[],"sources":["../../../../src/dom/features/track-playback-initiated.ts"],"mappings":";;;;;;;AAQA;UAAiB,sBAAA;;EAEf,iBAAA;EAAA;EAEA,YAAA;IAAiB,GAAA;EAAA;AAAA;AAMnB;;;AAAA,UAAiB,uBAAA;EACf,YAAA,GAAe,gBAAA;AAAA;;;;;;;;;;;;;;;;;;;;iBAsBD,sBAAA,CAAA;EACd,KAAA;EACA,MAAA;EACA;AAAA;EAEA,KAAA,EAAO,aAAA,CAAc,sBAAA;EACrB,MAAA,EAAQ,aAAA,CAAc,uBAAA;EACtB,MAAA,EAAQ,WAAA,CAAY,kBAAA;AAAA"}
+{"version":3,"file":"track-playback-initiated.d.ts","names":[],"sources":["../../../../src/dom/features/track-playback-initiated.ts"],"mappings":";;;;;AAOA;UAAiB,sBAAA;;EAEf,iBAAA;EAAA;EAEA,YAAA;IAAiB,GAAA;EAAA;AAAA;AAMnB;;;AAAA,UAAiB,uBAAA;EACf,YAAA,GAAe,gBAAA;AAAA;;;;;;;;;;;;;;;iBAiBD,sBAAA,WAAiC,sBAAA,YAAkC,uBAAA,CAAA,CAAA;EACjF,KAAA;EACA;AAAA;EAEA,KAAA,EAAO,MAAA,CAAO,CAAA;EACd,MAAA,EAAQ,MAAA,CAAO,CAAA;AAAA"}