analytica-frontend-lib 1.1.86 → 1.1.88

package/dist/index.mjs

@@ -1924,14 +1924,34 @@ var Modal = ({
     return () => document.removeEventListener("keydown", handleEscape);
   }, [isOpen, closeOnEscape, onClose]);
   useEffect3(() => {
+    if (!isOpen) return;
+    const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
     const originalOverflow = document.body.style.overflow;
-    if (isOpen) {
-      document.body.style.overflow = "hidden";
-    } else {
-      document.body.style.overflow = originalOverflow;
+    const originalPaddingRight = document.body.style.paddingRight;
+    document.body.style.overflow = "hidden";
+    if (scrollbarWidth > 0) {
+      document.body.style.paddingRight = `${scrollbarWidth}px`;
+      const overlay = document.createElement("div");
+      overlay.id = "modal-scrollbar-overlay";
+      overlay.style.cssText = `
+        position: fixed;
+        top: 0;
+        right: 0;
+        width: ${scrollbarWidth}px;
+        height: 100vh;
+        background-color: rgb(0 0 0 / 0.6);
+        z-index: 40;
+        pointer-events: none;
+      `;
+      document.body.appendChild(overlay);
     }
     return () => {
       document.body.style.overflow = originalOverflow;
+      document.body.style.paddingRight = originalPaddingRight;
+      const overlay = document.getElementById("modal-scrollbar-overlay");
+      if (overlay) {
+        overlay.remove();
+      }
     };
   }, [isOpen]);
   if (!isOpen) return null;
@@ -8649,6 +8669,8 @@ var VideoPlayer = ({
     }
   }, [isPlaying, isFullscreen, showControlsWithTimer, clearControlsTimeout]);
   useEffect15(() => {
+    const video = videoRef.current;
+    if (!video) return;
     const handleFullscreenChange = () => {
       const isCurrentlyFullscreen = !!document.fullscreenElement;
       setIsFullscreen(isCurrentlyFullscreen);
@@ -8656,9 +8678,29 @@ var VideoPlayer = ({
         showControlsWithTimer();
       }
     };
+    const handleWebkitBeginFullscreen = () => {
+      setIsFullscreen(true);
+      showControlsWithTimer();
+    };
+    const handleWebkitEndFullscreen = () => {
+      setIsFullscreen(false);
+    };
     document.addEventListener("fullscreenchange", handleFullscreenChange);
+    video.addEventListener(
+      "webkitbeginfullscreen",
+      handleWebkitBeginFullscreen
+    );
+    video.addEventListener("webkitendfullscreen", handleWebkitEndFullscreen);
     return () => {
       document.removeEventListener("fullscreenchange", handleFullscreenChange);
+      video.removeEventListener(
+        "webkitbeginfullscreen",
+        handleWebkitBeginFullscreen
+      );
+      video.removeEventListener(
+        "webkitendfullscreen",
+        handleWebkitEndFullscreen
+      );
     };
   }, [showControlsWithTimer]);
   useEffect15(() => {
@@ -8765,15 +8807,30 @@ var VideoPlayer = ({
       video.currentTime = newTime;
     }
   }, []);
+  const isSafariIOS = useCallback3(() => {
+    const ua = navigator.userAgent;
+    const isIOS = /iPad|iPhone|iPod/.test(ua);
+    const isWebKit = /WebKit/.test(ua);
+    const isNotChrome = !/CriOS|Chrome/.test(ua);
+    return isIOS && isWebKit && isNotChrome;
+  }, []);
   const toggleFullscreen = useCallback3(() => {
-    const container = videoRef.current?.parentElement;
-    if (!container) return;
-    if (!isFullscreen && container.requestFullscreen) {
+    const video = videoRef.current;
+    const container = video?.parentElement;
+    if (!video || !container) return;
+    if (isSafariIOS()) {
+      const videoElement = video;
+      if (!isFullscreen && videoElement.webkitEnterFullscreen) {
+        videoElement.webkitEnterFullscreen();
+      } else if (isFullscreen && videoElement.webkitExitFullscreen) {
+        videoElement.webkitExitFullscreen();
+      }
+    } else if (!isFullscreen && container.requestFullscreen) {
       container.requestFullscreen();
     } else if (isFullscreen && document.exitFullscreen) {
       document.exitFullscreen();
     }
-  }, [isFullscreen]);
+  }, [isFullscreen, isSafariIOS]);
   const handleSpeedChange = useCallback3((speed) => {
     if (videoRef.current) {
       videoRef.current.playbackRate = speed;