@imgly/codesign-mcp 0.1.5 → 0.1.7

package/assets/docs/guide/import-media/concepts.md

@@ -1,4 +1,4 @@
-> 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).
+> This is one page of the CE.SDK Node.js documentation. For a complete overview, see the [Node.js Documentation Index](https://img.ly/docs/cesdk/node.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
 
 **Navigation:** [Guides](./guides.md) > [Import Media Assets](./import-media.md) > [Concepts](./import-media/concepts.md)
 
@@ -6,19 +6,9 @@
 
 Understand the foundational architecture of CE.SDK's asset system and how asset sources organize content across platforms.
 
-Asset sources are CE.SDK's content delivery architecture. Instead of hardcoding asset knowledge into the editor, CE.SDK uses a modular system where any content can be provided through a standardized interface. This decouples what assets are available from how they're discovered and applied.
+Asset sources are CE.SDK's content delivery architecture. Instead of hardcoding asset knowledge into the engine, CE.SDK uses a modular system where any content can be provided through a standardized interface. This decouples what assets are available from how they're discovered and applied.
 
 ```
- PLATFORM-SPECIFIC UI (Web)
-┌─────────────────────────────────────────────────────────────────────────┐
-│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐                  │
-│  │ Dock Button │───▶│ Asset Panel │───▶│ Assets Grid │                  │
-│  └─────────────┘    └─────────────┘    └─────────────┘                  │
-│                                                                         │
-│  Configured via: Asset Library Entries, Dock config, Panel navigation   │
-└─────────────────────────────────────────────────────────────────────────┘
-                                   │
-                                   ▼
  CROSS-PLATFORM ENGINE (engine.asset API)
 ┌─────────────────────────────────────────────────────────────────────────┐
 │                                                                         │
@@ -32,7 +22,7 @@ Asset sources are CE.SDK's content delivery architecture. Instead of hardcoding
 │  │ Database     │   │ Collections  │   │ Asset Packs  │                 │
 │  └──────────────┘   └──────────────┘   └──────────────┘                 │
 │                                                                         │
-│  Identical across Web, iOS, Android                                     │
+│  Identical across Web, iOS, Android, and server environments            │
 └─────────────────────────────────────────────────────────────────────────┘
 ```
 
@@ -40,7 +30,7 @@ This guide covers the foundational concepts of asset sources. For implementation
 
 ## Asset Source Fundamentals
 
-An asset source provides content to the editor through a common interface. Every source has a unique identifier (e.g., `ly.img.image`, `ly.img.sticker`) and implements methods for discovering and applying assets.
+An asset source provides content to the engine through a common interface. Every source has a unique identifier (e.g., `ly.img.image`, `ly.img.sticker`) and implements methods for discovering and applying assets.
 
 Sources support:
 
@@ -64,7 +54,7 @@ Asset sources handle virtually all reusable creative content:
 | Templates  | Design templates, page presets           |
 | Custom     | User uploads, remote APIs, your own data |
 
-Built-in sources include `ly.img.image`, `ly.img.sticker`, `ly.img.template`, `ly.img.typeface`, `ly.img.filter`, `ly.img.blur`, `ly.img.effect`, and more.
+Built-in sources include `ly.img.image`, `ly.img.sticker`, `ly.img.template`, `ly.img.typeface`, `ly.img.filter.lut`, `ly.img.blur`, `ly.img.effect`, and more.
 
 ## Types of Asset Sources
 
@@ -80,31 +70,27 @@ Implement the source interface to connect any backend—database, API, or custom
 
 ### Local Sources
 
-Managed by the engine with dynamic add/remove operations. Local sources are suitable for user uploads or custom collections that change during the editing session. The engine handles storage and retrieval.
+Managed by the engine with dynamic add/remove operations. Local sources are suitable for runtime asset management or collections that change during processing. The engine handles storage and retrieval.
 
 ### JSON-Based Sources
 
 Pre-defined asset collections loaded from JSON files. All built-in asset packs use this approach. JSON sources are ideal for static content that doesn't change frequently.
 
-## Asset Sources and the User Interface
-
-Asset sources are backend providers—they don't know about UI. The connection between sources and what users see happens through platform-specific UI configuration.
+## Server Environment Considerations
 
-On Web, asset sources connect to the UI through:
+In server-side rendering scenarios, asset sources operate identically to browser environments at the engine API level. The `engine.asset` API provides the same methods for registering sources, querying assets, and applying them to scenes.
 
-- **Asset Library Entries** — Group one or more sources for display, configure grid layout and preview
-- **Dock Buttons** — Sidebar icons that open asset panels
-- **Panel Navigation** — Entry → Source → Groups → Assets grid
+Server environments typically use asset sources for:
 
-This separation means you can:
+- **Batch processing** — Loading templates and applying assets programmatically
+- **Dynamic content generation** — Populating designs with content from databases or APIs
+- **Automated workflows** — Processing user-uploaded assets through custom sources
 
-- Show multiple sources in one UI panel
-- Show the same source in different UI locations
-- Change UI presentation without changing the source
+Since server environments are headless, there's no UI layer to configure. You work directly with the engine's asset API to register sources, query assets, and apply them to scenes programmatically.
 
 ## Cross-Platform Architecture
 
-Asset sources use the `engine.asset` API consistently across all platforms (Web, iOS, Android).
+Asset sources use the `engine.asset` API consistently across all platforms (Web, iOS, Android) and server environments.
 
 All platforms support:
 
@@ -135,15 +121,15 @@ Assets are discovered through queries supporting pagination, text search, tag/gr
 
 ## Source Lifecycle Events
 
-The engine emits events when sources change: added, removed, or contents updated. Subscribe to these events to keep UI synchronized with available content.
+The engine emits events when sources change: added, removed, or contents updated. Subscribe to these events to keep processing logic synchronized with available content.
 
 ## Troubleshooting
 
 Common conceptual misunderstandings:
 
-- **Confusing sources with UI** — Asset sources are backend providers; they don't render UI. The UI (dock buttons, panels, grids) is configured separately and connects to sources.
-- **Expecting sources to filter themselves** — Sources return all matching assets; UI configuration determines what's displayed to users.
+- **Expecting sources to filter themselves** — Sources return all matching assets; your code determines what to process.
 - **Mixing source types** — Custom sources (your code), local sources (engine-managed), and JSON sources (static files) serve different purposes. Choose based on whether you need dynamic backend connections, runtime asset management, or static asset packs.
+- **Not disposing the engine** — In server environments, always call `engine.dispose()` when finished to free resources.
 
 ## API Reference
 
@@ -157,17 +143,13 @@ Common conceptual misunderstandings:
 | `engine.asset.onAssetSourceRemoved()` | Events            | Subscribe to source removal events                                |
 | `engine.asset.onAssetSourceUpdated()` | Events            | Subscribe to source content change events                         |
 
-## Next Steps
 
-- [Your Server](./import-media/from-remote-source/your-server.md) — Connect your own backend as an asset source
-- [Asset Library Basics](./import-media/asset-panel/basics.md) — Configure the asset library UI on web
-- [Customize Asset Library](./import-media/asset-panel/customize.md) — Customize asset library appearance
 
 ---
 
 ## More Resources
 
-- **[Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md)** - Browse all Vanilla JS/TS documentation
+- **[Node.js Documentation Index](https://img.ly/docs/cesdk/node.md)** - Browse all Node.js 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
+- **[Web Documentation](./node.md)** - Interactive documentation with examples
+- **[Support](mailto:support@img.ly)** - Contact IMG.LY support

package/assets/docs/guide/import-media/content-json-schema.md

@@ -1,4 +1,4 @@
-> 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).
+> This is one page of the CE.SDK Node.js documentation. For a complete overview, see the [Node.js Documentation Index](https://img.ly/docs/cesdk/node.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
 
 **Navigation:** [Guides](./guides.md) > [Import Media Assets](./import-media.md) > [Asset Content JSON Schema](./import-media/content-json-schema.md)
 
@@ -20,24 +20,24 @@ Every `content.json` file requires three top-level fields:
 }
 ```
 
-| Field     | Type                | Required | Description                            |
-| --------- | ------------------- | -------- | -------------------------------------- |
-| `version` | `string`            | Yes      | Schema version                         |
-| `id`      | `string`            | Yes      | Unique identifier for the asset source |
-| `assets`  | `AssetDefinition[]` | Yes      | Array of asset definitions             |
+| Field | Type | Required | Description |
+|-------|------|----------|-------------|
+| `version` | `string` | Yes | Schema version |
+| `id` | `string` | Yes | Unique identifier for the asset source |
+| `assets` | `AssetDefinition[]` | Yes | Array of asset definitions |
 
 ## Asset Definition
 
 Each asset in the `assets` array follows this structure:
 
-| Property  | Type                       | Required | Description                                 |
-| --------- | -------------------------- | -------- | ------------------------------------------- |
-| `id`      | `string`                   | Yes      | Unique identifier within the source         |
-| `label`   | `Record<Locale, string>`   | No       | Localized display names for UI and tooltips |
-| `tags`    | `Record<Locale, string[]>` | No       | Localized keywords for search and filtering |
-| `groups`  | `string[]`                 | No       | Categories for grouping assets in the UI    |
-| `meta`    | `AssetMetaData`            | No       | Content-specific metadata                   |
-| `payload` | `AssetPayload`             | No       | Structured data for specialized assets      |
+| Property | Type | Required | Description |
+|----------|------|----------|-------------|
+| `id` | `string` | Yes | Unique identifier within the source |
+| `label` | `Record<Locale, string>` | No | Localized display names for UI and tooltips |
+| `tags` | `Record<Locale, string[]>` | No | Localized keywords for search and filtering |
+| `groups` | `string[]` | No | Categories for grouping assets in the UI |
+| `meta` | `AssetMetaData` | No | Content-specific metadata |
+| `payload` | `AssetPayload` | No | Structured data for specialized assets |
 
 ### Localization
 
@@ -78,13 +78,13 @@ Define URIs and file information for loading the asset content. The `uri` proper
 }
 ```
 
-| Property     | Type     | Description                                              |
-| ------------ | -------- | -------------------------------------------------------- |
-| `uri`        | `string` | Primary content URI. Supports `{{base_url}}` placeholder |
-| `thumbUri`   | `string` | Thumbnail image URI for previews                         |
-| `previewUri` | `string` | Higher-quality preview URI                               |
-| `filename`   | `string` | Original filename                                        |
-| `mimeType`   | `string` | MIME type (e.g., `"image/jpeg"`, `"video/mp4"`)          |
+| Property | Type | Description |
+|----------|------|-------------|
+| `uri` | `string` | Primary content URI. Supports `{{base_url}}` placeholder |
+| `thumbUri` | `string` | Thumbnail image URI for previews |
+| `previewUri` | `string` | Higher-quality preview URI |
+| `filename` | `string` | Original filename |
+| `mimeType` | `string` | MIME type (e.g., `"image/jpeg"`, `"video/mp4"`) |
 
 ### Dimension Properties
 
@@ -99,9 +99,9 @@ Specify the pixel dimensions of the asset. CE.SDK uses these values for layout c
 }
 ```
 
-| Property | Type     | Description              |
-| -------- | -------- | ------------------------ |
-| `width`  | `number` | Content width in pixels  |
+| Property | Type | Description |
+|----------|------|-------------|
+| `width` | `number` | Content width in pixels |
 | `height` | `number` | Content height in pixels |
 
 ### Block Creation Properties
@@ -119,44 +119,44 @@ Control what design block CE.SDK creates when the asset is applied. These proper
 }
 ```
 
-| Property    | Type     | Description                                                    |
-| ----------- | -------- | -------------------------------------------------------------- |
-| `blockType` | `string` | Design block type to create                                    |
-| `fillType`  | `string` | Fill type for the block                                        |
-| `shapeType` | `string` | Shape type for stickers/shapes                                 |
-| `kind`      | `string` | Asset category hint (e.g., `"image"`, `"video"`, `"template"`) |
+| Property | Type | Description |
+|----------|------|-------------|
+| `blockType` | `string` | Design block type to create |
+| `fillType` | `string` | Fill type for the block |
+| `shapeType` | `string` | Shape type for stickers/shapes |
+| `kind` | `string` | Asset category hint (e.g., `"image"`, `"video"`, `"template"`) |
 
 **Block Type Values:**
 
-| Value                  | Use Case                   |
-| ---------------------- | -------------------------- |
+| Value | Use Case |
+|-------|----------|
 | `//ly.img.ubq/graphic` | Images, stickers, graphics |
-| `//ly.img.ubq/text`    | Text blocks                |
-| `//ly.img.ubq/audio`   | Audio clips                |
-| `//ly.img.ubq/page`    | Templates, pages           |
-| `//ly.img.ubq/group`   | Grouped elements           |
-| `//ly.img.ubq/cutout`  | Cutout shapes              |
+| `//ly.img.ubq/text` | Text blocks |
+| `//ly.img.ubq/audio` | Audio clips |
+| `//ly.img.ubq/page` | Templates, pages |
+| `//ly.img.ubq/group` | Grouped elements |
+| `//ly.img.ubq/cutout` | Cutout shapes |
 
 **Fill Type Values:**
 
-| Value                                | Use Case          |
-| ------------------------------------ | ----------------- |
-| `//ly.img.ubq/fill/image`            | Image fills       |
-| `//ly.img.ubq/fill/video`            | Video fills       |
-| `//ly.img.ubq/fill/color`            | Solid color fills |
-| `//ly.img.ubq/fill/gradient/linear`  | Linear gradients  |
-| `//ly.img.ubq/fill/gradient/radial`  | Radial gradients  |
+| Value | Use Case |
+|-------|----------|
+| `//ly.img.ubq/fill/image` | Image fills |
+| `//ly.img.ubq/fill/video` | Video fills |
+| `//ly.img.ubq/fill/color` | Solid color fills |
+| `//ly.img.ubq/fill/gradient/linear` | Linear gradients |
+| `//ly.img.ubq/fill/gradient/radial` | Radial gradients |
 | `//ly.img.ubq/fill/gradient/conical` | Conical gradients |
 
 **Shape Type Values:**
 
-| Value                            | Use Case            |
-| -------------------------------- | ------------------- |
-| `//ly.img.ubq/shape/rect`        | Rectangles          |
-| `//ly.img.ubq/shape/ellipse`     | Circles, ovals      |
-| `//ly.img.ubq/shape/polygon`     | Polygons            |
-| `//ly.img.ubq/shape/star`        | Star shapes         |
-| `//ly.img.ubq/shape/line`        | Lines               |
+| Value | Use Case |
+|-------|----------|
+| `//ly.img.ubq/shape/rect` | Rectangles |
+| `//ly.img.ubq/shape/ellipse` | Circles, ovals |
+| `//ly.img.ubq/shape/polygon` | Polygons |
+| `//ly.img.ubq/shape/star` | Star shapes |
+| `//ly.img.ubq/shape/line` | Lines |
 | `//ly.img.ubq/shape/vector_path` | Custom vector paths |
 
 ### Media Properties
@@ -173,11 +173,11 @@ Configure playback behavior for time-based media like video and audio. Use `dura
 }
 ```
 
-| Property     | Type      | Description                                                                       |
-| ------------ | --------- | --------------------------------------------------------------------------------- |
-| `duration`   | `string`  | Duration in seconds as a string (e.g., `"30"`, `"120"`)                           |
-| `looping`    | `boolean` | Whether media should loop continuously. Use for background music or ambient video |
-| `vectorPath` | `string`  | SVG path data for vector shapes                                                   |
+| Property | Type | Description |
+|----------|------|-------------|
+| `duration` | `string` | Duration in seconds as a string (e.g., `"30"`, `"120"`) |
+| `looping` | `boolean` | Whether media should loop continuously. Use for background music or ambient video |
+| `vectorPath` | `string` | SVG path data for vector shapes |
 
 ### Effect Properties
 
@@ -192,10 +192,10 @@ Define visual effects that can be applied to design blocks. Effects include filt
 }
 ```
 
-| Property     | Type     | Description                                                                                                                          |
-| ------------ | -------- | ------------------------------------------------------------------------------------------------------------------------------------ |
-| `effectType` | `string` | Effect type (e.g., `"//ly.img.ubq/effect/lut_filter"`, `"//ly.img.ubq/effect/duotone_filter"`)                                       |
-| `blurType`   | `string` | Blur type: `"//ly.img.ubq/blur/uniform"`, `"//ly.img.ubq/blur/linear"`, `"//ly.img.ubq/blur/mirrored"`, `"//ly.img.ubq/blur/radial"` |
+| Property | Type | Description |
+|----------|------|-------------|
+| `effectType` | `string` | Effect type (e.g., `"//ly.img.ubq/effect/lut_filter"`, `"//ly.img.ubq/effect/duotone_filter"`) |
+| `blurType` | `string` | Blur type: `"//ly.img.ubq/blur/uniform"`, `"//ly.img.ubq/blur/linear"`, `"//ly.img.ubq/blur/mirrored"`, `"//ly.img.ubq/blur/radial"` |
 
 ### Responsive Sources
 
@@ -215,22 +215,22 @@ The `sourceSet` property defines multiple resolutions for responsive loading. Th
 
 When a user browses assets in the library panel, CE.SDK loads the smallest appropriate resolution. When the asset is added to the canvas and zoomed in, higher resolutions are loaded on demand. This pattern significantly improves initial load times for asset libraries with many items.
 
-| Property | Type     | Required | Description             |
-| -------- | -------- | -------- | ----------------------- |
-| `uri`    | `string` | Yes      | Source URI              |
-| `width`  | `number` | Yes      | Source width in pixels  |
-| `height` | `number` | Yes      | Source height in pixels |
+| Property | Type | Required | Description |
+|----------|------|----------|-------------|
+| `uri` | `string` | Yes | Source URI |
+| `width` | `number` | Yes | Source width in pixels |
+| `height` | `number` | Yes | Source height in pixels |
 
 ## Asset Payload
 
 The `payload` object contains structured data for specialized asset types like colors, fonts, and presets.
 
-| Property          | Type                   | Description                                 |
-| ----------------- | ---------------------- | ------------------------------------------- |
-| `color`           | `AssetColor`           | Color definition                            |
-| `typeface`        | `Typeface`             | Font family definition                      |
-| `transformPreset` | `AssetTransformPreset` | Page size or aspect ratio preset            |
-| `sourceSet`       | `Source[]`             | Responsive sources (same as meta.sourceSet) |
+| Property | Type | Description |
+|----------|------|-------------|
+| `color` | `AssetColor` | Color definition |
+| `typeface` | `Typeface` | Font family definition |
+| `transformPreset` | `AssetTransformPreset` | Page size or aspect ratio preset |
+| `sourceSet` | `Source[]` | Responsive sources (same as meta.sourceSet) |
 
 ### Color Payload
 
@@ -253,12 +253,12 @@ Colors support three color spaces: sRGB, CMYK, and Spot Color. Use sRGB for scre
 
 sRGB is the standard color space for web and digital displays. Component values range from 0 to 1, where `{ r: 1, g: 0, b: 0 }` represents pure red.
 
-| Property     | Type     | Range | Description            |
-| ------------ | -------- | ----- | ---------------------- |
-| `colorSpace` | `"sRGB"` | —     | Color space identifier |
-| `r`          | `number` | 0–1   | Red component          |
-| `g`          | `number` | 0–1   | Green component        |
-| `b`          | `number` | 0–1   | Blue component         |
+| Property | Type | Range | Description |
+|----------|------|-------|-------------|
+| `colorSpace` | `"sRGB"` | — | Color space identifier |
+| `r` | `number` | 0–1 | Red component |
+| `g` | `number` | 0–1 | Green component |
+| `b` | `number` | 0–1 | Blue component |
 
 **CMYK Color:**
 
@@ -278,13 +278,13 @@ sRGB is the standard color space for web and digital displays. Component values
 
 CMYK is used for print production. Component values represent ink percentages from 0 to 1, where higher values mean more ink coverage.
 
-| Property     | Type     | Range | Description            |
-| ------------ | -------- | ----- | ---------------------- |
-| `colorSpace` | `"CMYK"` | —     | Color space identifier |
-| `c`          | `number` | 0–1   | Cyan component         |
-| `m`          | `number` | 0–1   | Magenta component      |
-| `y`          | `number` | 0–1   | Yellow component       |
-| `k`          | `number` | 0–1   | Black (key) component  |
+| Property | Type | Range | Description |
+|----------|------|-------|-------------|
+| `colorSpace` | `"CMYK"` | — | Color space identifier |
+| `c` | `number` | 0–1 | Cyan component |
+| `m` | `number` | 0–1 | Magenta component |
+| `y` | `number` | 0–1 | Yellow component |
+| `k` | `number` | 0–1 | Black (key) component |
 
 **Spot Color:**
 
@@ -293,8 +293,8 @@ CMYK is used for print production. Component values represent ink percentages fr
   "payload": {
     "color": {
       "colorSpace": "SpotColor",
-      "name": "Pantone 286 C",
-      "externalReference": "pantone://286-c",
+      "name": "Brand-Blue-286",
+      "externalReference": "spot://brand-blue-286",
       "representation": {
         "colorSpace": "sRGB",
         "r": 0.0,
@@ -306,14 +306,14 @@ CMYK is used for print production. Component values represent ink percentages fr
 }
 ```
 
-Spot colors reference named colors from systems like Pantone. The `representation` provides a screen preview while the actual color is defined by the external reference for accurate print reproduction.
+Spot colors reference named colors from a named-color system (for example, your in-house brand palette or a print vendor's spot-color library). The `representation` provides a screen preview while the actual color is defined by the external reference for accurate print reproduction.
 
-| Property            | Type                              | Description                 |
-| ------------------- | --------------------------------- | --------------------------- |
-| `colorSpace`        | `"SpotColor"`                     | Color space identifier      |
-| `name`              | `string`                          | Spot color name             |
-| `externalReference` | `string`                          | External reference URI      |
-| `representation`    | `AssetRGBColor \| AssetCMYKColor` | Screen/print representation |
+| Property | Type | Description |
+|----------|------|-------------|
+| `colorSpace` | `"SpotColor"` | Color space identifier |
+| `name` | `string` | Spot color name |
+| `externalReference` | `string` | External reference URI |
+| `representation` | `AssetRGBColor \| AssetCMYKColor` | Screen/print representation |
 
 ### Typeface Payload
 
@@ -353,19 +353,19 @@ Each font entry in the `fonts` array represents a single font file. When a user
 
 **Typeface Properties:**
 
-| Property | Type     | Required | Description               |
-| -------- | -------- | -------- | ------------------------- |
-| `name`   | `string` | Yes      | Typeface family name      |
-| `fonts`  | `Font[]` | Yes      | Array of font definitions |
+| Property | Type | Required | Description |
+|----------|------|----------|-------------|
+| `name` | `string` | Yes | Typeface family name |
+| `fonts` | `Font[]` | Yes | Array of font definitions |
 
 **Font Properties:**
 
-| Property    | Type         | Required | Description                                          |
-| ----------- | ------------ | -------- | ---------------------------------------------------- |
-| `uri`       | `string`     | Yes      | Font file URI (.ttf, .otf, .woff, .woff2)            |
-| `subFamily` | `string`     | Yes      | Font subfamily name (e.g., "Regular", "Bold Italic") |
-| `weight`    | `FontWeight` | No       | Font weight                                          |
-| `style`     | `FontStyle`  | No       | Font style                                           |
+| Property | Type | Required | Description |
+|----------|------|----------|-------------|
+| `uri` | `string` | Yes | Font file URI (.ttf, .otf, .woff, .woff2) |
+| `subFamily` | `string` | Yes | Font subfamily name (e.g., "Regular", "Bold Italic") |
+| `weight` | `FontWeight` | No | Font weight |
+| `style` | `FontStyle` | No | Font style |
 
 **Font Weight Values:** `"thin"`, `"extraLight"`, `"light"`, `"normal"`, `"medium"`, `"semiBold"`, `"bold"`, `"extraBold"`, `"heavy"`
 
@@ -392,12 +392,12 @@ Defines page size or aspect ratio presets for templates, canvases, and crop tool
 
 Fixed size presets lock both width and height to specific values. Use `designUnit` to specify whether dimensions are in pixels (for digital), millimeters, or inches (for print).
 
-| Property     | Type          | Description                                  |
-| ------------ | ------------- | -------------------------------------------- |
-| `type`       | `"FixedSize"` | Preset type                                  |
-| `width`      | `number`      | Width value                                  |
-| `height`     | `number`      | Height value                                 |
-| `designUnit` | `string`      | Unit: `"Pixel"`, `"Millimeter"`, or `"Inch"` |
+| Property | Type | Description |
+|----------|------|-------------|
+| `type` | `"FixedSize"` | Preset type |
+| `width` | `number` | Width value |
+| `height` | `number` | Height value |
+| `designUnit` | `string` | Unit: `"Pixel"`, `"Millimeter"`, or `"Inch"` |
 
 **Fixed Aspect Ratio:**
 
@@ -415,11 +415,11 @@ Fixed size presets lock both width and height to specific values. Use `designUni
 
 Fixed aspect ratio presets maintain proportions while allowing flexible sizing. The width and height values represent the ratio components, not pixel dimensions.
 
-| Property | Type                 | Description                   |
-| -------- | -------------------- | ----------------------------- |
-| `type`   | `"FixedAspectRatio"` | Preset type                   |
-| `width`  | `number`             | Aspect ratio width component  |
-| `height` | `number`             | Aspect ratio height component |
+| Property | Type | Description |
+|----------|------|-------------|
+| `type` | `"FixedAspectRatio"` | Preset type |
+| `width` | `number` | Aspect ratio width component |
+| `height` | `number` | Aspect ratio height component |
 
 **Free Aspect Ratio:**
 
@@ -435,6 +435,24 @@ Fixed aspect ratio presets maintain proportions while allowing flexible sizing.
 
 Free aspect ratio presets allow unrestricted resizing without maintaining proportions.
 
+**Content Aspect Ratio:**
+
+```json
+{
+  "payload": {
+    "transformPreset": {
+      "type": "ContentAspectRatio"
+    }
+  }
+}
+```
+
+Content aspect ratio presets snap the block's frame to the intrinsic aspect ratio of its content, resolved from the fill's `sourceSet` when the preset is applied. Use this to revert a cropped image or video block to its natural proportions. Applying this preset to a block without resolvable content dimensions (e.g. a text block, empty placeholder, or page) returns an error.
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `type` | `"ContentAspectRatio"` | Preset type |
+
 ## Base URL Placeholder
 
 The `{{base_url}}` placeholder enables portable asset definitions. CE.SDK replaces this placeholder with the actual base path when loading:
@@ -596,20 +614,22 @@ Page format presets define canvas sizes for new designs. Use `FixedSize` to spec
 
 ## Troubleshooting
 
-| Issue                  | Solution                                                           |
-| ---------------------- | ------------------------------------------------------------------ |
-| Assets not appearing   | Verify `version`, `id`, and `assets` fields exist at the top level |
-| Invalid asset          | Ensure each asset has a unique `id`                                |
-| Missing thumbnails     | Check `thumbUri` points to accessible image URLs                   |
-| Base URL not resolving | Use exact `{{base_url}}` syntax (double curly braces)              |
-| CORS errors            | Configure server headers to allow cross-origin requests            |
-| Wrong block created    | Verify `meta.blockType` matches the intended design block          |
+| Issue | Solution |
+|-------|----------|
+| Assets not appearing | Verify `version`, `id`, and `assets` fields exist at the top level |
+| Invalid asset | Ensure each asset has a unique `id` |
+| Missing thumbnails | Check `thumbUri` points to accessible image URLs |
+| Base URL not resolving | Use exact `{{base_url}}` syntax (double curly braces) |
+| CORS errors | Configure server headers to allow cross-origin requests |
+| Wrong block created | Verify `meta.blockType` matches the intended design block |
+
+
 
 ---
 
 ## More Resources
 
-- **[Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md)** - Browse all Vanilla JS/TS documentation
+- **[Node.js Documentation Index](https://img.ly/docs/cesdk/node.md)** - Browse all Node.js 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
+- **[Web Documentation](./node.md)** - Interactive documentation with examples
+- **[Support](mailto:support@img.ly)** - Contact IMG.LY support