@imgly/plugin-ai-generation-web 0.2.8 → 0.2.10

package/CHANGELOG.md

@@ -2,6 +2,49 @@
 
 ## [Unreleased]
 
+## [0.2.10] - 2025-10-22
+
+### New Features
+
+-   [video-generation] **Google Veo 3.1 Provider Suite**: Added comprehensive Google Veo 3.1 video generation providers via fal.ai, offering multiple models optimized for different use cases:
+    - **Text-to-Video Providers**:
+        - `Veo31TextToVideo`: Standard quality text-to-video with configurable aspect ratios (16:9, 9:16, 1:1), variable duration (4s, 6s, 8s), resolution options (720p, 1080p), and optional audio generation
+        - `Veo31FastTextToVideo`: Faster and more cost-effective text-to-video variant with same capabilities as standard version
+    - **Image-to-Video Providers**:
+        - `Veo31ImageToVideo`: Standard quality image-to-video with auto aspect ratio detection, multiple preset options (16:9, 9:16, 1:1), resolution options (720p, 1080p), fixed 8-second duration, and optional audio generation
+        - `Veo31FastImageToVideo`: Faster and more cost-effective image-to-video variant with same capabilities
+    - **First-Last Frame Providers** (experimental dual-image transformation):
+        - `Veo31FirstLastFrameToVideo`: Standard quality interpolation between two images (first and last frame)
+        - `Veo31FastFirstLastFrameToVideo`: Faster variant with dual image input UI, multiple aspect ratios (16:9, 9:16, 1:1, 4:3, 3:4), resolution options (480p, 720p, 1080p), adjustable duration (2-8 seconds), optional prompt guidance, and optional audio generation
+    - **Quick Action Support**: Added "Animate Between Images" quick action for creating smooth transitions between two selected images using the first-last-frame providers
+
+## [0.2.9] - 2025-10-16
+
+### New Features
+
+-   [image-generation] **GeminiFlash25 Provider**: Added Google Gemini Flash 2.5 text-to-image provider via fal.ai with fast generation times, multiple aspect ratios (1:1, 3:4, 4:3, 9:16, 16:9), custom dimensions support, and multiple output formats (JPEG, PNG, WEBP)
+-   [image-generation] **Gemini25FlashImageEdit Provider**: Added Google Gemini 2.5 Flash Image Edit provider via fal.ai for advanced image editing with multi-image support (1-10 images), comprehensive quick actions support (editImage, swapBackground, styleTransfer, artistTransfer, createVariant, combineImages, remixPage, remixPageWithPrompt), text-based editing instructions, and fast processing times
+
+### Improvements
+
+-   [generation-web] **Middleware preventDefault() API**: Added `options.preventDefault()` method to suppress default UI feedback (notifications, block states, console logging) when handling errors in custom middleware
+-   [all] **Internationalization Support**: All hardcoded strings across AI plugins have been removed and replaced with translation keys, enabling full localization support for plugin labels, actions, styles, and error messages
+-   [all] **Translation Keys Available**: Added comprehensive translation keys for:
+    -   Panel and dock labels (AI Image, AI Video, AI Sticker, AI Voice, Sound Generation)
+    -   Action labels (Generate Image, Generate Video, Generate Sticker)
+    -   Style transfer options (None, Anime, Cyberpunk, Kodak 400, Watercolor, Dark Fantasy, Vaporwave, Vector Flat, 3D Animation, Ukiyo-e, Surreal, Steampunk, Night Bokeh, Pop Art)
+    -   Error messages and UI elements
+-   [all] **Backwards Compatibility**: Translation system automatically detects CE.SDK version and gracefully falls back to English strings for CE.SDK versions < 1.59.0, ensuring no breaking changes for existing integrations
+
+### Fixed
+
+-   [generation-web] **Placeholder Block Error State**: Fixed placeholder blocks getting stuck in Pending state when generation fails or is aborted. Blocks are now properly destroyed when generation is aborted, or moved to Error state when generation fails, preventing perpetual loading spinners in the UI.
+-   [generation-web] **Middleware Block Targeting**: Fixed middleware to correctly receive block IDs for placeholder blocks and quick action targets. Previously, middleware would fall back to `findAllSelected()` which could target incorrect blocks if the selection changed during generation. Now placeholder blocks created during panel generation and target blocks from quick actions are explicitly passed to middleware, ensuring operations like pending state, locking, and highlighting affect the correct blocks.
+
+### Changed
+
+-   [generation-web] **BlockIds Type Refinement**: Removed unused `| null` type from `blockIds` parameter in `GenerationOptions` and `Generate` function signature. The `null` value was documented but never implemented or used. Use an empty array `[]` instead of `null` to explicitly target no blocks.
+
 ## [0.2.8] - 2025-09-29
 
 ### New Features

package/README.md

@@ -1208,9 +1208,9 @@ const upload = uploadMiddleware(async (output) => {
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify(output)
   });
-  
+
   const result = await response.json();
-  
+
   // Return the output with the updated URL
   return {
     ...output,
@@ -1228,6 +1228,137 @@ const provider = {
 };
 ```
 
+#### Preventing Default Feedback
+
+Middleware can suppress default UI feedback behaviors (notifications, block states, console logging) using `options.preventDefault()`. This is useful when you want to handle success or error feedback yourself:
+
+```typescript
+const customErrorMiddleware: Middleware<any, any> = async (input, options, next) => {
+  try {
+    return await next(input, options);
+  } catch (error) {
+    // Prevent default error notification and block error state
+    options.preventDefault();
+
+    // When preventDefault() is called, you need to handle the block state yourself.
+    // Here we set the error state to mimic the default behavior:
+    options.blockIds?.forEach(blockId => {
+      if (options.engine.block.isValid(blockId)) {
+        options.engine.block.setState(blockId, { type: 'Error', error: 'Unknown' });
+      }
+    });
+    // Alternative: Delete the placeholder block instead
+    // options.blockIds?.forEach(blockId => {
+    //   if (options.engine.block.isValid(blockId)) {
+    //     options.engine.block.destroy(blockId);
+    //   }
+    // });
+
+    // Show custom notification
+    options.cesdk?.ui.showNotification({
+      type: 'error',
+      message: `Custom error: ${error.message}`,
+      duration: 5000,
+      action: {
+        label: 'Contact Support',
+        onClick: () => window.open('mailto:support@example.com')
+      }
+    });
+
+    throw error;
+  }
+};
+```
+
+**What gets prevented:**
+- Error/success notifications (toast messages)
+- Block error state (error icon)
+- Console error logging
+
+**What is NOT prevented:**
+- Pending → Ready transition (loading spinner always stops)
+
+**Common use cases:**
+
+**1. Custom Error Notifications:**
+```typescript
+const middleware = async (input, options, next) => {
+  try {
+    return await next(input, options);
+  } catch (error) {
+    options.preventDefault();
+
+    // When preventDefault() is called, you need to handle the block state yourself.
+    // Here we set the error state to mimic the default behavior:
+    options.blockIds?.forEach(blockId => {
+      if (options.engine.block.isValid(blockId)) {
+        options.engine.block.setState(blockId, { type: 'Error', error: 'Unknown' });
+      }
+    });
+
+    options.cesdk?.ui.showNotification({
+      type: 'error',
+      message: `Generation failed: ${error.message}`,
+      action: { label: 'Retry', onClick: () => retry() }
+    });
+    throw error;
+  }
+};
+```
+
+**2. Silent Failures with External Logging:**
+```typescript
+const middleware = async (input, options, next) => {
+  try {
+    return await next(input, options);
+  } catch (error) {
+    options.preventDefault();
+    errorTracker.capture({ error, context: { input, blockIds: options.blockIds } });
+    throw error;
+  }
+};
+```
+
+**3. Retry Logic:**
+```typescript
+const retryMiddleware = async (input, options, next) => {
+  const maxRetries = 3;
+  let attempt = 0;
+
+  while (attempt < maxRetries) {
+    try {
+      return await next(input, options);
+    } catch (error) {
+      attempt++;
+      if (attempt < maxRetries) {
+        options.preventDefault();
+        options.cesdk?.ui.showNotification({
+          type: 'info',
+          message: `Retrying... (${attempt}/${maxRetries})`
+        });
+        await new Promise(resolve => setTimeout(resolve, 1000));
+      } else {
+        options.preventDefault();
+
+        // When preventDefault() is called, you need to handle the block state yourself.
+        // After final retry failure, you might want to delete the placeholder:
+        options.blockIds?.forEach(blockId => {
+          if (options.engine.block.isValid(blockId)) {
+            options.engine.block.destroy(blockId); // Remove failed placeholder
+          }
+        });
+
+        options.cesdk?.ui.showNotification({
+          type: 'error',
+          message: `Failed after ${maxRetries} attempts`
+        });
+        throw error;
+      }
+    }
+  }
+};
+```
+
 ### Provider Registry
 
 The `ProviderRegistry` is a global singleton that manages all registered providers: