@umituz/react-native-photo-editor 2.0.16 → 2.0.19
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/package.json +1 -1
- package/skills/README.md +13 -0
- package/skills/SKILL.md +75 -0
package/package.json
CHANGED
package/skills/README.md
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
# React Native photo-editor Skills
|
|
2
|
+
|
|
3
|
+
Claude Code skills for `@umituz/react-native-photo-editor`.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npx skills add /Users/umituz/Desktop/github/umituz/apps/mobile/npm-packages/react-native-photo-editor/skills/SKILL.md -g
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
Say: **"Setup photo-editor in my app"**
|
package/skills/SKILL.md
ADDED
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: setup-react-native-photo-editor
|
|
3
|
+
description: Sets up photo editing capabilities for React Native apps with filters, adjustments, cropping, and transformations. Triggers on: Setup photo editor, image editing, photo filters, image cropping, usePhotoEditor, photo manipulation.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Setup React Native Photo Editor
|
|
7
|
+
|
|
8
|
+
Comprehensive setup for `@umituz/react-native-photo-editor` - Photo editing with filters, adjustments, and cropping.
|
|
9
|
+
|
|
10
|
+
## Overview
|
|
11
|
+
|
|
12
|
+
This skill handles photo editing integration:
|
|
13
|
+
- Package installation
|
|
14
|
+
- Photo editor component
|
|
15
|
+
- Image filters
|
|
16
|
+
- Adjustments (brightness, contrast, saturation)
|
|
17
|
+
- Cropping and transforming
|
|
18
|
+
- Export functionality
|
|
19
|
+
|
|
20
|
+
## Quick Start
|
|
21
|
+
|
|
22
|
+
Say: **"Setup photo editor in my app"**
|
|
23
|
+
|
|
24
|
+
## Step 1: Install
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
npm install @umituz/react-native-photo-editor@latest
|
|
28
|
+
npm install @umituz/react-native-design-system
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## Step 2: Use Photo Editor
|
|
32
|
+
|
|
33
|
+
```typescript
|
|
34
|
+
import { PhotoEditor } from '@umituz/react-native-photo-editor';
|
|
35
|
+
|
|
36
|
+
export function EditPhotoScreen({ route }) {
|
|
37
|
+
const { imageUri } = route.params;
|
|
38
|
+
|
|
39
|
+
const handleSave = async (editedUri: string) => {
|
|
40
|
+
await saveToGallery(editedUri);
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
return (
|
|
44
|
+
<PhotoEditor
|
|
45
|
+
imageUri={imageUri}
|
|
46
|
+
onSave={handleSave}
|
|
47
|
+
enableFilters={true}
|
|
48
|
+
enableAdjustments={true}
|
|
49
|
+
enableCrop={true}
|
|
50
|
+
enableTransform={true}
|
|
51
|
+
/>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
## Features
|
|
57
|
+
|
|
58
|
+
- **Filters** - Preset filters (vintage, noir, vivid, etc.)
|
|
59
|
+
- **Adjustments** - Brightness, contrast, saturation, warmth
|
|
60
|
+
- **Crop** - Aspect ratios, free-form crop
|
|
61
|
+
- **Transform** - Rotate, flip, straighten
|
|
62
|
+
- **Export** - Save to gallery or custom location
|
|
63
|
+
|
|
64
|
+
## Verification
|
|
65
|
+
|
|
66
|
+
- ✅ Package installed
|
|
67
|
+
- ✅ Photo editor renders
|
|
68
|
+
- ✅ Filters apply correctly
|
|
69
|
+
- ✅ Adjustments work
|
|
70
|
+
- ✅ Export saves image
|
|
71
|
+
|
|
72
|
+
---
|
|
73
|
+
|
|
74
|
+
**Compatible with:** @umituz/react-native-photo-editor@latest
|
|
75
|
+
**Platforms:** React Native (Expo & Bare)
|