eb-player 2.3.2 → 2.4.1

package/dist/build/eb-player.css

@@ -3342,12 +3342,18 @@
    here — it cancels the native mirroring. Only elements positioned with a
    physical inline style (chapter markers use right: N% under RTL) need an
    explicit override.
+
+   Both overrides below MUST stay anchored to .eb-player[dir="rtl"]. As bare
+   [dir="rtl"] descendant selectors they also matched through an ancestor —
+   inside an RTL document (<html dir="rtl">) they fired even when the player
+   itself was LTR, mirroring the markers and volume thumb while Seekbar and
+   VolumeControl used their LTR pointer maths. Never widen these back.
    ============================================================ */
-[dir="rtl"] .eb-chapter-marker {
+.eb-player[dir="rtl"] .eb-chapter-marker {
   --eb-chapter-marker-x: 50%;
 }
 
-[dir="rtl"] .eb-volume-thumb {
+.eb-player[dir="rtl"] .eb-volume-thumb {
   --eb-volume-thumb-x: 50%;
 }
 

package/dist/build/ebplayer.bundle.js

@@ -4,7 +4,7 @@
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.EBPlayer = {}));
 })(this, (function (exports) { 'use strict';
 
-    var __EB_PLAYER_VERSION__ = "2.3.2";
+    var __EB_PLAYER_VERSION__ = "2.4.1";
 
     /**
      * Finite State Machine for player playback state transitions.
@@ -459,6 +459,7 @@
         hasPlaylistPicker: false,
         disableCustomAbr: true,
         lang: undefined,
+        rtl: undefined,
         // EPG
         epgContentId: undefined,
         epgPolling: null,
@@ -3121,7 +3122,7 @@
             return b `
       <div
         class="eb-player${isIOS ? ' eb-ios-native' : ''}"
-        dir="${isRtl ? 'rtl' : ''}"
+        dir="${isRtl ? 'rtl' : 'ltr'}"
       >
         <video
           class="eb-video"
@@ -3433,20 +3434,20 @@
             inner.classList.toggle('eb-ad-playing', this.state.adPlaying);
         }
         /**
-         * Applies or removes the dir=rtl attribute without full re-render.
+         * Writes a concrete dir attribute without full re-render.
          * More efficient than re-rendering the entire template for a simple attribute change.
+         *
+         * Always asserts a direction — never removes the attribute. `dir` is an enumerated
+         * attribute: absent and `""` both mean "inherit from the ancestor", so removing it
+         * inside an RTL document (`<html dir="rtl">`) left the player mirrored by inheritance
+         * while Seekbar/VolumeControl had already switched to their LTR pointer maths. The
+         * player element is the authoritative direction root in BOTH states.
          */
         applyRtl() {
             const inner = this.el?.firstElementChild;
             if (inner == null)
                 return;
-            const isRtl = this.state.isRtl;
-            if (isRtl) {
-                inner.setAttribute('dir', 'rtl');
-            }
-            else {
-                inner.removeAttribute('dir');
-            }
+            inner.setAttribute('dir', this.state.isRtl ? 'rtl' : 'ltr');
         }
         invokeExtensions() {
             const config = this.config;
@@ -4669,7 +4670,9 @@
                 container.style.setProperty('--eb-color-volume', skinColors.volumeBar);
             }
             // Set config-derived state flags
-            this.state.isRtl = this.config.lang === 'ar';
+            // `rtl` decouples direction from language. Undefined (the default) falls back
+            // to deriving it from `lang`, preserving pre-2.4.0 behaviour exactly.
+            this.state.isRtl = this.config.rtl ?? (this.config.lang === 'ar');
             this.state.isRadio = this.config.radio === true;
             // Step 3: Create SkinRoot. This runs on EVERY mount, including noUi —
             // SkinRoot is the only creator of the <video> element, and its own