@umituz/react-native-video-editor 1.1.15 → 1.1.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-video-editor",
-  "version": "1.1.15",
+  "version": "1.1.17",
   "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/infrastructure/services/video-cache.service.ts

@@ -130,7 +130,7 @@ export const clearVideoCache = async (): Promise<void> => {
 /**
  * Delete a specific cached video
  */
-export const deleteSpecificCachedVideo = (url: string): boolean => {
+export const deleteSpecificCachedVideo = async (url: string): Promise<boolean> => {
   if (!url || url.startsWith("file://")) return false;
   return deleteCachedFile(url, getVideoCacheDir());
 };

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

@@ -3,7 +3,7 @@
  * Reusable video player with caching, thumbnail and controls
  */
 
-import React, { useState, useCallback, useMemo, useEffect } from "react";
+import React, { useState, useCallback, useMemo } from "react";
 import { View, TouchableOpacity, StyleSheet, type ViewStyle } from "react-native";
 import { Image } from "expo-image";
 import { VideoView } from "expo-video";
@@ -43,7 +43,8 @@ export const VideoPlayer: React.FC<VideoPlayerProps> = ({
   // IMPORTANT: Call useResponsive BEFORE useAppDesignTokens to maintain hook order
   const { width: screenWidth, horizontalPadding } = useResponsive();
   const tokens = useAppDesignTokens();
-  const [showVideo, setShowVideo] = useState(autoPlay);
+  const [userTriggeredPlay, setUserTriggeredPlay] = useState(false);
+  const showVideo = autoPlay || userTriggeredPlay;
 
   // Cache the video first (downloads if needed)
   const { localUri, isDownloading, downloadProgress, error } = useVideoCaching(source);
@@ -53,24 +54,16 @@ export const VideoPlayer: React.FC<VideoPlayerProps> = ({
     source: localUri,
     loop,
     muted,
-    autoPlay: false,
+    autoPlay,
   });
 
-  useEffect(() => {
-    if (showVideo && state.isPlayerValid && player) {
-      if (__DEV__) {
-        console.log("[VideoPlayer] Starting playback from:", localUri);
-      }
-      controls.play();
-    }
-  }, [showVideo, state.isPlayerValid, player, controls, localUri]);
-
   const handlePlay = useCallback(() => {
     if (__DEV__) {
       console.log("[VideoPlayer] handlePlay, localUri:", localUri);
     }
-    setShowVideo(true);
-  }, [localUri]);
+    setUserTriggeredPlay(true);
+    controls.play();
+  }, [localUri, controls]);
 
   // Calculate dimensions
   const videoWidth = getWidthFromStyle(style as ViewStyle) ?? (screenWidth - horizontalPadding * 2);

package/src/presentation/components/DraggableLayer.tsx

@@ -62,7 +62,7 @@ export const DraggableLayer: React.FC<DraggableLayerProps> = ({
       { translateX: state.x },
       { translateY: state.y },
       { rotate: `${layer.rotation}deg` },
-    ],
+    ] as const,
     opacity: layer.opacity,
     width: state.width,
     height: state.height,

package/src/presentation/components/EditorHeader.tsx

@@ -11,7 +11,7 @@ import {
   useAppDesignTokens,
 } from "@umituz/react-native-design-system";
 
-export interface EditorHeaderProps {
+interface EditorHeaderProps {
   projectTitle: string;
   canUndo: boolean;
   canRedo: boolean;

package/src/presentation/components/EditorPreviewArea.tsx

@@ -18,7 +18,7 @@ const { width } = Dimensions.get("window");
 const PREVIEW_ASPECT_RATIO = 16 / 9;
 const PREVIEW_HEIGHT = width / PREVIEW_ASPECT_RATIO;
 
-export interface EditorPreviewAreaProps {
+interface EditorPreviewAreaProps {
   scene: Scene;
   selectedLayerId: string | null;
   isPlaying: boolean;

package/src/presentation/components/EditorTimeline.tsx

@@ -13,7 +13,7 @@ import {
 import { useLocalization } from "@umituz/react-native-settings";
 import type { VideoProject, Scene } from "../../domain/entities";
 
-export interface EditorTimelineProps {
+interface EditorTimelineProps {
   project: VideoProject;
   currentSceneIndex: number;
   onSceneSelect: (index: number) => void;

package/src/presentation/components/EditorToolPanel.tsx

@@ -18,7 +18,7 @@ import {
 } from "@umituz/react-native-design-system";
 import { useLocalization } from "@umituz/react-native-settings";
 
-export interface EditorToolPanelProps {
+interface EditorToolPanelProps {
   onAddText: () => void;
   onAddImage: () => void;
   onAddShape: () => void;

package/src/presentation/components/LayerActionsMenu.tsx

@@ -13,7 +13,7 @@ import {
 import { useLocalization } from "@umituz/react-native-settings";
 import type { Layer } from "../../domain/entities";
 
-export interface LayerActionsMenuProps {
+interface LayerActionsMenuProps {
   layer: Layer;
   onEditText: () => void;
   onEditImage: () => void;

package/src/presentation/components/SceneActionsMenu.tsx

@@ -11,7 +11,7 @@ import {
   useAppDesignTokens,
 } from "@umituz/react-native-design-system";
 
-export interface SceneActionsMenuProps {
+interface SceneActionsMenuProps {
   sceneIndex: number;
   canDelete: boolean;
   onDuplicate: () => void;

package/src/presentation/components/text-layer/TextInputSection.tsx

@@ -49,7 +49,6 @@ export const TextInputSection: React.FC<TextInputSectionProps> = ({
         value={text}
         onChangeText={onChangeText}
         multiline
-        autoFocus
       />
     </View>
   );

package/src/presentation/hooks/useAnimationLayerForm.ts

@@ -7,14 +7,14 @@ import { useState, useCallback } from "react";
 import type { Animation, AnimationType } from "../../domain/entities";
 import type { Easing } from "../../infrastructure/constants/animation-layer.constants";
 
-export interface AnimationLayerFormState {
+interface AnimationLayerFormState {
   animationType: AnimationType;
   duration: number;
   delay: number;
   easing: Easing;
 }
 
-export interface UseAnimationLayerFormReturn {
+interface UseAnimationLayerFormReturn {
   formState: AnimationLayerFormState;
   setAnimationType: (type: AnimationType) => void;
   setDuration: (duration: number) => void;

package/src/presentation/hooks/useAudioLayerForm.ts

@@ -6,14 +6,14 @@
 import { useState, useCallback } from "react";
 import type { Audio } from "../../domain/entities";
 
-export interface AudioLayerFormState {
+interface AudioLayerFormState {
   audioUri: string;
   volume: number;
   fadeIn: number;
   fadeOut: number;
 }
 
-export interface UseAudioLayerFormReturn {
+interface UseAudioLayerFormReturn {
   formState: AudioLayerFormState;
   setAudioUri: (uri: string) => void;
   setVolume: (volume: number) => void;

package/src/presentation/hooks/useEditorActions.tsx

@@ -12,7 +12,7 @@ import { useSceneActions } from "./useSceneActions";
 import { useMenuActions } from "./useMenuActions";
 import { useExportActions } from "./useExportActions";
 
-export interface UseEditorActionsParams {
+interface UseEditorActionsParams {
   project: VideoProject | undefined;
   selectedLayerId: string | null;
   currentScene: any;
@@ -22,7 +22,7 @@ export interface UseEditorActionsParams {
   onExportComplete: (settings: any, uri?: string) => void;
 }
 
-export interface UseEditorActionsReturn {
+interface UseEditorActionsReturn {
   handleAddText: () => void;
   handleEditLayer: () => void;
   handleAddImage: () => void;

package/src/presentation/hooks/useEditorHistory.ts

@@ -6,13 +6,13 @@
 import { useCallback, useState } from "react";
 import type { VideoProject } from "../../domain/entities";
 
-export interface UseEditorHistoryParams {
+interface UseEditorHistoryParams {
   project: VideoProject | undefined;
   projectId: string; // Kept for interface compatibility, used for reset if needed
   onUpdateProject: (updates: Partial<VideoProject>) => void;
 }
 
-export interface UseEditorHistoryReturn {
+interface UseEditorHistoryReturn {
   undo: () => void;
   redo: () => void;
   canUndo: boolean;

package/src/presentation/hooks/useEditorLayers.ts

@@ -15,7 +15,7 @@ import type {
 } from "../../domain/entities";
 import type { TextLayer, ImageLayer, Animation } from "../../domain/entities";
 
-export interface UseEditorLayersParams {
+interface UseEditorLayersParams {
   projectId: string;
   scenes: any[];
   sceneIndex: number;

package/src/presentation/hooks/useEditorPlayback.ts

@@ -6,11 +6,11 @@
 import { useState, useEffect, useCallback } from "react";
 import type { Scene } from "../../domain/entities";
 
-export interface UseEditorPlaybackParams {
+interface UseEditorPlaybackParams {
   currentScene: Scene | undefined;
 }
 
-export interface UseEditorPlaybackReturn {
+interface UseEditorPlaybackReturn {
   isPlaying: boolean;
   currentTime: number;
   playPause: () => void;

package/src/presentation/hooks/useEditorScenes.ts

@@ -9,7 +9,7 @@ import { useLocalization } from "@umituz/react-native-settings";
 import { sceneOperationsService } from "../../infrastructure/services/scene-operations.service";
 import type { Scene, Audio } from "../../domain/entities";
 
-export interface UseEditorScenesParams {
+interface UseEditorScenesParams {
   scenes: Scene[];
   currentSceneIndex: number;
   onUpdateScenes: (scenes: Scene[]) => void;

package/src/presentation/hooks/useExport.ts

@@ -30,7 +30,7 @@ export interface UseExportConfig {
   ) => Promise<ExportResult>;
 }
 
-export interface UseExportReturn {
+interface UseExportReturn {
   isExporting: boolean;
   exportProgress: ExportProgress | null;
   exportVideo: (

package/src/presentation/hooks/useExportActions.tsx

@@ -8,13 +8,13 @@ import { ExportDialog } from "../components/ExportDialog";
 import type { VideoProject, ExportSettings } from "../../domain/entities";
 import type { UseEditorBottomSheetReturn } from "./useEditorBottomSheet";
 
-export interface UseExportActionsParams {
+interface UseExportActionsParams {
   project: VideoProject | undefined;
   bottomSheet: UseEditorBottomSheetReturn;
   onExportComplete: (settings: ExportSettings, uri?: string) => void;
 }
 
-export interface UseExportActionsReturn {
+interface UseExportActionsReturn {
   handleExport: () => void;
   handleSave: () => void;
 }

package/src/presentation/hooks/useExportForm.ts

@@ -16,14 +16,14 @@ import {
   QUALITY_MULTIPLIERS,
 } from "../../infrastructure/constants/export.constants";
 
-export interface ExportFormState {
+interface ExportFormState {
   resolution: Resolution;
   quality: Quality;
   format: Format;
   includeWatermark: boolean;
 }
 
-export interface UseExportFormReturn {
+interface UseExportFormReturn {
   formState: ExportFormState;
   setResolution: (resolution: Resolution) => void;
   setQuality: (quality: Quality) => void;

package/src/presentation/hooks/useImageLayerForm.ts

@@ -6,12 +6,12 @@
 import { useState, useCallback } from "react";
 import type { ImageLayer } from "../../domain/entities";
 
-export interface ImageLayerFormState {
+interface ImageLayerFormState {
   imageUri: string;
   opacity: number;
 }
 
-export interface UseImageLayerFormReturn {
+interface UseImageLayerFormReturn {
   formState: ImageLayerFormState;
   setImageUri: (uri: string) => void;
   setOpacity: (opacity: number) => void;

package/src/presentation/hooks/useImageLayerOperations.ts

@@ -9,14 +9,14 @@ import { useLocalization } from "@umituz/react-native-settings";
 import { layerOperationsService } from "../../infrastructure/services/layer-operations.service";
 import type { AddImageLayerData, Scene, ImageLayer } from "../../domain/entities";
 
-export interface UseImageLayerOperationsParams {
+interface UseImageLayerOperationsParams {
   scenes: Scene[];
   sceneIndex: number;
   onUpdateScenes: (scenes: Scene[]) => void;
   onCloseBottomSheet: () => void;
 }
 
-export interface UseImageLayerOperationsReturn {
+interface UseImageLayerOperationsReturn {
   addImageLayer: (data: AddImageLayerData) => void;
   editImageLayer: (layerId: string, data: Partial<ImageLayer>) => void;
 }

package/src/presentation/hooks/useLayerActions.tsx

@@ -13,14 +13,14 @@ import type { Scene, ImageLayer, Layer } from "../../domain/entities";
 import type { UseEditorLayersReturn } from "./useEditorLayers";
 import type { UseEditorBottomSheetReturn } from "./useEditorBottomSheet";
 
-export interface UseLayerActionsParams {
+interface UseLayerActionsParams {
   selectedLayerId: string | null;
   currentScene: Scene | undefined;
   layers: UseEditorLayersReturn;
   bottomSheet: UseEditorBottomSheetReturn;
 }
 
-export interface UseLayerActionsReturn {
+interface UseLayerActionsReturn {
   handleAddText: () => void;
   handleEditLayer: () => void;
   handleAddImage: () => void;

package/src/presentation/hooks/useLayerManipulation.ts

@@ -9,7 +9,7 @@ import { useLocalization } from "@umituz/react-native-settings";
 import { layerOperationsService } from "../../infrastructure/services/layer-operations.service";
 import type { Scene, LayerOrderAction, Animation } from "../../domain/entities";
 
-export interface UseLayerManipulationParams {
+interface UseLayerManipulationParams {
   scenes: Scene[];
   sceneIndex: number;
   onUpdateScenes: (scenes: Scene[]) => void;
@@ -17,7 +17,7 @@ export interface UseLayerManipulationParams {
   onLayerDeleted?: () => void;
 }
 
-export interface UseLayerManipulationReturn {
+interface UseLayerManipulationReturn {
   deleteLayer: (layerId: string) => void;
   changeLayerOrder: (layerId: string, action: LayerOrderAction) => void;
   duplicateLayer: (layerId: string) => void;

package/src/presentation/hooks/useMenuActions.tsx

@@ -8,7 +8,7 @@ import { LayerActionsMenu } from "../components/LayerActionsMenu";
 import type { UseEditorLayersReturn } from "./useEditorLayers";
 import type { UseEditorBottomSheetReturn } from "./useEditorBottomSheet";
 
-export interface UseMenuActionsParams {
+interface UseMenuActionsParams {
   layers: UseEditorLayersReturn;
   bottomSheet: UseEditorBottomSheetReturn;
   handleEditLayer: () => void;
@@ -16,7 +16,7 @@ export interface UseMenuActionsParams {
   handleAnimate: (layerId: string) => void;
 }
 
-export interface UseMenuActionsReturn {
+interface UseMenuActionsReturn {
   handleLayerActionsPress: (layer: any) => void;
 }
 

package/src/presentation/hooks/useSceneActions.tsx

@@ -9,13 +9,13 @@ import { SceneActionsMenu } from "../components/SceneActionsMenu";
 import type { UseEditorScenesReturn } from "./useEditorScenes";
 import type { UseEditorBottomSheetReturn } from "./useEditorBottomSheet";
 
-export interface UseSceneActionsParams {
+interface UseSceneActionsParams {
   currentScene: any;
   scenes: UseEditorScenesReturn;
   bottomSheet: UseEditorBottomSheetReturn;
 }
 
-export interface UseSceneActionsReturn {
+interface UseSceneActionsReturn {
   handleAudio: () => void;
   handleSceneLongPress: (index: number, canDelete: boolean) => void;
 }

package/src/presentation/hooks/useShapeLayerForm.ts

@@ -16,7 +16,7 @@ export interface ShapeLayerFormState {
   opacity: number;
 }
 
-export interface UseShapeLayerFormReturn {
+interface UseShapeLayerFormReturn {
   formState: ShapeLayerFormState;
   setShape: (shape: ShapeType) => void;
   setFillColor: (color: string) => void;

package/src/presentation/hooks/useShapeLayerOperations.ts

@@ -9,7 +9,7 @@ import { useLocalization } from "@umituz/react-native-settings";
 import { layerOperationsService } from "../../infrastructure/services/layer-operations.service";
 import type { AddShapeLayerData, Scene } from "../../domain/entities";
 
-export interface UseShapeLayerOperationsParams {
+interface UseShapeLayerOperationsParams {
   scenes: Scene[];
   sceneIndex: number;
   onUpdateScenes: (scenes: Scene[]) => void;
@@ -17,7 +17,7 @@ export interface UseShapeLayerOperationsParams {
   defaultColor: string;
 }
 
-export interface UseShapeLayerOperationsReturn {
+interface UseShapeLayerOperationsReturn {
   addShapeLayer: (data: AddShapeLayerData) => void;
 }
 

package/src/presentation/hooks/useTextLayerForm.ts

@@ -16,7 +16,7 @@ export interface TextLayerFormState {
   textAlign: "left" | "center" | "right";
 }
 
-export interface UseTextLayerFormReturn {
+interface UseTextLayerFormReturn {
   formState: TextLayerFormState;
   setText: (text: string) => void;
   setFontSize: (size: number) => void;

package/src/presentation/hooks/useTextLayerOperations.ts

@@ -9,7 +9,7 @@ import { useLocalization } from "@umituz/react-native-settings";
 import { layerOperationsService } from "../../infrastructure/services/layer-operations.service";
 import type { AddTextLayerData, Scene, TextLayer } from "../../domain/entities";
 
-export interface UseTextLayerOperationsParams {
+interface UseTextLayerOperationsParams {
   scenes: Scene[];
   sceneIndex: number;
   onUpdateScenes: (scenes: Scene[]) => void;
@@ -17,7 +17,7 @@ export interface UseTextLayerOperationsParams {
   defaultColor: string;
 }
 
-export interface UseTextLayerOperationsReturn {
+interface UseTextLayerOperationsReturn {
   addTextLayer: (data: AddTextLayerData) => void;
   editTextLayer: (layerId: string, data: Partial<TextLayer>) => void;
 }

package/src/presentation/components/draggable-layer/index.ts

@@ -1,7 +0,0 @@
-/**
- * Draggable Layer Components
- * Barrel file for draggable layer components
- */
-
-export { LayerContent } from "./LayerContent";
-export { ResizeHandles } from "./ResizeHandles";