@mux/mux-player 3.11.9-canary.2 → 3.12.0

package/dist/themes/news/index.js

@@ -689,7 +689,7 @@ var mediaThemeNews = (() => {
   var internalGlobalThis = isServer ? globalThisShim : globalThis;
   var internalDocument = isServer ? globalThisShim.document : globalThis.document;
 
-  // node_modules/media-chrome/dist/constants.js
+  // ../../node_modules/media-chrome/dist/constants.js
   var MediaUIEvents = {
     MEDIA_PLAY_REQUEST: "mediaplayrequest",
     MEDIA_PAUSE_REQUEST: "mediapauserequest",
@@ -822,7 +822,7 @@ var mediaThemeNews = (() => {
     METADATA: "metadata"
   };
 
-  // node_modules/media-chrome/dist/utils/server-safe-globals.js
+  // ../../node_modules/media-chrome/dist/utils/server-safe-globals.js
   var EventTarget2 = class {
     addEventListener() {
     }
@@ -928,7 +928,7 @@ var mediaThemeNews = (() => {
   var GlobalThis = isServer2 && !isShimmed ? globalThisShim2 : globalThis;
   var Document2 = isServer2 && !isShimmed ? documentShim : globalThis.document;
 
-  // node_modules/media-chrome/dist/utils/template-parts.js
+  // ../../node_modules/media-chrome/dist/utils/template-parts.js
   var __accessCheck2 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -1259,7 +1259,7 @@ var mediaThemeNews = (() => {
     return b;
   }
 
-  // node_modules/media-chrome/dist/utils/utils.js
+  // ../../node_modules/media-chrome/dist/utils/utils.js
   function parseRenditionList(renditions) {
     return renditions == null ? void 0 : renditions.split(/\s+/).map(parseRendition);
   }
@@ -1292,7 +1292,7 @@ var mediaThemeNews = (() => {
     return !isNaN(str) && !isNaN(parseFloat(str));
   }
 
-  // node_modules/media-chrome/dist/utils/template-processor.js
+  // ../../node_modules/media-chrome/dist/utils/template-processor.js
   var pipeModifiers = {
     string: (value) => String(value)
   };
@@ -1519,7 +1519,7 @@ var mediaThemeNews = (() => {
     return tokens;
   }
 
-  // node_modules/media-chrome/dist/media-theme-element.js
+  // ../../node_modules/media-chrome/dist/media-theme-element.js
   var __accessCheck3 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -1780,7 +1780,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-theme", MediaThemeElement);
   }
 
-  // node_modules/media-chrome/dist/utils/anchor-utils.js
+  // ../../node_modules/media-chrome/dist/utils/anchor-utils.js
   function computePosition({
     anchor,
     floating,
@@ -1856,7 +1856,7 @@ var mediaThemeNews = (() => {
     return ["top", "bottom"].includes(getSide(placement)) ? "y" : "x";
   }
 
-  // node_modules/media-chrome/dist/utils/resize-observer.js
+  // ../../node_modules/media-chrome/dist/utils/resize-observer.js
   var callbacksMap = /* @__PURE__ */ new WeakMap();
   var getCallbacks = (element) => {
     let callbacks = callbacksMap.get(element);
@@ -1885,7 +1885,7 @@ var mediaThemeNews = (() => {
     }
   }
 
-  // node_modules/media-chrome/dist/utils/events.js
+  // ../../node_modules/media-chrome/dist/utils/events.js
   var InvokeEvent = class extends Event {
     /**
      * @param init - The event options.
@@ -1907,7 +1907,7 @@ var mediaThemeNews = (() => {
     }
   };
 
-  // node_modules/media-chrome/dist/utils/element-utils.js
+  // ../../node_modules/media-chrome/dist/utils/element-utils.js
   function namedNodeMapToObject(namedNodeMap) {
     const obj = {};
     for (const attr of namedNodeMap) {
@@ -2074,7 +2074,7 @@ var mediaThemeNews = (() => {
     el.setAttribute(attrName, nextValue);
   }
 
-  // node_modules/media-chrome/dist/menu/media-chrome-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-chrome-menu.js
   var __accessCheck4 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -2919,7 +2919,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-chrome-menu", MediaChromeMenu);
   }
 
-  // node_modules/media-chrome/dist/menu/media-chrome-menu-item.js
+  // ../../node_modules/media-chrome/dist/menu/media-chrome-menu-item.js
   var __accessCheck5 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -3371,7 +3371,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-settings-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-settings-menu.js
   function getTemplateHTML3(_attrs) {
     return (
       /*html*/
@@ -3431,7 +3431,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-settings-menu", MediaSettingsMenu);
   }
 
-  // node_modules/media-chrome/dist/menu/media-settings-menu-item.js
+  // ../../node_modules/media-chrome/dist/menu/media-settings-menu-item.js
   function getTemplateHTML4(_attrs) {
     return (
       /*html*/
@@ -3471,7 +3471,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/media-tooltip.js
+  // ../../node_modules/media-chrome/dist/media-tooltip.js
   var Attributes3 = {
     PLACEMENT: "placement",
     BOUNDS: "bounds"
@@ -3673,7 +3673,7 @@ var mediaThemeNews = (() => {
   }
   var media_tooltip_default = MediaTooltip;
 
-  // node_modules/media-chrome/dist/media-chrome-button.js
+  // ../../node_modules/media-chrome/dist/media-chrome-button.js
   var __accessCheck6 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -3996,7 +3996,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-chrome-button", MediaChromeButton);
   }
 
-  // node_modules/media-chrome/dist/menu/media-chrome-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-chrome-menu-button.js
   var MediaChromeMenuButton = class extends MediaChromeButton {
     connectedCallback() {
       super.connectedCallback();
@@ -4037,7 +4037,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/lang/en.js
+  // ../../node_modules/media-chrome/dist/lang/en.js
   var En = {
     "Start airplay": "Start airplay",
     "Stop airplay": "Stop airplay",
@@ -4112,7 +4112,7 @@ var mediaThemeNews = (() => {
     "video not loaded, unknown time.": "video not loaded, unknown time."
   };
 
-  // node_modules/media-chrome/dist/utils/i18n.js
+  // ../../node_modules/media-chrome/dist/utils/i18n.js
   var _a;
   var translations = {
     en: En
@@ -4128,7 +4128,7 @@ var mediaThemeNews = (() => {
     (_, v) => v in vars ? String(vars[v]) : `{${v}}`
   );
 
-  // node_modules/media-chrome/dist/menu/media-settings-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-settings-menu-button.js
   function getSlotTemplateHTML2() {
     return (
       /*html*/
@@ -4176,7 +4176,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-audio-track-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-audio-track-menu.js
   var __accessCheck7 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -4310,7 +4310,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-audio-track-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-audio-track-menu-button.js
   var audioTrackIcon = (
     /*html*/
     `<svg aria-hidden="true" viewBox="0 0 24 24">
@@ -4387,7 +4387,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/utils/captions.js
+  // ../../node_modules/media-chrome/dist/utils/captions.js
   var splitTextTracksStr = (textTracksStr = "") => textTracksStr.split(/\s+/);
   var parseTextTrackStr = (textTrackStr = "") => {
     const [kind, language, encodedLabel] = textTrackStr.split(":");
@@ -4423,7 +4423,7 @@ var mediaThemeNews = (() => {
     return showingSubtitles;
   };
 
-  // node_modules/media-chrome/dist/menu/media-captions-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-captions-menu.js
   var __accessCheck8 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -4616,7 +4616,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-captions-menu", MediaCaptionsMenu);
   }
 
-  // node_modules/media-chrome/dist/menu/media-captions-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-captions-menu-button.js
   var ccIconOn = `<svg aria-hidden="true" viewBox="0 0 26 24">
   <path d="M22.83 5.68a2.58 2.58 0 0 0-2.3-2.5c-3.62-.24-11.44-.24-15.06 0a2.58 2.58 0 0 0-2.3 2.5c-.23 4.21-.23 8.43 0 12.64a2.58 2.58 0 0 0 2.3 2.5c3.62.24 11.44.24 15.06 0a2.58 2.58 0 0 0 2.3-2.5c.23-4.21.23-8.43 0-12.64Zm-11.39 9.45a3.07 3.07 0 0 1-1.91.57 3.06 3.06 0 0 1-2.34-1 3.75 3.75 0 0 1-.92-2.67 3.92 3.92 0 0 1 .92-2.77 3.18 3.18 0 0 1 2.43-1 2.94 2.94 0 0 1 2.13.78c.364.359.62.813.74 1.31l-1.43.35a1.49 1.49 0 0 0-1.51-1.17 1.61 1.61 0 0 0-1.29.58 2.79 2.79 0 0 0-.5 1.89 3 3 0 0 0 .49 1.93 1.61 1.61 0 0 0 1.27.58 1.48 1.48 0 0 0 1-.37 2.1 2.1 0 0 0 .59-1.14l1.4.44a3.23 3.23 0 0 1-1.07 1.69Zm7.22 0a3.07 3.07 0 0 1-1.91.57 3.06 3.06 0 0 1-2.34-1 3.75 3.75 0 0 1-.92-2.67 3.88 3.88 0 0 1 .93-2.77 3.14 3.14 0 0 1 2.42-1 3 3 0 0 1 2.16.82 2.8 2.8 0 0 1 .73 1.31l-1.43.35a1.49 1.49 0 0 0-1.51-1.21 1.61 1.61 0 0 0-1.29.58A2.79 2.79 0 0 0 15 12a3 3 0 0 0 .49 1.93 1.61 1.61 0 0 0 1.27.58 1.44 1.44 0 0 0 1-.37 2.1 2.1 0 0 0 .6-1.15l1.4.44a3.17 3.17 0 0 1-1.1 1.7Z"/>
 </svg>`;
@@ -4739,7 +4739,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/utils/attribute-token-list.js
+  // ../../node_modules/media-chrome/dist/utils/attribute-token-list.js
   var __accessCheck9 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -4852,7 +4852,7 @@ var mediaThemeNews = (() => {
     return __privateGet9(this, _tokenSet).size ? __privateGet9(this, _tokenSet) : __privateGet9(this, _defaultSet);
   };
 
-  // node_modules/media-chrome/dist/media-playback-rate-button.js
+  // ../../node_modules/media-chrome/dist/media-playback-rate-button.js
   var __accessCheck10 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -4976,7 +4976,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-playback-rate-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-playback-rate-menu.js
   var __accessCheck11 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -5123,7 +5123,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-playback-rate-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-playback-rate-menu-button.js
   var DEFAULT_RATE2 = 1;
   function getSlotTemplateHTML6(attrs) {
     return (
@@ -5206,7 +5206,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-rendition-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-rendition-menu.js
   var __accessCheck12 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -5249,7 +5249,8 @@ var mediaThemeNews = (() => {
         MediaUIAttributes.MEDIA_RENDITION_LIST,
         MediaUIAttributes.MEDIA_RENDITION_SELECTED,
         MediaUIAttributes.MEDIA_RENDITION_UNAVAILABLE,
-        MediaUIAttributes.MEDIA_HEIGHT
+        MediaUIAttributes.MEDIA_HEIGHT,
+        MediaUIAttributes.MEDIA_WIDTH
       ];
     }
     static formatMenuItemText(text, rendition) {
@@ -5273,14 +5274,21 @@ var mediaThemeNews = (() => {
     }
     attributeChangedCallback(attrName, oldValue, newValue) {
       super.attributeChangedCallback(attrName, oldValue, newValue);
-      if (attrName === MediaUIAttributes.MEDIA_RENDITION_SELECTED && oldValue !== newValue) {
-        this.value = newValue != null ? newValue : "auto";
-        __privateMethod8(this, _render4, render_fn4).call(this);
-      } else if (attrName === MediaUIAttributes.MEDIA_RENDITION_LIST && oldValue !== newValue) {
-        __privateSet10(this, _renditionList, parseRenditionList(newValue));
-        __privateMethod8(this, _render4, render_fn4).call(this);
-      } else if (attrName === MediaUIAttributes.MEDIA_HEIGHT && oldValue !== newValue) {
-        __privateMethod8(this, _render4, render_fn4).call(this);
+      if (oldValue !== newValue) {
+        switch (attrName) {
+          case MediaUIAttributes.MEDIA_RENDITION_SELECTED:
+            this.value = newValue != null ? newValue : "auto";
+            __privateMethod8(this, _render4, render_fn4).call(this);
+            break;
+          case MediaUIAttributes.MEDIA_RENDITION_LIST:
+            __privateSet10(this, _renditionList, parseRenditionList(newValue));
+            __privateMethod8(this, _render4, render_fn4).call(this);
+            break;
+          case MediaUIAttributes.MEDIA_HEIGHT:
+          case MediaUIAttributes.MEDIA_WIDTH:
+            __privateMethod8(this, _render4, render_fn4).call(this);
+            break;
+        }
       }
     }
     connectedCallback() {
@@ -5323,6 +5331,12 @@ var mediaThemeNews = (() => {
     set mediaHeight(height) {
       setNumericAttr(this, MediaUIAttributes.MEDIA_HEIGHT, height);
     }
+    get mediaWidth() {
+      return getNumericAttr(this, MediaUIAttributes.MEDIA_WIDTH);
+    }
+    set mediaWidth(width) {
+      setNumericAttr(this, MediaUIAttributes.MEDIA_WIDTH, width);
+    }
     compareRendition(a, b) {
       const ctor = this.constructor;
       return ctor.compareRendition(a, b);
@@ -5345,12 +5359,15 @@ var mediaThemeNews = (() => {
   _prevState3 = /* @__PURE__ */ new WeakMap();
   _render4 = /* @__PURE__ */ new WeakSet();
   render_fn4 = function() {
-    if (__privateGet12(this, _prevState3).mediaRenditionList === JSON.stringify(this.mediaRenditionList) && __privateGet12(this, _prevState3).mediaHeight === this.mediaHeight)
+    const isAuto = !this.mediaRenditionSelected;
+    if (__privateGet12(this, _prevState3).mediaRenditionList === JSON.stringify(this.mediaRenditionList) && __privateGet12(this, _prevState3).mediaHeight === this.mediaHeight && __privateGet12(this, _prevState3).mediaWidth === this.mediaWidth && __privateGet12(this, _prevState3).isAuto === isAuto)
       return;
     __privateGet12(this, _prevState3).mediaRenditionList = JSON.stringify(
       this.mediaRenditionList
     );
     __privateGet12(this, _prevState3).mediaHeight = this.mediaHeight;
+    __privateGet12(this, _prevState3).mediaWidth = this.mediaWidth;
+    __privateGet12(this, _prevState3).isAuto = isAuto;
     const renditionList = this.mediaRenditionList.sort(
       this.compareRendition.bind(this)
     );
@@ -5361,7 +5378,6 @@ var mediaThemeNews = (() => {
       rendition.selected = rendition === selectedRendition;
     }
     this.defaultSlot.textContent = "";
-    const isAuto = !this.mediaRenditionSelected;
     for (const rendition of renditionList) {
       const text = this.formatRendition(rendition, {
         showBitrate: this.showRenditionBitrate(rendition)
@@ -5376,15 +5392,22 @@ var mediaThemeNews = (() => {
       this.defaultSlot.append(item2);
     }
     const showSelectedBitrate = selectedRendition && this.showRenditionBitrate(selectedRendition);
-    const autoText = isAuto ? (
-      // Auto • 1080p (4 Mbps)
-      selectedRendition ? this.formatMenuItemText(
-        `${t("Auto")} \u2022 ${this.formatRendition(selectedRendition, {
-          showBitrate: showSelectedBitrate
-        })}`,
-        selectedRendition
-      ) : this.formatMenuItemText(`${t("Auto")} (${this.mediaHeight}p)`)
-    ) : this.formatMenuItemText(t("Auto"));
+    let autoText = void 0;
+    if (isAuto) {
+      if (selectedRendition) {
+        autoText = this.formatMenuItemText(
+          `${t("Auto")} \u2022 ${this.formatRendition(selectedRendition, {
+            showBitrate: showSelectedBitrate
+          })}`,
+          selectedRendition
+        );
+      } else if (this.mediaHeight > 0 && this.mediaWidth > 0) {
+        autoText = this.formatMenuItemText(`${t("Auto")} (${Math.min(this.mediaWidth, this.mediaHeight)}p)`);
+      }
+    }
+    if (!autoText) {
+      autoText = this.formatMenuItemText(t("Auto"));
+    }
     const item = createMenuItem({
       type: "radio",
       text: autoText,
@@ -5413,7 +5436,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-rendition-menu", MediaRenditionMenu);
   }
 
-  // node_modules/media-chrome/dist/menu/media-rendition-menu-button.js
+  // ../../node_modules/media-chrome/dist/menu/media-rendition-menu-button.js
   var renditionIcon = (
     /*html*/
     `<svg aria-hidden="true" viewBox="0 0 24 24">
@@ -5482,7 +5505,7 @@ var mediaThemeNews = (() => {
     );
   }
 
-  // node_modules/media-chrome/dist/menu/media-context-menu.js
+  // ../../node_modules/media-chrome/dist/menu/media-context-menu.js
   var __accessCheck13 = (obj, member, msg) => {
     if (!member.has(obj))
       throw TypeError("Cannot " + msg);
@@ -5668,7 +5691,7 @@ var mediaThemeNews = (() => {
     GlobalThis.customElements.define("media-context-menu", MediaContextMenu);
   }
 
-  // node_modules/media-chrome/dist/menu/media-context-menu-item.js
+  // ../../node_modules/media-chrome/dist/menu/media-context-menu-item.js
   function getTemplateHTML9(_attrs) {
     return (
       /*html*/