@imgly/plugin-ai-generation-web 0.2.5 → 0.2.6

package/CHANGELOG.md

@@ -2,12 +2,22 @@
 
 ## [Unreleased]
 
+## [0.2.6] - 2025-09-09
+
+### New Features
+
+-   [all] **Feature API Integration**: Added comprehensive Feature API support across all AI plugins to control visibility and availability of features through feature flags. Core features include `providerSelect`, `quickAction`, `quickAction.providerSelect`, `fromText`, and `fromImage` flags.
+-   [all] **Quick Action Feature Flags**: Each quick action now automatically registers and respects its own feature flag (e.g., `ly.img.plugin-ai-image-generation-web.quickAction.editImage`), allowing fine-grained control over which quick actions are available to users.
+-   [image-generation] **Provider Style Group Control**: Added Feature API support for Recraft providers to control style group visibility. RecraftV3 supports `style.image` and `style.vector` flags, while Recraft20b adds `style.icon` flag for controlling icon style availability.
+-   [all] **Provider Selection Feature Flags**: Added support for controlling provider selection UI in both panels (`providerSelect`) and quick actions (`quickAction.providerSelect`), with proper handling when multiple providers are configured.
+
 ## [0.2.5] - 2025-09-03
 
 ### New Features
 
 -   [image-generation] **NanoBanana Provider**: Added NanoBanana text-to-image provider via fal.ai with fast generation times, 1024×1024 resolution, support for multiple output formats (JPEG, PNG), configurable number of images (1-4), and remixPageWithPrompt quick action
 -   [image-generation] **NanoBananaEdit Provider**: Added NanoBananaEdit image-to-image provider via fal.ai for editing existing images with text prompts, supporting all standard quick actions (editImage, swapBackground, styleTransfer, artistTransfer, createVariant, combineImages with up to 10 images, remixPage, remixPageWithPrompt)
+-   [all] **AI Style Asset Library Translations**: AI style presets in asset libraries now automatically use localized names and descriptions from provider translation files, eliminating the need for manual translation configuration
 
 ### Bug Fixes
 

package/README.md

@@ -902,6 +902,161 @@ For example:
 - Audio quick actions: `ly.img.plugin-ai-audio-generation-web.canvasMenu`
 - Text quick actions: `ly.img.plugin-ai-text-generation-web.canvasMenu`
 
+### Customizing Quick Action Availability
+
+You can control which quick actions appear in your application using the Feature API. This is useful when you want to:
+- Show only specific AI capabilities to certain user groups
+- Simplify the UI by hiding advanced features
+- Create different feature sets for different subscription tiers
+- Disable actions that aren't relevant to your use case
+
+#### Disabling Specific Quick Actions
+
+All quick actions are enabled by default. To hide specific quick actions from the UI:
+
+```typescript
+// Hide the "Edit Image" quick action from users
+cesdk.feature.enable(
+  'ly.img.plugin-ai-image-generation-web.quickAction.editImage',
+  false
+);
+
+// Hide multiple text quick actions for a simpler experience
+cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.changeTone', false);
+cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.translate', false);
+```
+
+#### Dynamic Feature Control
+
+You can also pass a function to dynamically control feature availability based on context. This is powerful for implementing complex business logic, time-based features, or context-sensitive UI. See the [CE.SDK Feature API documentation](https://img.ly/docs/cesdk/js/user-interface/customization/disable-or-enable-f058e2/) for more details.
+
+```typescript
+// Show advanced AI features only during business hours
+cesdk.feature.enable(
+  'ly.img.plugin-ai-image-generation-web.quickAction.artistTransfer',
+  ({ isPreviousEnable }) => {
+    const hour = new Date().getHours();
+    const isBusinessHours = hour >= 9 && hour < 18;
+    return isBusinessHours && isPreviousEnable();
+  }
+);
+
+// Disable certain quick actions based on selected content
+cesdk.feature.enable(
+  'ly.img.plugin-ai-text-generation-web.quickAction.translate',
+  ({ engine, isPreviousEnable }) => {
+    const selectedBlocks = engine.block.findAllSelected();
+    if (selectedBlocks.length === 0) return false;
+    
+    const blockId = selectedBlocks[0];
+    const textContent = engine.block.getString(blockId, 'text/text');
+    
+    // Only show translate if text is long enough
+    const hasEnoughText = textContent && textContent.length > 20;
+    return hasEnoughText && isPreviousEnable();
+  }
+);
+```
+
+#### Creating Feature Sets for Different User Tiers
+
+```typescript
+// Configure features based on user subscription
+function configureAIFeatures(cesdk, userTier) {
+  if (userTier === 'basic') {
+    // Basic users only get simple text improvements
+    cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.improve', true);
+    cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.fix', true);
+    cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.translate', false);
+    cesdk.feature.enable('ly.img.plugin-ai-text-generation-web.quickAction.changeTone', false);
+    
+    // Disable advanced image features
+    cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.quickAction.artistTransfer', false);
+    cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.quickAction.styleTransfer', false);
+  } else if (userTier === 'premium') {
+    // Premium users get all features (default behavior)
+    // All quick actions are enabled by default
+  }
+}
+```
+
+#### Available Feature Flags
+
+##### Core Plugin Features
+
+These feature flags control the main functionality of each AI plugin:
+
+**General Features:**
+- `ly.img.plugin-ai-{kind}-generation-web.providerSelect` - Enable/disable provider selection dropdown in panels
+- `ly.img.plugin-ai-{kind}-generation-web.quickAction` - Enable/disable all quick actions for a plugin
+- `ly.img.plugin-ai-{kind}-generation-web.quickAction.providerSelect` - Enable/disable provider selection dropdown in quick actions
+
+**Input Type Features (Image & Video only):**
+- `ly.img.plugin-ai-image-generation-web.fromText` - Enable/disable text-to-image generation
+- `ly.img.plugin-ai-image-generation-web.fromImage` - Enable/disable image-to-image generation
+- `ly.img.plugin-ai-video-generation-web.fromText` - Enable/disable text-to-video generation
+- `ly.img.plugin-ai-video-generation-web.fromImage` - Enable/disable image-to-video generation
+
+**Usage Examples:**
+
+```typescript
+// Hide provider selection dropdown in video generation panel
+cesdk.feature.enable('ly.img.plugin-ai-video-generation-web.providerSelect', false);
+
+// Only allow text-to-image, disable image-to-image editing
+cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.fromImage', false);
+cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.fromText', true);
+
+// Hide provider selection dropdown in quick actions (use default provider only)
+cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.quickAction.providerSelect', false);
+
+// Disable all quick actions but keep panel generation available
+cesdk.feature.enable('ly.img.plugin-ai-image-generation-web.quickAction', false);
+```
+
+##### Quick Action Features
+
+The quick action feature flags follow this pattern: `ly.img.plugin-ai-{kind}-generation-web.quickAction.{actionName}`
+
+**Image Quick Actions:**
+- `ly.img.plugin-ai-image-generation-web.quickAction.editImage`
+- `ly.img.plugin-ai-image-generation-web.quickAction.swapBackground`
+- `ly.img.plugin-ai-image-generation-web.quickAction.styleTransfer`
+- `ly.img.plugin-ai-image-generation-web.quickAction.artistTransfer`
+- `ly.img.plugin-ai-image-generation-web.quickAction.createVariant`
+- `ly.img.plugin-ai-image-generation-web.quickAction.combineImages`
+- `ly.img.plugin-ai-image-generation-web.quickAction.remixPage`
+- `ly.img.plugin-ai-image-generation-web.quickAction.remixPageWithPrompt`
+
+**Text Quick Actions:**
+- `ly.img.plugin-ai-text-generation-web.quickAction.improve`
+- `ly.img.plugin-ai-text-generation-web.quickAction.fix`
+- `ly.img.plugin-ai-text-generation-web.quickAction.shorter`
+- `ly.img.plugin-ai-text-generation-web.quickAction.longer`
+- `ly.img.plugin-ai-text-generation-web.quickAction.changeTone`
+- `ly.img.plugin-ai-text-generation-web.quickAction.translate`
+- `ly.img.plugin-ai-text-generation-web.quickAction.changeTextTo`
+
+**Video Quick Actions:**
+- `ly.img.plugin-ai-video-generation-web.quickAction.createVideo`
+
+**Note:** Quick actions are automatically enabled when their plugin is loaded. Each quick action manages its own feature flag internally, ensuring proper initialization and registration.
+
+##### Provider-Specific Style Features
+
+Some providers (like RecraftV3 and Recraft20b) support style groups that can be controlled independently:
+
+**RecraftV3 Style Groups:**
+- `ly.img.plugin-ai-image-generation-web.fal-ai/recraft-v3.style.image` - Enable/disable image styles (realistic, digital illustration)
+- `ly.img.plugin-ai-image-generation-web.fal-ai/recraft-v3.style.vector` - Enable/disable vector styles (vector illustration and variants)
+
+**Recraft20b Style Groups:**
+- `ly.img.plugin-ai-image-generation-web.fal-ai/recraft/v2/text-to-image.style.image` - Enable/disable image styles
+- `ly.img.plugin-ai-image-generation-web.fal-ai/recraft/v2/text-to-image.style.vector` - Enable/disable vector styles
+- `ly.img.plugin-ai-image-generation-web.fal-ai/recraft/v2/text-to-image.style.icon` - Enable/disable icon styles
+
+When all style groups are disabled for a provider, it automatically falls back to the 'any' style. For more details on style control, see the [@imgly/plugin-ai-image-generation-web documentation](https://github.com/imgly/plugins/tree/main/packages/plugin-ai-image-generation-web).
+
 ### Using with Existing AI Generation Plugins
 
 IMG.LY offers several pre-built AI generation packages that work with this base plugin:

package/dist/__tests__/featureFlags.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/index.d.ts

@@ -26,3 +26,4 @@ export { default as initializeProvider } from './providers/initializeProvider';
 export { default as initializeQuickActionComponents } from './ui/quickActions/initializeQuickActionComponents';
 export { extractAndSetSchemaTranslations } from './openapi/extractSchemaTranslations';
 export { AI_EDIT_MODE, AI_METADATA_KEY } from './ui/quickActions/utils';
+export { createTranslationCallback, buildTranslationKeys } from './utils/translationHelpers';