ts-video-player 0.1.7 → 0.1.8

package/dist/{chunk-24n6adw2.js → chunk-hvjcmbfn.js}

@@ -1026,8 +1026,9 @@ class VimeoProvider2 extends BaseProvider2 {
       return;
     }
     if (this.player) {
-      await this.player.destroy();
-      this.player = null;
+      await this.player.loadVideo(parseInt(parsed.videoId, 10));
+      await this.announceLoaded();
+      return;
     }
     const playerOptions = {
       id: parseInt(parsed.videoId, 10),
@@ -1051,6 +1052,11 @@ class VimeoProvider2 extends BaseProvider2 {
       this.iframe.style.cssText = "position:absolute;inset:0;width:100%;height:100%;border:0";
     }
     this.attachVimeoEvents();
+    await this.announceLoaded();
+  }
+  async announceLoaded() {
+    if (!this.player)
+      return;
     this.events.emit("loadedmetadata");
     this.events.emit("canplay");
     this._duration = await this.player.getDuration();
@@ -2042,6 +2048,630 @@ function embedCover(state, dismissed) {
   return { show: true, image: youtubeId ? `https://i.ytimg.com/vi/${youtubeId}/hqdefault.jpg` : "" };
 }
 
+// src/core/i18n.ts
+var englishStrings2 = {
+  play: "Play",
+  pause: "Pause",
+  replay: "Replay",
+  mute: "Mute",
+  unmute: "Unmute",
+  volume: "Volume",
+  seekBackward: "Seek backward {seconds} seconds",
+  seekForward: "Seek forward {seconds} seconds",
+  seekTo: "Seek to {time}",
+  duration: "Duration",
+  currentTime: "Current time",
+  played: "Played",
+  buffered: "Buffered",
+  enterFullscreen: "Enter fullscreen",
+  exitFullscreen: "Exit fullscreen",
+  enterPiP: "Enter picture-in-picture",
+  exitPiP: "Exit picture-in-picture",
+  enableCaptions: "Enable captions",
+  disableCaptions: "Disable captions",
+  captions: "Captions",
+  captionsOff: "Off",
+  settings: "Settings",
+  quality: "Quality",
+  auto: "Auto",
+  speed: "Speed",
+  normal: "Normal",
+  loop: "Loop",
+  loopEnabled: "Loop enabled",
+  loopDisabled: "Loop disabled",
+  audioBoost: "Audio boost",
+  audioTrack: "Audio track",
+  live: "LIVE",
+  liveEdge: "At live edge",
+  seekToLive: "Seek to live edge",
+  behindLive: "{seconds}s behind",
+  networkError: "A network error occurred",
+  mediaError: "The media could not be loaded",
+  unknownError: "An unknown error occurred",
+  loading: "Loading",
+  buffering: "Buffering",
+  chapters: "Chapters",
+  airPlay: "AirPlay",
+  googleCast: "Cast",
+  casting: "Casting to {device}",
+  download: "Download",
+  share: "Share",
+  close: "Close",
+  menu: "Menu",
+  back: "Back",
+  seek: "Seek",
+  playbackRate: "Playback speed {rate}x",
+  airPlayPlay: "Play on AirPlay",
+  remotePlayback: "Play on another device",
+  videoPlayer: "Video player",
+  videoRole: "video player",
+  playTitle: "Play {title}",
+  audio: "Audio",
+  defaultTrack: "Default",
+  playing: "Playing",
+  paused: "Paused",
+  muted: "Muted",
+  volumeLevel: "Volume {percent}%",
+  ended: "Playback ended",
+  enteredFullscreen: "Entered fullscreen",
+  exitedFullscreen: "Exited fullscreen",
+  errorMessage: "Error: {message}",
+  timeOf: "{current} of {duration}",
+  hourOne: "{n} hour",
+  hourOther: "{n} hours",
+  minuteOne: "{n} minute",
+  minuteOther: "{n} minutes",
+  secondOne: "{n} second",
+  secondOther: "{n} seconds"
+};
+var spanishStrings2 = {
+  play: "Reproducir",
+  pause: "Pausar",
+  replay: "Repetir",
+  mute: "Silenciar",
+  unmute: "Activar sonido",
+  volume: "Volumen",
+  seekBackward: "Retroceder {seconds} segundos",
+  seekForward: "Avanzar {seconds} segundos",
+  seekTo: "Ir a {time}",
+  duration: "Duración",
+  currentTime: "Tiempo actual",
+  played: "Reproducido",
+  buffered: "Almacenado",
+  enterFullscreen: "Pantalla completa",
+  exitFullscreen: "Salir de pantalla completa",
+  enterPiP: "Imagen en imagen",
+  exitPiP: "Salir de imagen en imagen",
+  enableCaptions: "Activar subtítulos",
+  disableCaptions: "Desactivar subtítulos",
+  captions: "Subtítulos",
+  captionsOff: "Desactivados",
+  settings: "Ajustes",
+  quality: "Calidad",
+  auto: "Automático",
+  speed: "Velocidad",
+  normal: "Normal",
+  loop: "Bucle",
+  loopEnabled: "Bucle activado",
+  loopDisabled: "Bucle desactivado",
+  audioBoost: "Aumento de audio",
+  audioTrack: "Pista de audio",
+  live: "EN VIVO",
+  liveEdge: "En vivo",
+  seekToLive: "Ir al directo",
+  behindLive: "{seconds}s de retraso",
+  networkError: "Error de red",
+  mediaError: "No se pudo cargar el medio",
+  unknownError: "Error desconocido",
+  loading: "Cargando",
+  buffering: "Almacenando",
+  chapters: "Capítulos",
+  airPlay: "AirPlay",
+  googleCast: "Enviar",
+  casting: "Enviando a {device}",
+  download: "Descargar",
+  share: "Compartir",
+  close: "Cerrar",
+  menu: "Menú",
+  back: "Volver",
+  seek: "Buscar",
+  playbackRate: "Velocidad de reproducción {rate}x",
+  airPlayPlay: "Reproducir con AirPlay",
+  remotePlayback: "Reproducir en otro dispositivo",
+  videoPlayer: "Reproductor de vídeo",
+  videoRole: "reproductor de vídeo",
+  playTitle: "Reproducir {title}",
+  audio: "Audio",
+  defaultTrack: "Predeterminado",
+  playing: "Reproduciendo",
+  paused: "En pausa",
+  muted: "Silenciado",
+  volumeLevel: "Volumen {percent}%",
+  ended: "Reproducción finalizada",
+  enteredFullscreen: "Pantalla completa activada",
+  exitedFullscreen: "Pantalla completa desactivada",
+  errorMessage: "Error: {message}",
+  timeOf: "{current} de {duration}",
+  hourOne: "{n} hora",
+  hourOther: "{n} horas",
+  minuteOne: "{n} minuto",
+  minuteOther: "{n} minutos",
+  secondOne: "{n} segundo",
+  secondOther: "{n} segundos"
+};
+var frenchStrings2 = {
+  play: "Lecture",
+  pause: "Pause",
+  replay: "Relire",
+  mute: "Muet",
+  unmute: "Son activé",
+  volume: "Volume",
+  seekBackward: "Reculer de {seconds} secondes",
+  seekForward: "Avancer de {seconds} secondes",
+  seekTo: "Aller à {time}",
+  duration: "Durée",
+  currentTime: "Temps actuel",
+  played: "Joué",
+  buffered: "Mis en mémoire tampon",
+  enterFullscreen: "Plein écran",
+  exitFullscreen: "Quitter le plein écran",
+  enterPiP: "Image dans l'image",
+  exitPiP: "Quitter l'image dans l'image",
+  enableCaptions: "Activer les sous-titres",
+  disableCaptions: "Désactiver les sous-titres",
+  captions: "Sous-titres",
+  captionsOff: "Désactivés",
+  settings: "Paramètres",
+  quality: "Qualité",
+  auto: "Auto",
+  speed: "Vitesse",
+  normal: "Normal",
+  loop: "Boucle",
+  loopEnabled: "Boucle activée",
+  loopDisabled: "Boucle désactivée",
+  audioBoost: "Amplification audio",
+  audioTrack: "Piste audio",
+  live: "EN DIRECT",
+  liveEdge: "En direct",
+  seekToLive: "Aller au direct",
+  behindLive: "{seconds}s de retard",
+  networkError: "Erreur réseau",
+  mediaError: "Le média n'a pas pu être chargé",
+  unknownError: "Erreur inconnue",
+  loading: "Chargement",
+  buffering: "Mise en mémoire tampon",
+  chapters: "Chapitres",
+  airPlay: "AirPlay",
+  googleCast: "Caster",
+  casting: "Diffusion sur {device}",
+  download: "Télécharger",
+  share: "Partager",
+  close: "Fermer",
+  menu: "Menu",
+  back: "Retour",
+  seek: "Rechercher",
+  playbackRate: "Vitesse de lecture {rate}x",
+  airPlayPlay: "Lire avec AirPlay",
+  remotePlayback: "Lire sur un autre appareil",
+  videoPlayer: "Lecteur vidéo",
+  videoRole: "lecteur vidéo",
+  playTitle: "Lire {title}",
+  audio: "Audio",
+  defaultTrack: "Par défaut",
+  playing: "Lecture",
+  paused: "En pause",
+  muted: "Son coupé",
+  volumeLevel: "Volume {percent} %",
+  ended: "Lecture terminée",
+  enteredFullscreen: "Plein écran activé",
+  exitedFullscreen: "Plein écran désactivé",
+  errorMessage: "Erreur : {message}",
+  timeOf: "{current} sur {duration}",
+  hourOne: "{n} heure",
+  hourOther: "{n} heures",
+  minuteOne: "{n} minute",
+  minuteOther: "{n} minutes",
+  secondOne: "{n} seconde",
+  secondOther: "{n} secondes"
+};
+var germanStrings2 = {
+  play: "Abspielen",
+  pause: "Pause",
+  replay: "Wiederholen",
+  mute: "Stumm",
+  unmute: "Ton an",
+  volume: "Lautstärke",
+  seekBackward: "{seconds} Sekunden zurück",
+  seekForward: "{seconds} Sekunden vor",
+  seekTo: "Zu {time} springen",
+  duration: "Dauer",
+  currentTime: "Aktuelle Zeit",
+  played: "Abgespielt",
+  buffered: "Gepuffert",
+  enterFullscreen: "Vollbild",
+  exitFullscreen: "Vollbild beenden",
+  enterPiP: "Bild-in-Bild",
+  exitPiP: "Bild-in-Bild beenden",
+  enableCaptions: "Untertitel aktivieren",
+  disableCaptions: "Untertitel deaktivieren",
+  captions: "Untertitel",
+  captionsOff: "Aus",
+  settings: "Einstellungen",
+  quality: "Qualität",
+  auto: "Auto",
+  speed: "Geschwindigkeit",
+  normal: "Normal",
+  loop: "Schleife",
+  loopEnabled: "Schleife aktiviert",
+  loopDisabled: "Schleife deaktiviert",
+  audioBoost: "Audio-Verstärkung",
+  audioTrack: "Audiospur",
+  live: "LIVE",
+  liveEdge: "Am Live-Punkt",
+  seekToLive: "Zum Live-Punkt",
+  behindLive: "{seconds}s hinter Live",
+  networkError: "Netzwerkfehler",
+  mediaError: "Medium konnte nicht geladen werden",
+  unknownError: "Unbekannter Fehler",
+  loading: "Wird geladen",
+  buffering: "Puffern",
+  chapters: "Kapitel",
+  airPlay: "AirPlay",
+  googleCast: "Streamen",
+  casting: "Streame zu {device}",
+  download: "Herunterladen",
+  share: "Teilen",
+  close: "Schließen",
+  menu: "Menü",
+  back: "Zurück",
+  seek: "Spulen",
+  playbackRate: "Wiedergabegeschwindigkeit {rate}x",
+  airPlayPlay: "Über AirPlay abspielen",
+  remotePlayback: "Auf einem anderen Gerät abspielen",
+  videoPlayer: "Videoplayer",
+  videoRole: "Videoplayer",
+  playTitle: "{title} abspielen",
+  audio: "Audio",
+  defaultTrack: "Standard",
+  playing: "Wird abgespielt",
+  paused: "Pausiert",
+  muted: "Stumm",
+  volumeLevel: "Lautstärke {percent} %",
+  ended: "Wiedergabe beendet",
+  enteredFullscreen: "Vollbild an",
+  exitedFullscreen: "Vollbild aus",
+  errorMessage: "Fehler: {message}",
+  timeOf: "{current} von {duration}",
+  hourOne: "{n} Stunde",
+  hourOther: "{n} Stunden",
+  minuteOne: "{n} Minute",
+  minuteOther: "{n} Minuten",
+  secondOne: "{n} Sekunde",
+  secondOther: "{n} Sekunden"
+};
+var japaneseStrings2 = {
+  play: "再生",
+  pause: "一時停止",
+  replay: "リプレイ",
+  mute: "ミュート",
+  unmute: "ミュート解除",
+  volume: "音量",
+  seekBackward: "{seconds}秒戻る",
+  seekForward: "{seconds}秒進む",
+  seekTo: "{time}にシーク",
+  duration: "長さ",
+  currentTime: "現在の時間",
+  played: "再生済み",
+  buffered: "バッファ済み",
+  enterFullscreen: "フルスクリーン",
+  exitFullscreen: "フルスクリーン終了",
+  enterPiP: "ピクチャーインピクチャー",
+  exitPiP: "ピクチャーインピクチャー終了",
+  enableCaptions: "字幕を有効化",
+  disableCaptions: "字幕を無効化",
+  captions: "字幕",
+  captionsOff: "オフ",
+  settings: "設定",
+  quality: "画質",
+  auto: "自動",
+  speed: "再生速度",
+  normal: "通常",
+  loop: "ループ",
+  loopEnabled: "ループ有効",
+  loopDisabled: "ループ無効",
+  audioBoost: "オーディオブースト",
+  audioTrack: "オーディオトラック",
+  live: "ライブ",
+  liveEdge: "ライブ中",
+  seekToLive: "ライブに移動",
+  behindLive: "{seconds}秒遅れ",
+  networkError: "ネットワークエラー",
+  mediaError: "メディアを読み込めません",
+  unknownError: "不明なエラー",
+  loading: "読み込み中",
+  buffering: "バッファリング",
+  chapters: "チャプター",
+  airPlay: "AirPlay",
+  googleCast: "キャスト",
+  casting: "{device}にキャスト中",
+  download: "ダウンロード",
+  share: "共有",
+  close: "閉じる",
+  menu: "メニュー",
+  back: "戻る",
+  seek: "シーク",
+  playbackRate: "再生速度 {rate}x",
+  airPlayPlay: "AirPlayで再生",
+  remotePlayback: "別のデバイスで再生",
+  videoPlayer: "動画プレーヤー",
+  videoRole: "動画プレーヤー",
+  playTitle: "{title}を再生",
+  audio: "音声",
+  defaultTrack: "デフォルト",
+  playing: "再生中",
+  paused: "一時停止中",
+  muted: "ミュート",
+  volumeLevel: "音量 {percent}%",
+  ended: "再生終了",
+  enteredFullscreen: "全画面表示",
+  exitedFullscreen: "全画面表示を終了",
+  errorMessage: "エラー: {message}",
+  timeOf: "{current} / {duration}",
+  hourOne: "{n}時間",
+  hourOther: "{n}時間",
+  minuteOne: "{n}分",
+  minuteOther: "{n}分",
+  secondOne: "{n}秒",
+  secondOther: "{n}秒"
+};
+var chineseStrings2 = {
+  play: "播放",
+  pause: "暂停",
+  replay: "重播",
+  mute: "静音",
+  unmute: "取消静音",
+  volume: "音量",
+  seekBackward: "后退{seconds}秒",
+  seekForward: "前进{seconds}秒",
+  seekTo: "跳转到{time}",
+  duration: "时长",
+  currentTime: "当前时间",
+  played: "已播放",
+  buffered: "已缓冲",
+  enterFullscreen: "全屏",
+  exitFullscreen: "退出全屏",
+  enterPiP: "画中画",
+  exitPiP: "退出画中画",
+  enableCaptions: "开启字幕",
+  disableCaptions: "关闭字幕",
+  captions: "字幕",
+  captionsOff: "关闭",
+  settings: "设置",
+  quality: "画质",
+  auto: "自动",
+  speed: "播放速度",
+  normal: "正常",
+  loop: "循环",
+  loopEnabled: "循环已开启",
+  loopDisabled: "循环已关闭",
+  audioBoost: "音频增强",
+  audioTrack: "音轨",
+  live: "直播",
+  liveEdge: "直播中",
+  seekToLive: "跳转到直播",
+  behindLive: "落后{seconds}秒",
+  networkError: "网络错误",
+  mediaError: "无法加载媒体",
+  unknownError: "未知错误",
+  loading: "加载中",
+  buffering: "缓冲中",
+  chapters: "章节",
+  airPlay: "AirPlay",
+  googleCast: "投射",
+  casting: "正在投射到{device}",
+  download: "下载",
+  share: "分享",
+  close: "关闭",
+  menu: "菜单",
+  back: "返回",
+  seek: "跳转",
+  playbackRate: "播放速度 {rate}x",
+  airPlayPlay: "通过 AirPlay 播放",
+  remotePlayback: "在其他设备上播放",
+  videoPlayer: "视频播放器",
+  videoRole: "视频播放器",
+  playTitle: "播放{title}",
+  audio: "音频",
+  defaultTrack: "默认",
+  playing: "正在播放",
+  paused: "已暂停",
+  muted: "已静音",
+  volumeLevel: "音量 {percent}%",
+  ended: "播放结束",
+  enteredFullscreen: "已进入全屏",
+  exitedFullscreen: "已退出全屏",
+  errorMessage: "错误：{message}",
+  timeOf: "{current} / {duration}",
+  hourOne: "{n}小时",
+  hourOther: "{n}小时",
+  minuteOne: "{n}分钟",
+  minuteOther: "{n}分钟",
+  secondOne: "{n}秒",
+  secondOther: "{n}秒"
+};
+var defaultTranslations2 = {
+  en: englishStrings2,
+  es: spanishStrings2,
+  fr: frenchStrings2,
+  de: germanStrings2,
+  ja: japaneseStrings2,
+  zh: chineseStrings2
+};
+
+class I18n2 {
+  language;
+  fallbackLanguage;
+  translations;
+  interpolationPattern;
+  constructor(config = {}) {
+    this.translations = { ...defaultTranslations2 };
+    this.language = config.language || this.detectLanguage() || "en";
+    this.fallbackLanguage = config.fallbackLanguage || "en";
+    if (config.translations) {
+      for (const [lang, strings] of Object.entries(config.translations)) {
+        if (strings) {
+          this.translations[lang] = { ...this.translations[lang], ...strings };
+        }
+      }
+    }
+    this.interpolationPattern = config.interpolationPattern || /\{(\w+)\}/g;
+  }
+  detectLanguage() {
+    if (typeof navigator === "undefined")
+      return null;
+    const lang = navigator.language || navigator.userLanguage;
+    if (!lang)
+      return null;
+    if (this.translations[lang]) {
+      return lang;
+    }
+    const baseLang = lang.split("-")[0];
+    if (this.translations[baseLang]) {
+      return baseLang;
+    }
+    return null;
+  }
+  getLanguage() {
+    return this.language;
+  }
+  setLanguage(language) {
+    this.language = language;
+  }
+  t(key, params) {
+    let str = this.translations[this.language]?.[key];
+    if (!str) {
+      str = this.translations[this.fallbackLanguage]?.[key];
+    }
+    if (!str) {
+      return key;
+    }
+    if (params) {
+      str = str.replace(this.interpolationPattern, (match, paramKey) => {
+        const value = params[paramKey];
+        return value !== undefined ? String(value) : match;
+      });
+    }
+    return str;
+  }
+  addTranslations(language, strings) {
+    this.translations[language] = {
+      ...this.translations[language],
+      ...strings
+    };
+  }
+  getTranslations(language) {
+    return this.translations[language];
+  }
+  getAvailableLanguages() {
+    return Object.keys(this.translations);
+  }
+  hasLanguage(language) {
+    return language in this.translations;
+  }
+}
+var globalI18n = null;
+function createI18n2(config) {
+  return new I18n2(config);
+}
+function getI18n2(config) {
+  if (!globalI18n) {
+    globalI18n = createI18n2(config);
+  }
+  return globalI18n;
+}
+function setI18n2(i18n) {
+  globalI18n = i18n;
+}
+function t2(key, params) {
+  return getI18n2().t(key, params);
+}
+
+// src/elements/utils.ts
+function languageOf(el) {
+  let node = el;
+  while (node) {
+    const tagged = node.closest?.("[lang]")?.getAttribute("lang");
+    if (tagged)
+      return tagged.toLowerCase();
+    const root = node.getRootNode?.();
+    node = root && root.host ? root.host : null;
+  }
+  if (typeof navigator !== "undefined" && navigator.language)
+    return navigator.language.toLowerCase();
+  return "en";
+}
+function label(el, key, params) {
+  const lang = languageOf(el);
+  const i18n = getI18n2();
+  const text = i18n.getTranslations(lang)?.[key] || i18n.getTranslations(lang.split("-")[0])?.[key] || englishStrings2[key] || key;
+  return params ? text.replace(/\{(\w+)\}/g, (match, name) => params[name] !== undefined ? String(params[name]) : match) : text;
+}
+function formatTime2(seconds, guide = 0) {
+  if (!isFinite(seconds) || isNaN(seconds))
+    return "0:00";
+  const s = Math.floor(seconds);
+  const h = Math.floor(s / 3600);
+  const m = Math.floor(s % 3600 / 60);
+  const sec = s % 60;
+  const showHours = h > 0 || guide >= 3600;
+  if (showHours) {
+    return `${h}:${m.toString().padStart(2, "0")}:${sec.toString().padStart(2, "0")}`;
+  }
+  return `${m}:${sec.toString().padStart(2, "0")}`;
+}
+function formatTimePhrase2(seconds, el) {
+  const say = (n, one, other) => label(el, n === 1 ? one : other, { n });
+  if (!isFinite(seconds) || isNaN(seconds))
+    return say(0, "secondOne", "secondOther");
+  const s = Math.floor(seconds);
+  const h = Math.floor(s / 3600);
+  const m = Math.floor(s % 3600 / 60);
+  const sec = s % 60;
+  const parts = [];
+  if (h > 0)
+    parts.push(say(h, "hourOne", "hourOther"));
+  if (m > 0)
+    parts.push(say(m, "minuteOne", "minuteOther"));
+  if (sec > 0 || parts.length === 0)
+    parts.push(say(sec, "secondOne", "secondOther"));
+  return parts.join(", ");
+}
+function toISODuration2(seconds) {
+  if (!isFinite(seconds) || isNaN(seconds))
+    return "PT0S";
+  const s = Math.floor(seconds);
+  const h = Math.floor(s / 3600);
+  const m = Math.floor(s % 3600 / 60);
+  const sec = s % 60;
+  let result = "PT";
+  if (h > 0)
+    result += `${h}H`;
+  if (m > 0)
+    result += `${m}M`;
+  if (sec > 0 || result === "PT")
+    result += `${sec}S`;
+  return result;
+}
+function resolvePlayer2(el) {
+  const forId = el.getAttribute("for");
+  if (forId) {
+    const target = document.getElementById(forId);
+    return target?.player ?? null;
+  }
+  const host = el.closest("video-player");
+  return host?.player ?? null;
+}
+
 // src/player.ts
 class Player2 {
   _el;
@@ -2098,8 +2728,8 @@ class Player2 {
     this._el.classList.add("ts-video-player");
     this._el.setAttribute("tabindex", "0");
     this._el.setAttribute("role", "region");
-    this._el.setAttribute("aria-roledescription", "video player");
-    this._el.setAttribute("aria-label", this._options.title || "Video player");
+    this._el.setAttribute("aria-roledescription", label(this._el, "videoRole"));
+    this._el.setAttribute("aria-label", this._options.title || label(this._el, "videoPlayer"));
     this._el.setAttribute("aria-keyshortcuts", "Space K M F I C ArrowLeft ArrowRight J L ArrowUp ArrowDown Home End 0 1 2 3 4 5 6 7 8 9");
     const mediaContainer = document.createElement("div");
     mediaContainer.className = "ts-video-player__container";
@@ -2123,7 +2753,7 @@ class Player2 {
     const cover = document.createElement("button");
     cover.type = "button";
     cover.className = "ts-video-player__cover";
-    cover.setAttribute("aria-label", `Play ${this._options.title || "video"}`);
+    cover.setAttribute("aria-label", this._options.title ? label(this._el, "playTitle", { title: this._options.title }) : label(this._el, "play"));
     cover.hidden = true;
     cover.style.cssText = "position:absolute;inset:0;z-index:2;display:none;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:#000 center/cover no-repeat;cursor:pointer;-webkit-tap-highlight-color:transparent";
     const button = document.createElement("span");
@@ -2348,7 +2978,7 @@ class Player2 {
       return;
     }
     this._coverDismissed = false;
-    this._playRequested = false;
+    this._playRequested = !!this._options.autoplay;
     this._store.batch({
       sources,
       src: sources[0],
@@ -2408,7 +3038,7 @@ class Player2 {
         });
         if (this._playRequested) {
           this._playRequested = false;
-          this._provider.play().catch(() => {});
+          this.startRequestedPlay(this._provider);
         }
         return;
       } catch (error) {
@@ -2455,12 +3085,12 @@ class Player2 {
     provider.on("play", () => {
       this._store.batch({ paused: false, ended: false });
       this._events.emit("play");
-      this.announce("Playing");
+      this.announce(label(this._el, "playing"));
     });
     provider.on("pause", () => {
       this._store.set("paused", true);
       this._events.emit("pause");
-      this.announce("Paused");
+      this.announce(label(this._el, "paused"));
     });
     provider.on("playing", () => {
       this._store.batch({ playing: true, started: true, waiting: false, playbackState: "playing" });
@@ -2490,9 +3120,9 @@ class Player2 {
       this._store.batch({ volume, muted });
       this._events.emit("volumechange", volume, muted);
       if (muted) {
-        this.announce("Muted");
+        this.announce(label(this._el, "muted"));
       } else {
-        this.announce(`Volume ${Math.round(volume * 100)}%`);
+        this.announce(label(this._el, "volumeLevel", { percent: Math.round(volume * 100) }));
       }
     });
     provider.on("ratechange", (rate) => {
@@ -2509,7 +3139,7 @@ class Player2 {
     provider.on("ended", () => {
       this._store.batch({ ended: true, playing: false, playbackState: "ended" });
       this._events.emit("ended");
-      this.announce("Playback ended");
+      this.announce(label(this._el, "ended"));
       if (this.state.loop) {
         this.seekTo(0);
         this.play();
@@ -2518,7 +3148,7 @@ class Player2 {
     provider.on("error", (error) => {
       this._store.batch({ loadingState: "error", error });
       this._events.emit("error", error);
-      this.announce(`Error: ${error.message}`);
+      this.announce(label(this._el, "errorMessage", { message: error.message }));
     });
     provider.on("statechange", (state) => {
       this._store.batch(state);
@@ -2531,7 +3161,7 @@ class Player2 {
     provider.on("fullscreenchange", (fullscreen) => {
       this._store.set("fullscreen", fullscreen);
       this._events.emit("fullscreenchange", fullscreen);
-      this.announce(fullscreen ? "Entered fullscreen" : "Exited fullscreen");
+      this.announce(label(this._el, fullscreen ? "enteredFullscreen" : "exitedFullscreen"));
     });
     provider.on("pipchange", (pip) => {
       this._store.set("pictureInPicture", pip);
@@ -2547,6 +3177,14 @@ class Player2 {
       this._events.emit("availabilitychange", feature, availability);
     });
   }
+  async startRequestedPlay(provider) {
+    await provider.play().catch(() => {});
+    if (this._provider !== provider || this.state.error?.code !== 1 || this.state.muted)
+      return;
+    this._store.set("error", null);
+    this.setMuted(true);
+    await provider.play().catch(() => {});
+  }
   async play() {
     if (!this._provider) {
       this._playRequested = true;
@@ -2871,62 +3509,6 @@ class VideoPlayerElement2 extends HTMLElementBase {
     }
   }
 }
-// src/elements/utils.ts
-function formatTime2(seconds, guide = 0) {
-  if (!isFinite(seconds) || isNaN(seconds))
-    return "0:00";
-  const s = Math.floor(seconds);
-  const h = Math.floor(s / 3600);
-  const m = Math.floor(s % 3600 / 60);
-  const sec = s % 60;
-  const showHours = h > 0 || guide >= 3600;
-  if (showHours) {
-    return `${h}:${m.toString().padStart(2, "0")}:${sec.toString().padStart(2, "0")}`;
-  }
-  return `${m}:${sec.toString().padStart(2, "0")}`;
-}
-function formatTimePhrase2(seconds) {
-  if (!isFinite(seconds) || isNaN(seconds))
-    return "0 seconds";
-  const s = Math.floor(seconds);
-  const h = Math.floor(s / 3600);
-  const m = Math.floor(s % 3600 / 60);
-  const sec = s % 60;
-  const parts = [];
-  if (h > 0)
-    parts.push(`${h} ${h === 1 ? "hour" : "hours"}`);
-  if (m > 0)
-    parts.push(`${m} ${m === 1 ? "minute" : "minutes"}`);
-  if (sec > 0 || parts.length === 0)
-    parts.push(`${sec} ${sec === 1 ? "second" : "seconds"}`);
-  return parts.join(", ");
-}
-function toISODuration2(seconds) {
-  if (!isFinite(seconds) || isNaN(seconds))
-    return "PT0S";
-  const s = Math.floor(seconds);
-  const h = Math.floor(s / 3600);
-  const m = Math.floor(s % 3600 / 60);
-  const sec = s % 60;
-  let result = "PT";
-  if (h > 0)
-    result += `${h}H`;
-  if (m > 0)
-    result += `${m}M`;
-  if (sec > 0 || result === "PT")
-    result += `${sec}S`;
-  return result;
-}
-function resolvePlayer2(el) {
-  const forId = el.getAttribute("for");
-  if (forId) {
-    const target = document.getElementById(forId);
-    return target?.player ?? null;
-  }
-  const host = el.closest("video-player");
-  return host?.player ?? null;
-}
-
 // src/elements/video-skin.ts
 class VideoSkin2 extends HTMLElementBase {
   _cleanups = [];
@@ -3062,7 +3644,7 @@ class MediaPlayButton2 extends HTMLElementBase {
           }
           button:hover { opacity: 0.8; }
         </style>
-        <button part="button" type="button" aria-label="Play">
+        <button part="button" type="button" aria-label="${label(this, "play")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon">
             <path d="${PLAY_ICON}"/>
           </svg>
@@ -3088,7 +3670,7 @@ class MediaPlayButton2 extends HTMLElementBase {
     btn.addEventListener("click", this._onClick);
     const unsub = player.subscribe("paused", (state) => {
       const paused = state.paused;
-      btn.setAttribute("aria-label", paused ? "Play" : "Pause");
+      btn.setAttribute("aria-label", label(this, paused ? "play" : "pause"));
       btn.setAttribute("aria-pressed", String(!paused));
       const path = this.shadowRoot.querySelector("path");
       path.setAttribute("d", paused ? PLAY_ICON : PAUSE_ICON);
@@ -3123,7 +3705,7 @@ class MediaMuteButton2 extends HTMLElementBase {
           }
           button:hover { opacity: 0.8; }
         </style>
-        <button part="button" type="button" aria-label="Mute">
+        <button part="button" type="button" aria-label="${label(this, "mute")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon">
             <path d="${ICON_HIGH}"/>
           </svg>
@@ -3144,7 +3726,7 @@ class MediaMuteButton2 extends HTMLElementBase {
     btn.addEventListener("click", () => player.toggleMute());
     const unsub = player.subscribe((state) => {
       const icon = getVolumeIcon(state.muted, state.volume);
-      btn.setAttribute("aria-label", state.muted ? "Unmute" : "Mute");
+      btn.setAttribute("aria-label", label(this, state.muted ? "unmute" : "mute"));
       const path = this.shadowRoot.querySelector("path");
       path.setAttribute("d", icon);
     });
@@ -3172,7 +3754,7 @@ class MediaFullscreenButton2 extends HTMLElementBase {
           button:hover { opacity: 0.8; }
           button:disabled { opacity: 0.4; cursor: not-allowed; }
         </style>
-        <button part="button" type="button" aria-label="Enter fullscreen">
+        <button part="button" type="button" aria-label="${label(this, "enterFullscreen")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon">
             <path d="${ENTER_FS}"/>
           </svg>
@@ -3200,7 +3782,7 @@ class MediaFullscreenButton2 extends HTMLElementBase {
       }
       btn.disabled = avail !== "available";
       const fs = state.fullscreen;
-      btn.setAttribute("aria-label", fs ? "Exit fullscreen" : "Enter fullscreen");
+      btn.setAttribute("aria-label", label(this, fs ? "exitFullscreen" : "enterFullscreen"));
       const path = this.shadowRoot.querySelector("path");
       path.setAttribute("d", fs ? EXIT_FS : ENTER_FS);
     });
@@ -3227,7 +3809,7 @@ class MediaPipButton2 extends HTMLElementBase {
           button:hover { opacity: 0.8; }
           button:disabled { opacity: 0.4; cursor: not-allowed; }
         </style>
-        <button part="button" type="button" aria-label="Picture in picture">
+        <button part="button" type="button" aria-label="${label(this, "enterPiP")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon">
             <path d="${PIP_ICON}"/>
           </svg>
@@ -3254,6 +3836,7 @@ class MediaPipButton2 extends HTMLElementBase {
         this.removeAttribute("hidden");
       }
       btn.disabled = avail !== "available";
+      btn.setAttribute("aria-label", label(this, state.pictureInPicture ? "exitPiP" : "enterPiP"));
     });
     this._cleanup = unsub;
   }
@@ -3284,7 +3867,7 @@ class MediaTimeDisplay2 extends HTMLElementBase {
           time { color: inherit; }
           .separator { margin: 0 2px; }
         </style>
-        <time part="time" datetime="PT0S" aria-valuetext="0 seconds">0:00</time>
+        <time part="time" datetime="PT0S" aria-valuetext="${formatTimePhrase2(0, this)}">0:00</time>
       `;
     }
     this.addEventListener("click", this.handleClick);
@@ -3330,7 +3913,7 @@ class MediaTimeDisplay2 extends HTMLElementBase {
       timeEl.textContent = formatTime2(seconds, state.duration);
     }
     timeEl.setAttribute("datetime", toISODuration2(seconds));
-    timeEl.setAttribute("aria-valuetext", formatTimePhrase2(seconds));
+    timeEl.setAttribute("aria-valuetext", formatTimePhrase2(seconds, this));
   }
 }
 // src/elements/media-time-group.ts
@@ -3488,7 +4071,7 @@ class MediaProgressBar2 extends HTMLElementBase {
         </style>
         <div class="container" part="container" role="slider"
           aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"
-          aria-label="Seek" tabindex="0">
+          aria-label="${label(this, "seek")}" tabindex="0">
           <div class="tooltip" part="tooltip">0:00</div>
           <div class="track" part="track">
             <div class="waveform" part="waveform" aria-hidden="true"></div>
@@ -3594,7 +4177,7 @@ class MediaProgressBar2 extends HTMLElementBase {
       fill.style.width = `${percent}%`;
       thumb.style.left = `${percent}%`;
       container.setAttribute("aria-valuenow", String(Math.round(percent)));
-      container.setAttribute("aria-valuetext", `${formatTimePhrase2(state.currentTime)} of ${formatTimePhrase2(duration)}`);
+      container.setAttribute("aria-valuetext", label(this, "timeOf", { current: formatTimePhrase2(state.currentTime, this), duration: formatTimePhrase2(duration, this) }));
       const bufferedPct = (state.bufferedAmount || 0) * 100;
       buffered.style.width = `${bufferedPct}%`;
     });
@@ -3636,7 +4219,7 @@ class MediaVolumeSlider2 extends HTMLElementBase {
         </style>
         <div class="container" part="container" role="slider"
           aria-valuemin="0" aria-valuemax="100" aria-valuenow="100"
-          aria-label="Volume" tabindex="0">
+          aria-label="${label(this, "volume")}" tabindex="0">
           <div class="track" part="track">
             <div class="fill" part="fill"></div>
             <div class="thumb" part="thumb"></div>
@@ -3831,7 +4414,7 @@ class MediaSettingsMenu2 extends HTMLElementBase {
           .back { font-weight: bold; border-bottom: 1px solid rgba(255,255,255,0.2); }
         </style>
         <button class="trigger" part="trigger" type="button"
-                aria-label="Settings" aria-haspopup="true" aria-expanded="false">
+                aria-label="${label(this, "settings")}" aria-haspopup="true" aria-expanded="false">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon">
             <path d="${GEAR_ICON}"/>
           </svg>
@@ -3943,35 +4526,35 @@ class MediaSettingsMenu2 extends HTMLElementBase {
   }
   renderMain(menu, player) {
     const state = player.state;
-    this.addItem(menu, `Speed: ${state.playbackRate}x`, () => {
+    this.addItem(menu, `${label(this, "speed")}: ${state.playbackRate}x`, () => {
       this._currentPanel = "speed";
       this.renderPanel();
     });
     if (state.qualities.length > 0) {
       const current = state.qualities.find((q) => q.selected);
-      const label = state.autoQuality ? "Auto" : current ? `${current.height}p` : "Auto";
-      this.addItem(menu, `Quality: ${label}`, () => {
+      const label2 = state.autoQuality ? label(this, "auto") : current ? `${current.height}p` : label(this, "auto");
+      this.addItem(menu, `${label(this, "quality")}: ${label2}`, () => {
         this._currentPanel = "quality";
         this.renderPanel();
       });
     }
     if (state.textTracks.length > 0) {
       const showing = state.textTracks.find((t) => t.mode === "showing");
-      this.addItem(menu, `Captions: ${showing?.label || "Off"}`, () => {
+      this.addItem(menu, `${label(this, "captions")}: ${showing?.label || label(this, "captionsOff")}`, () => {
         this._currentPanel = "captions";
         this.renderPanel();
       });
     }
     if (state.audioTracks.length > 1) {
       const selected = state.audioTracks.find((track) => track.selected);
-      this.addItem(menu, `Audio: ${selected?.label || "Default"}`, () => {
+      this.addItem(menu, `${label(this, "audio")}: ${selected?.label || label(this, "defaultTrack")}`, () => {
         this._currentPanel = "audio";
         this.renderPanel();
       });
     }
   }
   renderSpeed(menu, player) {
-    this.addItem(menu, "Back", () => {
+    this.addItem(menu, label(this, "back"), () => {
       this._currentPanel = "main";
       this.renderPanel();
     }, false, true);
@@ -3984,11 +4567,11 @@ class MediaSettingsMenu2 extends HTMLElementBase {
     }
   }
   renderQuality(menu, player) {
-    this.addItem(menu, "Back", () => {
+    this.addItem(menu, label(this, "back"), () => {
       this._currentPanel = "main";
       this.renderPanel();
     }, false, true);
-    this.addItem(menu, "Auto", () => {
+    this.addItem(menu, label(this, "auto"), () => {
       player.setQuality("auto");
       this.close();
     }, player.state.autoQuality);
@@ -4000,12 +4583,12 @@ class MediaSettingsMenu2 extends HTMLElementBase {
     }
   }
   renderCaptions(menu, player) {
-    this.addItem(menu, "Back", () => {
+    this.addItem(menu, label(this, "back"), () => {
       this._currentPanel = "main";
       this.renderPanel();
     }, false, true);
     const anyShowing = player.state.textTracks.some((t) => t.mode === "showing");
-    this.addItem(menu, "Off", () => {
+    this.addItem(menu, label(this, "captionsOff"), () => {
       for (const t of player.state.textTracks) {
         if (t.mode === "showing")
           player.setTextTrack(t.id, "disabled");
@@ -4022,12 +4605,12 @@ class MediaSettingsMenu2 extends HTMLElementBase {
     }
   }
   renderAudio(menu, player) {
-    this.addItem(menu, "Back", () => {
+    this.addItem(menu, label(this, "back"), () => {
       this._currentPanel = "main";
       this.renderPanel();
     }, false, true);
     for (const track of player.state.audioTracks) {
-      this.addItem(menu, track.label || track.language || "Audio track", () => {
+      this.addItem(menu, track.label || track.language || label(this, "audioTrack"), () => {
         player.setAudioTrack(track.id);
         this.close();
       }, track.selected);
@@ -4079,9 +4662,8 @@ class MediaSeekButton2 extends HTMLElementBase {
       return;
     const seconds = Number.parseFloat(this.getAttribute("seconds") ?? "10");
     const offset = Number.isFinite(seconds) && seconds !== 0 ? seconds : 10;
-    const label = offset > 0 ? `Forward ${offset} seconds` : `Back ${Math.abs(offset)} seconds`;
     button.textContent = offset > 0 ? `+${offset}` : String(offset);
-    button.setAttribute("aria-label", label);
+    button.setAttribute("aria-label", label(this, offset > 0 ? "seekForward" : "seekBackward", { seconds: Math.abs(offset) }));
     this.onClick = () => player.seekBy(offset);
     button.addEventListener("click", this.onClick);
     this.cleanup = player.subscribe((state) => {
@@ -4105,7 +4687,7 @@ class MediaPlaybackRateButton2 extends HTMLElementBase {
           button:hover { opacity: .8; }
           button:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
         </style>
-        <button part="button" type="button" aria-label="Playback speed"></button>
+        <button part="button" type="button" aria-label="${label(this, "speed")}"></button>
       `;
     }
     queueMicrotask(() => this.attach());
@@ -4135,7 +4717,7 @@ class MediaPlaybackRateButton2 extends HTMLElementBase {
     button.addEventListener("click", this.onClick);
     this.cleanup = player.subscribe("playbackRate", (state) => {
       button.textContent = `${state.playbackRate}x`;
-      button.setAttribute("aria-label", `Playback speed ${state.playbackRate}x`);
+      button.setAttribute("aria-label", label(this, "playbackRate", { rate: state.playbackRate }));
     });
   }
 }
@@ -4155,7 +4737,7 @@ class MediaAirplayButton2 extends HTMLElementBase {
           button:hover { opacity: 0.8; }
           :host([connected]) button { color: var(--media-airplay-active-color, #38bdf8); }
         </style>
-        <button part="button" type="button" aria-label="Play on AirPlay">
+        <button part="button" type="button" aria-label="${label(this, "airPlayPlay")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon"><path d="${AIRPLAY_ICON}"/></svg>
         </button>
       `;
@@ -4214,7 +4796,7 @@ class MediaLiveButton2 extends HTMLElementBase {
           i { width: 8px; height: 8px; border-radius: 9999px; background: #ef4444; }
           :host(:not([at-live-edge])) button { opacity: 0.72; }
         </style>
-        <button part="button" type="button" aria-label="Go to live edge"><i aria-hidden="true"></i><span>LIVE</span></button>
+        <button part="button" type="button" aria-label="${label(this, "seekToLive")}"><i aria-hidden="true"></i><span>${label(this, "live")}</span></button>
       `;
     }
     queueMicrotask(() => this.attach());
@@ -4310,7 +4892,7 @@ class MediaRemotePlaybackButton2 extends HTMLElementBase {
           button:hover { opacity: 0.8; }
           :host([connected]) button { color: var(--media-remote-active-color, #38bdf8); }
         </style>
-        <button part="button" type="button" aria-label="Play on another device">
+        <button part="button" type="button" aria-label="${label(this, "remotePlayback")}">
           <svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" part="icon"><path d="${REMOTE_ICON}"/></svg>
         </button>
       `;
@@ -4413,4 +4995,4 @@ function registerElements2() {
   }
 }
 
-export { isMediaSessionSupported2, createMediaSession2, updateMetadata2, isOrientationLockSupported2, lockOrientation2, unlockOrientation2, BaseProvider2, isHTML5Source2, HTML5Provider2, html5Loader2, extractYouTubeId2, isYouTubeSource2, YouTubeProvider2, youtubeLoader2, extractVimeoId2, extractVimeoHash2, isVimeoSource2, VimeoProvider2, vimeoLoader2, isHLSSource2, isNativeHLSSupported2, HLSProvider2, hlsLoader2, isDASHSource2, DASHProvider2, dashLoader2, defaultLoaders2, findLoader2, detectMediaType2, getPreconnectHints2, Player2, createPlayer2, getPlayer2, VideoPlayerElement2, formatTime2, formatTimePhrase2, toISODuration2, resolvePlayer2, VideoSkin2, MediaPlayButton2, MediaMuteButton2, MediaFullscreenButton2, MediaPipButton2, MediaTimeDisplay2, MediaTimeGroup2, MediaTimeSeparator2, MediaPreviewTime2, MediaProgressBar2, MediaVolumeSlider2, computePosition2, applyPosition2, MediaSettingsMenu2, MediaSeekButton2, MediaPlaybackRateButton2, MediaAirplayButton2, MediaLiveButton2, MediaErrorDisplay2, MediaRemotePlaybackButton2, registerElements2 };
+export { isMediaSessionSupported2, createMediaSession2, updateMetadata2, isOrientationLockSupported2, lockOrientation2, unlockOrientation2, BaseProvider2, isHTML5Source2, HTML5Provider2, html5Loader2, extractYouTubeId2, isYouTubeSource2, YouTubeProvider2, youtubeLoader2, extractVimeoId2, extractVimeoHash2, isVimeoSource2, VimeoProvider2, vimeoLoader2, isHLSSource2, isNativeHLSSupported2, HLSProvider2, hlsLoader2, isDASHSource2, DASHProvider2, dashLoader2, defaultLoaders2, findLoader2, detectMediaType2, getPreconnectHints2, englishStrings2, spanishStrings2, frenchStrings2, germanStrings2, japaneseStrings2, chineseStrings2, defaultTranslations2, I18n2, createI18n2, getI18n2, setI18n2, t2, formatTime2, formatTimePhrase2, toISODuration2, resolvePlayer2, Player2, createPlayer2, getPlayer2, VideoPlayerElement2, VideoSkin2, MediaPlayButton2, MediaMuteButton2, MediaFullscreenButton2, MediaPipButton2, MediaTimeDisplay2, MediaTimeGroup2, MediaTimeSeparator2, MediaPreviewTime2, MediaProgressBar2, MediaVolumeSlider2, computePosition2, applyPosition2, MediaSettingsMenu2, MediaSeekButton2, MediaPlaybackRateButton2, MediaAirplayButton2, MediaLiveButton2, MediaErrorDisplay2, MediaRemotePlaybackButton2, registerElements2 };