ultra-image-uploader 2.0.0 → 2.0.2
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/README.md +200 -186
- package/dist/components/ImageUploader.d.ts +15 -13
- package/dist/components/ImageUploader.d.ts.map +1 -1
- package/dist/components/ImageUploader.js +138 -119
- package/dist/components/ImageUploader.js.map +1 -1
- package/dist/index.d.ts +1 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +14 -7
package/README.md
CHANGED
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
<div align="center">
|
|
4
4
|
|
|
5
|
-
A modern,
|
|
5
|
+
A modern, fancy React image upload component with responsive grid layout, drag-and-drop reordering, and beautiful animations.
|
|
6
6
|
|
|
7
7
|
[](https://www.npmjs.com/package/ultra-image-uploader)
|
|
8
8
|
|
|
9
9
|
[](https://opensource.org/licenses/MIT)
|
|
10
10
|
|
|
11
|
-
**Modern UI** • **
|
|
11
|
+
**Modern UI** • **Dark/Light Themes** • **Grid Layout** • **Drag Reorder**
|
|
12
12
|
|
|
13
13
|
</div>
|
|
14
14
|
|
|
@@ -16,21 +16,33 @@ A modern, beautiful React image upload component with support for multiple provi
|
|
|
16
16
|
|
|
17
17
|
## Features
|
|
18
18
|
|
|
19
|
-
- **
|
|
20
|
-
- **
|
|
21
|
-
- **
|
|
19
|
+
- **Modern UI** - Beautiful card-based design with shadows and rounded corners
|
|
20
|
+
- **Responsive Grid** - Adaptive grid layout (2-6 columns) for all screen sizes
|
|
21
|
+
- **Drag & Drop** - Upload files by dragging or clicking
|
|
22
|
+
- **Live Previews** - Instant image thumbnails with metadata
|
|
23
|
+
- **Drag Reorder** - Rearrange images by dragging
|
|
24
|
+
- **Progress Tracking** - Real-time upload progress with animations
|
|
25
|
+
- **Theme Support** - Built-in light/dark theme toggle
|
|
26
|
+
- **Smooth Animations** - Hover effects, fade transitions, scale animations
|
|
27
|
+
- **Keyboard Accessible** - Full keyboard navigation support
|
|
28
|
+
- **File Validation** - Size and type validation
|
|
22
29
|
- **Multiple Providers** - ImgBB & Cloudinary support
|
|
23
|
-
- **
|
|
24
|
-
- **Upload Progress** - Real-time progress tracking
|
|
25
|
-
- **File Validation** - Type and size validation
|
|
26
|
-
- **Auto Upload** - Optional automatic uploading
|
|
27
|
-
- **TypeScript** - Fully typed
|
|
28
|
-
- **Simple API** - Easy to use
|
|
30
|
+
- **Auto Import** - Works with VS Code, WebStorm, and all editors
|
|
29
31
|
|
|
30
32
|
## Installation
|
|
31
33
|
|
|
32
34
|
```bash
|
|
35
|
+
# npm
|
|
33
36
|
npm install ultra-image-uploader
|
|
37
|
+
|
|
38
|
+
# yarn
|
|
39
|
+
yarn add ultra-image-uploader
|
|
40
|
+
|
|
41
|
+
# pnpm
|
|
42
|
+
pnpm add ultra-image-uploader
|
|
43
|
+
|
|
44
|
+
# bun
|
|
45
|
+
bun add ultra-image-uploader
|
|
34
46
|
```
|
|
35
47
|
|
|
36
48
|
## Quick Start
|
|
@@ -47,265 +59,267 @@ function App() {
|
|
|
47
59
|
images={images}
|
|
48
60
|
setImages={setImages}
|
|
49
61
|
multiple
|
|
50
|
-
|
|
62
|
+
gridCols={4}
|
|
51
63
|
/>
|
|
52
64
|
);
|
|
53
65
|
}
|
|
54
66
|
```
|
|
55
67
|
|
|
56
|
-
##
|
|
57
|
-
|
|
58
|
-
Choose from 5 beautiful themes:
|
|
59
|
-
|
|
60
|
-
```tsx
|
|
61
|
-
// Light (default)
|
|
62
|
-
<ImageUploader theme="light" images={images} setImages={setImages} />
|
|
63
|
-
|
|
64
|
-
// Dark
|
|
65
|
-
<ImageUploader theme="dark" images={images} setImages={setImages} />
|
|
66
|
-
|
|
67
|
-
// Modern (pink)
|
|
68
|
-
<ImageUploader theme="modern" images={images} setImages={setImages} />
|
|
68
|
+
## Props
|
|
69
69
|
|
|
70
|
-
|
|
71
|
-
|
|
70
|
+
| Prop | Type | Default | Description |
|
|
71
|
+
|------|------|---------|-------------|
|
|
72
|
+
| `images` | `File[]` | **Required** | Selected image files |
|
|
73
|
+
| `setImages` | `(files: File[]) => void` | **Required** | Update images state |
|
|
74
|
+
| `multiple` | `boolean` | `true` | Allow multiple files |
|
|
75
|
+
| `maxSize` | `number` | `52428800` | Max file size (50MB) |
|
|
76
|
+
| `allowedTypes` | `string[]` | Image types | Allowed MIME types |
|
|
77
|
+
| `maxImages` | `number` | `20` | Maximum images allowed |
|
|
78
|
+
| `theme` | `'light' \| 'dark'` | `undefined` | Theme (uses internal if not set) |
|
|
79
|
+
| `onThemeChange` | `(theme) => void` | `undefined` | Theme change callback |
|
|
80
|
+
| `showThemeToggle` | `boolean` | `true` | Show theme toggle button |
|
|
81
|
+
| `showImageCount` | `boolean` | `true` | Show image count header |
|
|
82
|
+
| `enableReorder` | `boolean` | `true` | Enable drag reordering |
|
|
83
|
+
| `gridCols` | `number` | `4` | Grid columns (2-6) |
|
|
84
|
+
| `cardClassName` | `string` | `''` | Custom card class |
|
|
85
|
+
| `containerClassName` | `string` | `'max-w-5xl mx-auto'` | Container styling |
|
|
86
|
+
| `uploadText` | `string` | `'Click or drag...'` | Upload area text |
|
|
87
|
+
| `dragText` | `string` | `'Drop images here'` | Drag over text |
|
|
88
|
+
| `autoUpload` | `boolean` | `false` | Auto-upload on selection |
|
|
89
|
+
| `uploadConfig` | `{ provider, config }` | `undefined` | Upload configuration |
|
|
90
|
+
| `onUploadComplete` | `(urls: string[]) => void` | `undefined` | Success callback |
|
|
91
|
+
| `onUploadError` | `(error: Error) => void` | `undefined` | Error callback |
|
|
72
92
|
|
|
73
|
-
|
|
74
|
-
<ImageUploader theme="sunset" images={images} setImages={setImages} />
|
|
75
|
-
```
|
|
93
|
+
## Examples
|
|
76
94
|
|
|
77
|
-
|
|
95
|
+
### Basic Grid Layout
|
|
78
96
|
|
|
79
97
|
```tsx
|
|
80
|
-
import { ImageUploader, type ThemeConfig } from "ultra-image-uploader";
|
|
81
|
-
|
|
82
|
-
const customTheme: ThemeConfig = {
|
|
83
|
-
primary: '#ff6b6b',
|
|
84
|
-
background: '#fff',
|
|
85
|
-
border: '#ddd',
|
|
86
|
-
text: '#333',
|
|
87
|
-
textSecondary: '#666',
|
|
88
|
-
error: '#e74c3c',
|
|
89
|
-
success: '#2ecc71',
|
|
90
|
-
radius: '8px',
|
|
91
|
-
};
|
|
92
|
-
|
|
93
98
|
<ImageUploader
|
|
94
99
|
images={images}
|
|
95
100
|
setImages={setImages}
|
|
96
|
-
|
|
101
|
+
multiple
|
|
102
|
+
gridCols={4}
|
|
97
103
|
/>
|
|
98
104
|
```
|
|
99
105
|
|
|
100
|
-
|
|
106
|
+
### Dark Theme
|
|
101
107
|
|
|
102
108
|
```tsx
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
function UploadToImgBB() {
|
|
109
|
+
function DarkExample() {
|
|
110
|
+
const [theme, setTheme] = useState<'light' | 'dark'>('dark');
|
|
106
111
|
const [images, setImages] = useState<File[]>([]);
|
|
107
112
|
|
|
108
|
-
const handleUpload = async () => {
|
|
109
|
-
const result = await uploadImagesToImageBB(images, 'YOUR_API_KEY');
|
|
110
|
-
console.log('Uploaded:', result.urls);
|
|
111
|
-
};
|
|
112
|
-
|
|
113
113
|
return (
|
|
114
|
-
<div>
|
|
115
|
-
<ImageUploader
|
|
116
|
-
|
|
114
|
+
<div className={theme === 'dark' ? 'dark' : ''}>
|
|
115
|
+
<ImageUploader
|
|
116
|
+
images={images}
|
|
117
|
+
setImages={setImages}
|
|
118
|
+
theme={theme}
|
|
119
|
+
onThemeChange={setTheme}
|
|
120
|
+
multiple
|
|
121
|
+
gridCols={3}
|
|
122
|
+
/>
|
|
117
123
|
</div>
|
|
118
124
|
);
|
|
119
125
|
}
|
|
120
126
|
```
|
|
121
127
|
|
|
122
|
-
|
|
128
|
+
### Custom Grid & Styling
|
|
123
129
|
|
|
124
130
|
```tsx
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
});
|
|
135
|
-
console.log('Uploaded:', results.map(r => r.url));
|
|
136
|
-
};
|
|
137
|
-
|
|
138
|
-
return (
|
|
139
|
-
<div>
|
|
140
|
-
<ImageUploader images={images} setImages={setImages} multiple theme="dark" />
|
|
141
|
-
<button onClick={handleUpload}>Upload</button>
|
|
142
|
-
</div>
|
|
143
|
-
);
|
|
144
|
-
}
|
|
131
|
+
<ImageUploader
|
|
132
|
+
images={images}
|
|
133
|
+
setImages={setImages}
|
|
134
|
+
gridCols={3}
|
|
135
|
+
maxImages={10}
|
|
136
|
+
maxSize={10 * 1024 * 1024}
|
|
137
|
+
containerClassName="max-w-4xl mx-auto"
|
|
138
|
+
cardClassName="border-2"
|
|
139
|
+
/>
|
|
145
140
|
```
|
|
146
141
|
|
|
147
|
-
|
|
142
|
+
### Without Reordering
|
|
148
143
|
|
|
149
144
|
```tsx
|
|
150
145
|
<ImageUploader
|
|
151
146
|
images={images}
|
|
152
147
|
setImages={setImages}
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
uploadConfig={{
|
|
156
|
-
provider: 'imgbb',
|
|
157
|
-
config: { apiKey: 'your-api-key' },
|
|
158
|
-
}}
|
|
159
|
-
onUploadComplete={(urls) => console.log('Done!', urls)}
|
|
160
|
-
onUploadError={(error) => console.error('Error:', error)}
|
|
148
|
+
enableReorder={false}
|
|
149
|
+
gridCols={5}
|
|
161
150
|
/>
|
|
162
151
|
```
|
|
163
152
|
|
|
164
|
-
|
|
153
|
+
### With Upload (ImgBB)
|
|
165
154
|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
| `setImages` | `(files: File[]) => void` | **Required** | Update images state |
|
|
170
|
-
| `multiple` | `boolean` | `false` | Allow multiple files |
|
|
171
|
-
| `theme` | `'light' \| 'dark' \| 'modern' \| 'ocean' \| 'sunset' \| ThemeConfig` | `'light'` | Theme to use |
|
|
172
|
-
| `mode` | `'add' \| 'update'` | `'add'` | Component mode |
|
|
173
|
-
| `defaultImages` | `string[]` | `[]` | Existing image URLs |
|
|
174
|
-
| `uploadText` | `string` | `'Drop images here...'` | Upload area text |
|
|
175
|
-
| `maxSize` | `number` | `10485760` | Max file size (bytes) |
|
|
176
|
-
| `allowedTypes` | `string[]` | Image types | Allowed MIME types |
|
|
177
|
-
| `showFileSize` | `boolean` | `true` | Show file size |
|
|
178
|
-
| `dragAndDrop` | `boolean` | `true` | Enable drag-drop |
|
|
179
|
-
| `previewWidth` | `number` | `140` | Preview width (px) |
|
|
180
|
-
| `previewHeight` | `number` | `140` | Preview height (px) |
|
|
181
|
-
| `autoUpload` | `boolean` | `false` | Auto upload files |
|
|
182
|
-
| `uploadConfig` | `{ provider, config }` | `undefined` | Upload config |
|
|
183
|
-
| `onUploadComplete` | `(urls: string[]) => void` | `undefined` | Upload success callback |
|
|
184
|
-
| `onUploadError` | `(error: Error) => void` | `undefined` | Upload error callback |
|
|
185
|
-
| `className` | `string` | `''` | Extra CSS classes |
|
|
186
|
-
|
|
187
|
-
## Upload Functions
|
|
155
|
+
```tsx
|
|
156
|
+
function UploadExample() {
|
|
157
|
+
const [images, setImages] = useState<File[]>([]);
|
|
188
158
|
|
|
189
|
-
|
|
159
|
+
return (
|
|
160
|
+
<ImageUploader
|
|
161
|
+
images={images}
|
|
162
|
+
setImages={setImages}
|
|
163
|
+
multiple
|
|
164
|
+
gridCols={4}
|
|
165
|
+
uploadConfig={{
|
|
166
|
+
provider: 'imgbb',
|
|
167
|
+
config: { apiKey: process.env.IMGBB_API_KEY }
|
|
168
|
+
}}
|
|
169
|
+
onUploadComplete={(urls) => {
|
|
170
|
+
console.log('Uploaded:', urls);
|
|
171
|
+
}}
|
|
172
|
+
/>
|
|
173
|
+
);
|
|
174
|
+
}
|
|
175
|
+
```
|
|
190
176
|
|
|
191
|
-
|
|
177
|
+
### Responsive Grid
|
|
192
178
|
|
|
193
179
|
```tsx
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
'imgbb',
|
|
199
|
-
{ apiKey: 'your-key' },
|
|
200
|
-
{
|
|
201
|
-
onProgress: (p) => console.log(p.percentage + '%'),
|
|
202
|
-
}
|
|
203
|
-
);
|
|
204
|
-
console.log(result.url);
|
|
180
|
+
// 2 columns on mobile, 4 on desktop
|
|
181
|
+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
|
182
|
+
<ImageUploader images={images} setImages={setImages} gridCols={1} />
|
|
183
|
+
</div>
|
|
205
184
|
```
|
|
206
185
|
|
|
207
|
-
|
|
186
|
+
## Theme Support
|
|
208
187
|
|
|
209
|
-
|
|
188
|
+
The component includes built-in light and dark themes:
|
|
210
189
|
|
|
211
190
|
```tsx
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
}
|
|
191
|
+
// Controlled theme
|
|
192
|
+
<ImageUploader
|
|
193
|
+
images={images}
|
|
194
|
+
setImages={setImages}
|
|
195
|
+
theme="dark"
|
|
196
|
+
showThemeToggle={false}
|
|
197
|
+
/>
|
|
198
|
+
|
|
199
|
+
// Uncontrolled theme (with toggle)
|
|
200
|
+
<ImageUploader
|
|
201
|
+
images={images}
|
|
202
|
+
setImages={setImages}
|
|
203
|
+
showThemeToggle={true}
|
|
204
|
+
/>
|
|
215
205
|
```
|
|
216
206
|
|
|
217
|
-
|
|
207
|
+
## Animations
|
|
218
208
|
|
|
219
|
-
|
|
209
|
+
The component includes smooth animations:
|
|
210
|
+
- Scale effect on drag over
|
|
211
|
+
- Fade-in/out for previews
|
|
212
|
+
- Hover scale on image cards
|
|
213
|
+
- Smooth progress bar transitions
|
|
214
|
+
- Button hover effects
|
|
220
215
|
|
|
221
|
-
|
|
222
|
-
const { urls } = await uploadImagesToImageBB(images, 'api-key');
|
|
223
|
-
```
|
|
216
|
+
## Accessibility
|
|
224
217
|
|
|
225
|
-
|
|
218
|
+
- Keyboard accessible (Enter/Space to upload)
|
|
219
|
+
- Focus indicators on drag area
|
|
220
|
+
- ARIA-compatible markup
|
|
221
|
+
- Screen reader friendly
|
|
226
222
|
|
|
227
|
-
|
|
223
|
+
## Responsive Design
|
|
224
|
+
|
|
225
|
+
The grid layout adapts to screen sizes:
|
|
226
|
+
- Default: `max-w-5xl mx-auto` container
|
|
227
|
+
- Configurable grid columns (2-6)
|
|
228
|
+
- Works on mobile, tablet, and desktop
|
|
229
|
+
|
|
230
|
+
## Upload Functions
|
|
228
231
|
|
|
229
232
|
```tsx
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
+
import {
|
|
234
|
+
uploadImage,
|
|
235
|
+
uploadImages,
|
|
236
|
+
uploadImagesToImageBB,
|
|
237
|
+
uploadImagesToCloudinary
|
|
238
|
+
} from "ultra-image-uploader";
|
|
239
|
+
|
|
240
|
+
// Upload with progress
|
|
241
|
+
const result = await uploadImage(file, 'imgbb', { apiKey }, {
|
|
242
|
+
onProgress: (p) => console.log(p.percentage)
|
|
243
|
+
});
|
|
244
|
+
|
|
245
|
+
// Multiple uploads
|
|
246
|
+
const results = await uploadImages(files, 'cloudinary', {
|
|
247
|
+
cloudName: 'your-cloud'
|
|
233
248
|
});
|
|
234
249
|
```
|
|
235
250
|
|
|
236
|
-
##
|
|
251
|
+
## API Configuration
|
|
237
252
|
|
|
238
253
|
### ImgBB
|
|
239
|
-
1.
|
|
240
|
-
2.
|
|
254
|
+
1. Get API key from [imgbb.com/settings/api](https://imgbb.com/settings/api)
|
|
255
|
+
2. Use `{ provider: 'imgbb', config: { apiKey } }`
|
|
241
256
|
|
|
242
257
|
### Cloudinary
|
|
243
258
|
1. Sign up at [cloudinary.com](https://cloudinary.com)
|
|
244
|
-
2. Get
|
|
245
|
-
3.
|
|
259
|
+
2. Get cloud name and create upload preset
|
|
260
|
+
3. Use `{ provider: 'cloudinary', config: { cloudName, uploadPreset } }`
|
|
246
261
|
|
|
247
|
-
##
|
|
262
|
+
## Customization
|
|
248
263
|
|
|
249
|
-
|
|
264
|
+
### Card Styling
|
|
250
265
|
|
|
251
266
|
```tsx
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
FileValidationOptions,
|
|
258
|
-
// ... more
|
|
259
|
-
} from "ultra-image-uploader";
|
|
267
|
+
<ImageUploader
|
|
268
|
+
images={images}
|
|
269
|
+
setImages={setImages}
|
|
270
|
+
cardClassName="border-2 border-purple-500"
|
|
271
|
+
/>
|
|
260
272
|
```
|
|
261
273
|
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
### Profile Picture
|
|
274
|
+
### Container Size
|
|
265
275
|
|
|
266
276
|
```tsx
|
|
267
277
|
<ImageUploader
|
|
268
|
-
images={
|
|
269
|
-
setImages={
|
|
270
|
-
|
|
271
|
-
maxSize={2 * 1024 * 1024}
|
|
272
|
-
theme="modern"
|
|
278
|
+
images={images}
|
|
279
|
+
setImages={setImages}
|
|
280
|
+
containerClassName="max-w-7xl mx-auto"
|
|
273
281
|
/>
|
|
274
282
|
```
|
|
275
283
|
|
|
276
|
-
###
|
|
284
|
+
### Grid Columns
|
|
277
285
|
|
|
278
286
|
```tsx
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
defaultImages={existingImages}
|
|
285
|
-
allowedTypes={['image/jpeg', 'image/webp']}
|
|
286
|
-
theme="ocean"
|
|
287
|
-
/>
|
|
287
|
+
// 2 columns
|
|
288
|
+
<ImageUploader gridCols={2} />
|
|
289
|
+
|
|
290
|
+
// 6 columns
|
|
291
|
+
<ImageUploader gridCols={6} />
|
|
288
292
|
```
|
|
289
293
|
|
|
290
|
-
|
|
294
|
+
## TypeScript
|
|
295
|
+
|
|
296
|
+
Full TypeScript support:
|
|
291
297
|
|
|
292
298
|
```tsx
|
|
293
|
-
|
|
294
|
-
images={images}
|
|
295
|
-
setImages={setImages}
|
|
296
|
-
theme={{
|
|
297
|
-
primary: '#00d9ff',
|
|
298
|
-
background: '#0a0a0a',
|
|
299
|
-
border: '#333',
|
|
300
|
-
text: '#fff',
|
|
301
|
-
textSecondary: '#999',
|
|
302
|
-
error: '#ff4757',
|
|
303
|
-
success: '#2ed573',
|
|
304
|
-
radius: '16px',
|
|
305
|
-
}}
|
|
306
|
-
/>
|
|
299
|
+
import type { ImageUploaderProps } from "ultra-image-uploader";
|
|
307
300
|
```
|
|
308
301
|
|
|
302
|
+
## Browser Support
|
|
303
|
+
|
|
304
|
+
- Chrome/Edge (latest)
|
|
305
|
+
- Firefox (latest)
|
|
306
|
+
- Safari (latest)
|
|
307
|
+
- Mobile browsers
|
|
308
|
+
|
|
309
|
+
## Troubleshooting
|
|
310
|
+
|
|
311
|
+
### Auto imports not working
|
|
312
|
+
- Restart TypeScript server in your editor
|
|
313
|
+
- Ensure `node_modules` exists
|
|
314
|
+
|
|
315
|
+
### Theme not applying
|
|
316
|
+
- Wrap parent div with `dark` class for dark mode
|
|
317
|
+
- Check Tailwind CSS dark mode config
|
|
318
|
+
|
|
319
|
+
### Grid not responsive
|
|
320
|
+
- Adjust `gridCols` prop for different breakpoints
|
|
321
|
+
- Use wrapper with responsive classes
|
|
322
|
+
|
|
309
323
|
## License
|
|
310
324
|
|
|
311
325
|
MIT © Digontha Das
|
|
@@ -1,27 +1,29 @@
|
|
|
1
|
-
import type { UploadProvider, ProviderConfig
|
|
2
|
-
export declare const themes: Record<string, ThemeConfig>;
|
|
1
|
+
import type { UploadProvider, ProviderConfig } from '../types';
|
|
3
2
|
export interface ImageUploaderProps {
|
|
4
3
|
images: File[];
|
|
5
4
|
setImages: (images: File[]) => void;
|
|
6
|
-
mode?: 'add' | 'update';
|
|
7
|
-
defaultImages?: string[];
|
|
8
5
|
multiple?: boolean;
|
|
9
|
-
theme?: keyof typeof themes | ThemeConfig;
|
|
10
|
-
uploadText?: string;
|
|
11
6
|
maxSize?: number;
|
|
12
7
|
allowedTypes?: string[];
|
|
13
|
-
|
|
14
|
-
dragAndDrop?: boolean;
|
|
15
|
-
previewWidth?: number;
|
|
16
|
-
previewHeight?: number;
|
|
8
|
+
maxImages?: number;
|
|
17
9
|
className?: string;
|
|
10
|
+
containerClassName?: string;
|
|
11
|
+
uploadText?: string;
|
|
12
|
+
dragText?: string;
|
|
13
|
+
theme?: 'light' | 'dark';
|
|
14
|
+
onThemeChange?: (theme: 'light' | 'dark') => void;
|
|
15
|
+
showThemeToggle?: boolean;
|
|
16
|
+
showImageCount?: boolean;
|
|
17
|
+
enableReorder?: boolean;
|
|
18
|
+
gridCols?: number;
|
|
19
|
+
cardClassName?: string;
|
|
20
|
+
onUploadComplete?: (urls: string[]) => void;
|
|
21
|
+
onUploadError?: (error: Error) => void;
|
|
18
22
|
autoUpload?: boolean;
|
|
19
23
|
uploadConfig?: {
|
|
20
24
|
provider: UploadProvider;
|
|
21
25
|
config: ProviderConfig;
|
|
22
26
|
};
|
|
23
|
-
onUploadComplete?: (urls: string[]) => void;
|
|
24
|
-
onUploadError?: (error: Error) => void;
|
|
25
27
|
}
|
|
26
|
-
export declare function ImageUploader({ images, setImages,
|
|
28
|
+
export declare function ImageUploader({ images, setImages, multiple, maxSize, allowedTypes, maxImages, className, containerClassName, uploadText, dragText, theme: externalTheme, onThemeChange, showThemeToggle, showImageCount, enableReorder, gridCols, cardClassName, onUploadComplete, onUploadError, autoUpload, uploadConfig, }: ImageUploaderProps): import("react/jsx-runtime").JSX.Element;
|
|
27
29
|
//# sourceMappingURL=ImageUploader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageUploader.d.ts","sourceRoot":"","sources":["../../src/components/ImageUploader.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"ImageUploader.d.ts","sourceRoot":"","sources":["../../src/components/ImageUploader.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAI/D,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,IAAI,EAAE,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE;QACb,QAAQ,EAAE,cAAc,CAAC;QACzB,MAAM,EAAE,cAAc,CAAC;KACxB,CAAC;CACH;AASD,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,QAAe,EACf,OAA0B,EAC1B,YAAkF,EAClF,SAAc,EACd,SAAc,EACd,kBAAwC,EACxC,UAA6C,EAC7C,QAA6B,EAC7B,KAAK,EAAE,aAAa,EACpB,aAAa,EACb,eAAsB,EACtB,cAAqB,EACrB,aAAoB,EACpB,QAAY,EACZ,aAAkB,EAClB,gBAAgB,EAChB,aAAa,EACb,UAAkB,EAClB,YAAY,GACb,EAAE,kBAAkB,2CAwgBpB"}
|
|
@@ -1,73 +1,41 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import { useState, useRef, useCallback, useEffect } from 'react';
|
|
4
|
-
import { Upload, X, Image as ImageIcon,
|
|
4
|
+
import { Upload, X, Image as ImageIcon, File, Moon, Sun, GripVertical } from 'lucide-react';
|
|
5
5
|
import { uploadImage } from '../providers';
|
|
6
6
|
import { isImageFile, formatFileSize } from '../utils/validation';
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
light: {
|
|
10
|
-
primary: '#6366f1',
|
|
11
|
-
background: '#ffffff',
|
|
12
|
-
border: '#e5e7eb',
|
|
13
|
-
text: '#1f2937',
|
|
14
|
-
textSecondary: '#6b7280',
|
|
15
|
-
error: '#ef4444',
|
|
16
|
-
success: '#10b981',
|
|
17
|
-
radius: '12px',
|
|
18
|
-
},
|
|
19
|
-
dark: {
|
|
20
|
-
primary: '#8b5cf6',
|
|
21
|
-
background: '#1f2937',
|
|
22
|
-
border: '#374151',
|
|
23
|
-
text: '#f9fafb',
|
|
24
|
-
textSecondary: '#9ca3af',
|
|
25
|
-
error: '#f87171',
|
|
26
|
-
success: '#34d399',
|
|
27
|
-
radius: '12px',
|
|
28
|
-
},
|
|
29
|
-
modern: {
|
|
30
|
-
primary: '#ec4899',
|
|
31
|
-
background: '#fdf2f8',
|
|
32
|
-
border: '#f9a8d4',
|
|
33
|
-
text: '#831843',
|
|
34
|
-
textSecondary: '#9d174d',
|
|
35
|
-
error: '#dc2626',
|
|
36
|
-
success: '#059669',
|
|
37
|
-
radius: '16px',
|
|
38
|
-
},
|
|
39
|
-
ocean: {
|
|
40
|
-
primary: '#0891b2',
|
|
41
|
-
background: '#ecfeff',
|
|
42
|
-
border: '#a5f3fc',
|
|
43
|
-
text: '#164e63',
|
|
44
|
-
textSecondary: '#155e75',
|
|
45
|
-
error: '#dc2626',
|
|
46
|
-
success: '#059669',
|
|
47
|
-
radius: '14px',
|
|
48
|
-
},
|
|
49
|
-
sunset: {
|
|
50
|
-
primary: '#f97316',
|
|
51
|
-
background: '#fff7ed',
|
|
52
|
-
border: '#fdba74',
|
|
53
|
-
text: '#7c2d12',
|
|
54
|
-
textSecondary: '#9a3412',
|
|
55
|
-
error: '#dc2626',
|
|
56
|
-
success: '#059669',
|
|
57
|
-
radius: '12px',
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
export function ImageUploader({ images, setImages, mode = 'add', defaultImages = [], multiple = false, theme = 'light', uploadText = 'Drop images here or click to browse', maxSize = 10 * 1024 * 1024, allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/webp', 'image/gif'], showFileSize = true, dragAndDrop = true, previewWidth = 140, previewHeight = 140, className = '', autoUpload = false, uploadConfig, onUploadComplete, onUploadError, }) {
|
|
61
|
-
const [removedDefaults, setRemovedDefaults] = useState([]);
|
|
7
|
+
export function ImageUploader({ images, setImages, multiple = true, maxSize = 50 * 1024 * 1024, allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/webp', 'image/gif'], maxImages = 20, className = '', containerClassName = 'max-w-5xl mx-auto', uploadText = 'Click or drag to upload images', dragText = 'Drop images here', theme: externalTheme, onThemeChange, showThemeToggle = true, showImageCount = true, enableReorder = true, gridCols = 4, cardClassName = '', onUploadComplete, onUploadError, autoUpload = false, uploadConfig, }) {
|
|
8
|
+
const [internalTheme, setInternalTheme] = useState('light');
|
|
62
9
|
const [isDragging, setIsDragging] = useState(false);
|
|
63
|
-
const [
|
|
10
|
+
const [fileStates, setFileStates] = useState(new Map());
|
|
64
11
|
const [uploading, setUploading] = useState(false);
|
|
65
|
-
const [
|
|
12
|
+
const [draggedIndex, setDraggedIndex] = useState(null);
|
|
66
13
|
const fileInputRef = useRef(null);
|
|
67
14
|
const dragCounter = useRef(0);
|
|
68
|
-
const
|
|
69
|
-
const
|
|
70
|
-
|
|
15
|
+
const theme = externalTheme || internalTheme;
|
|
16
|
+
const isDark = theme === 'dark';
|
|
17
|
+
const handleThemeToggle = () => {
|
|
18
|
+
const newTheme = isDark ? 'light' : 'dark';
|
|
19
|
+
setInternalTheme(newTheme);
|
|
20
|
+
onThemeChange?.(newTheme);
|
|
21
|
+
};
|
|
22
|
+
// Generate previews
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
const newStates = new Map();
|
|
25
|
+
images.forEach((file) => {
|
|
26
|
+
const key = `${file.name}-${file.size}`;
|
|
27
|
+
const existing = fileStates.get(key);
|
|
28
|
+
if (existing?.preview) {
|
|
29
|
+
newStates.set(key, existing);
|
|
30
|
+
}
|
|
31
|
+
else {
|
|
32
|
+
const preview = isImageFile(file) ? URL.createObjectURL(file) : undefined;
|
|
33
|
+
newStates.set(key, { ...file, progress: 0, status: 'pending', preview });
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
setFileStates(newStates);
|
|
37
|
+
}, [images]);
|
|
38
|
+
// Auto upload effect
|
|
71
39
|
useEffect(() => {
|
|
72
40
|
if (autoUpload && uploadConfig && images.length > 0 && !uploading) {
|
|
73
41
|
handleAutoUpload();
|
|
@@ -78,11 +46,35 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
78
46
|
return;
|
|
79
47
|
setUploading(true);
|
|
80
48
|
try {
|
|
81
|
-
const results = await Promise.all(images.map((file) =>
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
49
|
+
const results = await Promise.all(images.map(async (file) => {
|
|
50
|
+
const key = `${file.name}-${file.size}`;
|
|
51
|
+
setFileStates((prev) => {
|
|
52
|
+
const next = new Map(prev);
|
|
53
|
+
next.set(key, { ...file, progress: 0, status: 'uploading' });
|
|
54
|
+
return next;
|
|
55
|
+
});
|
|
56
|
+
const result = await uploadImage(file, uploadConfig.provider, uploadConfig.config, {
|
|
57
|
+
onProgress: (p) => {
|
|
58
|
+
setFileStates((prev) => {
|
|
59
|
+
const next = new Map(prev);
|
|
60
|
+
const current = next.get(key);
|
|
61
|
+
if (current) {
|
|
62
|
+
next.set(key, { ...current, progress: p.percentage });
|
|
63
|
+
}
|
|
64
|
+
return next;
|
|
65
|
+
});
|
|
66
|
+
},
|
|
67
|
+
});
|
|
68
|
+
setFileStates((prev) => {
|
|
69
|
+
const next = new Map(prev);
|
|
70
|
+
const current = next.get(key);
|
|
71
|
+
if (current) {
|
|
72
|
+
next.set(key, { ...current, progress: 100, status: 'done' });
|
|
73
|
+
}
|
|
74
|
+
return next;
|
|
75
|
+
});
|
|
76
|
+
return result;
|
|
77
|
+
}));
|
|
86
78
|
const urls = results.map((r) => r.url);
|
|
87
79
|
onUploadComplete?.(urls);
|
|
88
80
|
}
|
|
@@ -92,42 +84,37 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
92
84
|
}
|
|
93
85
|
finally {
|
|
94
86
|
setUploading(false);
|
|
95
|
-
setProgress({});
|
|
96
87
|
}
|
|
97
88
|
};
|
|
98
89
|
const validateFiles = useCallback((files) => {
|
|
99
90
|
const valid = [];
|
|
100
91
|
const invalid = [];
|
|
101
92
|
Array.from(files).forEach((file) => {
|
|
102
|
-
if (!isImageFile(file)) {
|
|
103
|
-
invalid.push(
|
|
93
|
+
if (!isImageFile(file) && !allowedTypes.includes(file.type)) {
|
|
94
|
+
invalid.push(file);
|
|
104
95
|
return;
|
|
105
96
|
}
|
|
106
97
|
if (file.size > maxSize) {
|
|
107
|
-
invalid.push(
|
|
98
|
+
invalid.push(file);
|
|
108
99
|
return;
|
|
109
100
|
}
|
|
110
|
-
if (
|
|
111
|
-
invalid.push({ ...file, error: 'File type not allowed' });
|
|
101
|
+
if (maxImages && images.length + valid.length >= maxImages) {
|
|
112
102
|
return;
|
|
113
103
|
}
|
|
114
104
|
valid.push(file);
|
|
115
105
|
});
|
|
116
106
|
return { valid, invalid };
|
|
117
|
-
}, [maxSize, allowedTypes]);
|
|
107
|
+
}, [maxSize, allowedTypes, maxImages, images.length]);
|
|
118
108
|
const handleFiles = useCallback((files) => {
|
|
119
|
-
const { valid
|
|
120
|
-
if (invalid.length > 0) {
|
|
121
|
-
setErrors((prev) => [...prev, ...invalid]);
|
|
122
|
-
}
|
|
109
|
+
const { valid } = validateFiles(files);
|
|
123
110
|
if (valid.length === 0)
|
|
124
111
|
return;
|
|
125
112
|
if (!multiple && valid.length > 1) {
|
|
126
|
-
alert('Only one
|
|
113
|
+
alert('Only one file allowed');
|
|
127
114
|
return;
|
|
128
115
|
}
|
|
129
116
|
setImages(multiple ? [...images, ...valid] : [valid[0]]);
|
|
130
|
-
}, [images, multiple, setImages, validateFiles]);
|
|
117
|
+
}, [images, multiple, setImages, validateFiles, maxImages]);
|
|
131
118
|
const handleChange = (e) => {
|
|
132
119
|
if (e.target.files?.length) {
|
|
133
120
|
handleFiles(e.target.files);
|
|
@@ -135,8 +122,6 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
135
122
|
}
|
|
136
123
|
};
|
|
137
124
|
const handleDragEnter = (e) => {
|
|
138
|
-
if (!dragAndDrop)
|
|
139
|
-
return;
|
|
140
125
|
e.preventDefault();
|
|
141
126
|
e.stopPropagation();
|
|
142
127
|
dragCounter.current++;
|
|
@@ -144,8 +129,6 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
144
129
|
setIsDragging(true);
|
|
145
130
|
};
|
|
146
131
|
const handleDragLeave = (e) => {
|
|
147
|
-
if (!dragAndDrop)
|
|
148
|
-
return;
|
|
149
132
|
e.preventDefault();
|
|
150
133
|
e.stopPropagation();
|
|
151
134
|
dragCounter.current--;
|
|
@@ -153,13 +136,9 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
153
136
|
setIsDragging(false);
|
|
154
137
|
};
|
|
155
138
|
const handleDragOver = (e) => {
|
|
156
|
-
if (!dragAndDrop)
|
|
157
|
-
return;
|
|
158
139
|
e.preventDefault();
|
|
159
140
|
};
|
|
160
141
|
const handleDrop = (e) => {
|
|
161
|
-
if (!dragAndDrop)
|
|
162
|
-
return;
|
|
163
142
|
e.preventDefault();
|
|
164
143
|
e.stopPropagation();
|
|
165
144
|
setIsDragging(false);
|
|
@@ -168,40 +147,80 @@ export function ImageUploader({ images, setImages, mode = 'add', defaultImages =
|
|
|
168
147
|
handleFiles(e.dataTransfer.files);
|
|
169
148
|
}
|
|
170
149
|
};
|
|
171
|
-
const
|
|
150
|
+
const removeFile = (index) => {
|
|
172
151
|
setImages(images.filter((_, i) => i !== index));
|
|
173
152
|
};
|
|
174
|
-
const
|
|
175
|
-
|
|
153
|
+
const handleDragStart = (e, index) => {
|
|
154
|
+
if (!enableReorder)
|
|
155
|
+
return;
|
|
156
|
+
setDraggedIndex(index);
|
|
157
|
+
e.dataTransfer.effectAllowed = 'move';
|
|
158
|
+
};
|
|
159
|
+
const handleDragOverItem = (e, index) => {
|
|
160
|
+
if (!enableReorder || draggedIndex === null || draggedIndex === index)
|
|
161
|
+
return;
|
|
162
|
+
e.preventDefault();
|
|
163
|
+
e.dataTransfer.dropEffect = 'move';
|
|
164
|
+
};
|
|
165
|
+
const handleDropItem = (e, index) => {
|
|
166
|
+
if (!enableReorder || draggedIndex === null || draggedIndex === index)
|
|
167
|
+
return;
|
|
168
|
+
e.preventDefault();
|
|
169
|
+
const newImages = [...images];
|
|
170
|
+
const draggedItem = newImages[draggedIndex];
|
|
171
|
+
newImages.splice(draggedIndex, 1);
|
|
172
|
+
newImages.splice(index, 0, draggedItem);
|
|
173
|
+
setImages(newImages);
|
|
174
|
+
setDraggedIndex(null);
|
|
175
|
+
};
|
|
176
|
+
const handleDragEnd = () => {
|
|
177
|
+
setDraggedIndex(null);
|
|
176
178
|
};
|
|
177
|
-
const
|
|
178
|
-
|
|
179
|
+
const getFileState = (file) => {
|
|
180
|
+
const key = `${file.name}-${file.size}`;
|
|
181
|
+
return fileStates.get(key) || { ...file, progress: 0, status: 'pending' };
|
|
179
182
|
};
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
183
|
+
const gridColsClass = {
|
|
184
|
+
2: 'grid-cols-2',
|
|
185
|
+
3: 'grid-cols-3',
|
|
186
|
+
4: 'grid-cols-4',
|
|
187
|
+
5: 'grid-cols-5',
|
|
188
|
+
6: 'grid-cols-6',
|
|
189
|
+
}[gridCols] || 'grid-cols-4';
|
|
190
|
+
return (_jsxs("div", { className: `image-uploader ${containerClassName} ${className}`, children: [_jsxs("div", { className: "flex items-center justify-between mb-6", children: [_jsx("h2", { className: `text-2xl font-bold ${isDark ? 'text-white' : 'text-gray-900'}`, children: "Upload Images" }), showImageCount && (_jsxs("span", { className: `text-sm ${isDark ? 'text-gray-400' : 'text-gray-600'}`, children: [images.length, " ", maxImages ? `/ ${maxImages}` : '', " images"] }))] }), _jsxs("div", { className: `relative rounded-2xl border-2 border-dashed transition-all duration-300 ${isDragging
|
|
191
|
+
? 'border-blue-500 bg-blue-50 scale-[1.02]'
|
|
192
|
+
: isDark
|
|
193
|
+
? 'border-gray-600 bg-gray-800/50 hover:border-gray-500'
|
|
194
|
+
: 'border-gray-300 bg-gray-50 hover:border-gray-400'}`, style: {
|
|
195
|
+
boxShadow: isDark
|
|
196
|
+
? '0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2)'
|
|
197
|
+
: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
198
|
+
}, onClick: () => fileInputRef.current?.click(), onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, tabIndex: 0, onKeyDown: (e) => {
|
|
199
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
200
|
+
fileInputRef.current?.click();
|
|
201
|
+
}
|
|
202
|
+
}, onFocus: (e) => e.currentTarget.classList.add('ring-2', 'ring-blue-500'), onBlur: (e) => e.currentTarget.classList.remove('ring-2', 'ring-blue-500'), children: [_jsx("input", { ref: fileInputRef, type: "file", accept: allowedTypes.join(','), multiple: multiple, onChange: handleChange, className: "absolute inset-0 opacity-0 cursor-pointer", style: { zIndex: 10 } }), _jsxs("div", { className: "flex flex-col items-center justify-center p-12", children: [_jsxs("div", { className: `relative mb-4 transition-transform duration-300 ${isDragging ? 'scale-110' : 'scale-100'}`, children: [_jsx("div", { className: `w-20 h-20 rounded-full flex items-center justify-center ${isDark ? 'bg-gray-700' : 'bg-white'}`, style: {
|
|
203
|
+
boxShadow: isDark
|
|
204
|
+
? '0 4px 6px -1px rgba(0, 0, 0, 0.3)'
|
|
205
|
+
: '0 4px 6px -1px rgba(0, 0, 0, 0.1)',
|
|
206
|
+
}, children: _jsx(ImageIcon, { size: 40, className: isDark ? 'text-gray-400' : 'text-gray-500' }) }), _jsx("div", { className: `absolute -bottom-2 -right-2 w-10 h-10 rounded-full flex items-center justify-center transition-all duration-300 ${isDragging ? 'scale-125' : 'scale-100'} ${isDark ? 'bg-blue-600' : 'bg-blue-500'}`, children: _jsx(Upload, { size: 20, className: "text-white" }) })] }), _jsx("p", { className: `text-lg font-semibold mb-2 transition-colors ${isDark ? 'text-white' : 'text-gray-900'}`, children: isDragging ? dragText : uploadText }), _jsxs("p", { className: `text-sm ${isDark ? 'text-gray-400' : 'text-gray-500'}`, children: ["Maximum file size ", formatFileSize(maxSize)] }), maxImages && (_jsxs("p", { className: `text-xs mt-2 ${isDark ? 'text-gray-500' : 'text-gray-400'}`, children: ["Up to ", maxImages, " images"] }))] })] }), showThemeToggle && !externalTheme && (_jsx("div", { className: "flex justify-end mt-4", children: _jsxs("button", { onClick: handleThemeToggle, className: `flex items-center gap-2 px-4 py-2 rounded-lg transition-all ${isDark
|
|
207
|
+
? 'bg-gray-800 hover:bg-gray-700 text-gray-200'
|
|
208
|
+
: 'bg-gray-100 hover:bg-gray-200 text-gray-700'}`, children: [isDark ? _jsx(Sun, { size: 18 }) : _jsx(Moon, { size: 18 }), _jsxs("span", { className: "text-sm font-medium", children: [isDark ? 'Light' : 'Dark', " Mode"] })] }) })), images.length > 0 && (_jsx("div", { className: "mt-8", children: _jsx("div", { className: `grid gap-4 ${gridColsClass} ${isDark ? 'text-white' : 'text-gray-900'}`, children: images.map((file, index) => {
|
|
209
|
+
const state = getFileState(file);
|
|
210
|
+
const isUploading = state.status === 'uploading';
|
|
211
|
+
const isDone = state.status === 'done';
|
|
212
|
+
return (_jsx("div", { draggable: enableReorder, onDragStart: (e) => handleDragStart(e, index), onDragOver: (e) => handleDragOverItem(e, index), onDrop: (e) => handleDropItem(e, index), onDragEnd: handleDragEnd, className: `group relative ${cardClassName} ${draggedIndex === index ? 'opacity-50' : ''}`, children: _jsxs("div", { className: `relative overflow-hidden rounded-xl transition-all duration-300 ${isDark
|
|
213
|
+
? 'bg-gray-800 hover:bg-gray-750'
|
|
214
|
+
: 'bg-white hover:bg-gray-50'}`, style: {
|
|
215
|
+
boxShadow: isDark
|
|
216
|
+
? '0 4px 6px -1px rgba(0, 0, 0, 0.3)'
|
|
217
|
+
: '0 4px 6px -1px rgba(0, 0, 0, 0.1)',
|
|
218
|
+
}, children: [enableReorder && (_jsx("div", { className: `absolute top-2 left-2 p-1.5 rounded-lg opacity-0 group-hover:opacity-100 transition-opacity z-20 ${isDark ? 'bg-gray-700' : 'bg-white'}`, style: { boxShadow: '0 2px 4px rgba(0,0,0,0.1)' }, children: _jsx(GripVertical, { size: 16, className: isDark ? 'text-gray-400' : 'text-gray-500' }) })), _jsx("button", { onClick: (e) => {
|
|
219
|
+
e.stopPropagation();
|
|
220
|
+
removeFile(index);
|
|
221
|
+
}, className: "absolute top-2 right-2 p-1.5 rounded-full opacity-0 group-hover:opacity-100 transition-all z-20 hover:scale-110 bg-red-500 hover:bg-red-600 text-white", style: { boxShadow: '0 2px 4px rgba(0,0,0,0.2)' }, children: _jsx(X, { size: 16 }) }), _jsxs("div", { className: "relative aspect-square", children: [state.preview ? (_jsx("img", { src: state.preview, alt: file.name, className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105" })) : (_jsx("div", { className: `w-full h-full flex items-center justify-center ${isDark ? 'bg-gray-700' : 'bg-gray-100'}`, children: _jsx(File, { size: 48, className: isDark ? 'text-gray-500' : 'text-gray-400' }) })), (isUploading || isDone) && (_jsx("div", { className: "absolute inset-0 bg-black/60 flex items-center justify-center", children: _jsx("div", { className: "text-center", children: isUploading ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "w-16 h-16 border-4 border-white border-t-transparent rounded-full animate-spin mx-auto mb-2" }), _jsxs("p", { className: "text-white font-semibold", children: [state.progress, "%"] })] })) : (_jsx("div", { className: "w-16 h-16 bg-green-500 rounded-full flex items-center justify-center", children: _jsx("svg", { className: "w-8 h-8 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) }) })) }) }))] }), _jsxs("div", { className: "p-3", children: [_jsx("p", { className: `text-sm font-medium truncate mb-1 ${isDark ? 'text-white' : 'text-gray-900'}`, children: file.name }), _jsx("p", { className: `text-xs ${isDark ? 'text-gray-400' : 'text-gray-500'}`, children: formatFileSize(file.size) }), isUploading && (_jsx("div", { className: "mt-2", children: _jsx("div", { className: "w-full bg-gray-200 rounded-full h-1", children: _jsx("div", { className: "bg-blue-500 h-1 rounded-full transition-all duration-300", style: { width: `${state.progress}%` } }) }) }))] })] }) }, `${file.name}-${file.size}`));
|
|
222
|
+
}) }) })), images.length > 0 && !autoUpload && (_jsxs("div", { className: "mt-6 flex items-center justify-end gap-3", children: [_jsx("button", { onClick: () => setImages([]), className: `px-6 py-2.5 text-sm font-medium rounded-lg transition-all ${isDark
|
|
223
|
+
? 'bg-gray-800 hover:bg-gray-700 text-gray-200 border border-gray-700'
|
|
224
|
+
: 'bg-white hover:bg-gray-50 text-gray-700 border border-gray-300'}`, children: "Clear All" }), _jsx("button", { onClick: handleAutoUpload, disabled: uploading, className: "px-6 py-2.5 text-sm font-medium text-white bg-blue-500 hover:bg-blue-600 rounded-lg disabled:opacity-50 disabled:cursor-not-allowed transition-all hover:shadow-lg hover:scale-105 flex items-center gap-2", children: uploading ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin" }), "Uploading..."] })) : (_jsxs(_Fragment, { children: [_jsx(Upload, { size: 16 }), "Upload ", images.length, " ", images.length === 1 ? 'Image' : 'Images'] })) })] }))] }));
|
|
206
225
|
}
|
|
207
226
|
//# sourceMappingURL=ImageUploader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageUploader.js","sourceRoot":"","sources":["../../src/components/ImageUploader.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ImageUploader.js","sourceRoot":"","sources":["../../src/components/ImageUploader.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -2,9 +2,8 @@
|
|
|
2
2
|
* Ultra Image Uploader
|
|
3
3
|
* Modern image upload component with ImgBB & Cloudinary support
|
|
4
4
|
*/
|
|
5
|
-
export { ImageUploader
|
|
5
|
+
export { ImageUploader } from './components/ImageUploader';
|
|
6
6
|
export type { ImageUploaderProps } from './components/ImageUploader';
|
|
7
|
-
export type { ThemeConfig } from './types';
|
|
8
7
|
export { uploadImage, uploadImages, uploadImagesToImageBB, uploadImagesToCloudinary, } from './providers';
|
|
9
8
|
export type { UploadProvider, UploadResult, UploadProgress, UploadOptions, ImageTransformOptions, ProviderConfig, FileValidationOptions, ValidationResult, ValidationError, } from './types';
|
|
10
9
|
export { validateImageFile, validateImageDimensions, validateFileComplete, formatFileSize, isImageFile, } from './utils/validation';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAGrE,OAAO,EACL,WAAW,EACX,YAAY,EACZ,qBAAqB,EACrB,wBAAwB,GACzB,MAAM,aAAa,CAAC;AAGrB,YAAY,EACV,cAAc,EACd,YAAY,EACZ,cAAc,EACd,aAAa,EACb,qBAAqB,EACrB,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,eAAe,GAChB,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,iBAAiB,EACjB,uBAAuB,EACvB,oBAAoB,EACpB,cAAc,EACd,WAAW,GACZ,MAAM,oBAAoB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Modern image upload component with ImgBB & Cloudinary support
|
|
4
4
|
*/
|
|
5
5
|
// Component
|
|
6
|
-
export { ImageUploader
|
|
6
|
+
export { ImageUploader } from './components/ImageUploader';
|
|
7
7
|
// Upload functions
|
|
8
8
|
export { uploadImage, uploadImages, uploadImagesToImageBB, uploadImagesToCloudinary, } from './providers';
|
|
9
9
|
// Validation
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,YAAY;AACZ,OAAO,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,YAAY;AACZ,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,mBAAmB;AACnB,OAAO,EACL,WAAW,EACX,YAAY,EACZ,qBAAqB,EACrB,wBAAwB,GACzB,MAAM,aAAa,CAAC;AAerB,aAAa;AACb,OAAO,EACL,iBAAiB,EACjB,uBAAuB,EACvB,oBAAoB,EACpB,cAAc,EACd,WAAW,GACZ,MAAM,oBAAoB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ultra-image-uploader",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.2",
|
|
4
4
|
"description": "A modern, beautiful React image upload component with ImgBB & Cloudinary support",
|
|
5
|
-
"main": "dist/index.js",
|
|
6
|
-
"module": "dist/index.js",
|
|
7
|
-
"types": "dist/index.d.ts",
|
|
5
|
+
"main": "./dist/index.js",
|
|
6
|
+
"module": "./dist/index.js",
|
|
7
|
+
"types": "./dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"types": "./dist/index.d.ts",
|
|
11
|
+
"import": "./dist/index.js",
|
|
12
|
+
"require": "./dist/index.js"
|
|
13
|
+
},
|
|
14
|
+
"./package.json": "./package.json"
|
|
15
|
+
},
|
|
8
16
|
"files": [
|
|
9
17
|
"dist",
|
|
10
18
|
"README.md",
|
|
@@ -29,10 +37,9 @@
|
|
|
29
37
|
"react-component",
|
|
30
38
|
"image-uploader",
|
|
31
39
|
"multiple-upload",
|
|
32
|
-
"themes",
|
|
33
|
-
"modern-ui",
|
|
34
40
|
"progress-tracking",
|
|
35
|
-
"file-validation"
|
|
41
|
+
"file-validation",
|
|
42
|
+
"auto-imports"
|
|
36
43
|
],
|
|
37
44
|
"author": "Digontha Das",
|
|
38
45
|
"license": "MIT",
|