@umituz/react-native-video-editor 1.0.11 → 1.0.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-video-editor",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "description": "Professional video editor with layer-based timeline, text/image/shape/audio/animation layers, and export functionality",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/player/presentation/components/VideoPlayer.tsx

@@ -4,18 +4,13 @@
  */
 
 import React, { useState, useCallback, useMemo, useEffect } from "react";
-import {
-  View,
-  TouchableOpacity,
-  StyleSheet,
-  type ViewStyle,
-} from "react-native";
+import { View, TouchableOpacity, StyleSheet, type ViewStyle } from "react-native";
 import { Image } from "expo-image";
 import { VideoView } from "expo-video";
 import {
+  useResponsive,
   useAppDesignTokens,
   AtomicIcon,
-  useResponsive,
 } from "@umituz/react-native-design-system";
 
 import type { VideoPlayerProps } from "../../types";
@@ -43,8 +38,10 @@ export const VideoPlayer: React.FC<VideoPlayerProps> = ({
   contentFit = "cover",
   style,
 }) => {
-  const tokens = useAppDesignTokens();
+  // IMPORTANT: Call useResponsive BEFORE useAppDesignTokens to maintain consistent hook order
+  // useAppDesignTokens internally calls useResponsive, so order matters
   const { width: screenWidth, horizontalPadding } = useResponsive();
+  const tokens = useAppDesignTokens();
   const [showVideo, setShowVideo] = useState(autoPlay);
 
   const { player, state, controls } = useVideoPlayerControl({
@@ -131,12 +128,20 @@ export const VideoPlayer: React.FC<VideoPlayerProps> = ({
       hasPlayer: !!player,
       source,
     });
+    // eslint-disable-next-line no-console
+    console.log("[VideoPlayer] dimensions:", {
+      screenWidth,
+      horizontalPadding,
+      videoWidth,
+      videoHeight,
+      styleWidth: getWidthFromStyle(style as ViewStyle),
+    });
   }
 
   if (showVideo && state.isPlayerValid && player) {
     if (typeof __DEV__ !== "undefined" && __DEV__) {
       // eslint-disable-next-line no-console
-      console.log("[VideoPlayer] Rendering VideoView");
+      console.log("[VideoPlayer] Rendering VideoView with dimensions:", { videoWidth, videoHeight });
     }
     return (
       <View style={[containerStyle, style]}>

package/src/player/presentation/hooks/useVideoPlayerControl.ts

@@ -39,6 +39,15 @@ export const useVideoPlayerControl = (
       if (autoPlay) {
         setIsPlaying(true);
       }
+      // Log player status for debugging
+      console.log("[useVideoPlayerControl] Player status:", {
+        currentTime: p.currentTime,
+        duration: p.duration,
+        status: p.status,
+        playing: p.playing,
+        muted: p.muted,
+        volume: p.volume,
+      });
     }
   });