@umituz/react-native-video-editor 1.1.29 → 1.1.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-video-editor",
-  "version": "1.1.29",
+  "version": "1.1.31",
   "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/infrastructure/services/image-layer-operations.service.ts

@@ -3,7 +3,7 @@
  * Single Responsibility: Image layer business logic
  */
 
-import { generateUUID } from "@umituz/react-native-design-system";
+import { generateUUID } from "@umituz/react-native-design-system/uuid";
 import type { Scene, ImageLayer } from "../../domain/entities";
 import type { LayerOperationResult, AddImageLayerData } from "../../domain/entities";
 

package/src/infrastructure/services/layer-operations/layer-duplicate.service.ts

@@ -3,7 +3,7 @@
  * Single Responsibility: Handle layer duplication operations
  */
 
-import { generateUUID } from "@umituz/react-native-design-system";
+import { generateUUID } from "@umituz/react-native-design-system/uuid";
 import type { Scene } from "../../../domain/entities";
 import type { LayerOperationResult } from "../../../domain/entities";
 

package/src/infrastructure/services/scene-operations.service.ts

@@ -3,7 +3,7 @@
  * Single Responsibility: Business logic for scene operations
  */
 
-import { generateUUID } from "@umituz/react-native-design-system";
+import { generateUUID } from "@umituz/react-native-design-system/uuid";
 import type { Scene, Audio } from "../../domain/entities";
 import type { SceneOperationResult } from "../../domain/entities";
 

package/src/infrastructure/services/shape-layer-operations.service.ts

@@ -3,7 +3,7 @@
  * Single Responsibility: Shape layer business logic
  */
 
-import { generateUUID } from "@umituz/react-native-design-system";
+import { generateUUID } from "@umituz/react-native-design-system/uuid";
 import type { Scene, ShapeLayer } from "../../domain/entities";
 import type { LayerOperationResult, AddShapeLayerData } from "../../domain/entities";
 

package/src/infrastructure/services/text-layer-operations.service.ts

@@ -3,7 +3,7 @@
  * Single Responsibility: Text layer business logic
  */
 
-import { generateUUID } from "@umituz/react-native-design-system";
+import { generateUUID } from "@umituz/react-native-design-system/uuid";
 import type { Scene, TextLayer } from "../../domain/entities";
 import type { LayerOperationResult, AddTextLayerData } from "../../domain/entities";
 

package/src/player/infrastructure/services/video-cache.service.ts

@@ -4,16 +4,8 @@
  * Bypasses CDN Range request issues by downloading entire file first
  */
 
-import {
-  downloadFileWithProgress,
-  getCachedFileUri,
-  isUrlCached,
-  deleteCachedFile,
-  getCacheDirectory,
-  clearCache,
-  type DownloadProgressCallback,
-  type DownloadProgress,
-} from "@umituz/react-native-design-system";
+import { getCachedFileUri, isUrlCached, getCacheDirectory, downloadFileWithProgress, deleteCachedFile, clearCache } from "@umituz/react-native-design-system/filesystem";
+import type { DownloadProgressCallback, DownloadProgress } from "@umituz/react-native-design-system/filesystem";
 
 declare const __DEV__: boolean;
 

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

@@ -7,12 +7,9 @@ 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";
-import {
-  useResponsive,
-  useAppDesignTokens,
-  AtomicIcon,
-  AtomicText,
-} from "@umituz/react-native-design-system";
+import { AtomicIcon, AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
+import { useResponsive } from "@umituz/react-native-design-system/responsive";
 
 import type { VideoPlayerProps } from "../../types";
 import { useVideoPlayerControl } from "../hooks/useVideoPlayerControl";

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

@@ -35,7 +35,6 @@ export const useVideoPlayerControl = (
 
   const player = useExpoVideoPlayer(source || "", (p) => {
     if (typeof __DEV__ !== "undefined" && __DEV__) {
-       
       console.log("[useVideoPlayerControl] Player callback, source:", source, "player:", !!p);
     }
     if (source && p) {
@@ -45,14 +44,11 @@ export const useVideoPlayerControl = (
         setIsPlaying(true);
       }
       if (typeof __DEV__ !== "undefined" && __DEV__) {
-         
-        console.log("[useVideoPlayerControl] Player status:", {
-          currentTime: p.currentTime,
-          duration: p.duration,
+        console.log("[useVideoPlayerControl] Player configured:", {
           status: p.status,
           playing: p.playing,
           muted: p.muted,
-          volume: p.volume,
+          loop: p.loop,
         });
       }
     }

package/src/presentation/components/AudioEditor.tsx

@@ -6,10 +6,8 @@
 import React, { useCallback } from "react";
 import { View, ScrollView, StyleSheet, Alert } from "react-native";
 import * as DocumentPicker from "expo-document-picker";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { useLocalization } from "@umituz/react-native-settings";
 import type { Audio } from "../../domain/entities";
 import { useAudioLayerForm } from "../hooks/useAudioLayerForm";

package/src/presentation/components/DraggableLayer.tsx

@@ -6,7 +6,7 @@
 import React from "react";
 import { View, StyleSheet } from "react-native";
 import { GestureDetector } from "react-native-gesture-handler";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { Layer } from "../../domain/entities";
 import { useDraggableLayerGestures } from "../hooks/useDraggableLayerGestures";
 import { LayerContent } from "./draggable-layer/LayerContent";

package/src/presentation/components/EditorHeader.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface EditorHeaderProps {
   projectTitle: string;

package/src/presentation/components/EditorPreviewArea.styles.ts

@@ -1,5 +1,5 @@
 import { StyleSheet } from "react-native";
-import { DesignTokens } from "@umituz/react-native-design-system";
+import { DesignTokens } from "@umituz/react-native-design-system/theme";
 
 export const createPreviewStyles = (_tokens: DesignTokens) =>
   StyleSheet.create({

package/src/presentation/components/EditorPreviewArea.tsx

@@ -5,11 +5,8 @@
 
 import React, { useMemo } from "react";
 import { View, TouchableOpacity, Dimensions } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { DraggableLayer } from "./DraggableLayer";
 import type { Scene, Layer } from "../../domain/entities";
 import { createPreviewStyles } from "./EditorPreviewArea.styles";

package/src/presentation/components/EditorTimeline.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, ScrollView, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { useLocalization } from "@umituz/react-native-settings";
 import type { VideoProject, Scene } from "../../domain/entities";
 

package/src/presentation/components/EditorToolPanel.tsx

@@ -11,11 +11,8 @@ import {
   StyleSheet,
   Alert,
 } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { useLocalization } from "@umituz/react-native-settings";
 
 interface EditorToolPanelProps {

package/src/presentation/components/LayerActionsMenu.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { useLocalization } from "@umituz/react-native-settings";
 import type { Layer } from "../../domain/entities";
 

package/src/presentation/components/SceneActionsMenu.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface SceneActionsMenuProps {
   sceneIndex: number;

package/src/presentation/components/animation-layer/AnimationEditorActions.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface AnimationEditorActionsProps {
   hasAnimation: boolean;

package/src/presentation/components/animation-layer/AnimationInfoBanner.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 export const AnimationInfoBanner: React.FC = () => {
   const tokens = useAppDesignTokens();

package/src/presentation/components/animation-layer/AnimationTypeSelector.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, ScrollView, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { ANIMATION_TYPES } from "../../../infrastructure/constants/animation-layer.constants";
 import type { AnimationType } from "../../../domain/entities";
 

package/src/presentation/components/audio-layer/AudioEditorActions.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface AudioEditorActionsProps {
   hasAudio: boolean;

package/src/presentation/components/audio-layer/AudioFileSelector.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { SUPPORTED_AUDIO_FORMATS } from "../../../infrastructure/constants/audio-layer.constants";
 
 interface AudioFileSelectorProps {

package/src/presentation/components/audio-layer/FadeEffectsSelector.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import {
   FADE_IN_OPTIONS,
   FADE_OUT_OPTIONS,

package/src/presentation/components/audio-layer/InfoBanner.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 export const InfoBanner: React.FC = () => {
   const tokens = useAppDesignTokens();

package/src/presentation/components/audio-layer/VolumeSelector.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { VOLUME_OPTIONS } from "../../../infrastructure/constants/audio-layer.constants";
 
 interface VolumeSelectorProps {

package/src/presentation/components/draggable-layer/LayerContent.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, Image, Text as RNText, StyleSheet } from "react-native";
-import {
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { Layer, TextLayer, ImageLayer, ShapeLayer } from "../../../domain/entities";
 
 interface LayerContentProps {

package/src/presentation/components/draggable-layer/ResizeHandles.tsx

@@ -6,7 +6,7 @@
 import React from "react";
 import { View, StyleSheet } from "react-native";
 import { Gesture, GestureDetector } from "react-native-gesture-handler";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface ResizeHandlesProps {
   topLeftGesture: ReturnType<typeof Gesture.Pan>;

package/src/presentation/components/export/ExportActions.tsx

@@ -9,12 +9,8 @@ import {
   StyleSheet,
   TouchableOpacity,
 } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  AtomicSpinner,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon, AtomicSpinner } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface ExportActionsProps {
   isExporting: boolean;

package/src/presentation/components/export/ExportInfoBanner.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 export const ExportInfoBanner: React.FC = () => {
   const tokens = useAppDesignTokens();

package/src/presentation/components/export/ExportProgress.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { ExportProgress as ExportProgressType } from "../../hooks/useExport";
 
 interface ExportProgressProps {

package/src/presentation/components/export/OptionSelectorRow.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface Option<T extends string> {
   value: T;

package/src/presentation/components/export/ProjectInfoBox.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { VideoProject } from "../../../domain/entities";
 
 interface ProjectInfoBoxProps {

package/src/presentation/components/export/WatermarkToggle.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface WatermarkToggleProps {
   includeWatermark: boolean;

package/src/presentation/components/image-layer/ImagePreview.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, Image, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface ImagePreviewProps {
   imageUri: string;

package/src/presentation/components/image-layer/ImageSelectionButtons.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface ImageSelectionButtonsProps {
   onPickFromGallery: () => void;

package/src/presentation/components/image-layer/OpacitySelector.tsx

@@ -6,10 +6,8 @@
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
 import { useLocalization } from "@umituz/react-native-settings";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { IMAGE_OPACITY_OPTIONS } from "../../../infrastructure/constants/image-layer.constants";
 
 interface OpacitySelectorProps {

package/src/presentation/components/shape-layer/ColorPickerHorizontal.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, ScrollView, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { SHAPE_COLORS } from "../../../infrastructure/constants/shape-layer.constants";
 
 interface ColorPickerHorizontalProps {

package/src/presentation/components/shape-layer/ShapePreview.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { ShapeLayerFormState } from "../../hooks/useShapeLayerForm";
 
 interface ShapePreviewProps {

package/src/presentation/components/shape-layer/ShapeTypeSelector.tsx

@@ -5,11 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import {
   SHAPES,
   type ShapeType,

package/src/presentation/components/shape-layer/ValueSelector.tsx

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface ValueSelectorProps {
   title: string;

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

@@ -6,11 +6,8 @@
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
 import { useLocalization } from "@umituz/react-native-settings";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { TEXT_COLORS } from "../../../infrastructure/constants/text-layer.constants";
 
 interface ColorPickerProps {

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

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { useLocalization } from "@umituz/react-native-settings";
 
 interface EditorActionsProps {

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

@@ -6,10 +6,8 @@
 import React from "react";
 import { View, ScrollView, TouchableOpacity, StyleSheet } from "react-native";
 import { useLocalization } from "@umituz/react-native-settings";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { FONT_SIZES } from "../../../infrastructure/constants/text-layer.constants";
 
 interface FontSizeSelectorProps {

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

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface Option {
   label: string;

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

@@ -6,11 +6,8 @@
 import React from "react";
 import { View, StyleSheet, TouchableOpacity } from "react-native";
 import { useLocalization } from "@umituz/react-native-settings";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import { TEXT_ALIGNS } from "../../../infrastructure/constants/text-layer.constants";
 
 interface TextAlignSelectorProps {

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

@@ -6,10 +6,8 @@
 import React from "react";
 import { View, TextInput, StyleSheet } from "react-native";
 import { useLocalization } from "@umituz/react-native-settings";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 
 interface TextInputSectionProps {
   text: string;

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

@@ -5,10 +5,8 @@
 
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system/atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { TextLayerFormState } from "../../hooks/useTextLayerForm";
 
 interface TextPreviewProps {

package/src/presentation/hooks/useShapeLayerForm.ts

@@ -4,7 +4,7 @@
  */
 
 import { useState, useCallback } from "react";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { ShapeLayer } from "../../domain/entities";
 import type { ShapeType } from "../../infrastructure/constants/shape-layer.constants";
 

package/src/presentation/hooks/useTextLayerForm.ts

@@ -4,7 +4,7 @@
  */
 
 import { useState, useCallback } from "react";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
 import type { TextLayer } from "../../domain/entities";
 
 export interface TextLayerFormState {