npm - @imgly/codesign-mcp - Versions diffs - 0.1.5 → 0.1.6 - Mend

@imgly/codesign-mcp 0.1.5 → 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.

Files changed (973) hide show

package/assets/docs/guide/to-v1-69.md DELETED Viewed

@@ -1,468 +0,0 @@
-> This is one page of the CE.SDK Vanilla JS/TS documentation. For a complete overview, see the [Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
-**Navigation:** [Upgrading](./upgrade.md) > [To v1.69](./to-v1-69.md)
----
-Version 1.69 introduces Starter Kits, a new asset source plugin system, and consolidated asset naming conventions. This guide walks you through the breaking changes and migration steps.
-## TL;DR
-**Key changes:**
-- Editor now initializes with a blank canvas by default
-- `addDefaultAssetSources()` and `addDemoAssetSources()` are deprecated
-- `createDesignScene()` and `createVideoScene()` are deprecated
-- Asset source IDs have been renamed and consolidated (v5 naming)
-- UI configuration options moved from `create()` to runtime APIs
-- New plugin-based system for loading assets
-- Unified `scene.create` action for scene creation
-**Migration time:** ~15-30 minutes for most projects
-## What's New in v1.69
-### Starter Kits
-Starter Kits are complete project templates with editable configuration files. Each kit provides a ready-to-run project with a well-defined architecture:
-- A `config/` folder containing all editor configuration
-- Separate files for UI layout, features, settings, and translations
-- A configuration plugin class that wires everything together
-- Clean separation between your app code and editor config
-### Asset Restructuring
-Version 1.69 introduces v5 assets and demo-v4 assets with updated naming conventions. This restructuring consolidates asset sources, establishes consistent naming patterns for asset source and asset IDs, and improves the developer experience when working with assets.
-> **Self-Host Your Assets:** For production deployments, we recommend downloading the assets and hosting them on your own CDN. This ensures faster load times, better reliability, and full control over asset availability. You can download assets from our CDN and serve them from your infrastructure using the `baseURL` option in asset source plugins. See [Serve Assets](./serve-assets.md) for detailed instructions.
-## Step-by-Step Migration
-### Step 1: Adopt Starter Kit Configuration
-Extract a Starter Kit config folder into your project:
-<TerminalTabs>
-  <TerminalTab label="degit">
-    npx degit imgly/starterkit-design-editor-ts-web/src/imgly/config ./src/config
-  </TerminalTab>
-  <TerminalTab label="git">
-    git clone https://github.com/imgly/starterkit-design-editor-ts-web.git
-    cp -r starterkit-design-editor-ts-web/src/imgly/config ./src/config
-    rm -rf starterkit-design-editor-ts-web
-  </TerminalTab>
-</TerminalTabs>
-> **Adjust Path:** The default destination is `./src/config`. Adjust the path to match your project structure.
-#### Which Starter Kit Should I Use?
-Choose based on your previous editor setup:
-- **Design Editor** — You used `createDesignScene()` for multi-page designs (social posts, flyers, presentations)
-- **Video Editor** — You used `createVideoScene()` for video timeline editing
-- **Advanced Design Editor** — You used `createDesignScene()` with the advanced inspector enabled to author design templates with placeholders for end-users to customize
-- **Advanced Video Editor** — You used `createVideoScene()` with the advanced inspector enabled to author video templates with placeholders for end-users to customize
-#### Available Starter Kits
-| Starter Kit            | Repository                                       | Use Case                    |
-| ---------------------- | ------------------------------------------------ | --------------------------- |
-| Design Editor          | `imgly/starterkit-design-editor-ts-web`          | Multi-page design creation  |
-| Photo Editor           | `imgly/starterkit-photo-editor-ts-web`           | Single-image editing        |
-| Video Editor           | `imgly/starterkit-video-editor-ts-web`           | Video timeline editing      |
-| Advanced Design Editor | `imgly/starterkit-advanced-design-editor-ts-web` | Full-featured design editor |
-| Advanced Video Editor  | `imgly/starterkit-advanced-video-editor-ts-web`  | Full-featured video editor  |
-| Design Viewer          | `imgly/starterkit-design-viewer-ts-web`          | Read-only design viewing    |
-| Video Player           | `imgly/starterkit-video-player-ts-web`           | Read-only video playback    |
-#### Repository Structure
-The `config/` folder contains all configuration files you can modify:
-```
-config/
-├── index.ts                # Exports configuration class
-├── plugin.ts               # Main plugin class, orchestrates all setup
-├── features.ts             # Feature flags (text, stickers, audio, etc.)
-├── settings.ts             # Engine settings (page size, margins, etc.)
-├── i18n.ts                 # Custom translations and labels
-├── actions.ts              # Export, save, and share button handlers
-└── ui/
-    ├── index.ts            # UI setup entry point
-    ├── canvas.ts           # Canvas behavior (zoom, pan, selection)
-    ├── components.ts       # Custom UI components
-    ├── dock.ts             # Left dock panel order and items
-    ├── inspectorBar.ts     # Right inspector panel configuration
-    ├── navigationBar.ts    # Top navigation bar buttons
-    └── panel.ts            # Panel settings and behavior
-```
-### Step 2: Use the Configuration Plugin
-```ts
-import CreativeEditorSDK from '@cesdk/cesdk-js';
-import { DesignEditorConfig } from './config/plugin';
-const cesdk = await CreativeEditorSDK.create('#editor', {
-  license: 'YOUR_CESDK_LICENSE_KEY',
-  baseURL: `https://cdn.img.ly/packages/imgly/cesdk-js/${CreativeEditorSDK.version}/assets`
-});
-// Add plugin first (resets configuration to clean slate)
-await cesdk.addPlugin(new DesignEditorConfig());
-// Apply custom configuration on top
-// ...
-// Create the scene
-await cesdk.actions.run('scene.create');
-```
-> **Preserving Legacy Configuration:** If you're still using deprecated configuration options (like `callbacks`, `ui.elements`, `locale`, or `ui.colorLibraries` in the `create()` call), they continue to work. Starter Kits call `reapplyLegacyUserConfiguration()` at the end of their `initialize()` method to preserve your deprecated settings on top of their defaults, so you can adopt them incrementally. Once you've fully migrated to runtime APIs, you can safely remove this call.
-### Step 3: Replace Deprecated Asset Loading Methods
-Replace calls to `addDefaultAssetSources()` and `addDemoAssetSources()` with the new plugin-based approach.
-#### Replacing `addDefaultAssetSources()`
-**Before (deprecated):**
-```ts
-await cesdk.addDefaultAssetSources();
-```
-**After (v1.69+):**
-The snippets below show the asset sources that `addDefaultAssetSources()` previously loaded by default. Include only the plugins your application requires:
-<Tabs syncKey="editor-type">
-  <TabItem label="Design">
-    ```ts
-    import {
-      BlurAssetSource,
-      ColorPaletteAssetSource,
-      CropPresetsAssetSource,
-      EffectsAssetSource,
-      FiltersAssetSource,
-      PagePresetsAssetSource,
-      StickerAssetSource,
-      TextAssetSource,
-      TextComponentAssetSource,
-      TypefaceAssetSource,
-      VectorShapeAssetSource
-    } from '@cesdk/cesdk-js/plugins';
-    await cesdk.addPlugin(new ColorPaletteAssetSource());
-    await cesdk.addPlugin(new TypefaceAssetSource());
-    await cesdk.addPlugin(new TextAssetSource());
-    await cesdk.addPlugin(new TextComponentAssetSource());
-    await cesdk.addPlugin(new VectorShapeAssetSource());
-    await cesdk.addPlugin(new StickerAssetSource());
-    await cesdk.addPlugin(new EffectsAssetSource());
-    await cesdk.addPlugin(new FiltersAssetSource());
-    await cesdk.addPlugin(new BlurAssetSource());
-    await cesdk.addPlugin(new PagePresetsAssetSource());
-    await cesdk.addPlugin(new CropPresetsAssetSource());
-    ```
-  </TabItem>
-  <TabItem label="Video">
-    ```ts
-    import {
-      BlurAssetSource,
-      CaptionPresetsAssetSource,
-      ColorPaletteAssetSource,
-      CropPresetsAssetSource,
-      EffectsAssetSource,
-      FiltersAssetSource,
-      PagePresetsAssetSource,
-      StickerAssetSource,
-      TextAssetSource,
-      TextComponentAssetSource,
-      TypefaceAssetSource,
-      VectorShapeAssetSource
-    } from '@cesdk/cesdk-js/plugins';
-    await cesdk.addPlugin(new ColorPaletteAssetSource());
-    await cesdk.addPlugin(new TypefaceAssetSource());
-    await cesdk.addPlugin(new TextAssetSource());
-    await cesdk.addPlugin(new TextComponentAssetSource());
-    await cesdk.addPlugin(new VectorShapeAssetSource());
-    await cesdk.addPlugin(new StickerAssetSource());
-    await cesdk.addPlugin(new EffectsAssetSource());
-    await cesdk.addPlugin(new FiltersAssetSource());
-    await cesdk.addPlugin(new BlurAssetSource());
-    await cesdk.addPlugin(new CaptionPresetsAssetSource());
-    await cesdk.addPlugin(new PagePresetsAssetSource({
-      include: [
-        'ly.img.page.presets.facebook.*',
-        'ly.img.page.presets.instagram.*',
-        'ly.img.page.presets.linkedin.*',
-        'ly.img.page.presets.pinterest.*',
-        'ly.img.page.presets.tiktok.*',
-        'ly.img.page.presets.video.*',
-        'ly.img.page.presets.x.*',
-        'ly.img.page.presets.youtube.*'
-      ]
-    }));
-    await cesdk.addPlugin(new CropPresetsAssetSource());
-    ```
-  </TabItem>
-</Tabs>
-#### Replacing `addDemoAssetSources()`
-**Before (deprecated):**
-```ts
-await cesdk.addDemoAssetSources();
-```
-**After (v1.69+):**
-The snippets below show the demo assets and upload sources that `addDemoAssetSources()` previously loaded by default. Include only the plugins your application requires:
-<Tabs syncKey="editor-type">
-  <TabItem label="Design">
-    ```ts
-    import { DemoAssetSources, UploadAssetSources } from '@cesdk/cesdk-js/plugins';
-    await cesdk.addPlugin(
-      new UploadAssetSources({
-        include: ['ly.img.image.upload']
-      })
-    );
-    await cesdk.addPlugin(
-      new DemoAssetSources({
-        include: [
-          'ly.img.image.*',
-          'ly.img.templates.blank.*',
-          'ly.img.templates.presentation.*',
-          'ly.img.templates.print.*',
-          'ly.img.templates.social.*'
-        ]
-      })
-    );
-    ```
-  </TabItem>
-  <TabItem label="Video">
-    ```ts
-    import { DemoAssetSources, UploadAssetSources } from '@cesdk/cesdk-js/plugins';
-    await cesdk.addPlugin(
-      new UploadAssetSources({
-        include: ['ly.img.image.upload', 'ly.img.video.upload', 'ly.img.audio.upload']
-      })
-    );
-    await cesdk.addPlugin(
-      new DemoAssetSources({
-        include: [
-          'ly.img.audio.*',
-          'ly.img.image.*',
-          'ly.img.templates.video.*',
-          'ly.img.video.*'
-        ]
-      })
-    );
-    ```
-  </TabItem>
-</Tabs>
-#### Asset Source Plugins Reference
-All plugins are imported from `@cesdk/cesdk-js/plugins`:
-| Plugin                      | Asset Source ID          | Description                  |
-| --------------------------- | ------------------------ | ---------------------------- |
-| `BlurAssetSource`           | `ly.img.blur`            | Blur effects                 |
-| `CaptionPresetsAssetSource` | `ly.img.caption.presets` | Caption text presets (video) |
-| `ColorPaletteAssetSource`   | `ly.img.color.palette`   | Color palettes               |
-| `CropPresetsAssetSource`    | `ly.img.crop.presets`    | Crop aspect ratios           |
-| `EffectsAssetSource`        | `ly.img.effect`          | Visual effects               |
-| `FiltersAssetSource`        | `ly.img.filter`          | LUT and duotone filters      |
-| `PagePresetsAssetSource`    | `ly.img.page.presets`    | Page size presets            |
-| `StickerAssetSource`        | `ly.img.sticker`         | Stickers and decorations     |
-| `TextAssetSource`           | `ly.img.text`            | Text presets                 |
-| `TextComponentAssetSource`  | `ly.img.text.components` | Styled text components       |
-| `TypefaceAssetSource`       | `ly.img.typeface`        | Fonts and typefaces          |
-| `VectorShapeAssetSource`    | `ly.img.vector.shape`    | Vector shapes                |
-| `UploadAssetSources`        | `ly.img.*.upload`        | User upload sources          |
-| `DemoAssetSources`          | Various                  | Demo content for testing     |
-Each plugin accepts an optional configuration object with:
-- `baseURL`: Custom base URL for loading assets
-- `include`: GLOB patterns to filter which assets to load
-- `assetLibraryEntries`: Map asset source IDs to UI library entry IDs
-#### Demo Asset Sources
-The `DemoAssetSources` plugin provides sample content for development and testing:
-| Pattern                           | Description             |
-| --------------------------------- | ----------------------- |
-| `ly.img.templates.*`              | All template categories |
-| `ly.img.templates.blank.*`        | Blank templates         |
-| `ly.img.templates.social.*`       | Social media templates  |
-| `ly.img.templates.print.*`        | Print templates         |
-| `ly.img.templates.presentation.*` | Presentation templates  |
-| `ly.img.templates.video.*`        | Video templates         |
-| `ly.img.image.*`                  | Demo images             |
-| `ly.img.video.*`                  | Demo videos             |
-| `ly.img.audio.*`                  | Demo audio              |
-> **Production vs. Development:** Use `DemoAssetSources` for development and testing. For production, replace demo assets with your own content or licensed stock assets.
-#### Upload Asset Sources
-The `UploadAssetSources` plugin enables file uploads:
-| ID                    | Default MIME Types                                                                 |
-| --------------------- | ---------------------------------------------------------------------------------- |
-| `ly.img.image.upload` | `image/jpeg`, `image/png`, `image/webp`, `image/svg+xml`, `image/bmp`, `image/gif` |
-| `ly.img.video.upload` | `video/mp4`, `video/quicktime`, `video/webm`, `video/matroska`, `image/gif`        |
-| `ly.img.audio.upload` | `audio/mpeg`, `audio/mp3`, `audio/x-m4a`, `audio/wav`                              |
-## Breaking Changes
-### Asset Source ID Renames
-The following asset source IDs have been renamed to align with v5 naming conventions:
-| Old ID (deprecated)            | New ID (v1.69+)          |
-| ------------------------------ | ------------------------ |
-| `ly.img.captionPresets`        | `ly.img.caption.presets` |
-| `ly.img.colors.defaultPalette` | `ly.img.color.palette`   |
-| `ly.img.vectorpath`            | `ly.img.vector.shape`    |
-| `ly.img.textComponents`        | `ly.img.text.components` |
-### Merged Asset Sources
-The following asset sources have been consolidated:
-| Old IDs (deprecated)                                | New ID (v1.69+)       | Notes                         |
-| --------------------------------------------------- | --------------------- | ----------------------------- |
-| `ly.img.filter.lut` + `ly.img.filter.duotone`       | `ly.img.filter`       | Single source for all filters |
-| `ly.img.page.presets` + `ly.img.page.presets.video` | `ly.img.page.presets` | Unified page presets          |
-| `ly.img.template` + `ly.img.video.template`         | `ly.img.templates`    | Unified template assets       |
-### Merged Feature API Identifiers
-The following Feature API identifiers have been consolidated:
-| Old IDs (deprecated)                          | New ID (v1.69+) | Notes                     |
-| --------------------------------------------- | --------------- | ------------------------- |
-| `ly.img.filter.lut` + `ly.img.filter.duotone` | `ly.img.filter` | Controls all filter types |
-### Translation Key Updates
-Translation keys have been updated to match the new asset source naming:
-- Keys containing `captionPresets` → `caption.presets`
-- Keys containing `colors.defaultPalette` → `color.palette`
-- Keys containing `vectorpath` → `vector.shape`
-- Keys containing `textComponents` → `text.components`
-- Keys containing `filter.lut` or `filter.duotone` → `filter`
-### Scene Creation Methods
-The `createDesignScene()` and `createVideoScene()` methods are deprecated. Use the unified `scene.create` action instead.
-<Tabs syncKey="editor-type">
-  <TabItem label="Design">
-    **Before (deprecated):**
-    ```ts
-    await cesdk.createDesignScene();
-    ```
-    **After (v1.69+):**
-    ```ts
-    await cesdk.actions.run('scene.create');
-    ```
-  </TabItem>
-  <TabItem label="Video">
-    **Before (deprecated):**
-    ```ts
-    await cesdk.createVideoScene();
-    ```
-    **After (v1.69+):**
-    ```ts
-    await cesdk.actions.run('scene.create', { mode: 'Video' });
-    ```
-  </TabItem>
-</Tabs>
-The new action provides a single entry point for scene creation with flexible configuration:
-```ts
-// Create a scene with specific page dimensions
-await cesdk.actions.run('scene.create', {
-  page: { width: 1080, height: 1920, unit: 'Pixel' }
-});
-// Create a scene from a page preset asset
-await cesdk.actions.run('scene.create', {
-  page: {
-    sourceId: 'ly.img.page.presets',
-    assetId: 'ly.img.page.presets.instagram.story'
-  }
-});
-// Create multiple pages at once
-await cesdk.actions.run('scene.create', {
-  page: { width: 1080, height: 1080, unit: 'Pixel' },
-  pageCount: 3
-});
-```
-> **Default Page Format Migration:** If you previously set `meta: { default: 'true' }` on a page preset asset to auto-select it when creating scenes, this is no longer applied automatically. Pass the desired page format explicitly via the `page` parameter.
-```ts
-await cesdk.actions.run('scene.create', {
-  page: {
-    sourceId: 'ly.img.page.presets',
-    assetId: 'ly.img.page.presets.instagram.story'
-  }
-});
-```
-## Migration Checklist
-Use this checklist to ensure a complete migration:
-- Adopt a Starter Kit configuration for your editor type
-- Replace `addDefaultAssetSources()` and `addDemoAssetSources()` calls with individual asset source plugins
-- Update any hardcoded asset source IDs to use the new v5 naming conventions (see Breaking Changes)
-- Test asset loading and UI configuration
-## Want a Complete, Ready-to-Run App?
-Extracting the configuration folder is ideal for existing projects where you need full control over editor setup. If you're starting fresh and want a complete application scaffold with build tooling, asset management, and framework integration already configured, explore our [Starter Kits](./starterkits.md) instead.
-Starter Kits provide complete applications with everything wired together—clone, install, and start building.
----
-## More Resources
-- **[Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md)** - Browse all Vanilla JS/TS documentation
-- **[Complete Documentation](./llms-full.txt.md)** - Full documentation in one file (for LLMs)
-- **[Web Documentation](./js.md)** - Interactive documentation with examples
-- **[Support](mailto:support@img.ly)** - Contact IMG.LY support

package/assets/docs/guide/to-v1-72.md DELETED Viewed

@@ -1,193 +0,0 @@
-> This is one page of the CE.SDK Vanilla JS/TS documentation. For a complete overview, see the [Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
-**Navigation:** [Upgrading](./upgrade.md) > [To v1.72](./to-v1-72.md)
----
-Version 1.72 deprecates scene mode. Previously, scenes were either `'Design'` or `'Video'`, and the mode restricted which engine features were available. Starting with this version, there is a single scene type that supports all features. Mode is legacy metadata that no longer affects engine behavior.
-This guide covers how to migrate to the new model and, if you cannot migrate yet, how to keep using legacy mode.
-> **Caution:** **Cross-platform users:** Mobile SDKs (iOS, Android) do not yet support scenes without a mode. If your application creates scenes on Web and loads them on mobile, you **must** set an explicit mode. See [How to Keep Using Legacy Mode](#how-to-keep-using-legacy-mode) below.
-## What Changed
-- **Scene mode is deprecated.** The following APIs still work but will be removed in a future version: `engine.scene.getMode()`, `engine.scene.setMode()`, `engine.scene.createVideo()`, `cesdk.createDesignScene()`, `cesdk.createVideoScene()`, and the `mode` option on the `scene.create` action.
-- **New scenes have no mode.** Both the `scene.create` action and `engine.scene.create()` now create scenes without a mode. `engine.scene.getMode()` returns `null` instead of `'Design'`.
-- **The engine no longer restricts features by mode.** Methods that previously threw errors on Design-mode scenes (e.g., `addVideo()`, `getBackgroundTrack()`) now work on every scene.
-- **Reading `scene/mode` via the property system errors on mode-less scenes.** Code that reads `scene/mode` through `engine.block.getEnum(scene, 'scene/mode')` will throw on scenes without a mode. Either remove mode checks entirely (see [Remove Scene Mode Checks](#remove-scene-mode-checks)) or set a mode explicitly (see [How to Keep Using Legacy Mode](#how-to-keep-using-legacy-mode)).
-- **Browser support checks are no longer automatic.** Config plugins that need video decode/encode checks must call `editor.checkBrowserSupport` explicitly.
-## How to Migrate
-Migrating means embracing the single scene type. You no longer need to think about mode at all.
-### Simplify Scene Creation
-The `scene.create` action no longer requires a `mode` option. Previously, video editors passed `{ mode: 'Video' }` to get video capabilities. Now every scene has all capabilities by default.
-**Before:**
-```typescript
-// Editor instance methods
-await cesdk.createDesignScene();
-await cesdk.createVideoScene();
-// Editor action with mode
-await cesdk.actions.run('scene.create', { mode: 'Video' });
-// Engine API
-const scene = engine.scene.createVideo();
-```
-**After:**
-```typescript
-// Editor action, no mode needed
-await cesdk.actions.run('scene.create');
-// Engine API
-const scene = engine.scene.create();
-```
-All of the following are deprecated:
-- `cesdk.createDesignScene()` and `cesdk.createVideoScene()`: use the `scene.create` action instead.
-- `engine.scene.createVideo()`: use `engine.scene.create()` instead.
-- The `mode` option on the `scene.create` action: omit it entirely.
-- `engine.scene.setMode()`: only needed if you must maintain legacy mode (see below).
-- `engine.scene.getMode()`: mode no longer determines available features.
-### Remove Scene Mode Checks
-Since mode no longer affects behavior, any code that branches on `getMode()` to decide which features to enable can be removed. All features are always available.
-**Before:**
-```typescript
-const mode = engine.scene.getMode();
-if (mode === 'Video') {
-  // enable video features
-}
-```
-**After:**
-```typescript
-// No check needed. Video features are always available.
-```
-### Update Browser Support Checks in Your Config
-Browser capability checks (video decode/encode support) no longer run automatically based on scene mode. They are now triggered explicitly via the `editor.checkBrowserSupport` action.
-**If you use a starter kit config** (e.g., video editor, advanced video editor): update to the latest version of the config. The v1.72 configs already include the `editor.checkBrowserSupport` call with the appropriate defaults. No changes needed on your end.
-**If you have a custom config plugin**, add the `editor.checkBrowserSupport` call to your plugin's `initialize()` method:
-```typescript
-async initialize({ cesdk }: EditorPluginContext) {
-  await cesdk.actions.run('editor.checkBrowserSupport', {
-    videoDecode: 'block',
-    videoEncode: 'warn'
-  });
-}
-```
-The action accepts an optional parameters object:
-| Parameter     | Values    | Description |
-| ------------- | --------- | ----------- | ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `videoDecode` | `'block'` | `'warn'`    | `'ignore'` | How to handle missing video decode support. `'block'` shows an unclosable error dialog. `'warn'` shows a dismissible warning. `'ignore'` skips the check. |
-| `videoEncode` | `'block'` | `'warn'`    | `'ignore'` | How to handle missing video encode support. Same options as above.                                                                                        |
-When called without parameters, the action falls back to scene mode-based defaults for backward compatibility:
-- **Video mode scenes:** `videoDecode: 'block'`, `videoEncode: 'warn'`
-- **No-mode scenes (null):** all checks ignored
-- **Design mode scenes:** no checks run
-### Update TypeScript Types
-The return type of `engine.scene.getMode()` changed from `SceneMode` to `SceneMode | null`. If you still reference this API, update your type annotations.
-```typescript
-// Before
-const mode: SceneMode = engine.scene.getMode();
-// After
-const mode: SceneMode | null = engine.scene.getMode();
-```
-## How to Keep Using Legacy Mode
-If you cannot fully migrate yet, you can continue using scene mode. The deprecated APIs still work and will remain functional until removed in a future version.
-The key change is that scene creation no longer sets a mode automatically. To preserve the old behavior, you need to both set the mode explicitly **and** enable the `useLegacySceneModeChecks` feature flag.
-### Enable the Feature Flag
-By default, the editor UI treats all scenes as unified and ignores mode when deciding which features to show. To restore the old behavior where the UI gates features based on scene mode (e.g., hiding video export in Design mode or hiding page resize in Video mode), set `useLegacySceneModeChecks` to `true` in your configuration:
-```typescript
-CreativeEditorSDK.create(container, {
-  featureFlags: {
-    useLegacySceneModeChecks: true
-  }
-});
-```
-Without this flag, calling `setMode()` still stores the mode on the scene, but the editor UI will not restrict any features based on it.
-### Cross-Platform Compatibility (Web + Mobile)
-> **Caution:** Mobile SDKs (iOS, Android) do not yet support scenes without a mode. If you create scenes on Web and load them on mobile without an explicit mode, mobile SDKs will not be able to handle the scene correctly.
-Set the mode explicitly when creating scenes that will be shared with mobile:
-```typescript
-// Using the scene.create action
-await cesdk.actions.run('scene.create', { mode: 'Video' }); // or 'Design'
-// Using the engine API
-const scene = engine.scene.create();
-engine.scene.setMode('Design'); // or 'Video'
-```
-### Keeping Legacy Behavior on Web
-If your Web integration relies on the editor UI gating features by mode, enable the `useLegacySceneModeChecks` feature flag (see above) and call `setMode()` after `create()`. The engine itself no longer restricts features by mode, but the editor UI will respect mode when the flag is enabled. Your own code can also still read and branch on `getMode()`.
-## Scene File Compatibility
-### Loading Old Scenes in v1.72+
-Scenes saved with older SDK versions contain an explicit mode (`'Design'` or `'Video'`). When loaded in v1.72+, the mode is **preserved**. `engine.scene.getMode()` returns the original mode. All features work regardless of the loaded mode.
-### Loading New Scenes in Older SDKs
-Older SDK versions (pre-v1.72) cannot load mode-less scenes. If you need to support older SDK versions, set an explicit mode with `engine.scene.setMode()` before saving. See [How to Keep Using Legacy Mode](#how-to-keep-using-legacy-mode).
-### Cross-Platform Compatibility
-Mobile SDKs (iOS, Android) do not yet support scenes without a mode. If you share scenes between Web and mobile, always set an explicit mode before saving. See [How to Keep Using Legacy Mode](#how-to-keep-using-legacy-mode).
-## Summary
-| Change                                       | Impact                                            | Migration                                                                        | Legacy workaround                                                                 |
-| -------------------------------------------- | ------------------------------------------------- | -------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
-| Scene mode deprecated                        | Mode no longer affects engine behavior            | Remove mode checks                                                               | Enable `useLegacySceneModeChecks` flag, call `setMode()` or pass `mode` to action |
-| New scenes have no mode                      | `getMode()` returns `null`                        | No action needed                                                                 | Pass `mode` to `scene.create` action                                              |
-| `createVideo()` and `mode` option deprecated | Still work                                        | Use `create()` without `mode`                                                    | Keep using them                                                                   |
-| All features work on every scene             | Methods that threw in Design mode no longer throw | No action needed                                                                 | No action needed                                                                  |
-| Browser support checks need explicit params  | No longer automatic                               | Update starter kit config, or add `editor.checkBrowserSupport` in custom plugins | Call without params for mode-based defaults                                       |
-| Cross-platform scenes                        | Mobile doesn't support mode-less scenes yet       | N/A                                                                              | Always `setMode()` before saving                                                  |
----
-## More Resources
-- **[Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md)** - Browse all Vanilla JS/TS documentation
-- **[Complete Documentation](./llms-full.txt.md)** - Full documentation in one file (for LLMs)
-- **[Web Documentation](./js.md)** - Interactive documentation with examples
-- **[Support](mailto:support@img.ly)** - Contact IMG.LY support