stream-chat-react 14.12.0 → 15.0.0-rc.1

package/dist/es/components/AudioPlayback/AudioPlayer.mjs

@@ -1,4 +1,4 @@
-import { StateStore } from "stream-chat";
+import { StateStore } from "@stream-io/state-store";
 import throttle from "lodash.throttle";
 //#region src/components/AudioPlayback/AudioPlayer.ts
 var DEFAULT_PLAYBACK_RATES = [
@@ -13,318 +13,21 @@ var defaultRegisterAudioPlayerError = ({ error } = {}) => {
 };
 var elementIsPlaying = (audioElement) => audioElement && !(audioElement.paused || audioElement.ended);
 var AudioPlayer = class {
+	state;
+	/** The audio MIME type that is checked before the audio is played. If the type is not supported the controller registers error in playbackError. */
+	_data;
+	_plugins = /* @__PURE__ */ new Map();
+	playTimeout = void 0;
+	unsubscribeEventListeners = null;
+	_pool;
+	_disposed = false;
+	_pendingLoadedMeta;
+	_elementIsReadyPromise;
+	_metadataProbe = null;
+	_metadataProbePromise;
+	_restoringPosition = false;
+	_removalTimeout = void 0;
 	constructor({ durationSeconds, fileSize, id, mimeType, playbackRates: customPlaybackRates, plugins, pool, src, title, waveformData }) {
-		this._plugins = /* @__PURE__ */ new Map();
-		this.playTimeout = void 0;
-		this.unsubscribeEventListeners = null;
-		this._disposed = false;
-		this._metadataProbe = null;
-		this._restoringPosition = false;
-		this._removalTimeout = void 0;
-		this.setDurationSeconds = (durationSeconds) => {
-			this._data.durationSeconds = durationSeconds;
-			this.state.partialNext({ durationSeconds });
-		};
-		this.setPlaybackStartSafetyTimeout = () => {
-			clearTimeout(this.playTimeout);
-			this.playTimeout = setTimeout(() => {
-				if (!this.elementRef) return;
-				try {
-					this.elementRef.pause();
-					this.state.partialNext({ isPlaying: false });
-				} catch (e) {
-					this.registerError({ errCode: "failed-to-start" });
-				}
-			}, 2e3);
-		};
-		this.updateDurationFromElement = (element) => {
-			const duration = element.duration;
-			if (typeof duration !== "number" || isNaN(duration) || !isFinite(duration) || duration <= 0) return;
-			this.setDurationSeconds(duration);
-		};
-		this.clearMetadataProbe = () => {
-			const probe = this._metadataProbe;
-			this._metadataProbe = null;
-			this._metadataProbePromise = void 0;
-			if (!probe) return;
-			try {
-				probe.pause();
-			} catch {}
-			probe.removeAttribute("src");
-			try {
-				probe.load();
-			} catch {}
-		};
-		this.preloadMetadata = () => {
-			if (this._disposed || this.durationSeconds != null || !this.src || this._metadataProbePromise || typeof document === "undefined") return;
-			const probe = document.createElement("audio");
-			probe.preload = "metadata";
-			this._metadataProbe = probe;
-			this._metadataProbePromise = new Promise((resolve) => {
-				const cleanup = () => {
-					probe.removeEventListener("loadedmetadata", handleLoadedMetadata);
-					probe.removeEventListener("error", handleError);
-					if (this._metadataProbe === probe) this.clearMetadataProbe();
-					else this._metadataProbePromise = void 0;
-					resolve();
-				};
-				const handleLoadedMetadata = () => {
-					this.updateDurationFromElement(probe);
-					cleanup();
-				};
-				const handleError = () => {
-					cleanup();
-				};
-				probe.addEventListener("loadedmetadata", handleLoadedMetadata, { once: true });
-				probe.addEventListener("error", handleError, { once: true });
-				probe.src = this.src;
-				try {
-					probe.load();
-				} catch {
-					cleanup();
-				}
-			});
-		};
-		this.clearPlaybackStartSafetyTimeout = () => {
-			if (!this.elementRef) return;
-			clearTimeout(this.playTimeout);
-			this.playTimeout = void 0;
-		};
-		this.clearPendingLoadedMeta = () => {
-			const pending = this._pendingLoadedMeta;
-			if (pending?.element && pending.onLoaded) pending.element.removeEventListener("loadedmetadata", pending.onLoaded);
-			this._pendingLoadedMeta = void 0;
-		};
-		this.restoreSavedPosition = (elementRef) => {
-			const saved = this.secondsElapsed;
-			if (!saved || saved <= 0) return;
-			const apply = () => {
-				const duration = elementRef.duration;
-				const clamped = typeof duration === "number" && !isNaN(duration) && isFinite(duration) ? Math.min(saved, duration) : saved;
-				try {
-					if (elementRef.currentTime === clamped) return;
-					elementRef.currentTime = clamped;
-					this.setSecondsElapsed(clamped);
-				} catch {}
-			};
-			if (elementRef.readyState < 1) {
-				this.clearPendingLoadedMeta();
-				this._restoringPosition = true;
-				const onLoaded = () => {
-					if (this._pendingLoadedMeta?.onLoaded !== onLoaded) return;
-					this._pendingLoadedMeta = void 0;
-					if (this.elementRef !== elementRef) {
-						this._restoringPosition = false;
-						return;
-					}
-					apply();
-					this._restoringPosition = false;
-				};
-				elementRef.addEventListener("loadedmetadata", onLoaded, { once: true });
-				this._pendingLoadedMeta = {
-					element: elementRef,
-					onLoaded
-				};
-			} else {
-				this._restoringPosition = true;
-				apply();
-				this._restoringPosition = false;
-			}
-		};
-		this.elementIsReady = () => {
-			if (this._elementIsReadyPromise) return this._elementIsReadyPromise;
-			this._elementIsReadyPromise = new Promise((resolve) => {
-				if (!this.elementRef) return resolve(false);
-				const element = this.elementRef;
-				const handleLoaded = () => {
-					element.removeEventListener("loadedmetadata", handleLoaded);
-					resolve(element.readyState > 0);
-				};
-				element.addEventListener("loadedmetadata", handleLoaded);
-			});
-			return this._elementIsReadyPromise;
-		};
-		this.setRef = (elementRef) => {
-			if (elementIsPlaying(this.elementRef)) this.releaseElement({ resetState: false });
-			this.clearPendingLoadedMeta();
-			this.clearMetadataProbe();
-			this._restoringPosition = false;
-			this._elementIsReadyPromise = void 0;
-			this.state.partialNext({ elementRef });
-			if (elementRef) this.registerSubscriptions();
-		};
-		this.setSecondsElapsed = (secondsElapsed) => {
-			const duration = this.elementRef?.duration ?? this.durationSeconds;
-			this.state.partialNext({
-				progressPercent: duration && secondsElapsed ? secondsElapsed / duration * 100 : 0,
-				secondsElapsed
-			});
-		};
-		this.canPlayMimeType = (mimeType) => {
-			if (!mimeType) return false;
-			if (this.elementRef) return !!this.elementRef.canPlayType(mimeType);
-			return !!new Audio().canPlayType(mimeType);
-		};
-		this.play = async (params) => {
-			if (this._disposed) return;
-			const elementRef = this.ensureElementRef();
-			if (elementIsPlaying(this.elementRef)) {
-				if (this.isPlaying) return;
-				this.state.partialNext({ isPlaying: true });
-				return;
-			}
-			const { currentPlaybackRate, playbackRates } = {
-				currentPlaybackRate: this.currentPlaybackRate,
-				playbackRates: this.playbackRates,
-				...params
-			};
-			if (!this.canPlayRecord) {
-				this.registerError({ errCode: "not-playable" });
-				return;
-			}
-			this.restoreSavedPosition(elementRef);
-			elementRef.playbackRate = currentPlaybackRate ?? this.currentPlaybackRate;
-			this.setPlaybackStartSafetyTimeout();
-			try {
-				await elementRef.play();
-				this.state.partialNext({
-					currentPlaybackRate,
-					isPlaying: true,
-					playbackRates
-				});
-				this._pool.setActiveAudioPlayer(this);
-			} catch (e) {
-				this.registerError({ error: e });
-				this.state.partialNext({ isPlaying: false });
-			} finally {
-				this.clearPlaybackStartSafetyTimeout();
-			}
-		};
-		this.pause = () => {
-			if (!elementIsPlaying(this.elementRef)) return;
-			this.clearPlaybackStartSafetyTimeout();
-			this.elementRef.pause();
-			this.state.partialNext({ isPlaying: false });
-		};
-		this.stop = () => {
-			this.pause();
-			this.state.partialNext({ isPlaying: false });
-			this.setSecondsElapsed(0);
-			if (this.elementRef) this.elementRef.currentTime = 0;
-		};
-		this.togglePlay = async () => this.isPlaying ? this.pause() : await this.play();
-		this.increasePlaybackRate = () => {
-			let currentPlaybackRateIndex = this.state.getLatestValue().playbackRates.findIndex((rate) => rate === this.currentPlaybackRate);
-			if (currentPlaybackRateIndex === -1) currentPlaybackRateIndex = 0;
-			const nextIndex = currentPlaybackRateIndex === this.playbackRates.length - 1 ? 0 : currentPlaybackRateIndex + 1;
-			const currentPlaybackRate = this.playbackRates[nextIndex];
-			this.state.partialNext({ currentPlaybackRate });
-			if (this.elementRef) this.elementRef.playbackRate = currentPlaybackRate;
-		};
-		this.seek = throttle(async ({ clientX, currentTarget }) => {
-			let element = this.elementRef;
-			if (!this.elementRef) {
-				element = this.ensureElementRef();
-				if (!await this.elementIsReady()) return;
-			}
-			if (!currentTarget || !element) return;
-			if (!isSeekable(element)) {
-				this.registerError({ errCode: "seek-not-supported" });
-				return;
-			}
-			const { width, x } = currentTarget.getBoundingClientRect();
-			const ratio = (clientX - x) / width;
-			if (ratio > 1 || ratio < 0) return;
-			const currentTime = ratio * element.duration;
-			this.setSecondsElapsed(currentTime);
-			element.currentTime = currentTime;
-		}, 16);
-		this.registerError = (params) => {
-			defaultRegisterAudioPlayerError(params);
-			this.plugins.forEach(({ onError }) => onError?.({
-				player: this,
-				...params
-			}));
-		};
-		this.requestRemoval = () => {
-			this._disposed = true;
-			this.cancelScheduledRemoval();
-			this.clearPendingLoadedMeta();
-			this.clearMetadataProbe();
-			this._restoringPosition = false;
-			this.releaseElement({ resetState: true });
-			this.unsubscribeEventListeners?.();
-			this.unsubscribeEventListeners = null;
-			this.plugins.forEach(({ onRemove }) => onRemove?.({ player: this }));
-			this._pool.deregister(this.id);
-		};
-		this.cancelScheduledRemoval = () => {
-			clearTimeout(this._removalTimeout);
-			this._removalTimeout = void 0;
-		};
-		this.scheduleRemoval = (ms = 0) => {
-			this.cancelScheduledRemoval();
-			this._removalTimeout = setTimeout(() => {
-				if (this.disposed) return;
-				this.requestRemoval();
-			}, ms);
-		};
-		this.releaseElementForHandoff = () => {
-			if (!this.elementRef) return;
-			this.releaseElement({ resetState: false });
-			this.unsubscribeEventListeners?.();
-			this.unsubscribeEventListeners = null;
-		};
-		this.registerSubscriptions = () => {
-			this.unsubscribeEventListeners?.();
-			const audioElement = this.elementRef;
-			if (!audioElement) return;
-			const handleEnded = () => {
-				if (audioElement) this.updateDurationFromElement(audioElement);
-				this.stop();
-			};
-			const handleError = (e) => {
-				const audio = e.currentTarget;
-				const state = { isPlaying: false };
-				if (!audio?.error?.code) {
-					this.state.partialNext(state);
-					return;
-				}
-				if (audio.error.code === 4) {
-					state.canPlayRecord = false;
-					this.state.partialNext(state);
-				}
-				const errorMsg = [
-					void 0,
-					"MEDIA_ERR_ABORTED: fetch aborted by user",
-					"MEDIA_ERR_NETWORK: network failed while fetching",
-					"MEDIA_ERR_DECODE: audio fetched but couldn’t decode",
-					"MEDIA_ERR_SRC_NOT_SUPPORTED: source not supported"
-				][audio?.error?.code];
-				if (!errorMsg) return;
-				defaultRegisterAudioPlayerError({ error: /* @__PURE__ */ new Error(errorMsg + ` (${audio.src})`) });
-			};
-			const handleTimeupdate = () => {
-				const t = audioElement?.currentTime ?? 0;
-				if (this._restoringPosition && t === 0) return;
-				if (!this.isPlaying && t === 0 && this.secondsElapsed > 0) return;
-				this.setSecondsElapsed(t);
-			};
-			const handleLoadedMetadata = () => {
-				if (audioElement) this.updateDurationFromElement(audioElement);
-			};
-			audioElement.addEventListener("ended", handleEnded);
-			audioElement.addEventListener("error", handleError);
-			audioElement.addEventListener("loadedmetadata", handleLoadedMetadata);
-			audioElement.addEventListener("timeupdate", handleTimeupdate);
-			this.unsubscribeEventListeners = () => {
-				audioElement.pause();
-				audioElement.removeEventListener("ended", handleEnded);
-				audioElement.removeEventListener("error", handleError);
-				audioElement.removeEventListener("loadedmetadata", handleLoadedMetadata);
-				audioElement.removeEventListener("timeupdate", handleTimeupdate);
-			};
-		};
 		this._data = {
 			durationSeconds,
 			fileSize,
@@ -400,17 +103,127 @@ var AudioPlayer = class {
 	get disposed() {
 		return this._disposed;
 	}
+	setDurationSeconds = (durationSeconds) => {
+		this._data.durationSeconds = durationSeconds;
+		this.state.partialNext({ durationSeconds });
+	};
 	ensureElementRef() {
 		if (this._disposed) throw new Error("AudioPlayer is disposed");
 		if (!this.elementRef) {
 			const el = this._pool.acquireElement({
-				ownerId: this.id,
+				owner: this,
 				src: this.src
 			});
 			this.setRef(el);
 		}
 		return this.elementRef;
 	}
+	setPlaybackStartSafetyTimeout = () => {
+		clearTimeout(this.playTimeout);
+		this.playTimeout = setTimeout(() => {
+			if (!this.elementRef) return;
+			try {
+				this.elementRef.pause();
+				this.state.partialNext({ isPlaying: false });
+			} catch (e) {
+				this.registerError({ errCode: "failed-to-start" });
+			}
+		}, 2e3);
+	};
+	updateDurationFromElement = (element) => {
+		const duration = element.duration;
+		if (typeof duration !== "number" || isNaN(duration) || !isFinite(duration) || duration <= 0) return;
+		this.setDurationSeconds(duration);
+	};
+	clearMetadataProbe = () => {
+		const probe = this._metadataProbe;
+		this._metadataProbe = null;
+		this._metadataProbePromise = void 0;
+		if (!probe) return;
+		try {
+			probe.pause();
+		} catch {}
+		probe.removeAttribute("src");
+		try {
+			probe.load();
+		} catch {}
+	};
+	preloadMetadata = () => {
+		if (this._disposed || this.durationSeconds != null || !this.src || this._metadataProbePromise || typeof document === "undefined") return;
+		const probe = document.createElement("audio");
+		probe.preload = "metadata";
+		this._metadataProbe = probe;
+		this._metadataProbePromise = new Promise((resolve) => {
+			const cleanup = () => {
+				probe.removeEventListener("loadedmetadata", handleLoadedMetadata);
+				probe.removeEventListener("error", handleError);
+				if (this._metadataProbe === probe) this.clearMetadataProbe();
+				else this._metadataProbePromise = void 0;
+				resolve();
+			};
+			const handleLoadedMetadata = () => {
+				this.updateDurationFromElement(probe);
+				cleanup();
+			};
+			const handleError = () => {
+				cleanup();
+			};
+			probe.addEventListener("loadedmetadata", handleLoadedMetadata, { once: true });
+			probe.addEventListener("error", handleError, { once: true });
+			probe.src = this.src;
+			try {
+				probe.load();
+			} catch {
+				cleanup();
+			}
+		});
+	};
+	clearPlaybackStartSafetyTimeout = () => {
+		if (!this.elementRef) return;
+		clearTimeout(this.playTimeout);
+		this.playTimeout = void 0;
+	};
+	clearPendingLoadedMeta = () => {
+		const pending = this._pendingLoadedMeta;
+		if (pending?.element && pending.onLoaded) pending.element.removeEventListener("loadedmetadata", pending.onLoaded);
+		this._pendingLoadedMeta = void 0;
+	};
+	restoreSavedPosition = (elementRef) => {
+		const saved = this.secondsElapsed;
+		if (!saved || saved <= 0) return;
+		const apply = () => {
+			const duration = elementRef.duration;
+			const clamped = typeof duration === "number" && !isNaN(duration) && isFinite(duration) ? Math.min(saved, duration) : saved;
+			try {
+				if (elementRef.currentTime === clamped) return;
+				elementRef.currentTime = clamped;
+				this.setSecondsElapsed(clamped);
+			} catch {}
+		};
+		if (elementRef.readyState < 1) {
+			this.clearPendingLoadedMeta();
+			this._restoringPosition = true;
+			const onLoaded = () => {
+				if (this._pendingLoadedMeta?.onLoaded !== onLoaded) return;
+				this._pendingLoadedMeta = void 0;
+				if (this.elementRef !== elementRef) {
+					this._restoringPosition = false;
+					return;
+				}
+				apply();
+				this._restoringPosition = false;
+			};
+			elementRef.addEventListener("loadedmetadata", onLoaded, { once: true });
+			this._pendingLoadedMeta = {
+				element: elementRef,
+				onLoaded
+			};
+		} else {
+			this._restoringPosition = true;
+			apply();
+			this._restoringPosition = false;
+		}
+	};
 	setDescriptor(descriptor) {
 		const previousSrc = this.src;
 		this._data = {
@@ -440,16 +253,218 @@ var AudioPlayer = class {
 			} catch {}
 		}
 		if (this.elementRef) {
-			this._pool.releaseElement(this.id);
+			this._pool.releaseElement(this);
 			this.setRef(null);
 		}
 	}
+	elementIsReady = () => {
+		if (this._elementIsReadyPromise) return this._elementIsReadyPromise;
+		this._elementIsReadyPromise = new Promise((resolve) => {
+			if (!this.elementRef) return resolve(false);
+			const element = this.elementRef;
+			const handleLoaded = () => {
+				element.removeEventListener("loadedmetadata", handleLoaded);
+				resolve(element.readyState > 0);
+			};
+			element.addEventListener("loadedmetadata", handleLoaded);
+		});
+		return this._elementIsReadyPromise;
+	};
+	setRef = (elementRef) => {
+		if (elementIsPlaying(this.elementRef)) this.releaseElement({ resetState: false });
+		this.clearPendingLoadedMeta();
+		this.clearMetadataProbe();
+		this._restoringPosition = false;
+		this._elementIsReadyPromise = void 0;
+		this.state.partialNext({ elementRef });
+		if (elementRef) this.registerSubscriptions();
+	};
+	setSecondsElapsed = (secondsElapsed) => {
+		const duration = this.elementRef?.duration ?? this.durationSeconds;
+		this.state.partialNext({
+			progressPercent: duration && secondsElapsed ? secondsElapsed / duration * 100 : 0,
+			secondsElapsed
+		});
+	};
 	setPlugins(setter) {
 		this._plugins = setter(this.plugins).reduce((acc, plugin) => {
 			if (plugin.id) acc.set(plugin.id, plugin);
 			return acc;
 		}, /* @__PURE__ */ new Map());
 	}
+	canPlayMimeType = (mimeType) => {
+		if (!mimeType) return false;
+		if (this.elementRef) return !!this.elementRef.canPlayType(mimeType);
+		return !!new Audio().canPlayType(mimeType);
+	};
+	play = async (params) => {
+		if (this._disposed) return;
+		const elementRef = this.ensureElementRef();
+		if (elementIsPlaying(this.elementRef)) {
+			if (this.isPlaying) return;
+			this.state.partialNext({ isPlaying: true });
+			return;
+		}
+		const { currentPlaybackRate, playbackRates } = {
+			currentPlaybackRate: this.currentPlaybackRate,
+			playbackRates: this.playbackRates,
+			...params
+		};
+		if (!this.canPlayRecord) {
+			this.registerError({ errCode: "not-playable" });
+			return;
+		}
+		this.restoreSavedPosition(elementRef);
+		elementRef.playbackRate = currentPlaybackRate ?? this.currentPlaybackRate;
+		this.setPlaybackStartSafetyTimeout();
+		try {
+			await elementRef.play();
+			this.state.partialNext({
+				currentPlaybackRate,
+				isPlaying: true,
+				playbackRates
+			});
+			this._pool.setActiveAudioPlayer(this);
+		} catch (e) {
+			this.registerError({ error: e });
+			this.state.partialNext({ isPlaying: false });
+		} finally {
+			this.clearPlaybackStartSafetyTimeout();
+		}
+	};
+	pause = () => {
+		if (!elementIsPlaying(this.elementRef)) return;
+		this.clearPlaybackStartSafetyTimeout();
+		this.elementRef.pause();
+		this.state.partialNext({ isPlaying: false });
+	};
+	stop = () => {
+		this.pause();
+		this.state.partialNext({ isPlaying: false });
+		this.setSecondsElapsed(0);
+		if (this.elementRef) this.elementRef.currentTime = 0;
+	};
+	togglePlay = async () => this.isPlaying ? this.pause() : await this.play();
+	increasePlaybackRate = () => {
+		let currentPlaybackRateIndex = this.state.getLatestValue().playbackRates.findIndex((rate) => rate === this.currentPlaybackRate);
+		if (currentPlaybackRateIndex === -1) currentPlaybackRateIndex = 0;
+		const nextIndex = currentPlaybackRateIndex === this.playbackRates.length - 1 ? 0 : currentPlaybackRateIndex + 1;
+		const currentPlaybackRate = this.playbackRates[nextIndex];
+		this.state.partialNext({ currentPlaybackRate });
+		if (this.elementRef) this.elementRef.playbackRate = currentPlaybackRate;
+	};
+	seek = throttle(async ({ clientX, currentTarget }) => {
+		let element = this.elementRef;
+		if (!this.elementRef) {
+			element = this.ensureElementRef();
+			if (!await this.elementIsReady()) return;
+		}
+		if (!currentTarget || !element) return;
+		if (!isSeekable(element)) {
+			this.registerError({ errCode: "seek-not-supported" });
+			return;
+		}
+		const { width, x } = currentTarget.getBoundingClientRect();
+		const ratio = (clientX - x) / width;
+		if (ratio > 1 || ratio < 0) return;
+		const currentTime = ratio * element.duration;
+		this.setSecondsElapsed(currentTime);
+		element.currentTime = currentTime;
+	}, 16);
+	registerError = (params) => {
+		defaultRegisterAudioPlayerError(params);
+		this.plugins.forEach(({ onError }) => onError?.({
+			player: this,
+			...params
+		}));
+	};
+	/**
+	* Removes the audio element reference, event listeners and audio player from the player pool.
+	* Helpful when only a single AudioPlayer instance is to be removed from the AudioPlayerPool.
+	*/
+	requestRemoval = () => {
+		this._disposed = true;
+		this.cancelScheduledRemoval();
+		this.clearPendingLoadedMeta();
+		this.clearMetadataProbe();
+		this._restoringPosition = false;
+		this.releaseElement({ resetState: true });
+		this.unsubscribeEventListeners?.();
+		this.unsubscribeEventListeners = null;
+		this.plugins.forEach(({ onRemove }) => onRemove?.({ player: this }));
+		this._pool.deregister(this.id);
+	};
+	cancelScheduledRemoval = () => {
+		clearTimeout(this._removalTimeout);
+		this._removalTimeout = void 0;
+	};
+	scheduleRemoval = (ms = 0) => {
+		this.cancelScheduledRemoval();
+		this._removalTimeout = setTimeout(() => {
+			if (this.disposed) return;
+			this.requestRemoval();
+		}, ms);
+	};
+	/**
+	* Releases only the underlying element back to the pool without disposing the player instance.
+	* Used by the pool to hand off the shared element in single-playback mode.
+	*/
+	releaseElementForHandoff = () => {
+		if (!this.elementRef) return;
+		this.releaseElement({ resetState: false });
+		this.unsubscribeEventListeners?.();
+		this.unsubscribeEventListeners = null;
+	};
+	registerSubscriptions = () => {
+		this.unsubscribeEventListeners?.();
+		const audioElement = this.elementRef;
+		if (!audioElement) return;
+		const handleEnded = () => {
+			if (audioElement) this.updateDurationFromElement(audioElement);
+			this.stop();
+		};
+		const handleError = (e) => {
+			const audio = e.currentTarget;
+			const state = { isPlaying: false };
+			if (!audio?.error?.code) {
+				this.state.partialNext(state);
+				return;
+			}
+			if (audio.error.code === 4) {
+				state.canPlayRecord = false;
+				this.state.partialNext(state);
+			}
+			const errorMsg = [
+				void 0,
+				"MEDIA_ERR_ABORTED: fetch aborted by user",
+				"MEDIA_ERR_NETWORK: network failed while fetching",
+				"MEDIA_ERR_DECODE: audio fetched but couldn’t decode",
+				"MEDIA_ERR_SRC_NOT_SUPPORTED: source not supported"
+			][audio?.error?.code];
+			if (!errorMsg) return;
+			defaultRegisterAudioPlayerError({ error: /* @__PURE__ */ new Error(errorMsg + ` (${audio.src})`) });
+		};
+		const handleTimeupdate = () => {
+			const t = audioElement?.currentTime ?? 0;
+			if (this._restoringPosition && t === 0) return;
+			if (!this.isPlaying && t === 0 && this.secondsElapsed > 0) return;
+			this.setSecondsElapsed(t);
+		};
+		const handleLoadedMetadata = () => {
+			if (audioElement) this.updateDurationFromElement(audioElement);
+		};
+		audioElement.addEventListener("ended", handleEnded);
+		audioElement.addEventListener("error", handleError);
+		audioElement.addEventListener("loadedmetadata", handleLoadedMetadata);
+		audioElement.addEventListener("timeupdate", handleTimeupdate);
+		this.unsubscribeEventListeners = () => {
+			audioElement.pause();
+			audioElement.removeEventListener("ended", handleEnded);
+			audioElement.removeEventListener("error", handleError);
+			audioElement.removeEventListener("loadedmetadata", handleLoadedMetadata);
+			audioElement.removeEventListener("timeupdate", handleTimeupdate);
+		};
+	};
 };
 //#endregion
 export { AudioPlayer, defaultRegisterAudioPlayerError, elementIsPlaying };