@umituz/react-native-design-system 2.6.110 → 2.6.112

package/src/image/infrastructure/services/ImageStorageService.ts

@@ -0,0 +1,37 @@
+/**
+ * Image Infrastructure - Storage Service
+ * 
+ * Handles saving images to the device filesystem
+ */
+
+import { FileSystemService } from '@umituz/react-native-filesystem';
+import { ImageValidator } from '../utils/ImageValidator';
+import { ImageErrorHandler, IMAGE_ERROR_CODES } from '../utils/ImageErrorHandler';
+
+export class ImageStorageService {
+    static async saveImage(
+        uri: string,
+        filename?: string
+    ): Promise<string> {
+        try {
+            const uriValidation = ImageValidator.validateUri(uri);
+            if (!uriValidation.isValid) {
+                throw ImageErrorHandler.createError(uriValidation.error!, IMAGE_ERROR_CODES.INVALID_URI, 'saveImage');
+            }
+
+            const result = await FileSystemService.copyToDocuments(uri, filename);
+            
+            if (!result.success || !result.uri) {
+                throw ImageErrorHandler.createError(
+                    'Failed to save image to filesystem',
+                    IMAGE_ERROR_CODES.STORAGE_FAILED,
+                    'saveImage'
+                );
+            }
+
+            return result.uri;
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'saveImage');
+        }
+    }
+}

package/src/image/infrastructure/services/ImageTemplateService.ts

@@ -0,0 +1,66 @@
+import { MemeTemplateOptions } from '../../domain/entities/ImageTemplateTypes';
+
+/**
+ * ImageTemplateService
+ * 
+ * Provides utilities for generating image template URLs (e.g. Memegen.link)
+ */
+export class ImageTemplateService {
+  /**
+   * Generates a meme URL for a given template and texts
+   * 
+   * @param options Meme configuration (templateKey, topText, bottomText)
+   * @param baseUrl Optional base URL for the image generation service
+   * @returns Formatted image URL
+   */
+  static generateMemeUrl(
+    options: MemeTemplateOptions, 
+    baseUrl: string = 'https://api.memegen.link'
+  ): string {
+    const { templateKey, topText = '', bottomText = '', style, width, height } = options;
+    
+    // Internal helper for memegen-specific encoding
+    const encodeMemeText = (text: string) => {
+      const sanitized = text.trim();
+      if (!sanitized) return "_";
+      
+      return encodeURIComponent(
+        sanitized
+          .replace(/ /g, "_")
+          .replace(/\?/g, "~q")
+          .replace(/#/g, "~h")
+          .replace(/\//g, "~s")
+      );
+    };
+
+    const top = encodeMemeText(topText);
+    const bottom = encodeMemeText(bottomText);
+
+    // Ensure baseUrl doesn't have a trailing slash
+    const base = baseUrl.endsWith('/') ? baseUrl.slice(0, -1) : baseUrl;
+    let url = `${base}/images/${templateKey}/${top}/${bottom}.png`;
+    
+    const params: string[] = [];
+    if (style) params.push(`style=${style}`);
+    if (width) params.push(`width=${width}`);
+    if (height) params.push(`height=${height}`);
+
+    if (params.length > 0) {
+      url += `?${params.join('&')}`;
+    }
+
+    return url;
+  }
+
+  /**
+   * Extracts template key from a memegen.link URL or filename
+   */
+  static extractTemplateKey(url: string): string {
+    if (!url) return 'custom';
+    
+    // Example: https://api.memegen.link/images/distracted.png -> distracted
+    const parts = url.split('/');
+    const lastPart = parts[parts.length - 1] || '';
+    return lastPart.split('.')[0] || 'custom';
+  }
+}

package/src/image/infrastructure/services/ImageTransformService.ts

@@ -0,0 +1,89 @@
+/**
+ * Image Infrastructure - Transform Service
+ * 
+ * Handles geometric transformations: resize, crop, rotate, flip
+ */
+
+import * as ImageManipulator from 'expo-image-manipulator';
+import type {
+    ImageManipulateAction,
+    ImageSaveOptions,
+    ImageManipulationResult,
+    ImageCropArea,
+    ImageFlipOptions,
+} from '../../domain/entities/ImageTypes';
+import { ImageUtils } from '../../domain/utils/ImageUtils';
+import { ImageValidator } from '../utils/ImageValidator';
+import { ImageErrorHandler, IMAGE_ERROR_CODES } from '../utils/ImageErrorHandler';
+import { ImageTransformUtils } from '../utils/ImageTransformUtils';
+
+export class ImageTransformService {
+    static async resize(uri: string, width?: number, height?: number, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        try {
+            ImageValidator.validateUri(uri);
+            ImageValidator.validateDimensions({ width, height });
+            return await ImageManipulator.manipulateAsync(uri, [{ resize: { width, height } }], ImageTransformUtils.buildSaveOptions(options));
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'resize');
+        }
+    }
+
+    static async crop(uri: string, cropArea: ImageCropArea, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        try {
+            ImageValidator.validateUri(uri);
+            ImageValidator.validateDimensions(cropArea);
+            return await ImageManipulator.manipulateAsync(uri, [{ crop: cropArea }], ImageTransformUtils.buildSaveOptions(options));
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'crop');
+        }
+    }
+
+    static async rotate(uri: string, degrees: number, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        try {
+            ImageValidator.validateUri(uri);
+            ImageValidator.validateRotation(degrees);
+            return await ImageManipulator.manipulateAsync(uri, [{ rotate: degrees }], ImageTransformUtils.buildSaveOptions(options));
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'rotate');
+        }
+    }
+
+    static async flip(uri: string, flip: ImageFlipOptions, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        try {
+            ImageValidator.validateUri(uri);
+            const actions: ImageManipulator.Action[] = [];
+            if (flip.horizontal) actions.push({ flip: ImageManipulator.FlipType.Horizontal });
+            if (flip.vertical) actions.push({ flip: ImageManipulator.FlipType.Vertical });
+            return await ImageManipulator.manipulateAsync(uri, actions, ImageTransformUtils.buildSaveOptions(options));
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'flip');
+        }
+    }
+
+    static async manipulate(uri: string, action: ImageManipulateAction, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        try {
+            ImageValidator.validateUri(uri);
+            const actions: ImageManipulator.Action[] = [];
+            if (action.resize) actions.push({ resize: action.resize });
+            if (action.crop) actions.push({ crop: action.crop });
+            if (action.rotate) actions.push({ rotate: action.rotate });
+            if (action.flip) {
+                if (action.flip.horizontal) actions.push({ flip: ImageManipulator.FlipType.Horizontal });
+                if (action.flip.vertical) actions.push({ flip: ImageManipulator.FlipType.Vertical });
+            }
+            return await ImageManipulator.manipulateAsync(uri, actions, ImageTransformUtils.buildSaveOptions(options));
+        } catch (error) {
+            throw ImageErrorHandler.handleUnknownError(error, 'manipulate');
+        }
+    }
+
+    static async resizeToFit(uri: string, maxWidth: number, maxHeight: number, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        const dimensions = ImageUtils.fitToSize(maxWidth, maxHeight, maxWidth, maxHeight);
+        return this.resize(uri, dimensions.width, dimensions.height, options);
+    }
+
+    static async cropToSquare(uri: string, width: number, height: number, options?: ImageSaveOptions): Promise<ImageManipulationResult> {
+        const cropArea = ImageUtils.getSquareCrop(width, height);
+        return this.crop(uri, cropArea, options);
+    }
+}

package/src/image/infrastructure/services/ImageViewerService.ts

@@ -0,0 +1,64 @@
+/**
+ * Image Infrastructure - Viewer Service
+ *
+ * Provides configuration for react-native-image-viewing component
+ */
+
+import type {
+  ImageViewerItem,
+  ImageGalleryOptions,
+} from '../../domain/entities/ImageTypes';
+
+export interface ImageViewerConfig {
+  images: ImageViewerItem[];
+  index?: number;
+  visible: boolean;
+  onDismiss?: () => void;
+  options?: ImageGalleryOptions;
+}
+
+export class ImageViewerService {
+  static prepareImages(uris: string[]): ImageViewerItem[] {
+    return uris.map(uri => ({ uri }));
+  }
+
+  static prepareImagesWithMetadata(items: ImageViewerItem[]): ImageViewerItem[] {
+    return items.map(item => ({
+      uri: item.uri,
+      title: item.title,
+      description: item.description,
+      width: item.width,
+      height: item.height,
+    }));
+  }
+
+  static createViewerConfig(
+    images: ImageViewerItem[],
+    startIndex: number = 0,
+    onDismiss?: () => void,
+    options?: ImageGalleryOptions
+  ): ImageViewerConfig {
+    return {
+      images,
+      index: options?.index ?? startIndex,
+      visible: true,
+      onDismiss: onDismiss || options?.onDismiss,
+      options: {
+        backgroundColor: options?.backgroundColor || '#000000',
+        swipeToCloseEnabled: options?.swipeToCloseEnabled ?? true,
+        doubleTapToZoomEnabled: options?.doubleTapToZoomEnabled ?? true,
+        onIndexChange: options?.onIndexChange,
+      },
+    };
+  }
+
+  static getDefaultOptions(): ImageGalleryOptions {
+    return {
+      index: 0,
+      backgroundColor: '#000000',
+      swipeToCloseEnabled: true,
+      doubleTapToZoomEnabled: true,
+    };
+  }
+}
+

package/src/image/infrastructure/utils/BatchProcessor.ts

@@ -0,0 +1,95 @@
+/**
+ * Image Infrastructure - Batch Processor Utilities
+ *
+ * Helper functions for batch processing operations
+ */
+
+import type { ImageManipulationResult, ImageCropArea, SaveFormat } from '../../domain/entities/ImageTypes';
+import type { BatchOperation, BatchProcessingOptions } from '../services/ImageBatchService';
+import { ImageTransformService } from '../services/ImageTransformService';
+import { ImageConversionService } from '../services/ImageConversionService';
+import { ImageValidator } from './ImageValidator';
+import { ImageErrorHandler, IMAGE_ERROR_CODES } from './ImageErrorHandler';
+
+export class BatchProcessor {
+  static async processBatchItem(
+    operation: BatchOperation,
+    options: BatchProcessingOptions = {}
+  ): Promise<{ uri: string; result: ImageManipulationResult | null; error?: Error }> {
+    try {
+      const uriValidation = ImageValidator.validateUri(operation.uri);
+      if (!uriValidation.isValid) {
+        throw ImageErrorHandler.createError(uriValidation.error!, IMAGE_ERROR_CODES.INVALID_URI, 'batchProcess');
+      }
+
+      let result: ImageManipulationResult;
+
+      switch (operation.type) {
+        case 'resize':
+          result = await ImageTransformService.resize(
+            operation.uri,
+            operation.params.width as number | undefined,
+            operation.params.height as number | undefined,
+            operation.options
+          );
+          break;
+
+        case 'crop':
+          result = await ImageTransformService.crop(
+            operation.uri,
+            operation.params as unknown as ImageCropArea,
+            operation.options
+          );
+          break;
+
+        case 'compress':
+          result = await ImageConversionService.compress(
+            operation.uri,
+            operation.params.quality as number
+          );
+          break;
+
+        case 'convert':
+          result = await ImageConversionService.convertFormat(
+            operation.uri,
+            operation.params.format as SaveFormat,
+            operation.params.quality as number
+          );
+          break;
+
+        default:
+          throw ImageErrorHandler.createError(
+            `Unknown operation type: ${operation.type}`,
+            IMAGE_ERROR_CODES.VALIDATION_ERROR,
+            'batchProcess'
+          );
+      }
+
+      return { uri: operation.uri, result };
+    } catch (error) {
+      return {
+        uri: operation.uri,
+        result: null,
+        error: error instanceof Error ? error : new Error('Unknown error')
+      };
+    }
+  }
+
+  static async processBatchInChunks<T>(
+    items: T[],
+    processor: (item: T) => Promise<unknown>,
+    concurrency: number,
+    onProgress?: (completed: number, total: number) => void
+  ): Promise<void> {
+    let completed = 0;
+    const total = items.length;
+
+    for (let i = 0; i < items.length; i += concurrency) {
+      const chunk = items.slice(i, i + concurrency);
+      await Promise.all(chunk.map(processor));
+      completed += chunk.length;
+      onProgress?.(completed, total);
+    }
+  }
+}
+

package/src/image/infrastructure/utils/FilterProcessor.ts

@@ -0,0 +1,124 @@
+/**
+ * Infrastructure - Filter Processor
+ * 
+ * Filter processing with preset management
+ */
+
+import { ImageFilterUtils } from './ImageFilterUtils';
+
+export interface FilterPreset {
+  id: string;
+  name: string;
+  category: 'basic' | 'color' | 'artistic' | 'vintage';
+  parameters: FilterParameter[];
+  preview?: string;
+}
+
+export interface FilterParameter {
+  name: string;
+  type: 'slider' | 'color' | 'boolean';
+  min?: number;
+  max?: number;
+  value: number | string | boolean;
+  step?: number;
+  label: string;
+}
+
+export interface FilterState {
+  id: string;
+  intensity: number;
+  parameters: Record<string, any>;
+  enabled: boolean;
+}
+
+export class FilterProcessor {
+  private static readonly PRESETS: FilterPreset[] = [
+    {
+      id: 'brightness',
+      name: 'Brightness',
+      category: 'basic',
+      parameters: [{ name: 'brightness', type: 'slider', min: -100, max: 100, value: 0, label: 'Brightness' }],
+    },
+    {
+      id: 'contrast',
+      name: 'Contrast',
+      category: 'basic',
+      parameters: [{ name: 'contrast', type: 'slider', min: -100, max: 100, value: 0, label: 'Contrast' }],
+    },
+    {
+      id: 'saturation',
+      name: 'Saturation',
+      category: 'color',
+      parameters: [{ name: 'saturation', type: 'slider', min: -100, max: 100, value: 0, label: 'Saturation' }],
+    },
+    {
+      id: 'vintage',
+      name: 'Vintage',
+      category: 'vintage',
+      parameters: [
+        { name: 'intensity', type: 'slider', min: 0, max: 100, value: 50, label: 'Intensity' },
+        { name: 'warmth', type: 'slider', min: 0, max: 100, value: 30, label: 'Warmth' },
+      ],
+    },
+    {
+      id: 'blur',
+      name: 'Blur',
+      category: 'artistic',
+      parameters: [{ name: 'radius', type: 'slider', min: 0, max: 20, value: 0, label: 'Blur Radius' }],
+    },
+  ];
+
+  static getPresets(category?: string): FilterPreset[] {
+    return category ? this.PRESETS.filter(preset => preset.category === category) : this.PRESETS;
+  }
+
+  static getPreset(id: string): FilterPreset | undefined {
+    return this.PRESETS.find(preset => preset.id === id);
+  }
+
+  static createFilterState(presetId: string): FilterState {
+    const preset = this.getPreset(presetId);
+    if (!preset) throw new Error(`Filter preset not found: ${presetId}`);
+
+    const parameters: Record<string, any> = {};
+    preset.parameters.forEach(param => { parameters[param.name] = param.value; });
+
+    return { id: presetId, intensity: 100, parameters, enabled: true };
+  }
+
+  static applyFilter(
+    imageData: Uint8ClampedArray,
+    width: number,
+    height: number,
+    filterState: FilterState
+  ): Uint8ClampedArray {
+    const preset = this.getPreset(filterState.id);
+    if (!preset || !filterState.enabled) return imageData;
+
+    let processedData = new Uint8ClampedArray(imageData);
+
+    switch (filterState.id) {
+      case 'brightness':
+        processedData = ImageFilterUtils.applyBrightness(processedData, filterState.parameters.brightness) as any;
+        break;
+      case 'contrast':
+        processedData = ImageFilterUtils.applyContrast(processedData, filterState.parameters.contrast) as any;
+        break;
+      case 'saturation':
+        processedData = ImageFilterUtils.applySaturation(processedData, filterState.parameters.saturation) as any;
+        break;
+      case 'vintage':
+        processedData = ImageFilterUtils.applyVintage(processedData, filterState.parameters.intensity, filterState.parameters.warmth) as any;
+        break;
+      case 'blur':
+        processedData = ImageFilterUtils.applyBlur(processedData, filterState.parameters.radius, width, height) as any;
+        break;
+    }
+
+    if (filterState.intensity < 100) {
+      processedData = ImageFilterUtils.applyIntensity(imageData, processedData, filterState.intensity / 100) as any;
+    }
+
+    return processedData as any;
+  }
+}

package/src/image/infrastructure/utils/ImageAnalysisUtils.ts

@@ -0,0 +1,122 @@
+/**
+ * Image Infrastructure - Image Analysis
+ * 
+ * Image analysis utilities
+ */
+
+export class ImageAnalysisUtils {
+  static calculateColorBalance(imageData: Uint8ClampedArray): {
+    redBalance: number;
+    greenBalance: number;
+    blueBalance: number;
+  } {
+    let redSum = 0, greenSum = 0, blueSum = 0;
+    const pixelCount = imageData.length / 4;
+    
+    for (let i = 0; i < imageData.length; i += 4) {
+      redSum += imageData[i];
+      greenSum += imageData[i + 1];
+      blueSum += imageData[i + 2];
+    }
+    
+    const redMean = redSum / pixelCount;
+    const greenMean = greenSum / pixelCount;
+    const blueMean = blueSum / pixelCount;
+    const grayMean = (redMean + greenMean + blueMean) / 3;
+    
+    return {
+      redBalance: (grayMean - redMean) / 255,
+      greenBalance: (grayMean - greenMean) / 255,
+      blueBalance: (grayMean - blueMean) / 255,
+    };
+  }
+
+  static detectNoise(imageData: Uint8ClampedArray): number {
+    let noiseLevel = 0;
+    let sampleCount = 0;
+    
+    for (let i = 0; i < imageData.length - 40; i += 40) {
+      const r1 = imageData[i];
+      const g1 = imageData[i + 1];
+      const b1 = imageData[i + 2];
+      
+      const r2 = imageData[i + 4];
+      const g2 = imageData[i + 5];
+      const b2 = imageData[i + 6];
+      
+      const diff = Math.abs(r1 - r2) + Math.abs(g1 - g2) + Math.abs(b1 - b2);
+      noiseLevel += diff;
+      sampleCount++;
+    }
+    
+    return noiseLevel / (sampleCount * 3 * 255);
+  }
+
+  static applySharpening(imageData: Uint8ClampedArray): Uint8ClampedArray {
+    const result = new Uint8ClampedArray(imageData.length);
+    const width = Math.sqrt(imageData.length / 4);
+    const kernel = [
+      0, -1, 0,
+      -1, 5, -1,
+      0, -1, 0
+    ];
+    
+    for (let i = 0; i < imageData.length; i += 4) {
+      const pixelIndex = i / 4;
+      const x = pixelIndex % width;
+      const y = Math.floor(pixelIndex / width);
+      
+      for (let c = 0; c < 3; c++) {
+        let sum = 0;
+        for (let ky = -1; ky <= 1; ky++) {
+          for (let kx = -1; kx <= 1; kx++) {
+            const nx = x + kx;
+            const ny = y + ky;
+            
+            if (nx >= 0 && nx < width && ny >= 0 && ny < width) {
+              const neighborIndex = (ny * width + nx) * 4 + c;
+              sum += imageData[neighborIndex] * kernel[(ky + 1) * 3 + (kx + 1)];
+            }
+          }
+        }
+        result[i + c] = Math.min(255, Math.max(0, sum));
+      }
+      result[i + 3] = imageData[i + 3];
+    }
+    
+    return result;
+  }
+
+  static applyNoiseReduction(imageData: Uint8ClampedArray): Uint8ClampedArray {
+    const result = new Uint8ClampedArray(imageData.length);
+    const width = Math.sqrt(imageData.length / 4);
+    
+    for (let i = 0; i < imageData.length; i += 4) {
+      const pixelIndex = i / 4;
+      const x = pixelIndex % width;
+      const y = Math.floor(pixelIndex / width);
+      
+      for (let c = 0; c < 3; c++) {
+        const values = [];
+        
+        for (let dy = -1; dy <= 1; dy++) {
+          for (let dx = -1; dx <= 1; dx++) {
+            const nx = x + dx;
+            const ny = y + dy;
+            
+            if (nx >= 0 && nx < width && ny >= 0 && ny < width) {
+              const neighborIndex = (ny * width + nx) * 4 + c;
+              values.push(imageData[neighborIndex]);
+            }
+          }
+        }
+        
+        values.sort((a, b) => a - b);
+        result[i + c] = values[Math.floor(values.length / 2)];
+      }
+      result[i + 3] = imageData[i + 3];
+    }
+    
+    return result;
+  }
+}

package/src/image/infrastructure/utils/ImageEditorHistoryUtils.ts

@@ -0,0 +1,63 @@
+/**
+ * Infrastructure - Editor History Utils
+ * 
+ * Logic for managing editor state history and undo/redo
+ */
+
+import { type EditorState, type EditorHistory } from '../../domain/entities/EditorTypes';
+
+export class ImageEditorHistoryUtils {
+  static addToHistory(
+    state: EditorState,
+    newHistory: EditorHistory,
+    maxHistory: number = 50
+  ): EditorState {
+    const newHistoryArray = [...state.history.slice(0, state.historyIndex + 1), newHistory];
+
+    if (newHistoryArray.length > maxHistory) {
+      newHistoryArray.shift();
+    }
+
+    return {
+      ...state,
+      history: newHistoryArray,
+      historyIndex: newHistoryArray.length - 1,
+    };
+  }
+
+  static undo(state: EditorState): EditorState {
+    if (state.historyIndex <= 0) return state;
+
+    const newIndex = state.historyIndex - 1;
+    const historyState = state.history[newIndex];
+
+    return {
+      ...state,
+      layers: historyState.layers,
+      historyIndex: newIndex,
+      isDirty: true,
+    };
+  }
+
+  static redo(state: EditorState): EditorState {
+    if (state.historyIndex >= state.history.length - 1) return state;
+
+    const newIndex = state.historyIndex + 1;
+    const historyState = state.history[newIndex];
+
+    return {
+      ...state,
+      layers: historyState.layers,
+      historyIndex: newIndex,
+      isDirty: true,
+    };
+  }
+
+  static canUndo(state: EditorState): boolean {
+    return state.historyIndex > 0;
+  }
+
+  static canRedo(state: EditorState): boolean {
+    return state.historyIndex < state.history.length - 1;
+  }
+}