@umituz/react-native-ai-generation-content 1.20.5 → 1.20.6

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.
@@ -1,400 +0,0 @@
1
- # Style Transfer Feature
2
-
3
- Apply artistic styles to images using AI.
4
-
5
- ## 📍 Import Path
6
-
7
- ```typescript
8
- import { useStyleTransferFeature } from '@umituz/react-native-ai-generation-content';
9
- ```
10
-
11
- **Location**: `src/features/style-transfer/`
12
-
13
- ## 🎯 Feature Purpose
14
-
15
- Transform photos into artistic artwork using AI style transfer. Apply various artistic styles like oil painting, watercolor, sketch, and more while preserving image content.
16
-
17
- ---
18
-
19
- ## 📋 Usage Strategy
20
-
21
- ### When to Use This Feature
22
-
23
- ✅ **Use Cases:**
24
- - Creating artistic versions of photos
25
- - Applying famous painting styles
26
- - Generating unique artwork
27
- - Social media creative content
28
- - Artistic experimentation
29
-
30
- ❌ **When NOT to Use:**
31
- - Anime style conversion (use Anime Selfie)
32
- - Photo restoration (use Photo Restoration)
33
- - Image filters and basic edits (use image editing software)
34
- - Background removal (use Remove Background)
35
-
36
- ### Implementation Strategy
37
-
38
- 1. **Select image** to stylize
39
- 2. **Choose artistic style** (painting, sketch, watercolor, etc.)
40
- 3. **Adjust intensity** level (0.0 to 1.0)
41
- 4. **Apply style transfer** with progress tracking
42
- 5. **Preview and compare** with original
43
- 6. **Save or share** artwork
44
-
45
- ---
46
-
47
- ## ⚠️ Critical Rules (MUST FOLLOW)
48
-
49
- ### 1. Image Requirements
50
- - **MUST** provide ONE image to stylize
51
- - **MUST** use clear, reasonably high-quality photos
52
- - **MUST** have recognizable content
53
- - **MUST** use reasonable resolution (min 512x512)
54
- - **MUST NOT** exceed file size limits (10MB max)
55
-
56
- ### 2. Configuration
57
- - **MUST** provide valid `userId` for tracking
58
- - **MUST** specify `style` (artistic style type)
59
- - **MUST** set `intensity` level (0.0 to 1.0)
60
- - **MUST** implement `onError` callback
61
- - **MUST** implement `onSelectImage` callback
62
-
63
- ### 3. State Management
64
- - **MUST** check `isReady` before enabling apply button
65
- - **MUST** display progress during style transfer
66
- - **MUST** handle long processing times
67
- - **MUST** display `error` state with clear messages
68
- - **MUST** implement proper cleanup on unmount
69
-
70
- ### 4. Performance
71
- - **MUST** implement image compression before upload
72
- - **MUST** show progress indicator for processing
73
- - **MUST** cache results locally
74
- - **MUST** allow users to cancel processing
75
- - **MUST NOT** stylize multiple images simultaneously
76
-
77
- ### 5. Content Quality
78
- - **MUST** provide before/after comparison
79
- - **MUST** allow intensity adjustment
80
- - **MUST** handle various image types
81
- - **MUST** preserve important details when enabled
82
- - **MUST** offer style regeneration
83
-
84
- ---
85
-
86
- ## 🚫 Prohibitions (MUST AVOID)
87
-
88
- ### Strictly Forbidden
89
-
90
- ❌ **NEVER** do the following:
91
-
92
- 1. **No Missing Images**
93
- - Always validate image is selected
94
- - Never call process() without image
95
-
96
- 2. **No Auto-Processing**
97
- - Never start transfer without user action
98
- - Always require explicit "Apply Style" button press
99
- - Show preview before processing
100
-
101
- 3. **No Hardcoded Credentials**
102
- - Never store API keys in component files
103
- - Use environment variables or secure storage
104
-
105
- 4. **No Unhandled Errors**
106
- - Never ignore transfer failures
107
- - Always explain what went wrong
108
- - Provide retry or alternative options
109
-
110
- 5. **No Memory Leaks**
111
- - Never store both original and stylized large images simultaneously
112
- - Clean up temporary images
113
- - Implement proper image disposal
114
-
115
- 6. **No Blocked UI**
116
- - Never block main thread with image processing
117
- - Always show progress indicator
118
- - Allow cancellation
119
-
120
- 7. **No Copyright Issues**
121
- - Never claim copyrighted artwork as original
122
- - Allow artistic style transformation only
123
- - Implement proper attribution
124
-
125
- ---
126
-
127
- ## 🤖 AI Agent Directions
128
-
129
- ### For AI Code Generation Tools
130
-
131
- When using this feature with AI code generation tools, follow these guidelines:
132
-
133
- #### Prompt Template for AI Agents
134
-
135
- ```
136
- You are implementing a style transfer feature using @umituz/react-native-ai-generation-content.
137
-
138
- REQUIREMENTS:
139
- 1. Import from: @umituz/react-native-ai-generation-content
140
- 2. Use the useStyleTransferFeature hook
141
- 3. Select artistic style type
142
- 4. Implement image selection UI
143
- 5. Adjust intensity level (0.0 to 1.0)
144
- 6. Validate image before transfer
145
- 7. Show before/after comparison
146
- 8. Handle long processing times with progress
147
- 9. Implement proper error handling
148
- 10. Implement cleanup on unmount
149
-
150
- CRITICAL RULES:
151
- - MUST validate image before calling apply()
152
- - MUST show before/after comparison
153
- - MUST handle intensity adjustment
154
- - MUST preserve important details when enabled
155
- - MUST implement debouncing (300ms)
156
- - MUST allow style regeneration
157
-
158
- CONFIGURATION:
159
- - Provide valid userId (string)
160
- - Set style: 'oil-painting' | 'watercolor' | 'sketch' | 'impressionist' | 'pop-art'
161
- - Set intensity: 0.0 to 1.0 (default: 0.8)
162
- - Implement onSelectImage callback
163
- - Implement onSaveResult callback
164
- - Configure callbacks: onProcessingStart, onProcessingComplete, onError
165
-
166
- OPTIONS:
167
- - style: Select artistic style type
168
- - intensity: 0.0 (subtle) to 1.0 (full style)
169
- - preserveDetails: boolean (maintain important details)
170
-
171
- STRICTLY FORBIDDEN:
172
- - No missing image validation
173
- - No auto-processing without user action
174
- - No hardcoded API keys
175
- - No unhandled errors
176
- - No memory leaks
177
- - No blocking UI
178
- - No copyright violations
179
-
180
- QUALITY CHECKLIST:
181
- - [ ] Image selection implemented
182
- - [ ] Style selector added
183
- - [ ] Intensity slider included
184
- - [ ] Before/after comparison view
185
- - [ ] Progress indicator during processing
186
- - [ ] Error display with retry option
187
- - [ ] Download/share functionality
188
- - [ ] Style regeneration option
189
- ```
190
-
191
- #### AI Implementation Checklist
192
-
193
- Use this checklist when generating code:
194
-
195
- - [ ] Feature imported from correct path
196
- - [ ] Image selection implemented
197
- - [ ] Style selector added
198
- - [ ] Intensity control implemented
199
- - [ ] Validation before apply()
200
- - [ ] Before/after comparison view
201
- - [ ] Progress indicator during processing
202
- - [ ] Error display with user-friendly message
203
- - [ ] Download/share buttons
204
- - [ ] Style regeneration option
205
- - [ ] Cleanup on unmount
206
- - [ ] Original image preserved
207
-
208
- ---
209
-
210
- ## 🛠️ Configuration Strategy
211
-
212
- ### Essential Configuration
213
-
214
- ```typescript
215
- // Required fields
216
- {
217
- userId: string
218
- style: 'oil-painting' | 'watercolor' | 'sketch' | 'impressionist' | 'pop-art'
219
- intensity: number // 0.0 to 1.0
220
- onSelectImage: () => Promise<string | null>
221
- }
222
-
223
- // Optional callbacks
224
- {
225
- onProcessingStart?: () => void
226
- onProcessingComplete?: (result) => void
227
- onError?: (error: string) => void
228
- }
229
- ```
230
-
231
- ### Recommended Settings
232
-
233
- 1. **Artistic Styles**
234
- - Oil Painting: Classic oil painting style
235
- - Watercolor: Soft, transparent watercolor
236
- - Sketch: Pencil or charcoal drawing
237
- - Impressionist: Impressionist painting style
238
- - Pop Art: Bold, colorful pop art
239
-
240
- 2. **Intensity Levels**
241
- - 0.3-0.5: Subtle artistic influence
242
- - 0.6-0.8: Balanced transformation (recommended)
243
- - 0.9-1.0: Full artistic style
244
-
245
- 3. **Image Quality**
246
- - Minimum: 512x512 resolution
247
- - Recommended: 1024x1024 or higher
248
- - Format: JPEG or PNG
249
- - Max size: 10MB
250
-
251
- ---
252
-
253
- ## 📊 State Management
254
-
255
- ### Feature States
256
-
257
- **isReady**: boolean
258
- - Image selected and validated
259
- - Check before enabling apply button
260
-
261
- **isProcessing**: boolean
262
- - Style transfer in progress
263
- - Show loading/progress indicator
264
- - Disable apply button
265
-
266
- **progress**: number (0-100)
267
- - Transfer progress percentage
268
- - Update progress bar
269
-
270
- **error**: string | null
271
- - Error message if transfer failed
272
- - Display to user with clear message
273
-
274
- **result**: {
275
- imageUrl: string
276
- originalImageUrl?: string
277
- style?: string
278
- intensity?: number
279
- metadata?: any
280
- }
281
-
282
- ---
283
-
284
- ## 🎨 Best Practices
285
-
286
- ### Image Selection
287
-
288
- 1. **Image Quality**
289
- - Good: Clear, well-composed photos
290
- - Bad: Blurry, cluttered images
291
-
292
- 2. **Style Matching**
293
- - Match style to image content
294
- - Consider subject matter for style
295
- - Landscape vs portrait considerations
296
-
297
- 3. **Intensity**
298
- - Start with moderate intensity (0.7-0.8)
299
- - Adjust based on results
300
- - Lower intensity for subtle effects
301
-
302
- 4. **Content Preservation**
303
- - Enable detail preservation for important elements
304
- - Consider focal points in image
305
- - Balance style vs content
306
-
307
- ### User Experience
308
-
309
- 1. **Before/After Comparison**
310
- - Side-by-side comparison
311
- - Slider or toggle for easy comparison
312
- - Zoom capability for detail inspection
313
-
314
- 2. **Style Preview**
315
- - Show examples of each style
316
- - Preview style before applying
317
- - Explain style characteristics
318
-
319
- 3. **Progress Feedback**
320
- - Show estimated time remaining
321
- - Update progress regularly
322
- - Allow cancellation
323
-
324
- ---
325
-
326
- ## 🐛 Common Pitfalls
327
-
328
- ### Quality Issues
329
-
330
- ❌ **Problem**: Poor style transfer
331
- ✅ **Solution**: Use higher quality photos, try different style or intensity
332
-
333
- ### Style Issues
334
-
335
- ❌ **Problem**: Artistic style doesn't match image
336
- ✅ **Solution**: Try different style, adjust intensity, consider image content
337
-
338
- ### Performance Issues
339
-
340
- ❌ **Problem**: Slow processing
341
- ✅ **Solution**: Compress images, show progress, allow cancellation
342
-
343
- ### Memory Issues
344
-
345
- ❌ **Problem**: App crashes with large images
346
- ✅ **Solution**: Compress images, clean up properly, optimize memory
347
-
348
- ---
349
-
350
- ## 📦 Related Components
351
-
352
- Use these components from the library:
353
-
354
- - **PhotoUploadCard**: Upload image interface
355
- - **ResultDisplay**: Before/after comparison
356
- - **StyleSelector**: Choose artistic style
357
- - **IntensitySlider**: Adjust intensity
358
- - **ProgressBar**: Progress display
359
-
360
- Located at: `src/presentation/components/`
361
-
362
- ---
363
-
364
- ## 🔄 Migration Strategy
365
-
366
- If migrating from previous implementation:
367
-
368
- 1. **Update imports** to new path
369
- 2. **Add style selector**
370
- 3. **Implement intensity control**
371
- 4. **Update state handling** for new structure
372
- 5. **Add before/after comparison**
373
- 6. **Test all artistic styles**
374
-
375
- ---
376
-
377
- ## 📚 Additional Resources
378
-
379
- - Main documentation: `/docs/`
380
- - API reference: `/docs/api/`
381
- - Examples: `/docs/examples/basic/style-transfer/`
382
- - Architecture: `/ARCHITECTURE.md`
383
-
384
- ---
385
-
386
- **Last Updated**: 2025-01-08
387
- **Version**: 2.0.0 (Strategy-based Documentation)
388
-
389
- ---
390
-
391
- ## 📝 Changelog
392
-
393
- ### v2.0.0 - 2025-01-08
394
- - **BREAKING**: Documentation format changed to strategy-based
395
- - Removed extensive code examples
396
- - Added rules, prohibitions, and AI agent directions
397
- - Focus on best practices and implementation guidance
398
-
399
- ### v1.0.0 - Initial Release
400
- - Initial feature documentation
@@ -1,52 +0,0 @@
1
- /**
2
- * Style Transfer Domain Entities
3
- */
4
-
5
- export interface StyleTransferConfig {
6
- /**
7
- * Strength of the style application (0.0 to 1.0)
8
- * @default 1.0
9
- */
10
- strength?: number;
11
-
12
- /**
13
- * Preserve original colors
14
- * @default false
15
- */
16
- preserveColor?: boolean;
17
- }
18
-
19
- export interface StyleTransferRequest {
20
- /**
21
- * The content image to apply style TO.
22
- * Can be a Base64 string or a remote URL.
23
- */
24
- contentImage: string;
25
-
26
- /**
27
- * The style image references (Base64 or URL)
28
- */
29
- styleImage?: string;
30
-
31
- /**
32
- * Or a preset style ID (e.g. "van_gogh_starry_night")
33
- */
34
- stylePreset?: string;
35
-
36
- /**
37
- * Optional configuration
38
- */
39
- options?: StyleTransferConfig;
40
- }
41
-
42
- export interface StyleTransferResult {
43
- /**
44
- * The stylized image URL or Base64
45
- */
46
- imageUrl: string;
47
-
48
- /**
49
- * Metadata about the generation
50
- */
51
- metadata?: Record<string, unknown>;
52
- }
@@ -1 +0,0 @@
1
- export * from './domain/entities';