@umituz/react-native-ai-generation-content 1.17.228 → 1.17.230

package/src/features/meme-generator/README.md

@@ -0,0 +1,327 @@
+# Meme Generator
+
+Create memes from images with AI-generated text and styling.
+
+## Features
+
+- Add text to images with smart positioning
+- Multiple meme templates
+- Custom text and captions
+- Auto-generated meme suggestions
+- Style and font customization
+
+## Installation
+
+This feature is part of `@umituz/react-native-ai-generation-content`.
+
+```bash
+npm install @umituz/react-native-ai-generation-content
+```
+
+## Basic Usage
+
+### Using the Hook
+
+```tsx
+import { useMemeGeneratorFeature } from '@umituz/react-native-ai-generation-content';
+import * as ImagePicker from 'react-native-image-picker';
+
+function MemeGeneratorScreen() {
+  const [image, setImage] = useState<string | null>(null);
+
+  const feature = useMemeGeneratorFeature({
+    config: {
+      template: 'classic',
+      onProcessingStart: () => console.log('Creating meme...'),
+      onProcessingComplete: (result) => console.log('Complete:', result),
+      onError: (error) => console.error('Error:', error),
+    },
+    onSelectImage: async () => {
+      const result = await ImagePicker.launchImageLibrary({ mediaType: 'photo' });
+      if (result.assets && result.assets[0].uri) {
+        const base64 = await convertToBase64(result.assets[0].uri);
+        setImage(base64);
+        return base64;
+      }
+      return null;
+    },
+    onSaveResult: async (imageUrl) => {
+      await saveToGallery(imageUrl);
+    },
+  });
+
+  return (
+    <View>
+      <PhotoUploadCard
+        image={image}
+        onSelectImage={feature.selectImage}
+        title="Select Image for Meme"
+      />
+
+      <MemeTemplateSelector
+        selectedTemplate={feature.state.template}
+        onSelectTemplate={feature.setTemplate}
+      />
+
+      <TextInput
+        placeholder="Top text"
+        value={feature.state.topText}
+        onChangeText={feature.setTopText}
+      />
+
+      <TextInput
+        placeholder="Bottom text"
+        value={feature.state.bottomText}
+        onChangeText={feature.setBottomText}
+      />
+
+      <Button
+        title="Create Meme"
+        onPress={feature.process}
+        disabled={!feature.isReady || feature.state.isProcessing}
+      />
+
+      {feature.state.isProcessing && (
+        <ActivityIndicator />
+      )}
+
+      {feature.state.result && (
+        <Image source={{ uri: feature.state.result.imageUrl }} />
+      )}
+    </View>
+  );
+}
+```
+
+### Using the Unified AI Feature Screen
+
+```tsx
+import { AIFeatureScreen } from '@umituz/react-native-ai-generation-content';
+
+function App() {
+  return (
+    <AIFeatureScreen
+      featureId="meme-generator"
+      userId="user-123"
+    />
+  );
+}
+```
+
+## Configuration Options
+
+### Feature Config
+
+```tsx
+interface MemeGeneratorFeatureConfig {
+  template?: 'classic' | 'modern' | 'minimal' | 'bold';
+  font?: string; // Font family
+  fontSize?: number; // Font size
+  onProcessingStart?: () => void;
+  onProcessingComplete?: (result: MemeGeneratorResult) => void;
+  onError?: (error: string) => void;
+}
+```
+
+### Generation Options
+
+```tsx
+interface MemeGeneratorOptions {
+  template: 'classic' | 'modern' | 'minimal' | 'bold';
+  topText?: string;
+  bottomText?: string;
+  fontSize?: number;
+  textColor?: string;
+  strokeColor?: string;
+}
+```
+
+## Meme Templates
+
+### Classic Template
+
+Classic top/bottom text meme:
+
+```tsx
+const result = await feature.process({
+  template: 'classic',
+  topText: 'WHEN YOU THINK',
+  bottomText: 'ABOUT IT',
+});
+```
+
+### Modern Template
+
+Modern styling with flexible text placement:
+
+```tsx
+const result = await feature.process({
+  template: 'modern',
+  topText: 'Me: Writes code',
+  bottomText: 'Also me: It works on my machine',
+});
+```
+
+### Minimal Template
+
+Clean, minimal design:
+
+```tsx
+const result = await feature.process({
+  template: 'minimal',
+  topText: 'Just vibing',
+});
+```
+
+### Bold Template
+
+Bold, impactful text:
+
+```tsx
+const result = await feature.process({
+  template: 'bold',
+  topText: 'ERROR 404',
+  bottomText: 'MOTIVATION NOT FOUND',
+});
+```
+
+## Usage Flow
+
+1. Select **Image** - Choose an image for the meme
+2. Choose **Template** - Select a meme template
+3. Add **Text** - Enter top and/or bottom text
+4. Customize **Style** - Adjust font, size, colors
+5. Tap **Create** - Generate the meme
+6. View Result - See the generated meme
+7. Save or Share - Save or share the meme
+
+## Component Examples
+
+### Template Selector
+
+```tsx
+import { GridSelector } from '@umituz/react-native-ai-generation-content';
+
+const templates = [
+  { id: 'classic', name: 'Classic', description: 'Top/Bottom text' },
+  { id: 'modern', name: 'Modern', description: 'Contemporary style' },
+  { id: 'minimal', name: 'Minimal', description: 'Clean & simple' },
+  { id: 'bold', name: 'Bold', description: 'Big impact' },
+];
+
+<GridSelector
+  options={templates}
+  selectedOption={selectedTemplate}
+  onSelectOption={setSelectedTemplate}
+/>
+```
+
+### Text Inputs
+
+```tsx
+import { TextInput } from 'react-native';
+
+<View>
+  <TextInput
+    placeholder="Top text"
+    value={topText}
+    onChangeText={setTopText}
+    style={{ fontSize: 18, fontWeight: 'bold' }}
+  />
+
+  <TextInput
+    placeholder="Bottom text"
+    value={bottomText}
+    onChangeText={setBottomText}
+    style={{ fontSize: 18, fontWeight: 'bold' }}
+  />
+</View>
+```
+
+### Color Picker
+
+```tsx
+import { TouchableOpacity, View } from 'react-native';
+
+const colors = ['#FFFFFF', '#000000', '#FF0000', '#00FF00', '#0000FF'];
+
+<View style={{ flexDirection: 'row' }}>
+  {colors.map(color => (
+    <TouchableOpacity
+      key={color}
+      style={{
+        width: 40,
+        height: 40,
+        backgroundColor: color,
+        borderRadius: 20,
+        margin: 5,
+        borderWidth: selectedColor === color ? 3 : 0,
+      }}
+      onPress={() => setSelectedColor(color)}
+    />
+  ))}
+</View>
+```
+
+## Use Cases
+
+### Funny Memes
+
+```tsx
+// Create humorous memes
+const result = await feature.process({
+  template: 'classic',
+  topText: 'Me at 3 AM',
+  bottomText: 'Let\'s learn quantum physics',
+});
+```
+
+### Social Media Content
+
+```tsx
+// Generate shareable content
+const result = await feature.process({
+  template: 'modern',
+  topText: 'Monday mood',
+});
+```
+
+### Marketing
+
+```tsx
+// Create marketing memes
+const result = await feature.process({
+  template: 'bold',
+  topText: 'NEW PRODUCT',
+  bottomText: '50% OFF',
+});
+```
+
+### Reaction Images
+
+```tsx
+// Turn reaction photos into memes
+const result = await feature.process({
+  template: 'classic',
+  topText: 'When the code works',
+  bottomText: 'On the first try',
+});
+```
+
+## Best Practices
+
+1. **Text Length**: Keep text short and punchy
+2. **Readability**: Ensure text contrasts well with image
+3. **Font Size**: Adjust based on image size and text length
+4. **Relevance**: Match text to image content
+5. **Humor**: Focus on relatable, funny content
+
+## Related Features
+
+- [Text to Image](../text-to-image) - Generate images from text
+- [Image to Image](../image-to-image) - Transform images with AI
+- [Style Transfer](../style-transfer) - Apply artistic styles
+
+## License
+
+MIT

package/src/features/photo-restoration/README.md

@@ -0,0 +1,286 @@
+# Photo Restoration
+
+Restore and enhance old, blurry, or damaged photos using AI.
+
+## Features
+
+- Repair old and damaged photographs
+- Remove scratches, tears, and stains
+- Enhance blurry photos
+- Colorize black and white photos
+- Restore facial details and features
+
+## Installation
+
+This feature is part of `@umituz/react-native-ai-generation-content`.
+
+```bash
+npm install @umituz/react-native-ai-generation-content
+```
+
+## Basic Usage
+
+### Using the Hook
+
+```tsx
+import { usePhotoRestoreFeature } from '@umituz/react-native-ai-generation-content';
+import * as ImagePicker from 'react-native-image-picker';
+
+function PhotoRestorationScreen() {
+  const [photo, setPhoto] = useState<string | null>(null);
+
+  const feature = usePhotoRestoreFeature({
+    config: {
+      restorationType: 'auto', // 'auto', ' scratches', 'blur', 'colorize'
+      onProcessingStart: () => console.log('Starting restoration...'),
+      onProcessingComplete: (result) => console.log('Complete:', result),
+      onError: (error) => console.error('Error:', error),
+    },
+    onSelectPhoto: async () => {
+      const result = await ImagePicker.launchImageLibrary({ mediaType: 'photo' });
+      if (result.assets && result.assets[0].uri) {
+        const base64 = await convertToBase64(result.assets[0].uri);
+        setPhoto(base64);
+        return base64;
+      }
+      return null;
+    },
+    onSaveResult: async (imageUrl) => {
+      await saveToGallery(imageUrl);
+    },
+  });
+
+  return (
+    <View>
+      <PhotoUploadCard
+        image={photo}
+        onSelectImage={feature.selectPhoto}
+        title="Select Photo to Restore"
+      />
+
+      <Button
+        title="Restore Photo"
+        onPress={feature.process}
+        disabled={!feature.isReady || feature.state.isProcessing}
+      />
+
+      {feature.state.isProcessing && (
+        <View>
+          <Text>Restoring photo...</Text>
+          <ProgressBar progress={feature.state.progress} />
+        </View>
+      )}
+
+      {feature.state.result && (
+        <ResultDisplay
+          originalImage={photo}
+          resultImage={feature.state.result.imageUrl}
+          onSave={() => feature.saveResult()}
+        />
+      )}
+    </View>
+  );
+}
+```
+
+### Using the Unified AI Feature Screen
+
+```tsx
+import { AIFeatureScreen } from '@umituz/react-native-ai-generation-content';
+
+function App() {
+  return (
+    <AIFeatureScreen
+      featureId="photo-restoration"
+      userId="user-123"
+    />
+  );
+}
+```
+
+## Configuration Options
+
+### Feature Config
+
+```tsx
+interface PhotoRestoreFeatureConfig {
+  restorationType?: 'auto' | 'scratches' | 'blur' | 'colorize' | 'all';
+  onProcessingStart?: () => void;
+  onProcessingComplete?: (result: PhotoRestoreResult) => void;
+  onError?: (error: string) => void;
+}
+```
+
+### Restoration Options
+
+```tsx
+interface PhotoRestoreOptions {
+  removeScratches?: boolean; // Remove scratches and tears
+  fixBlur?: boolean; // Fix blurry photos
+  colorize?: boolean; // Colorize black and white photos
+  enhanceFaces?: boolean; // Restore facial details
+  adjustContrast?: boolean; // Improve contrast and brightness
+}
+```
+
+## Usage Flow
+
+1. Select **Photo** - Choose an old or damaged photo
+2. Choose **Restoration Type** - Select what to restore (or use auto)
+3. Tap **Restore** - Start the restoration process
+4. View **Comparison** - See before and after side by side
+5. Save or Share - Save the restored photo
+
+## Restoration Types
+
+### Auto Restoration
+
+Automatically detects and applies appropriate restoration:
+
+```tsx
+const result = await feature.process({
+  restorationType: 'auto',
+});
+```
+
+### Remove Scratches & Tears
+
+```tsx
+const result = await feature.process({
+  removeScratches: true,
+});
+```
+
+### Fix Blurry Photos
+
+```tsx
+const result = await feature.process({
+  fixBlur: true,
+});
+```
+
+### Colorize Black & White
+
+```tsx
+const result = await feature.process({
+  colorize: true,
+});
+```
+
+### Complete Restoration
+
+Apply all restoration techniques:
+
+```tsx
+const result = await feature.process({
+  removeScratches: true,
+  fixBlur: true,
+  colorize: true,
+  enhanceFaces: true,
+  adjustContrast: true,
+});
+```
+
+## Component Examples
+
+### Restoration Type Selector
+
+```tsx
+import { GridSelector } from '@umituz/react-native-ai-generation-content';
+
+const restorationTypes = [
+  { id: 'auto', name: 'Auto', description: 'Automatic detection' },
+  { id: 'scratches', name: 'Scratches', description: 'Remove scratches & tears' },
+  { id: 'blur', name: 'Blur', description: 'Fix blurry photos' },
+  { id: 'colorize', name: 'Colorize', description: 'Add color to B&W photos' },
+];
+
+function MyScreen() {
+  const [restorationType, setRestorationType] = useState('auto');
+
+  return (
+    <GridSelector
+      options={restorationTypes}
+      selectedOption={restorationType}
+      onSelectOption={setRestorationType}
+    />
+  );
+}
+```
+
+### Before/After Comparison
+
+```tsx
+import { ResultDisplay } from '@umituz/react-native-ai-generation-content';
+
+{feature.state.result && photo && (
+  <ResultDisplay
+    originalImage={photo}
+    resultImage={feature.state.result.imageUrl}
+    onSave={() => feature.saveResult()}
+    onShare={() => shareImage(feature.state.result.imageUrl)}
+  />
+)}
+```
+
+## Use Cases
+
+### Restoring Old Family Photos
+
+```tsx
+// Restore old family photographs
+const result = await feature.process({
+  removeScratches: true,
+  fixBlur: true,
+  adjustContrast: true,
+});
+```
+
+### Colorizing Historical Photos
+
+```tsx
+// Add color to black and white photos
+const result = await feature.process({
+  colorize: true,
+});
+```
+
+### Fixing Damaged Photos
+
+```tsx
+// Repair tears and stains
+const result = await feature.process({
+  removeScratches: true,
+});
+```
+
+## Best Practices
+
+1. **Scan Quality**: Use high-quality scans for best results
+2. **Start with Auto**: Let AI detect issues first
+3. **Multiple Passes**: Some photos may benefit from multiple restoration passes
+4. **Face Focus**: Enable face enhancement for portrait photos
+5. **Color Accuracy**: Colorization works best with clear reference points
+
+## Error Handling
+
+```tsx
+const { state, process } = usePhotoRestoreFeature({ ...config });
+
+useEffect(() => {
+  if (state.error) {
+    Alert.alert('Restoration Failed', state.error);
+  }
+}, [state.error]);
+```
+
+## Related Features
+
+- [Upscaling](../upscaling) - Increase image resolution
+- [HD Touch Up](../hd-touch-up) - High-detail enhancements
+- [Colorization](../colorization) - Add color to B&W photos
+- [Face Detection](../../../domains/face-detection) - Face detection API
+
+## License
+
+MIT