@imgly/plugin-ai-image-generation-web 0.1.10 → 0.2.1

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/CHANGELOG.md CHANGED
@@ -2,6 +2,41 @@
2
2
 
3
3
  ## [Unreleased]
4
4
 
5
+ ## [0.2.1] - 2025-07-15
6
+
7
+ - [ai-apps] Fix issue where AI apps panel displayed empty content when no provider app was available
8
+ - [ai-apps] Maintain backwards compatibility by registering legacy AI apps ID, alongside new `ly.img.ai.apps` panel ID
9
+
10
+ ## [0.2.0] - 2025-07-15
11
+
12
+ ### Breaking Changes
13
+
14
+ - [all] **Provider Initialization**: `initProvider` is replaced with `initializeProviders` and `initializeProvider` with a different signature
15
+ - [all] **Quick Actions Structure**: `provider.input.quickctions.actions` replaced with `provider.input.quickActions.supported`
16
+ - [all] **History Asset Sources**: Combined history asset source is now not added to the default asset libraries anymore. Add the following sources to any library entry (default or not):
17
+ - Image Generation History: `ly.img.ai.image-generation.history`
18
+ - Video Generation History: `ly.img.ai.video-generation.history`
19
+ - Audio Generation History: `ly.img.ai.audio-generation.history`
20
+ - Sticker Generation History: `ly.img.ai.sticker-generation.history`
21
+ - [all] **ID Format Standardization**: All `ly.img.ai/` prefixed IDs changed to use dot notation `ly.img.ai.` for consistency
22
+ - Panel IDs: `ly.img.ai/apps` → `ly.img.ai.apps`, `ly.img.ai/image-generation` → `ly.img.ai.image-generation`
23
+ - Dock IDs: `ly.img.ai/apps.dock` → `ly.img.ai.apps.dock`
24
+
25
+ ### New Features
26
+
27
+ - [all] **Multiple Providers Support**: All plugin packages now support arrays of providers with automatic selection UI
28
+ - [image-generation] **Recraft20b Provider**: Added new Recraft20b (v2) provider via fal.ai with support for icon styles including `broken_line`, `colored_outline`, `colored_shapes`, and more
29
+ - [sticker-generation] **New Sticker Generation Plugin**: Added `@imgly/plugin-ai-sticker-generation-web` plugin for AI-powered sticker generation with support for text-to-sticker generation using Recraft20b provider with icon styles
30
+ - [image-generation] **Flux Pro Kontext Provider**: Added Flux Pro Kontext provider for image editing with style transfer and artist style options
31
+ - [image-generation] **Flux Pro Kontext Max Provider**: Added Flux Pro Kontext Max provider for enhanced image editing capabilities
32
+ - [video-generation] **Veo3 Provider**: Added Veo3 text-to-video provider via fal.ai with support for 16:9, 9:16, and 1:1 aspect ratios and 8-second duration
33
+ - [video-generation] **Kling Video V2.1 Master Providers**: Added Kling Video V2.1 Master providers for both text-to-video and image-to-video generation with configurable duration (5s/10s) and aspect ratios
34
+ - [text-generation] **Model Selection**: OpenAI and Anthropic providers now support configurable model selection through the `model` parameter
35
+
36
+ ### Deprecated Features
37
+
38
+ - [all] **Middleware Configuration**: The `middleware` property in provider configurations is deprecated. Use `middlewares` instead. The old property will continue to work for now.
39
+
5
40
  ## [0.1.10] - 2025-06-20
6
41
 
7
42
  - [all] Fix issue with GPT provider when using text provider
package/README.md CHANGED
@@ -27,6 +27,8 @@ npm install @imgly/plugin-ai-image-generation-web
27
27
 
28
28
  To use the plugin, import it and configure it with your preferred providers:
29
29
 
30
+ #### Single Provider Configuration
31
+
30
32
  ```typescript
31
33
  import CreativeEditorSDK from '@cesdk/cesdk-js';
32
34
  import ImageGeneration from '@imgly/plugin-ai-image-generation-web';
@@ -44,12 +46,29 @@ CreativeEditorSDK.create(domElement, {
44
46
  ImageGeneration({
45
47
  // Text-to-image provider
46
48
  text2image: FalAiImage.RecraftV3({
47
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
49
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
50
+ headers: {
51
+ 'x-custom-header': 'value',
52
+ 'x-client-version': '1.0.0'
53
+ }
48
54
  }),
49
55
 
56
+ // Alternative: Use Recraft20b with icon style support
57
+ // text2image: FalAiImage.Recraft20b({
58
+ // proxyUrl: 'http://your-proxy-server.com/api/proxy',
59
+ // headers: {
60
+ // 'x-custom-header': 'value',
61
+ // 'x-client-version': '1.0.0'
62
+ // }
63
+ // }),
64
+
50
65
  // Image-to-image provider (optional)
51
66
  image2image: FalAiImage.GeminiFlashEdit({
52
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
67
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
68
+ headers: {
69
+ 'x-custom-header': 'value',
70
+ 'x-client-version': '1.0.0'
71
+ }
53
72
  }),
54
73
 
55
74
  // Optional configuration
@@ -57,25 +76,75 @@ CreativeEditorSDK.create(domElement, {
57
76
  dryRun: false
58
77
  })
59
78
  );
60
-
61
- // Alternatively, use OpenAI providers
62
- // cesdk.addPlugin(
63
- // ImageGeneration({
64
- // // Text-to-image provider
65
- // text2image: OpenAiImage.GptImage1.Text2Image({
66
- // proxyUrl: 'https://your-openai-proxy.example.com'
67
- // }),
68
- //
69
- // // Image-to-image provider (optional)
70
- // image2image: OpenAiImage.GptImage1.Image2Image({
71
- // proxyUrl: 'https://your-openai-proxy.example.com'
72
- // }),
73
- //
74
- // // Optional configuration
75
- // debug: false,
76
- // dryRun: false
77
- // })
78
- // );
79
+ });
80
+ ```
81
+
82
+ #### Multiple Providers Configuration
83
+
84
+ You can configure multiple providers for each generation type, and users will see a selection box to choose between them:
85
+
86
+ ```typescript
87
+ import CreativeEditorSDK from '@cesdk/cesdk-js';
88
+ import ImageGeneration from '@imgly/plugin-ai-image-generation-web';
89
+ import FalAiImage from '@imgly/plugin-ai-image-generation-web/fal-ai';
90
+ import OpenAiImage from '@imgly/plugin-ai-image-generation-web/open-ai';
91
+
92
+ // Initialize CreativeEditor SDK
93
+ CreativeEditorSDK.create(domElement, {
94
+ license: 'your-license-key',
95
+ // Other configuration options...
96
+ }).then(async (cesdk) => {
97
+ // Add the image generation plugin with multiple providers
98
+ cesdk.addPlugin(
99
+ ImageGeneration({
100
+ // Multiple text-to-image providers
101
+ text2image: [
102
+ FalAiImage.RecraftV3({
103
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
104
+ headers: {
105
+ 'x-custom-header': 'value',
106
+ 'x-client-version': '1.0.0'
107
+ }
108
+ }),
109
+ FalAiImage.Recraft20b({
110
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
111
+ headers: {
112
+ 'x-custom-header': 'value',
113
+ 'x-client-version': '1.0.0'
114
+ }
115
+ }),
116
+ OpenAiImage.GptImage1.Text2Image({
117
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
118
+ headers: {
119
+ 'x-api-key': 'your-key',
120
+ 'x-request-source': 'cesdk-plugin'
121
+ }
122
+ })
123
+ ],
124
+
125
+ // Multiple image-to-image providers (optional)
126
+ image2image: [
127
+ FalAiImage.GeminiFlashEdit({
128
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
129
+ headers: {
130
+ 'x-custom-header': 'value',
131
+ 'x-client-version': '1.0.0'
132
+ }
133
+ }),
134
+ OpenAiImage.GptImage1.Image2Image({
135
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
136
+ headers: {
137
+ 'x-api-key': 'your-key',
138
+ 'x-request-source': 'cesdk-plugin'
139
+ }
140
+ })
141
+ ],
142
+
143
+ // Optional configuration
144
+ debug: false,
145
+ dryRun: false
146
+ })
147
+ );
79
148
  });
80
149
  ```
81
150
 
@@ -89,7 +158,11 @@ A versatile text-to-image model from fal.ai that generates images based on text
89
158
 
90
159
  ```typescript
91
160
  text2image: FalAiImage.RecraftV3({
92
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
161
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
162
+ headers: {
163
+ 'x-custom-header': 'value',
164
+ 'x-client-version': '1.0.0'
165
+ }
93
166
  })
94
167
  ```
95
168
 
@@ -98,14 +171,41 @@ Key features:
98
171
  - Various image size presets
99
172
  - Custom dimensions support
100
173
  - Adjustable quality settings
174
+ - Custom headers support for API requests
101
175
 
102
- #### 2. GptImage1.Text2Image (Text-to-Image)
176
+ #### 2. Recraft20b (Text-to-Image)
177
+
178
+ An enhanced text-to-image model from fal.ai with additional icon style support:
179
+
180
+ ```typescript
181
+ text2image: FalAiImage.Recraft20b({
182
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
183
+ headers: {
184
+ 'x-custom-header': 'value',
185
+ 'x-client-version': '1.0.0'
186
+ }
187
+ })
188
+ ```
189
+
190
+ Key features:
191
+ - All RecraftV3 features (realistic, illustration, vector styles)
192
+ - **New icon styles**: broken_line, colored_outline, colored_shapes, doodle_fill, and more
193
+ - Three-way style selection (image/vector/icon)
194
+ - Same image size presets and custom dimensions support
195
+ - Cost-effective alternative to RecraftV3
196
+ - Custom headers support for API requests
197
+
198
+ #### 3. GptImage1.Text2Image (Text-to-Image)
103
199
 
104
200
  OpenAI's GPT-4 Vision based text-to-image model that generates high-quality images:
105
201
 
106
202
  ```typescript
107
203
  text2image: OpenAiImage.GptImage1.Text2Image({
108
- proxyUrl: 'https://your-openai-proxy.example.com'
204
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
205
+ headers: {
206
+ 'x-api-key': 'your-key',
207
+ 'x-request-source': 'cesdk-plugin'
208
+ }
109
209
  })
110
210
  ```
111
211
 
@@ -114,14 +214,19 @@ Key features:
114
214
  - Multiple size options (1024×1024, 1536×1024, 1024×1536)
115
215
  - Background transparency options
116
216
  - Automatic prompt optimization
217
+ - Custom headers support for API requests
117
218
 
118
- #### 3. GeminiFlashEdit (Image-to-Image)
219
+ #### 4. GeminiFlashEdit (Image-to-Image)
119
220
 
120
221
  An image modification model from fal.ai that transforms existing images:
121
222
 
122
223
  ```typescript
123
224
  image2image: FalAiImage.GeminiFlashEdit({
124
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
225
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
226
+ headers: {
227
+ 'x-custom-header': 'value',
228
+ 'x-client-version': '1.0.0'
229
+ }
125
230
  })
126
231
  ```
127
232
 
@@ -130,14 +235,19 @@ Key features:
130
235
  - Available directly through canvas quick actions
131
236
  - Maintains original image dimensions
132
237
  - Includes style presets and artist-specific transformations
238
+ - Custom headers support for API requests
133
239
 
134
- #### 4. GptImage1.Image2Image (Image-to-Image)
240
+ #### 5. GptImage1.Image2Image (Image-to-Image)
135
241
 
136
242
  OpenAI's GPT-4 Vision based image editing model that can transform existing images:
137
243
 
138
244
  ```typescript
139
245
  image2image: OpenAiImage.GptImage1.Image2Image({
140
- proxyUrl: 'https://your-openai-proxy.example.com'
246
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
247
+ headers: {
248
+ 'x-api-key': 'your-key',
249
+ 'x-request-source': 'cesdk-plugin'
250
+ }
141
251
  })
142
252
  ```
143
253
 
@@ -146,6 +256,38 @@ Key features:
146
256
  - Supports the same quick actions as GeminiFlashEdit
147
257
  - Maintains original image dimensions
148
258
  - Can be used as a direct alternative to GeminiFlashEdit
259
+ - Custom headers support for API requests
260
+
261
+ #### 5. FluxProKontextEdit (Image-to-Image)
262
+
263
+ A versatile image editing model that applies stylistic changes and transformations:
264
+
265
+ ```typescript
266
+ image2image: FalAiImage.FluxProKontextEdit({
267
+ proxyUrl: 'http://your-proxy-server.com/api/proxy'
268
+ })
269
+ ```
270
+
271
+ Key features:
272
+ - Change existing images with text prompts
273
+ - Built-in quick actions for style transfer, artist styles, background swapping, and variants
274
+ - Keeps original image dimensions
275
+
276
+ #### 6. FluxProKontextMaxEdit (Image-to-Image)
277
+
278
+ A high-quality variant of FluxProKontext offering more detailed results:
279
+
280
+ ```typescript
281
+ image2image: FalAiImage.FluxProKontextMaxEdit({
282
+ proxyUrl: 'http://your-proxy-server.com/api/proxy'
283
+ })
284
+ ```
285
+
286
+ Key features:
287
+ - All capabilities of FluxProKontextEdit with enhanced quality
288
+ - Style transfer & artist presets
289
+ - Maintains original dimensions
290
+ - Canvas quick-action integration
149
291
 
150
292
  ### Configuration Options
151
293
 
@@ -153,8 +295,8 @@ The plugin accepts the following configuration options:
153
295
 
154
296
  | Option | Type | Description | Default |
155
297
  |--------|------|-------------|---------|
156
- | `text2image` | Provider | Provider for text-to-image generation | undefined |
157
- | `image2image` | Provider | Provider for image-to-image transformation | undefined |
298
+ | `text2image` | Provider \| Provider[] | Provider(s) for text-to-image generation. When multiple providers are provided, users can select between them | undefined |
299
+ | `image2image` | Provider \| Provider[] | Provider(s) for image-to-image transformation. When multiple providers are provided, users can select between them | undefined |
158
300
  | `debug` | boolean | Enable debug logging | false |
159
301
  | `dryRun` | boolean | Simulate generation without API calls | false |
160
302
  | `middleware` | Function[] | Array of middleware functions to extend the generation process | undefined |
@@ -183,8 +325,9 @@ const rateLimit = rateLimitMiddleware({
183
325
  cesdk.addPlugin(
184
326
  ImageGeneration({
185
327
  text2image: FalAiImage.RecraftV3({
186
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
328
+ proxyUrl: 'http://your-proxy-server.com/api/proxy'
187
329
  }),
330
+ // Or use: FalAiImage.Recraft20b({ proxyUrl: 'http://your-proxy-server.com/api/proxy' }),
188
331
  middleware: [logging, rateLimit] // Apply middleware in order
189
332
  })
190
333
  );
@@ -245,10 +388,29 @@ For security reasons, it's recommended to use a proxy server to handle API reque
245
388
 
246
389
  ```typescript
247
390
  text2image: FalAiImage.RecraftV3({
248
- proxyUrl: 'https://your-fal-ai-proxy.example.com'
391
+ proxyUrl: 'http://your-proxy-server.com/api/proxy',
392
+ headers: {
393
+ 'x-custom-header': 'value',
394
+ 'x-client-version': '1.0.0'
395
+ }
249
396
  })
397
+
398
+ // Or use Recraft20b with icon style support:
399
+ // text2image: FalAiImage.Recraft20b({
400
+ // proxyUrl: 'http://your-proxy-server.com/api/proxy',
401
+ // headers: {
402
+ // 'x-custom-header': 'value',
403
+ // 'x-client-version': '1.0.0'
404
+ // }
405
+ // })
250
406
  ```
251
407
 
408
+ The `headers` option allows you to include custom HTTP headers in all API requests. This is useful for:
409
+ - Adding custom client identification headers
410
+ - Including version information
411
+ - Passing through metadata required by your API
412
+ - Adding correlation IDs for request tracing
413
+
252
414
  You'll need to implement a proxy server that forwards requests to fal.ai and handles authentication.
253
415
 
254
416
  ## API Reference
@@ -265,11 +427,11 @@ Creates and returns a plugin that can be added to CreativeEditor SDK.
265
427
 
266
428
  ```typescript
267
429
  interface PluginConfiguration {
268
- // Provider for text-to-image generation
269
- text2image?: AiImageProvider;
430
+ // Provider(s) for text-to-image generation
431
+ text2image?: AiImageProvider | AiImageProvider[];
270
432
 
271
- // Provider for image-to-image generation
272
- image2image?: AiImageProvider;
433
+ // Provider(s) for image-to-image generation
434
+ image2image?: AiImageProvider | AiImageProvider[];
273
435
 
274
436
  // Enable debug logging
275
437
  debug?: boolean;
@@ -289,6 +451,17 @@ interface PluginConfiguration {
289
451
  ```typescript
290
452
  FalAiImage.RecraftV3(config: {
291
453
  proxyUrl: string;
454
+ headers?: Record<string, string>;
455
+ debug?: boolean;
456
+ })
457
+ ```
458
+
459
+ #### Recraft20b
460
+
461
+ ```typescript
462
+ FalAiImage.Recraft20b(config: {
463
+ proxyUrl: string;
464
+ headers?: Record<string, string>;
292
465
  debug?: boolean;
293
466
  })
294
467
  ```
@@ -297,6 +470,47 @@ FalAiImage.RecraftV3(config: {
297
470
 
298
471
  ```typescript
299
472
  FalAiImage.GeminiFlashEdit(config: {
473
+ proxyUrl: string;
474
+ headers?: Record<string, string>;
475
+ debug?: boolean;
476
+ })
477
+ ```
478
+
479
+ ### OpenAI Providers
480
+
481
+ #### GptImage1.Text2Image
482
+
483
+ ```typescript
484
+ OpenAiImage.GptImage1.Text2Image(config: {
485
+ proxyUrl: string;
486
+ headers?: Record<string, string>;
487
+ debug?: boolean;
488
+ })
489
+ ```
490
+
491
+ #### GptImage1.Image2Image
492
+
493
+ ```typescript
494
+ OpenAiImage.GptImage1.Image2Image(config: {
495
+ proxyUrl: string;
496
+ headers?: Record<string, string>;
497
+ debug?: boolean;
498
+ })
499
+ ```
500
+
501
+ #### FluxProKontextEdit
502
+
503
+ ```typescript
504
+ FalAiImage.FluxProKontextEdit(config: {
505
+ proxyUrl: string;
506
+ debug?: boolean;
507
+ })
508
+ ```
509
+
510
+ #### FluxProKontextMaxEdit
511
+
512
+ ```typescript
513
+ FalAiImage.FluxProKontextMaxEdit(config: {
300
514
  proxyUrl: string;
301
515
  debug?: boolean;
302
516
  })
@@ -313,68 +527,96 @@ The plugin automatically registers the following UI components:
313
527
 
314
528
  ### Quick Action Features
315
529
 
316
- The plugin includes several pre-configured quick actions for both providers, built using helper components from the core generation library:
530
+ The plugin includes several pre-configured quick actions for image generation providers:
531
+
532
+ #### Available Quick Actions
533
+
534
+ - **`ly.img.editImage`**: Change image based on description
535
+ - Input: `{ prompt: string, uri: string }`
536
+
537
+ - **`ly.img.swapBackground`**: Change the background of the image
538
+ - Input: `{ prompt: string, uri: string }`
539
+
540
+ - **`ly.img.createVariant`**: Create a variation of the image
541
+ - Input: `{ prompt: string, uri: string }`
317
542
 
318
- 1. **Change Image**: Edit the currently selected image using a text prompt
319
- 2. **Swap Background**: Change only the background of the selected image
320
- 3. **Create Variant**: Duplicate the selected image and generate a variant
321
- 4. **Style Transfer**: Apply different artistic styles to the selected image (GeminiFlashEdit only)
322
- 5. **Artist Painting Styles**: Transform the image in the style of famous artists (GeminiFlashEdit only)
543
+ - **`ly.img.styleTransfer`**: Transform image into different art styles
544
+ - Input: `{ style: string, uri: string }`
323
545
 
324
- These quick actions are implemented using helper components from `@imgly/plugin-ai-generation-web`:
546
+ - **`ly.img.artistTransfer`**: Transform image in the style of famous artists
547
+ - Input: `{ artist: string, uri: string }`
548
+
549
+ - **`ly.img.combineImages`**: Combine multiple images with instructions
550
+ - Input: `{ prompt: string, uris: string[], exportFromBlockIds: number[] }`
551
+
552
+ - **`ly.img.remixPage`**: Convert the page into a single image
553
+ - Input: `{ prompt: string, uri: string }`
554
+
555
+ - **`ly.img.remixPageWithPrompt`**: Remix the page with custom instructions
556
+ - Input: `{ prompt: string, uri: string }`
557
+
558
+ - **`ly.img.gpt-image-1.changeStyleLibrary`**: Apply different art styles (GPT-specific)
559
+ - Input: `{ prompt: string, uri: string }`
560
+
561
+ #### Provider Quick Action Support
562
+
563
+ Providers declare which quick actions they support through their configuration:
325
564
 
326
565
  ```typescript
327
- // Example of how the GptImage1 provider implements quick actions
328
- function createQuickActions(cesdk): QuickAction[] {
329
- return [
330
- // Swap background quick action
331
- QuickActionSwapImageBackground({
332
- mapInput: (input) => ({ ...input, image_url: input.uri }),
333
- cesdk
334
- }),
335
-
336
- // Change image quick action
337
- QuickActionChangeImage({
338
- mapInput: (input) => ({ ...input, image_url: input.uri }),
339
- cesdk
340
- }),
341
-
342
- // Create variant quick action
343
- QuickActionImageVariant({
344
- onApply: async ({ prompt, uri, duplicatedBlockId }, context) => {
345
- return context.generate(
346
- {
347
- prompt,
348
- image_url: uri
349
- },
350
- {
351
- blockIds: [duplicatedBlockId]
352
- }
353
- );
354
- },
355
- cesdk
356
- })
357
- ];
358
- }
566
+ const myImageProvider = {
567
+ // ... other provider config
568
+ input: {
569
+ // ... panel config
570
+ quickActions: {
571
+ supported: {
572
+ 'ly.img.editImage': {
573
+ mapInput: (quickActionInput) => ({
574
+ prompt: quickActionInput.prompt,
575
+ image_url: quickActionInput.uri
576
+ })
577
+ },
578
+ 'ly.img.swapBackground': {
579
+ mapInput: (quickActionInput) => ({
580
+ prompt: quickActionInput.prompt,
581
+ image_url: quickActionInput.uri
582
+ })
583
+ },
584
+ 'ly.img.styleTransfer': {
585
+ mapInput: (quickActionInput) => ({
586
+ style: quickActionInput.style,
587
+ image_url: quickActionInput.uri
588
+ })
589
+ }
590
+ // Add more supported quick actions as needed
591
+ }
592
+ }
593
+ }
594
+ };
359
595
  ```
360
596
 
361
597
  ### Panel IDs
362
598
 
363
- - Main panel: `ly.img.ai/image-generation`
599
+ - Main panel: `ly.img.ai.image-generation`
364
600
  - Canvas quick actions: `ly.img.ai.image.canvasMenu`
365
601
  - Provider-specific panels:
366
- - RecraftV3: `ly.img.ai/fal-ai/recraft-v3`
367
- - GeminiFlashEdit: `ly.img.ai/fal-ai/gemini-flash-edit`
368
- - GptImage1.Text2Image: `ly.img.ai/open-ai/gpt-image-1/text2image`
369
- - GptImage1.Image2Image: `ly.img.ai/open-ai/gpt-image-1/image2image`
602
+ - RecraftV3: `ly.img.ai.fal-ai/recraft-v3`
603
+ - Recraft20b: `ly.img.ai.fal-ai/recraft/v2/text-to-image`
604
+ - GeminiFlashEdit: `ly.img.ai.fal-ai/gemini-flash-edit`
605
+ - GptImage1.Text2Image: `ly.img.ai.open-ai/gpt-image-1/text2image`
606
+ - GptImage1.Image2Image: `ly.img.ai.open-ai/gpt-image-1/image2image`
607
+ - FluxProKontextEdit: `ly.img.ai.fal-ai/flux-pro/kontext`
608
+ - FluxProKontextMaxEdit: `ly.img.ai.fal-ai/flux-pro/kontext/max`
370
609
 
371
610
  ### Asset History
372
611
 
373
612
  Generated images are automatically stored in asset sources with the following IDs:
374
613
  - RecraftV3: `fal-ai/recraft-v3.history`
614
+ - Recraft20b: `fal-ai/recraft/v2/text-to-image.history`
375
615
  - GeminiFlashEdit: `fal-ai/gemini-flash-edit.history`
376
616
  - GptImage1.Text2Image: `open-ai/gpt-image-1/text2image.history`
377
617
  - GptImage1.Image2Image: `open-ai/gpt-image-1/image2image.history`
618
+ - FluxProKontextEdit: `fal-ai/flux-pro/kontext.history`
619
+ - FluxProKontextMaxEdit: `fal-ai/flux-pro/kontext/max.history`
378
620
 
379
621
  ### Dock Integration
380
622
 
@@ -383,21 +625,21 @@ The plugin automatically registers a dock component with a sparkle icon that ope
383
625
  ```typescript
384
626
  // Add the AI Image component to the beginning of the dock
385
627
  cesdk.ui.setDockOrder([
386
- 'ly.img.ai/image-generation.dock',
628
+ 'ly.img.ai.image-generation.dock',
387
629
  ...cesdk.ui.getDockOrder()
388
630
  ]);
389
631
 
390
632
  // Or add it at a specific position
391
633
  const currentOrder = cesdk.ui.getDockOrder();
392
- currentOrder.splice(2, 0, 'ly.img.ai/image-generation.dock');
634
+ currentOrder.splice(2, 0, 'ly.img.ai.image-generation.dock');
393
635
  cesdk.ui.setDockOrder(currentOrder);
394
636
  ```
395
637
 
396
638
  ## Related Packages
397
639
 
398
- - [@imgly/plugin-ai-generation-web](https://github.com/imgly/plugin-ai-generation-web) - Core utilities for AI generation
399
- - [@imgly/plugin-ai-video-generation-web](https://github.com/imgly/plugin-ai-video-generation-web) - AI video generation
400
- - [@imgly/plugin-ai-audio-generation-web](https://github.com/imgly/plugin-ai-audio-generation-web) - AI audio generation
640
+ - [@imgly/plugin-ai-generation-web](https://github.com/imgly/plugins/tree/main/packages/plugin-ai-generation-web) - Core utilities for AI generation
641
+ - [@imgly/plugin-ai-video-generation-web](https://github.com/imgly/plugins/tree/main/packages/plugin-ai-video-generation-web) - AI video generation
642
+ - [@imgly/plugin-ai-audio-generation-web](https://github.com/imgly/plugins/tree/main/packages/plugin-ai-audio-generation-web) - AI audio generation
401
643
 
402
644
  ## License
403
645
 
@@ -1 +1,6 @@
1
1
  export declare const PLUGIN_ID = "@imgly/plugin-ai-image-generation-web";
2
+ /**
3
+ * Default order for image quick actions, matching the ai-demo.tsx example.
4
+ * This is used as a fallback when children is undefined in canvas menu order.
5
+ */
6
+ export declare const DEFAULT_IMAGE_QUICK_ACTION_ORDER: string[];
@@ -0,0 +1,11 @@
1
+ import { ImageOutput, type Provider, type CommonProviderConfiguration } from '@imgly/plugin-ai-generation-web';
2
+ import CreativeEditorSDK from '@cesdk/cesdk-js';
3
+ type FluxProKontextEditInput = {
4
+ prompt: string;
5
+ image_url: string;
6
+ };
7
+ export declare function FluxProKontextEdit(config: CommonProviderConfiguration<FluxProKontextEditInput, ImageOutput>): (context: {
8
+ cesdk: CreativeEditorSDK;
9
+ }) => Promise<Provider<'image', FluxProKontextEditInput, ImageOutput>>;
10
+ declare function getProvider(cesdk: CreativeEditorSDK, config: CommonProviderConfiguration<FluxProKontextEditInput, ImageOutput>): Provider<'image', FluxProKontextEditInput, ImageOutput>;
11
+ export default getProvider;
@@ -0,0 +1,11 @@
1
+ import { ImageOutput, type Provider, type CommonProviderConfiguration } from '@imgly/plugin-ai-generation-web';
2
+ import CreativeEditorSDK from '@cesdk/cesdk-js';
3
+ export type FluxProKontextMaxEditInput = {
4
+ prompt: string;
5
+ image_url: string;
6
+ };
7
+ export declare function FluxProKontextMaxEdit(config: CommonProviderConfiguration<FluxProKontextMaxEditInput, ImageOutput>): (context: {
8
+ cesdk: CreativeEditorSDK;
9
+ }) => Promise<Provider<'image', FluxProKontextMaxEditInput, ImageOutput>>;
10
+ declare function getProvider(cesdk: CreativeEditorSDK, config: CommonProviderConfiguration<FluxProKontextMaxEditInput, ImageOutput>): Provider<'image', FluxProKontextMaxEditInput, ImageOutput>;
11
+ export default getProvider;