@ereo/plugin-images 0.1.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.
- package/README.md +197 -0
- package/dist/build/manifest.d.ts +94 -0
- package/dist/build/manifest.d.ts.map +1 -0
- package/dist/build/optimizer.d.ts +99 -0
- package/dist/build/optimizer.d.ts.map +1 -0
- package/dist/components/Image.d.ts +28 -0
- package/dist/components/Image.d.ts.map +1 -0
- package/dist/components/Picture.d.ts +36 -0
- package/dist/components/Picture.d.ts.map +1 -0
- package/dist/components/index.d.ts +9 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +3172 -0
- package/dist/components/types.d.ts +380 -0
- package/dist/components/types.d.ts.map +1 -0
- package/dist/config/defaults.d.ts +77 -0
- package/dist/config/defaults.d.ts.map +1 -0
- package/dist/config/schema.d.ts +23 -0
- package/dist/config/schema.d.ts.map +1 -0
- package/dist/index.d.ts +50 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +4870 -0
- package/dist/plugin.d.ts +28 -0
- package/dist/plugin.d.ts.map +1 -0
- package/dist/processing/blur.d.ts +78 -0
- package/dist/processing/blur.d.ts.map +1 -0
- package/dist/processing/color.d.ts +60 -0
- package/dist/processing/color.d.ts.map +1 -0
- package/dist/processing/processor.d.ts +101 -0
- package/dist/processing/processor.d.ts.map +1 -0
- package/dist/processing/sharp-processor.d.ts +74 -0
- package/dist/processing/sharp-processor.d.ts.map +1 -0
- package/dist/runtime/cache.d.ts +276 -0
- package/dist/runtime/cache.d.ts.map +1 -0
- package/dist/runtime/middleware.d.ts +29 -0
- package/dist/runtime/middleware.d.ts.map +1 -0
- package/package.json +51 -0
|
@@ -0,0 +1,380 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ereo/plugin-images - Component Type Definitions
|
|
3
|
+
*
|
|
4
|
+
* TypeScript interfaces for the Image and Picture components.
|
|
5
|
+
*/
|
|
6
|
+
import type { CSSProperties, ImgHTMLAttributes } from 'react';
|
|
7
|
+
/**
|
|
8
|
+
* Static image data from importing an image file.
|
|
9
|
+
* This is the shape of the object returned when you import an image.
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* import heroImg from './hero.jpg';
|
|
13
|
+
* // heroImg: StaticImageData
|
|
14
|
+
*/
|
|
15
|
+
export interface StaticImageData {
|
|
16
|
+
/** Source URL of the image */
|
|
17
|
+
src: string;
|
|
18
|
+
/** Original width in pixels */
|
|
19
|
+
width: number;
|
|
20
|
+
/** Original height in pixels */
|
|
21
|
+
height: number;
|
|
22
|
+
/** Base64 encoded blur placeholder (if generated) */
|
|
23
|
+
blurDataURL?: string;
|
|
24
|
+
/** Dominant color (if extracted) */
|
|
25
|
+
dominantColor?: string;
|
|
26
|
+
/** MIME type of the original image */
|
|
27
|
+
type?: string;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* Placeholder type for image loading states.
|
|
31
|
+
*/
|
|
32
|
+
export type PlaceholderType = 'blur' | 'color' | 'shimmer' | 'empty';
|
|
33
|
+
/**
|
|
34
|
+
* Object fit values for fill mode.
|
|
35
|
+
*/
|
|
36
|
+
export type ObjectFit = 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
|
|
37
|
+
/**
|
|
38
|
+
* Object position values for fill mode.
|
|
39
|
+
*/
|
|
40
|
+
export type ObjectPosition = CSSProperties['objectPosition'];
|
|
41
|
+
/**
|
|
42
|
+
* Loading attribute values.
|
|
43
|
+
*/
|
|
44
|
+
export type ImageLoading = 'lazy' | 'eager';
|
|
45
|
+
/**
|
|
46
|
+
* Decoding attribute values.
|
|
47
|
+
*/
|
|
48
|
+
export type ImageDecoding = 'async' | 'sync' | 'auto';
|
|
49
|
+
/**
|
|
50
|
+
* Custom loader function for generating image URLs.
|
|
51
|
+
*/
|
|
52
|
+
export interface ImageLoaderParams {
|
|
53
|
+
src: string;
|
|
54
|
+
width: number;
|
|
55
|
+
quality?: number;
|
|
56
|
+
}
|
|
57
|
+
export type ImageLoader = (params: ImageLoaderParams) => string;
|
|
58
|
+
/**
|
|
59
|
+
* Props for the Image component.
|
|
60
|
+
*/
|
|
61
|
+
export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'src' | 'srcSet' | 'width' | 'height' | 'loading' | 'placeholder'> {
|
|
62
|
+
/**
|
|
63
|
+
* Image source - can be a URL string or imported StaticImageData.
|
|
64
|
+
*/
|
|
65
|
+
src: string | StaticImageData;
|
|
66
|
+
/**
|
|
67
|
+
* Alt text for the image (required for accessibility).
|
|
68
|
+
*/
|
|
69
|
+
alt: string;
|
|
70
|
+
/**
|
|
71
|
+
* Width of the image in pixels.
|
|
72
|
+
* Not required if using `fill` or if src is StaticImageData.
|
|
73
|
+
*/
|
|
74
|
+
width?: number;
|
|
75
|
+
/**
|
|
76
|
+
* Height of the image in pixels.
|
|
77
|
+
* Not required if using `fill` or if src is StaticImageData.
|
|
78
|
+
*/
|
|
79
|
+
height?: number;
|
|
80
|
+
/**
|
|
81
|
+
* Fill the parent container.
|
|
82
|
+
* Parent must have position: relative, absolute, or fixed.
|
|
83
|
+
*/
|
|
84
|
+
fill?: boolean;
|
|
85
|
+
/**
|
|
86
|
+
* Object-fit CSS property when using fill mode.
|
|
87
|
+
* @default 'cover'
|
|
88
|
+
*/
|
|
89
|
+
objectFit?: ObjectFit;
|
|
90
|
+
/**
|
|
91
|
+
* Object-position CSS property when using fill mode.
|
|
92
|
+
* @default 'center'
|
|
93
|
+
*/
|
|
94
|
+
objectPosition?: ObjectPosition;
|
|
95
|
+
/**
|
|
96
|
+
* Aspect ratio to maintain (e.g., '16/9', '4/3').
|
|
97
|
+
* Can be used instead of explicit width/height.
|
|
98
|
+
*/
|
|
99
|
+
aspectRatio?: string;
|
|
100
|
+
/**
|
|
101
|
+
* Sizes attribute for responsive images.
|
|
102
|
+
* Describes how wide the image will be at various breakpoints.
|
|
103
|
+
*
|
|
104
|
+
* @example
|
|
105
|
+
* sizes="(max-width: 768px) 100vw, 50vw"
|
|
106
|
+
*/
|
|
107
|
+
sizes?: string;
|
|
108
|
+
/**
|
|
109
|
+
* Placeholder to show while loading.
|
|
110
|
+
* - 'blur': Use blurDataURL or auto-generated blur
|
|
111
|
+
* - 'color': Use dominant color as background
|
|
112
|
+
* - 'shimmer': Animated shimmer effect
|
|
113
|
+
* - 'empty': No placeholder (default)
|
|
114
|
+
*/
|
|
115
|
+
placeholder?: PlaceholderType;
|
|
116
|
+
/**
|
|
117
|
+
* Custom blur data URL (base64).
|
|
118
|
+
* Only used when placeholder='blur'.
|
|
119
|
+
*/
|
|
120
|
+
blurDataURL?: string;
|
|
121
|
+
/**
|
|
122
|
+
* Quality of the optimized image (1-100).
|
|
123
|
+
* @default 80
|
|
124
|
+
*/
|
|
125
|
+
quality?: number;
|
|
126
|
+
/**
|
|
127
|
+
* Mark as high priority (preload).
|
|
128
|
+
* Use for above-the-fold images.
|
|
129
|
+
*/
|
|
130
|
+
priority?: boolean;
|
|
131
|
+
/**
|
|
132
|
+
* Loading strategy.
|
|
133
|
+
* @default 'lazy' unless priority is true
|
|
134
|
+
*/
|
|
135
|
+
loading?: ImageLoading;
|
|
136
|
+
/**
|
|
137
|
+
* Decoding strategy.
|
|
138
|
+
* @default 'async'
|
|
139
|
+
*/
|
|
140
|
+
decoding?: ImageDecoding;
|
|
141
|
+
/**
|
|
142
|
+
* Custom loader function for generating image URLs.
|
|
143
|
+
* Useful for external image services (Cloudinary, Imgix, etc.).
|
|
144
|
+
*/
|
|
145
|
+
loader?: ImageLoader;
|
|
146
|
+
/**
|
|
147
|
+
* Disable automatic optimization.
|
|
148
|
+
* Use when you need the original image.
|
|
149
|
+
*/
|
|
150
|
+
unoptimized?: boolean;
|
|
151
|
+
/**
|
|
152
|
+
* Callback when the image has loaded.
|
|
153
|
+
*/
|
|
154
|
+
onLoad?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
|
|
155
|
+
/**
|
|
156
|
+
* Callback when loading fails.
|
|
157
|
+
*/
|
|
158
|
+
onError?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
|
|
159
|
+
}
|
|
160
|
+
/**
|
|
161
|
+
* Art direction source for Picture component.
|
|
162
|
+
*/
|
|
163
|
+
export interface PictureSource {
|
|
164
|
+
/**
|
|
165
|
+
* Image source for this breakpoint.
|
|
166
|
+
*/
|
|
167
|
+
src: string | StaticImageData;
|
|
168
|
+
/**
|
|
169
|
+
* Media query for when to use this source.
|
|
170
|
+
* @example "(max-width: 640px)"
|
|
171
|
+
*/
|
|
172
|
+
media?: string;
|
|
173
|
+
/**
|
|
174
|
+
* MIME type hint for the browser.
|
|
175
|
+
*/
|
|
176
|
+
type?: string;
|
|
177
|
+
/**
|
|
178
|
+
* Width of this variant.
|
|
179
|
+
*/
|
|
180
|
+
width?: number;
|
|
181
|
+
/**
|
|
182
|
+
* Height of this variant.
|
|
183
|
+
*/
|
|
184
|
+
height?: number;
|
|
185
|
+
/**
|
|
186
|
+
* Sizes attribute for this source.
|
|
187
|
+
*/
|
|
188
|
+
sizes?: string;
|
|
189
|
+
}
|
|
190
|
+
/**
|
|
191
|
+
* Props for the Picture component (art direction).
|
|
192
|
+
*/
|
|
193
|
+
export interface PictureProps extends Omit<ImageProps, 'src' | 'width' | 'height'> {
|
|
194
|
+
/**
|
|
195
|
+
* Array of sources for different breakpoints/formats.
|
|
196
|
+
* Listed in order of preference (first match wins).
|
|
197
|
+
*/
|
|
198
|
+
sources: PictureSource[];
|
|
199
|
+
/**
|
|
200
|
+
* Fallback source (used when no source matches).
|
|
201
|
+
* If not provided, the last source in the array is used.
|
|
202
|
+
*/
|
|
203
|
+
fallback?: string | StaticImageData;
|
|
204
|
+
/**
|
|
205
|
+
* Fallback width.
|
|
206
|
+
*/
|
|
207
|
+
width?: number;
|
|
208
|
+
/**
|
|
209
|
+
* Fallback height.
|
|
210
|
+
*/
|
|
211
|
+
height?: number;
|
|
212
|
+
}
|
|
213
|
+
/**
|
|
214
|
+
* Plugin configuration for image optimization.
|
|
215
|
+
*/
|
|
216
|
+
export interface ImagePluginConfig {
|
|
217
|
+
/**
|
|
218
|
+
* Allowed remote image patterns.
|
|
219
|
+
* Images from other domains will only be optimized if they match.
|
|
220
|
+
*/
|
|
221
|
+
remotePatterns?: RemotePattern[];
|
|
222
|
+
/**
|
|
223
|
+
* Output formats to generate.
|
|
224
|
+
* @default { webp: true, avif: false }
|
|
225
|
+
*/
|
|
226
|
+
formats?: {
|
|
227
|
+
webp?: boolean;
|
|
228
|
+
avif?: boolean;
|
|
229
|
+
jpeg?: boolean;
|
|
230
|
+
png?: boolean;
|
|
231
|
+
};
|
|
232
|
+
/**
|
|
233
|
+
* Default quality for optimized images.
|
|
234
|
+
* @default 80
|
|
235
|
+
*/
|
|
236
|
+
quality?: number;
|
|
237
|
+
/**
|
|
238
|
+
* Device sizes for responsive images.
|
|
239
|
+
*/
|
|
240
|
+
sizes?: {
|
|
241
|
+
/**
|
|
242
|
+
* Device widths for srcset generation.
|
|
243
|
+
* @default [640, 750, 828, 1080, 1200, 1920, 2048, 3840]
|
|
244
|
+
*/
|
|
245
|
+
deviceSizes?: number[];
|
|
246
|
+
/**
|
|
247
|
+
* Image widths for srcset generation.
|
|
248
|
+
* @default [16, 32, 48, 64, 96, 128, 256, 384]
|
|
249
|
+
*/
|
|
250
|
+
imageSizes?: number[];
|
|
251
|
+
};
|
|
252
|
+
/**
|
|
253
|
+
* Minimum size difference (%) to create a new variant.
|
|
254
|
+
* @default 20
|
|
255
|
+
*/
|
|
256
|
+
minimumCacheTTL?: number;
|
|
257
|
+
/**
|
|
258
|
+
* Domains allowed for remote images (legacy, use remotePatterns).
|
|
259
|
+
* @deprecated Use remotePatterns instead
|
|
260
|
+
*/
|
|
261
|
+
domains?: string[];
|
|
262
|
+
/**
|
|
263
|
+
* Directory for cached/optimized images.
|
|
264
|
+
* @default '.ereo/images'
|
|
265
|
+
*/
|
|
266
|
+
cacheDir?: string;
|
|
267
|
+
/**
|
|
268
|
+
* Generate blur placeholders at build time.
|
|
269
|
+
* @default true
|
|
270
|
+
*/
|
|
271
|
+
generateBlurPlaceholder?: boolean;
|
|
272
|
+
/**
|
|
273
|
+
* Extract dominant colors at build time.
|
|
274
|
+
* @default true
|
|
275
|
+
*/
|
|
276
|
+
extractDominantColor?: boolean;
|
|
277
|
+
/**
|
|
278
|
+
* Maximum image dimension (width or height).
|
|
279
|
+
* @default 3840
|
|
280
|
+
*/
|
|
281
|
+
maxDimension?: number;
|
|
282
|
+
/**
|
|
283
|
+
* Path prefix for optimized images.
|
|
284
|
+
* @default '/_ereo/image'
|
|
285
|
+
*/
|
|
286
|
+
path?: string;
|
|
287
|
+
/**
|
|
288
|
+
* Dangerously allow any remote image.
|
|
289
|
+
* @default false
|
|
290
|
+
*/
|
|
291
|
+
dangerouslyAllowAllRemote?: boolean;
|
|
292
|
+
}
|
|
293
|
+
/**
|
|
294
|
+
* Remote image pattern for allowlisting.
|
|
295
|
+
*/
|
|
296
|
+
export interface RemotePattern {
|
|
297
|
+
/**
|
|
298
|
+
* Protocol (http or https).
|
|
299
|
+
*/
|
|
300
|
+
protocol?: 'http' | 'https';
|
|
301
|
+
/**
|
|
302
|
+
* Hostname pattern (supports wildcards).
|
|
303
|
+
* @example 'cdn.example.com' or '*.example.com'
|
|
304
|
+
*/
|
|
305
|
+
hostname: string;
|
|
306
|
+
/**
|
|
307
|
+
* Port number.
|
|
308
|
+
*/
|
|
309
|
+
port?: string;
|
|
310
|
+
/**
|
|
311
|
+
* Path prefix pattern.
|
|
312
|
+
* @example '/images/*'
|
|
313
|
+
*/
|
|
314
|
+
pathname?: string;
|
|
315
|
+
}
|
|
316
|
+
/**
|
|
317
|
+
* Image manifest entry (stored at build time).
|
|
318
|
+
*/
|
|
319
|
+
export interface ImageManifestEntry {
|
|
320
|
+
/** Original source path */
|
|
321
|
+
src: string;
|
|
322
|
+
/** Original width */
|
|
323
|
+
width: number;
|
|
324
|
+
/** Original height */
|
|
325
|
+
height: number;
|
|
326
|
+
/** Generated variants */
|
|
327
|
+
variants: ImageVariant[];
|
|
328
|
+
/** Blur placeholder data URL */
|
|
329
|
+
blurDataURL?: string;
|
|
330
|
+
/** Dominant color */
|
|
331
|
+
dominantColor?: string;
|
|
332
|
+
/** File hash for cache busting */
|
|
333
|
+
hash: string;
|
|
334
|
+
}
|
|
335
|
+
/**
|
|
336
|
+
* Generated image variant.
|
|
337
|
+
*/
|
|
338
|
+
export interface ImageVariant {
|
|
339
|
+
/** Output path */
|
|
340
|
+
path: string;
|
|
341
|
+
/** Width */
|
|
342
|
+
width: number;
|
|
343
|
+
/** Height */
|
|
344
|
+
height: number;
|
|
345
|
+
/** Format */
|
|
346
|
+
format: 'webp' | 'avif' | 'jpeg' | 'png';
|
|
347
|
+
/** File size in bytes */
|
|
348
|
+
size: number;
|
|
349
|
+
}
|
|
350
|
+
/**
|
|
351
|
+
* Image optimization parameters (for runtime).
|
|
352
|
+
*/
|
|
353
|
+
export interface ImageOptimizationParams {
|
|
354
|
+
/** Source image path or URL */
|
|
355
|
+
src: string;
|
|
356
|
+
/** Target width */
|
|
357
|
+
width: number;
|
|
358
|
+
/** Target height (optional, maintains aspect ratio if omitted) */
|
|
359
|
+
height?: number;
|
|
360
|
+
/** Quality (1-100) */
|
|
361
|
+
quality?: number;
|
|
362
|
+
/** Output format */
|
|
363
|
+
format?: 'auto' | 'webp' | 'avif' | 'jpeg' | 'png';
|
|
364
|
+
}
|
|
365
|
+
/**
|
|
366
|
+
* Image processing result.
|
|
367
|
+
*/
|
|
368
|
+
export interface ProcessedImage {
|
|
369
|
+
/** Processed image buffer */
|
|
370
|
+
buffer: Buffer;
|
|
371
|
+
/** MIME type */
|
|
372
|
+
contentType: string;
|
|
373
|
+
/** Width */
|
|
374
|
+
width: number;
|
|
375
|
+
/** Height */
|
|
376
|
+
height: number;
|
|
377
|
+
/** Format */
|
|
378
|
+
format: string;
|
|
379
|
+
}
|
|
380
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/components/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ereo/plugin-images - Default Configuration
|
|
3
|
+
*
|
|
4
|
+
* Default values for the image optimization plugin.
|
|
5
|
+
*/
|
|
6
|
+
import type { ImagePluginConfig } from '../components/types';
|
|
7
|
+
/**
|
|
8
|
+
* Default device sizes for responsive srcset generation.
|
|
9
|
+
* These cover common device widths from mobile to 4K.
|
|
10
|
+
*/
|
|
11
|
+
export declare const DEFAULT_DEVICE_SIZES: number[];
|
|
12
|
+
/**
|
|
13
|
+
* Default image sizes for smaller images (icons, avatars, etc.).
|
|
14
|
+
*/
|
|
15
|
+
export declare const DEFAULT_IMAGE_SIZES: number[];
|
|
16
|
+
/**
|
|
17
|
+
* All available widths for srcset (device sizes + image sizes, sorted).
|
|
18
|
+
*/
|
|
19
|
+
export declare const ALL_SIZES: number[];
|
|
20
|
+
/**
|
|
21
|
+
* Default image quality (1-100).
|
|
22
|
+
*/
|
|
23
|
+
export declare const DEFAULT_QUALITY = 80;
|
|
24
|
+
/**
|
|
25
|
+
* Maximum allowed dimension (width or height).
|
|
26
|
+
*/
|
|
27
|
+
export declare const MAX_DIMENSION = 3840;
|
|
28
|
+
/**
|
|
29
|
+
* Minimum cache TTL in seconds.
|
|
30
|
+
*/
|
|
31
|
+
export declare const MIN_CACHE_TTL = 60;
|
|
32
|
+
/**
|
|
33
|
+
* Default cache TTL in seconds (1 year).
|
|
34
|
+
*/
|
|
35
|
+
export declare const DEFAULT_CACHE_TTL = 31536000;
|
|
36
|
+
/**
|
|
37
|
+
* Blur placeholder width (for generating tiny blur images).
|
|
38
|
+
*/
|
|
39
|
+
export declare const BLUR_WIDTH = 8;
|
|
40
|
+
/**
|
|
41
|
+
* URL path prefix for the image optimization endpoint.
|
|
42
|
+
*/
|
|
43
|
+
export declare const IMAGE_PATH_PREFIX = "/_ereo/image";
|
|
44
|
+
/**
|
|
45
|
+
* Cache directory for optimized images.
|
|
46
|
+
*/
|
|
47
|
+
export declare const CACHE_DIR = ".ereo/images";
|
|
48
|
+
/**
|
|
49
|
+
* Supported input formats for processing.
|
|
50
|
+
*/
|
|
51
|
+
export declare const SUPPORTED_INPUT_FORMATS: string[];
|
|
52
|
+
/**
|
|
53
|
+
* Supported output formats.
|
|
54
|
+
*/
|
|
55
|
+
export declare const SUPPORTED_OUTPUT_FORMATS: readonly ["webp", "avif", "jpeg", "png"];
|
|
56
|
+
/**
|
|
57
|
+
* MIME types for image formats.
|
|
58
|
+
*/
|
|
59
|
+
export declare const FORMAT_MIME_TYPES: Record<string, string>;
|
|
60
|
+
/**
|
|
61
|
+
* File extensions for image formats.
|
|
62
|
+
*/
|
|
63
|
+
export declare const FORMAT_EXTENSIONS: Record<string, string>;
|
|
64
|
+
/**
|
|
65
|
+
* Default plugin configuration.
|
|
66
|
+
*/
|
|
67
|
+
export declare const DEFAULT_CONFIG: Required<ImagePluginConfig>;
|
|
68
|
+
/**
|
|
69
|
+
* Get all available sizes for srcset generation.
|
|
70
|
+
*/
|
|
71
|
+
export declare function getAllSizes(config: ImagePluginConfig): number[];
|
|
72
|
+
/**
|
|
73
|
+
* Get sizes appropriate for a given target width.
|
|
74
|
+
* Returns only sizes up to 2x the target width.
|
|
75
|
+
*/
|
|
76
|
+
export declare function getSizesForWidth(targetWidth: number, config: ImagePluginConfig): number[];
|
|
77
|
+
//# sourceMappingURL=defaults.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"defaults.d.ts","sourceRoot":"","sources":["../../src/config/defaults.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D;;;GAGG;AACH,eAAO,MAAM,oBAAoB,UAAgD,CAAC;AAElF;;GAEG;AACH,eAAO,MAAM,mBAAmB,UAAsC,CAAC;AAEvE;;GAEG;AACH,eAAO,MAAM,SAAS,UAErB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC;;GAEG;AACH,eAAO,MAAM,aAAa,OAAO,CAAC;AAElC;;GAEG;AACH,eAAO,MAAM,aAAa,KAAK,CAAC;AAEhC;;GAEG;AACH,eAAO,MAAM,iBAAiB,WAAW,CAAC;AAE1C;;GAEG;AACH,eAAO,MAAM,UAAU,IAAI,CAAC;AAE5B;;GAEG;AACH,eAAO,MAAM,iBAAiB,iBAAiB,CAAC;AAEhD;;GAEG;AACH,eAAO,MAAM,SAAS,iBAAiB,CAAC;AAExC;;GAEG;AACH,eAAO,MAAM,uBAAuB,UAAuD,CAAC;AAE5F;;GAEG;AACH,eAAO,MAAM,wBAAwB,0CAA2C,CAAC;AAEjF;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAQpD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAMpD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,QAAQ,CAAC,iBAAiB,CAqBtD,CAAC;AAEF;;GAEG;AACH,wBAAgB,WAAW,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,EAAE,CAI/D;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB,GAAG,MAAM,EAAE,CAIzF"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ereo/plugin-images - Configuration Validation
|
|
3
|
+
*
|
|
4
|
+
* Schema validation for plugin configuration.
|
|
5
|
+
*/
|
|
6
|
+
import type { ImagePluginConfig, RemotePattern } from '../components/types';
|
|
7
|
+
/**
|
|
8
|
+
* Validation error with details.
|
|
9
|
+
*/
|
|
10
|
+
export declare class ConfigValidationError extends Error {
|
|
11
|
+
field: string;
|
|
12
|
+
value: unknown;
|
|
13
|
+
constructor(message: string, field: string, value: unknown);
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Validate and normalize plugin configuration.
|
|
17
|
+
*/
|
|
18
|
+
export declare function validateConfig(config?: ImagePluginConfig): Required<ImagePluginConfig>;
|
|
19
|
+
/**
|
|
20
|
+
* Check if a URL matches the allowed remote patterns.
|
|
21
|
+
*/
|
|
22
|
+
export declare function matchesRemotePattern(url: URL, patterns: RemotePattern[], domains?: string[]): boolean;
|
|
23
|
+
//# sourceMappingURL=schema.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../src/config/schema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAG5E;;GAEG;AACH,qBAAa,qBAAsB,SAAQ,KAAK;IAGrC,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,OAAO;gBAFrB,OAAO,EAAE,MAAM,EACR,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,OAAO;CAKxB;AAyJD;;GAEG;AACH,wBAAgB,cAAc,CAAC,MAAM,GAAE,iBAAsB,GAAG,QAAQ,CAAC,iBAAiB,CAAC,CA2E1F;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,aAAa,EAAE,EACzB,OAAO,GAAE,MAAM,EAAO,GACrB,OAAO,CAyCT"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ereo/plugin-images
|
|
3
|
+
*
|
|
4
|
+
* Complete image optimization system for EreoJS.
|
|
5
|
+
* Provides automatic image optimization, blur placeholders,
|
|
6
|
+
* responsive srcset generation, and art direction support.
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* // ereo.config.ts
|
|
10
|
+
* import images from '@ereo/plugin-images';
|
|
11
|
+
*
|
|
12
|
+
* export default defineConfig({
|
|
13
|
+
* plugins: [
|
|
14
|
+
* images({
|
|
15
|
+
* formats: { webp: true, avif: true },
|
|
16
|
+
* quality: 80,
|
|
17
|
+
* }),
|
|
18
|
+
* ],
|
|
19
|
+
* });
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* // In your components
|
|
23
|
+
* import { Image, Picture } from '@ereo/plugin-images/components';
|
|
24
|
+
* import heroImg from './hero.jpg';
|
|
25
|
+
*
|
|
26
|
+
* function Hero() {
|
|
27
|
+
* return (
|
|
28
|
+
* <Image
|
|
29
|
+
* src={heroImg}
|
|
30
|
+
* alt="Hero image"
|
|
31
|
+
* placeholder="blur"
|
|
32
|
+
* priority
|
|
33
|
+
* />
|
|
34
|
+
* );
|
|
35
|
+
* }
|
|
36
|
+
*/
|
|
37
|
+
export { imagesPlugin as default, imagesPlugin } from './plugin';
|
|
38
|
+
export { Image, Picture } from './components/index';
|
|
39
|
+
export type { ImageProps, PictureProps, PictureSource, StaticImageData, PlaceholderType, ObjectFit, ObjectPosition, ImageLoading, ImageDecoding, ImageLoader, ImageLoaderParams, ImagePluginConfig, RemotePattern, ImageManifestEntry, ImageVariant, ImageOptimizationParams, ProcessedImage, } from './components/types';
|
|
40
|
+
export { createImageProcessor, ImageProcessor } from './processing/processor';
|
|
41
|
+
export { createSharpProcessor, SharpProcessor } from './processing/sharp-processor';
|
|
42
|
+
export { generateBlurPlaceholder, generateShimmerSVG, generateShimmerDataURL, } from './processing/blur';
|
|
43
|
+
export { extractDominantColor, rgbToHex, hexToRgb, getContrastColor, } from './processing/color';
|
|
44
|
+
export { createBuildOptimizer, optimizeImages, BuildOptimizer } from './build/optimizer';
|
|
45
|
+
export { createManifestManager, ImageManifestManager } from './build/manifest';
|
|
46
|
+
export { createImageMiddleware, imageMiddleware } from './runtime/middleware';
|
|
47
|
+
export { MemoryCache, DiskCache, TwoTierCache, generateCacheKey } from './runtime/cache';
|
|
48
|
+
export { validateConfig, matchesRemotePattern, ConfigValidationError } from './config/schema';
|
|
49
|
+
export { DEFAULT_DEVICE_SIZES, DEFAULT_IMAGE_SIZES, DEFAULT_QUALITY, MAX_DIMENSION, IMAGE_PATH_PREFIX, SUPPORTED_INPUT_FORMATS, SUPPORTED_OUTPUT_FORMATS, FORMAT_MIME_TYPES, getAllSizes, getSizesForWidth, } from './config/defaults';
|
|
50
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAGH,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAGjE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAGpD,YAAY,EACV,UAAU,EACV,YAAY,EACZ,aAAa,EACb,eAAe,EACf,eAAe,EACf,SAAS,EACT,cAAc,EACd,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,uBAAuB,EACvB,cAAc,GACf,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AACpF,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,sBAAsB,GACvB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,oBAAoB,EACpB,QAAQ,EACR,QAAQ,EACR,gBAAgB,GACjB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACzF,OAAO,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAG/E,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAC9E,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGzF,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAC9F,OAAO,EACL,oBAAoB,EACpB,mBAAmB,EACnB,eAAe,EACf,aAAa,EACb,iBAAiB,EACjB,uBAAuB,EACvB,wBAAwB,EACxB,iBAAiB,EACjB,WAAW,EACX,gBAAgB,GACjB,MAAM,mBAAmB,CAAC"}
|