@umituz/react-native-ai-generation-content 1.17.228 → 1.17.230
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +346 -0
- package/package.json +1 -3
- package/src/domain/README.md +503 -0
- package/src/domains/content-moderation/README.md +363 -0
- package/src/domains/creations/README.md +394 -0
- package/src/domains/face-detection/README.md +395 -0
- package/src/domains/prompts/README.md +387 -0
- package/src/features/ai-hug/README.md +276 -0
- package/src/features/ai-kiss/README.md +276 -0
- package/src/features/anime-selfie/README.md +325 -0
- package/src/features/audio-generation/README.md +370 -0
- package/src/features/colorization/README.md +289 -0
- package/src/features/couple-future/README.md +270 -0
- package/src/features/face-swap/README.md +234 -0
- package/src/features/future-prediction/README.md +281 -0
- package/src/features/hd-touch-up/README.md +309 -0
- package/src/features/image-captioning/README.md +361 -0
- package/src/features/image-to-image/README.md +418 -0
- package/src/features/image-to-video/README.md +369 -0
- package/src/features/inpainting/README.md +302 -0
- package/src/features/meme-generator/README.md +327 -0
- package/src/features/photo-restoration/README.md +286 -0
- package/src/features/remove-background/README.md +292 -0
- package/src/features/remove-object/README.md +352 -0
- package/src/features/replace-background/README.md +288 -0
- package/src/features/script-generator/README.md +362 -0
- package/src/features/shared/README.md +280 -0
- package/src/features/sketch-to-image/README.md +296 -0
- package/src/features/style-transfer/README.md +301 -0
- package/src/features/text-to-image/README.md +228 -0
- package/src/features/text-to-video/README.md +245 -0
- package/src/features/text-to-voice/README.md +335 -0
- package/src/features/upscaling/README.md +247 -0
- package/src/infrastructure/config/README.md +310 -0
- package/src/infrastructure/middleware/README.md +378 -0
- package/src/infrastructure/orchestration/README.md +362 -0
- package/src/infrastructure/services/README.md +382 -0
- package/src/infrastructure/utils/README.md +523 -0
- package/src/infrastructure/wrappers/README.md +336 -0
- package/src/presentation/components/README.md +535 -0
- package/src/presentation/hooks/README.md +380 -0
- package/src/presentation/hooks/base/use-dual-image-feature.ts +4 -4
- package/src/presentation/hooks/base/use-image-with-prompt-feature.ts +4 -4
- package/src/presentation/hooks/base/utils/feature-state.factory.ts +1 -1
- package/src/presentation/layouts/README.md +374 -0
- package/src/presentation/layouts/types/layout-props.ts +1 -1
- package/src/presentation/screens/README.md +430 -0
|
@@ -0,0 +1,387 @@
|
|
|
1
|
+
# Prompts Domain
|
|
2
|
+
|
|
3
|
+
AI prompt management and generation system for AI features.
|
|
4
|
+
|
|
5
|
+
## Overview
|
|
6
|
+
|
|
7
|
+
The Prompts domain provides a comprehensive system for managing, generating, and templating AI prompts across all AI generation features. It includes services for prompt history, template management, and AI service processing.
|
|
8
|
+
|
|
9
|
+
## Features
|
|
10
|
+
|
|
11
|
+
- **Prompt Templates**: Pre-configured templates for various AI features
|
|
12
|
+
- **Prompt History**: Track and manage generated prompts
|
|
13
|
+
- **AI Service Processing**: Process prompts through AI services
|
|
14
|
+
- **Type Safety**: Full TypeScript support with comprehensive types
|
|
15
|
+
- **Extensible**: Easy to add new templates and services
|
|
16
|
+
|
|
17
|
+
## Installation
|
|
18
|
+
|
|
19
|
+
This domain is part of `@umituz/react-native-ai-generation-content`.
|
|
20
|
+
|
|
21
|
+
```bash
|
|
22
|
+
npm install @umituz/react-native-ai-generation-content
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Core Components
|
|
26
|
+
|
|
27
|
+
### Entities
|
|
28
|
+
|
|
29
|
+
#### AIPromptTemplate
|
|
30
|
+
|
|
31
|
+
Base template for AI prompts:
|
|
32
|
+
|
|
33
|
+
```tsx
|
|
34
|
+
import { AIPromptTemplate } from '@umituz/react-native-ai-generation-content';
|
|
35
|
+
|
|
36
|
+
const template: AIPromptTemplate = {
|
|
37
|
+
id: 'text-to-image-default',
|
|
38
|
+
name: 'Default Text to Image',
|
|
39
|
+
template: 'Create an image of {description}',
|
|
40
|
+
variables: ['description'],
|
|
41
|
+
category: 'image-generation',
|
|
42
|
+
};
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
#### GeneratedPrompt
|
|
46
|
+
|
|
47
|
+
Represents a generated prompt:
|
|
48
|
+
|
|
49
|
+
```tsx
|
|
50
|
+
import { GeneratedPrompt } from '@umituz/react-native-ai-generation-content';
|
|
51
|
+
|
|
52
|
+
const generatedPrompt: GeneratedPrompt = {
|
|
53
|
+
id: 'prompt-123',
|
|
54
|
+
templateId: 'text-to-image-default',
|
|
55
|
+
content: 'Create an image of a beautiful sunset',
|
|
56
|
+
variables: {
|
|
57
|
+
description: 'a beautiful sunset',
|
|
58
|
+
},
|
|
59
|
+
createdAt: new Date(),
|
|
60
|
+
};
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
#### Feature-Specific Configs
|
|
64
|
+
|
|
65
|
+
##### FaceSwapConfig
|
|
66
|
+
|
|
67
|
+
```tsx
|
|
68
|
+
import { FaceSwapConfig } from '@umituz/react-native-ai-generation-content';
|
|
69
|
+
|
|
70
|
+
const config: FaceSwapConfig = {
|
|
71
|
+
enhanceFace: true,
|
|
72
|
+
matchSkinTone: true,
|
|
73
|
+
};
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
##### PhotoRestorationConfig
|
|
77
|
+
|
|
78
|
+
```tsx
|
|
79
|
+
import { PhotoRestorationConfig } from '@umituz/react-native-ai-generation-content';
|
|
80
|
+
|
|
81
|
+
const config: PhotoRestorationConfig = {
|
|
82
|
+
removeScratches: true,
|
|
83
|
+
fixBlur: true,
|
|
84
|
+
colorize: false,
|
|
85
|
+
};
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
##### StyleTransferConfig
|
|
89
|
+
|
|
90
|
+
```tsx
|
|
91
|
+
import { StyleTransferConfig } from '@umituz/react-native-ai-generation-content';
|
|
92
|
+
|
|
93
|
+
const config: StyleTransferConfig = {
|
|
94
|
+
style: 'oil-painting',
|
|
95
|
+
intensity: 0.8,
|
|
96
|
+
};
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
##### TextGenerationConfig
|
|
100
|
+
|
|
101
|
+
```tsx
|
|
102
|
+
import { TextGenerationConfig } from '@umituz/react-native-ai-generation-content';
|
|
103
|
+
|
|
104
|
+
const config: TextGenerationConfig = {
|
|
105
|
+
model: 'gpt-4',
|
|
106
|
+
temperature: 0.7,
|
|
107
|
+
maxTokens: 1000,
|
|
108
|
+
};
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
### Hooks
|
|
112
|
+
|
|
113
|
+
#### usePromptGeneration
|
|
114
|
+
|
|
115
|
+
Generate prompts from templates:
|
|
116
|
+
|
|
117
|
+
```tsx
|
|
118
|
+
import { usePromptGeneration } from '@umituz/react-native-ai-generation-content';
|
|
119
|
+
|
|
120
|
+
function MyComponent() {
|
|
121
|
+
const { generatePrompt, isGenerating, error } = usePromptGeneration();
|
|
122
|
+
|
|
123
|
+
const handleGenerate = async () => {
|
|
124
|
+
const prompt = await generatePrompt({
|
|
125
|
+
templateId: 'text-to-image-default',
|
|
126
|
+
variables: {
|
|
127
|
+
description: 'a majestic mountain landscape',
|
|
128
|
+
},
|
|
129
|
+
});
|
|
130
|
+
console.log('Generated prompt:', prompt);
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
return <Button onPress={handleGenerate} title="Generate Prompt" />;
|
|
134
|
+
}
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
#### useTemplateRepository
|
|
138
|
+
|
|
139
|
+
Manage prompt templates:
|
|
140
|
+
|
|
141
|
+
```tsx
|
|
142
|
+
import { useTemplateRepository } from '@umituz/react-native-ai-generation-content';
|
|
143
|
+
|
|
144
|
+
function TemplateManager() {
|
|
145
|
+
const { templates, addTemplate, updateTemplate, deleteTemplate } = useTemplateRepository();
|
|
146
|
+
|
|
147
|
+
const handleAddTemplate = async () => {
|
|
148
|
+
await addTemplate({
|
|
149
|
+
id: 'custom-template',
|
|
150
|
+
name: 'Custom Template',
|
|
151
|
+
template: 'Generate {style} image of {subject}',
|
|
152
|
+
variables: ['style', 'subject'],
|
|
153
|
+
category: 'custom',
|
|
154
|
+
});
|
|
155
|
+
};
|
|
156
|
+
|
|
157
|
+
return (
|
|
158
|
+
<View>
|
|
159
|
+
{templates.map(template => (
|
|
160
|
+
<Text key={template.id}>{template.name}</Text>
|
|
161
|
+
))}
|
|
162
|
+
<Button onPress={handleAddTemplate} title="Add Template" />
|
|
163
|
+
</View>
|
|
164
|
+
);
|
|
165
|
+
}
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
#### useFaceSwap
|
|
169
|
+
|
|
170
|
+
Face swap specific prompt generation:
|
|
171
|
+
|
|
172
|
+
```tsx
|
|
173
|
+
import { useFaceSwap } from '@umituz/react-native-ai-generation-content';
|
|
174
|
+
|
|
175
|
+
function FaceSwapComponent() {
|
|
176
|
+
const { generatePrompt, config } = useFaceSwap({
|
|
177
|
+
enhanceFace: true,
|
|
178
|
+
matchSkinTone: true,
|
|
179
|
+
});
|
|
180
|
+
|
|
181
|
+
const handleGenerate = async () => {
|
|
182
|
+
const prompt = await generatePrompt({
|
|
183
|
+
sourceImage: 'base64...',
|
|
184
|
+
targetImage: 'base64...',
|
|
185
|
+
});
|
|
186
|
+
};
|
|
187
|
+
}
|
|
188
|
+
```
|
|
189
|
+
|
|
190
|
+
#### usePhotoRestoration
|
|
191
|
+
|
|
192
|
+
Photo restoration prompt generation:
|
|
193
|
+
|
|
194
|
+
```tsx
|
|
195
|
+
import { usePhotoRestoration } from '@umituz/react-native-ai-generation-content';
|
|
196
|
+
|
|
197
|
+
const { generatePrompt } = usePhotoRestoration({
|
|
198
|
+
removeScratches: true,
|
|
199
|
+
fixBlur: true,
|
|
200
|
+
});
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
#### useStyleTransfer
|
|
204
|
+
|
|
205
|
+
Style transfer prompt generation:
|
|
206
|
+
|
|
207
|
+
```tsx
|
|
208
|
+
import { useStyleTransfer } from '@umituz/react-native-ai-generation-content';
|
|
209
|
+
|
|
210
|
+
const { generatePrompt } = useStyleTransfer({
|
|
211
|
+
style: 'oil-painting',
|
|
212
|
+
intensity: 0.8,
|
|
213
|
+
});
|
|
214
|
+
```
|
|
215
|
+
|
|
216
|
+
#### useImageEnhancement
|
|
217
|
+
|
|
218
|
+
Image enhancement prompt generation:
|
|
219
|
+
|
|
220
|
+
```tsx
|
|
221
|
+
import { useImageEnhancement } from '@umituz/react-native-ai-generation-content';
|
|
222
|
+
|
|
223
|
+
const { generatePrompt } = useImageEnhancement({
|
|
224
|
+
enhanceDetails: true,
|
|
225
|
+
adjustColors: true,
|
|
226
|
+
});
|
|
227
|
+
```
|
|
228
|
+
|
|
229
|
+
### Services
|
|
230
|
+
|
|
231
|
+
#### PromptGenerationService
|
|
232
|
+
|
|
233
|
+
Core service for generating prompts:
|
|
234
|
+
|
|
235
|
+
```tsx
|
|
236
|
+
import { PromptGenerationService } from '@umituz/react-native-ai-generation-content';
|
|
237
|
+
|
|
238
|
+
const service = new PromptGenerationService();
|
|
239
|
+
|
|
240
|
+
const prompt = await service.generatePrompt({
|
|
241
|
+
templateId: 'text-to-image-default',
|
|
242
|
+
variables: { description: 'beautiful sunset' },
|
|
243
|
+
});
|
|
244
|
+
```
|
|
245
|
+
|
|
246
|
+
#### AIServiceProcessor
|
|
247
|
+
|
|
248
|
+
Process prompts through AI services:
|
|
249
|
+
|
|
250
|
+
```tsx
|
|
251
|
+
import { AIServiceProcessor } from '@umituz/react-native-ai-generation-content';
|
|
252
|
+
|
|
253
|
+
const processor = new AIServiceProcessor({
|
|
254
|
+
apiKey: 'your-api-key',
|
|
255
|
+
provider: 'openai',
|
|
256
|
+
});
|
|
257
|
+
|
|
258
|
+
const result = await processor.processPrompt({
|
|
259
|
+
prompt: 'Create an image of...',
|
|
260
|
+
service: 'text-to-image',
|
|
261
|
+
});
|
|
262
|
+
```
|
|
263
|
+
|
|
264
|
+
### Repositories
|
|
265
|
+
|
|
266
|
+
#### TemplateRepository
|
|
267
|
+
|
|
268
|
+
Manage prompt templates:
|
|
269
|
+
|
|
270
|
+
```tsx
|
|
271
|
+
import { TemplateRepository } from '@umituz/react-native-ai-generation-content';
|
|
272
|
+
|
|
273
|
+
const repository = new TemplateRepository();
|
|
274
|
+
|
|
275
|
+
// Get all templates
|
|
276
|
+
const templates = await repository.getAll();
|
|
277
|
+
|
|
278
|
+
// Get template by ID
|
|
279
|
+
const template = await repository.getById('text-to-image-default');
|
|
280
|
+
|
|
281
|
+
// Save template
|
|
282
|
+
await repository.save(template);
|
|
283
|
+
|
|
284
|
+
// Delete template
|
|
285
|
+
await repository.delete('text-to-image-default');
|
|
286
|
+
```
|
|
287
|
+
|
|
288
|
+
#### PromptHistoryRepository
|
|
289
|
+
|
|
290
|
+
Track prompt generation history:
|
|
291
|
+
|
|
292
|
+
```tsx
|
|
293
|
+
import { PromptHistoryRepository } from '@umituz/react-native-ai-generation-content';
|
|
294
|
+
|
|
295
|
+
const repository = new PromptHistoryRepository();
|
|
296
|
+
|
|
297
|
+
// Add to history
|
|
298
|
+
await repository.add({
|
|
299
|
+
promptId: 'prompt-123',
|
|
300
|
+
content: 'Create an image...',
|
|
301
|
+
createdAt: new Date(),
|
|
302
|
+
});
|
|
303
|
+
|
|
304
|
+
// Get history
|
|
305
|
+
const history = await repository.getHistory({ limit: 10 });
|
|
306
|
+
|
|
307
|
+
// Clear history
|
|
308
|
+
await repository.clear();
|
|
309
|
+
```
|
|
310
|
+
|
|
311
|
+
## Sample Prompts
|
|
312
|
+
|
|
313
|
+
Pre-configured example prompts:
|
|
314
|
+
|
|
315
|
+
```tsx
|
|
316
|
+
import {
|
|
317
|
+
DEFAULT_TEXT_TO_IMAGE_PROMPTS,
|
|
318
|
+
DEFAULT_TEXT_TO_VOICE_PROMPTS,
|
|
319
|
+
} from '@umituz/react-native-ai-generation-content';
|
|
320
|
+
|
|
321
|
+
// Text to image prompts
|
|
322
|
+
DEFAULT_TEXT_TO_IMAGE_PROMPTS.forEach(prompt => {
|
|
323
|
+
console.log(prompt.id, prompt.fallbackText);
|
|
324
|
+
// Output:
|
|
325
|
+
// sunset, "A beautiful sunset over mountains with vibrant colors"
|
|
326
|
+
// cityscape, "Futuristic cityscape at night with neon lights"
|
|
327
|
+
// ...
|
|
328
|
+
});
|
|
329
|
+
|
|
330
|
+
// Text to voice prompts
|
|
331
|
+
DEFAULT_TEXT_TO_VOICE_PROMPTS.forEach(prompt => {
|
|
332
|
+
console.log(prompt.id, prompt.fallbackText);
|
|
333
|
+
// Output:
|
|
334
|
+
// welcome, "Welcome to our amazing product!..."
|
|
335
|
+
// story, "Once upon a time..."
|
|
336
|
+
// ...
|
|
337
|
+
});
|
|
338
|
+
```
|
|
339
|
+
|
|
340
|
+
## Custom Templates
|
|
341
|
+
|
|
342
|
+
Create custom prompt templates:
|
|
343
|
+
|
|
344
|
+
```tsx
|
|
345
|
+
import { AIPromptTemplate } from '@umituz/react-native-ai-generation-content';
|
|
346
|
+
|
|
347
|
+
const customTemplate: AIPromptTemplate = {
|
|
348
|
+
id: 'my-custom-template',
|
|
349
|
+
name: 'My Custom Template',
|
|
350
|
+
template: 'Create a {style} image of {subject} with {mood} mood',
|
|
351
|
+
variables: ['style', 'subject', 'mood'],
|
|
352
|
+
category: 'custom',
|
|
353
|
+
metadata: {
|
|
354
|
+
author: 'Your Name',
|
|
355
|
+
version: '1.0.0',
|
|
356
|
+
},
|
|
357
|
+
};
|
|
358
|
+
|
|
359
|
+
// Use custom template
|
|
360
|
+
const prompt = await generatePrompt({
|
|
361
|
+
templateId: 'my-custom-template',
|
|
362
|
+
variables: {
|
|
363
|
+
style: 'realistic',
|
|
364
|
+
subject: 'a cat',
|
|
365
|
+
mood: 'playful',
|
|
366
|
+
},
|
|
367
|
+
});
|
|
368
|
+
// Result: "Create a realistic image of a cat with playful mood"
|
|
369
|
+
```
|
|
370
|
+
|
|
371
|
+
## Best Practices
|
|
372
|
+
|
|
373
|
+
1. **Template Organization**: Group templates by category for easy management
|
|
374
|
+
2. **Variable Naming**: Use clear, descriptive variable names
|
|
375
|
+
3. **Prompt History**: Track prompt generation for analytics and debugging
|
|
376
|
+
4. **Error Handling**: Always handle errors gracefully
|
|
377
|
+
5. **Type Safety**: Leverage TypeScript types for type safety
|
|
378
|
+
|
|
379
|
+
## Related Features
|
|
380
|
+
|
|
381
|
+
- [Content Moderation](../content-moderation) - Moderate generated content
|
|
382
|
+
- [Face Detection](../face-detection) - Detect faces in images
|
|
383
|
+
- [Creations](../creations) - Manage AI-generated creations
|
|
384
|
+
|
|
385
|
+
## License
|
|
386
|
+
|
|
387
|
+
MIT
|
|
@@ -0,0 +1,276 @@
|
|
|
1
|
+
# AI Hug
|
|
2
|
+
|
|
3
|
+
Generate AI-powered hug images between two people.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- Create realistic hug images from two photos
|
|
8
|
+
- Automatic pose and body detection
|
|
9
|
+
- Natural arm positioning and embrace
|
|
10
|
+
- Support for various hug types
|
|
11
|
+
- High-quality facial matching
|
|
12
|
+
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
This feature is part of `@umituz/react-native-ai-generation-content`.
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
npm install @umituz/react-native-ai-generation-content
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Basic Usage
|
|
22
|
+
|
|
23
|
+
### Using the Hook
|
|
24
|
+
|
|
25
|
+
```tsx
|
|
26
|
+
import { useAIHugFeature } from '@umituz/react-native-ai-generation-content';
|
|
27
|
+
import * as ImagePicker from 'react-native-image-picker';
|
|
28
|
+
|
|
29
|
+
function AIHugScreen() {
|
|
30
|
+
const [person1, setPerson1] = useState<string | null>(null);
|
|
31
|
+
const [person2, setPerson2] = useState<string | null>(null);
|
|
32
|
+
|
|
33
|
+
const feature = useAIHugFeature({
|
|
34
|
+
config: {
|
|
35
|
+
hugType: 'romantic',
|
|
36
|
+
onProcessingStart: () => console.log('Generating hug...'),
|
|
37
|
+
onProcessingComplete: (result) => console.log('Complete:', result),
|
|
38
|
+
onError: (error) => console.error('Error:', error),
|
|
39
|
+
},
|
|
40
|
+
onSelectPerson1: async () => {
|
|
41
|
+
const result = await ImagePicker.launchImageLibrary({ mediaType: 'photo' });
|
|
42
|
+
if (result.assets && result.assets[0].uri) {
|
|
43
|
+
const base64 = await convertToBase64(result.assets[0].uri);
|
|
44
|
+
setPerson1(base64);
|
|
45
|
+
return base64;
|
|
46
|
+
}
|
|
47
|
+
return null;
|
|
48
|
+
},
|
|
49
|
+
onSelectPerson2: async () => {
|
|
50
|
+
const result = await ImagePicker.launchImageLibrary({ mediaType: 'photo' });
|
|
51
|
+
if (result.assets && result.assets[0].uri) {
|
|
52
|
+
const base64 = await convertToBase64(result.assets[0].uri);
|
|
53
|
+
setPerson2(base64);
|
|
54
|
+
return base64;
|
|
55
|
+
}
|
|
56
|
+
return null;
|
|
57
|
+
},
|
|
58
|
+
onSaveResult: async (imageUrl) => {
|
|
59
|
+
await saveToGallery(imageUrl);
|
|
60
|
+
},
|
|
61
|
+
});
|
|
62
|
+
|
|
63
|
+
return (
|
|
64
|
+
<View>
|
|
65
|
+
<DualImagePicker
|
|
66
|
+
sourceImage={person1}
|
|
67
|
+
targetImage={person2}
|
|
68
|
+
onSelectSourceImage={feature.selectPerson1}
|
|
69
|
+
onSelectTargetImage={feature.selectPerson2}
|
|
70
|
+
sourceLabel="Person 1"
|
|
71
|
+
targetLabel="Person 2"
|
|
72
|
+
/>
|
|
73
|
+
|
|
74
|
+
<HugTypeSelector
|
|
75
|
+
selectedType={feature.state.hugType}
|
|
76
|
+
onSelectType={feature.setHugType}
|
|
77
|
+
/>
|
|
78
|
+
|
|
79
|
+
<Button
|
|
80
|
+
title="Generate AI Hug"
|
|
81
|
+
onPress={feature.process}
|
|
82
|
+
disabled={!feature.isReady || feature.state.isProcessing}
|
|
83
|
+
/>
|
|
84
|
+
|
|
85
|
+
{feature.state.isProcessing && (
|
|
86
|
+
<View>
|
|
87
|
+
<Text>Creating your hug image...</Text>
|
|
88
|
+
<ProgressBar progress={feature.state.progress} />
|
|
89
|
+
</View>
|
|
90
|
+
)}
|
|
91
|
+
|
|
92
|
+
{feature.state.result && (
|
|
93
|
+
<Image source={{ uri: feature.state.result.imageUrl }} />
|
|
94
|
+
)}
|
|
95
|
+
</View>
|
|
96
|
+
);
|
|
97
|
+
}
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
### Using the Unified AI Feature Screen
|
|
101
|
+
|
|
102
|
+
```tsx
|
|
103
|
+
import { AIFeatureScreen } from '@umituz/react-native-ai-generation-content';
|
|
104
|
+
|
|
105
|
+
function App() {
|
|
106
|
+
return (
|
|
107
|
+
<AIFeatureScreen
|
|
108
|
+
featureId="ai-hug"
|
|
109
|
+
userId="user-123"
|
|
110
|
+
/>
|
|
111
|
+
);
|
|
112
|
+
}
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
## Configuration Options
|
|
116
|
+
|
|
117
|
+
### Feature Config
|
|
118
|
+
|
|
119
|
+
```tsx
|
|
120
|
+
interface AIHugFeatureConfig {
|
|
121
|
+
hugType?: 'romantic' | 'friendly' | 'family' | 'cute';
|
|
122
|
+
onProcessingStart?: () => void;
|
|
123
|
+
onProcessingComplete?: (result: AIHugResult) => void;
|
|
124
|
+
onError?: (error: string) => void;
|
|
125
|
+
}
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
### Generation Options
|
|
129
|
+
|
|
130
|
+
```tsx
|
|
131
|
+
interface AIHugOptions {
|
|
132
|
+
hugType: 'romantic' | 'friendly' | 'family' | 'cute';
|
|
133
|
+
preserveFaces?: boolean; // Maintain facial features (default: true)
|
|
134
|
+
enhanceQuality?: boolean; // Enhance output quality (default: true)
|
|
135
|
+
}
|
|
136
|
+
```
|
|
137
|
+
|
|
138
|
+
## Hug Types
|
|
139
|
+
|
|
140
|
+
### Romantic Hug
|
|
141
|
+
|
|
142
|
+
```tsx
|
|
143
|
+
const result = await feature.process({
|
|
144
|
+
hugType: 'romantic',
|
|
145
|
+
});
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
### Friendly Hug
|
|
149
|
+
|
|
150
|
+
```tsx
|
|
151
|
+
const result = await feature.process({
|
|
152
|
+
hugType: 'friendly',
|
|
153
|
+
});
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
### Family Hug
|
|
157
|
+
|
|
158
|
+
```tsx
|
|
159
|
+
const result = await feature.process({
|
|
160
|
+
hugType: 'family',
|
|
161
|
+
});
|
|
162
|
+
```
|
|
163
|
+
|
|
164
|
+
### Cute Hug
|
|
165
|
+
|
|
166
|
+
```tsx
|
|
167
|
+
const result = await feature.process({
|
|
168
|
+
hugType: 'cute',
|
|
169
|
+
});
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
## Usage Flow
|
|
173
|
+
|
|
174
|
+
1. Select **Person 1** - Choose the first person's photo
|
|
175
|
+
2. Select **Person 2** - Choose the second person's photo
|
|
176
|
+
3. Choose **Hug Type** - Select the style of hug
|
|
177
|
+
4. Tap **Generate** - Start the AI generation
|
|
178
|
+
5. View Result - See the generated hug image
|
|
179
|
+
6. Save or Share - Save to gallery or share
|
|
180
|
+
|
|
181
|
+
## Component Examples
|
|
182
|
+
|
|
183
|
+
### Hug Type Selector
|
|
184
|
+
|
|
185
|
+
```tsx
|
|
186
|
+
import { StylePresetsGrid } from '@umituz/react-native-ai-generation-content';
|
|
187
|
+
|
|
188
|
+
const hugTypes = [
|
|
189
|
+
{ id: 'romantic', name: 'Romantic', preview: '...' },
|
|
190
|
+
{ id: 'friendly', name: 'Friendly', preview: '...' },
|
|
191
|
+
{ id: 'family', name: 'Family', preview: '...' },
|
|
192
|
+
{ id: 'cute', name: 'Cute', preview: '...' },
|
|
193
|
+
];
|
|
194
|
+
|
|
195
|
+
<StylePresetsGrid
|
|
196
|
+
styles={hugTypes}
|
|
197
|
+
selectedStyle={selectedHugType}
|
|
198
|
+
onSelectStyle={setSelectedHugType}
|
|
199
|
+
/>
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
### Result Display with Actions
|
|
203
|
+
|
|
204
|
+
```tsx
|
|
205
|
+
import { ResultImageCard } from '@umituz/react-native-ai-generation-content';
|
|
206
|
+
|
|
207
|
+
{feature.state.result && (
|
|
208
|
+
<ResultImageCard
|
|
209
|
+
imageUrl={feature.state.result.imageUrl}
|
|
210
|
+
onSave={() => feature.saveResult()}
|
|
211
|
+
onShare={() => shareImage(feature.state.result.imageUrl)}
|
|
212
|
+
onRegenerate={() => feature.process()}
|
|
213
|
+
/>
|
|
214
|
+
)}
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
## Best Practices
|
|
218
|
+
|
|
219
|
+
1. **Photo Quality**: Use high-quality, well-lit photos
|
|
220
|
+
2. **Full Body**: Photos showing full body work best
|
|
221
|
+
3. **Facing Forward**: Forward-facing photos produce better results
|
|
222
|
+
4. **Clear Faces**: Ensure both faces are clearly visible
|
|
223
|
+
5. **Similar Lighting**: Similar lighting in both photos creates more natural results
|
|
224
|
+
|
|
225
|
+
## Use Cases
|
|
226
|
+
|
|
227
|
+
### Couple Photos
|
|
228
|
+
|
|
229
|
+
```tsx
|
|
230
|
+
// Create romantic hug images for couples
|
|
231
|
+
const result = await feature.process({
|
|
232
|
+
hugType: 'romantic',
|
|
233
|
+
preserveFaces: true,
|
|
234
|
+
});
|
|
235
|
+
```
|
|
236
|
+
|
|
237
|
+
### Family Moments
|
|
238
|
+
|
|
239
|
+
```tsx
|
|
240
|
+
// Generate family hug photos
|
|
241
|
+
const result = await feature.process({
|
|
242
|
+
hugType: 'family',
|
|
243
|
+
enhanceQuality: true,
|
|
244
|
+
});
|
|
245
|
+
```
|
|
246
|
+
|
|
247
|
+
### Fun with Friends
|
|
248
|
+
|
|
249
|
+
```tsx
|
|
250
|
+
// Create fun hug images with friends
|
|
251
|
+
const result = await feature.process({
|
|
252
|
+
hugType: 'friendly',
|
|
253
|
+
});
|
|
254
|
+
```
|
|
255
|
+
|
|
256
|
+
## Error Handling
|
|
257
|
+
|
|
258
|
+
```tsx
|
|
259
|
+
const { state, process } = useAIHugFeature({ ...config });
|
|
260
|
+
|
|
261
|
+
useEffect(() => {
|
|
262
|
+
if (state.error) {
|
|
263
|
+
Alert.alert('Generation Failed', state.error);
|
|
264
|
+
}
|
|
265
|
+
}, [state.error]);
|
|
266
|
+
```
|
|
267
|
+
|
|
268
|
+
## Related Features
|
|
269
|
+
|
|
270
|
+
- [AI Kiss](../ai-kiss) - Generate AI kiss images
|
|
271
|
+
- [Couple Future](../couple-future) - Generate future couple predictions
|
|
272
|
+
- [Face Swap](../face-swap) - Swap faces between images
|
|
273
|
+
|
|
274
|
+
## License
|
|
275
|
+
|
|
276
|
+
MIT
|