@cesdk/engine 1.56.0-nightly.20250706 → 1.56.0-nightly.20250708

package/index.d.ts

@@ -1,3 +1,98 @@
+/**
+ * Options for adding images to the scene.
+ * @public
+ */
+export declare type AddImageOptions = {
+    /** How the image should be sized and positioned */
+    sizeMode?: SizeMode;
+    /** How the position should be interpreted */
+    positionMode?: PositionMode;
+    /** X position in scene design units */
+    x?: number;
+    /** Y position in scene design units */
+    y?: number;
+    /** Corner radius for rounded corners in scene design units */
+    cornerRadius?: number;
+    /** Size for the image - can be a number for equal width/height or an object */
+    size?: number | {
+        /** Width in scene design units */
+        width: number;
+        /** Height in scene design units */
+        height: number;
+    };
+    /** Timeline configuration for video scenes */
+    timeline?: {
+        /** Start time offset in seconds */
+        timeOffset?: number;
+        /** Duration in seconds */
+        duration?: number;
+    };
+    /** Drop shadow configuration */
+    shadow?: DropShadowOptions;
+    /** Animation configuration */
+    animation?: AnimationOptions;
+};
+
+/**
+ * Options for adding videos to the scene.
+ * @public
+ */
+export declare interface AddVideoOptions {
+    /** How the video should be sized and positioned */
+    sizeMode?: SizeMode;
+    /** How the position should be interpreted */
+    positionMode?: PositionMode;
+    /** X position in scene design units */
+    x?: number;
+    /** Y position in scene design units */
+    y?: number;
+    /** Corner radius for rounded corners in scene design units */
+    cornerRadius?: number;
+    /** Timeline configuration */
+    timeline?: {
+        /** Start time offset in seconds */
+        timeOffset?: number;
+        /** Duration in seconds */
+        duration?: number;
+    };
+    /** Drop shadow configuration */
+    shadow?: DropShadowOptions;
+    /** Animation configuration */
+    animation?: AnimationOptions;
+}
+
+/**
+ * The easing options for the camera animation.
+ * @public
+ */
+export declare type AnimationEasing = 'Linear' | 'EaseIn' | 'EaseOut' | 'EaseInOut' | 'EaseInQuart' | 'EaseOutQuart' | 'EaseInOutQuart' | 'EaseInQuint' | 'EaseOutQuint' | 'EaseInOutQuint' | 'EaseInBack' | 'EaseOutBack' | 'EaseInOutBack' | 'EaseInSpring' | 'EaseOutSpring' | 'EaseInOutSpring';
+
+/**
+ * Configuration options for animations.
+ * @public
+ */
+export declare type AnimationEntry = {
+    /** The type of animation to apply */
+    type: AnimationType;
+    /** Duration of the animation in seconds */
+    duration: number;
+    /** Easing function for the animation */
+    easing?: AnimationEasing;
+};
+
+/**
+ * Options for configuring animations (in, loop, out animations).
+ * @public
+ */
+export declare type AnimationOptions = {
+    /** Animation when the element enters */
+    in?: AnimationEntry;
+    /** Animation that loops while the element is visible */
+    loop?: AnimationEntry;
+    /** Animation when the element exits */
+    out?: AnimationEntry;
+};
+
 /**
  * The block type IDs for the animation blocks. These are the IDs used to create new animations
  * using `cesdk.engine.block.createAnimation(id)`.
@@ -122,6 +217,27 @@ export declare class AssetAPI {
      * The asset source provides methods for finding assets, applying them to scenes or blocks,
      * and managing asset lifecycle. All source operations are handled asynchronously.
      *
+     * ```javascript
+     * engine.asset.addSource({
+     *   id: 'foobar',
+     *   async findAssets(queryData) {
+     *     return Promise.resolve({
+     *       assets: [
+     *         {
+     *           id: 'logo',
+     *           meta: {
+     *             uri: 'https://img.ly/static/ubq_samples/imgly_logo.jpg',
+     *           }
+     *         }
+     *       ],
+     *       total: 1,
+     *       currentPage: queryData.page,
+     *       nextPage: undefined
+     *     });
+     *   },
+     * });
+     * ```
+     *
      * @category Asset Source Management
      * @param source - The asset source configuration.
      */
@@ -132,6 +248,10 @@ export declare class AssetAPI {
      * Local asset sources allow dynamic asset management through the add/remove methods.
      * You can specify supported MIME types to restrict what assets can be added.
      *
+     * ```javascript
+     * engine.asset.addLocalSource('local-source');
+     * ```
+     *
      * @category Asset Source Management
      * @param id - Unique identifier for the asset source.
      * @param supportedMimeTypes - The mime types of assets that are allowed to be added to this local source.
@@ -145,6 +265,10 @@ export declare class AssetAPI {
      * This permanently removes the asset source and all its associated assets.
      * Any ongoing operations with this source will be cancelled.
      *
+     * ```javascript
+     * engine.asset.removeSource('asset-source-id');
+     * ```
+     *
      * @category Asset Source Management
      * @param id - The ID of the asset source to remove.
      */
@@ -152,6 +276,10 @@ export declare class AssetAPI {
     /**
      * Get all registered asset source IDs.
      *
+     * ```javascript
+     * engine.asset.findAllSources();
+     * ```
+     *
      * @category Asset Source Management
      * @returns A list with the IDs of all registered asset sources.
      */
@@ -162,6 +290,14 @@ export declare class AssetAPI {
      * Supports pagination, text search, tag filtering, grouping, and sorting options.
      * Results include asset metadata, thumbnails, and application context.
      *
+     * ```javascript
+     * const result = await engine.asset.findAssets('asset-source-id', {
+     *   page: 0,
+     *   perPage: 100
+     * });
+     * const asset = result.assets[0];
+     * ```
+     *
      * @category Asset Discovery
      * @param sourceId - The ID of the asset source.
      * @param query - Query options to filter and sort the search results.
@@ -173,6 +309,10 @@ export declare class AssetAPI {
      *
      * Groups provide categorization for assets within a source, enabling filtered discovery.
      *
+     * ```javascript
+     * const groups = engine.asset.getGroups(customSource.id);
+     * ```
+     *
      * @category Asset Information
      * @param id - The ID of the asset source.
      * @returns Promise resolving to list of available group names.
@@ -183,6 +323,10 @@ export declare class AssetAPI {
      *
      * Returns the file types that can be added to this source. An empty result means all MIME types are supported.
      *
+     * ```javascript
+     * const mimeTypes = engine.asset.getSupportedMimeTypes('asset-source-id');
+     * ```
+     *
      * @category Asset Information
      * @param sourceId - The ID of the asset source.
      * @returns Array of supported MIME type strings.
@@ -191,6 +335,10 @@ export declare class AssetAPI {
     /**
      * Get attribution credits for an asset source.
      *
+     * ```javascript
+     * const credits = engine.asset.getCredits('asset-source-id');
+     * ```
+     *
      * @category Asset Information
      * @param sourceId - The ID of the asset source.
      * @returns The asset source's credits info consisting of a name and an optional URL.
@@ -202,6 +350,10 @@ export declare class AssetAPI {
     /**
      * Get license information for an asset source.
      *
+     * ```javascript
+     * const license = engine.asset.getLicense('asset-source-id');
+     * ```
+     *
      * @category Asset Information
      * @param sourceId - The ID of the asset source.
      * @returns The asset source's license info consisting of a name and an optional URL.
@@ -213,9 +365,13 @@ export declare class AssetAPI {
     /**
      * Check if an asset source supports asset management.
      *
-     * Returns true if the source allows adding and removing assets dynamically.
+     * Returns true if the source allows adding and removing assets dynamically, via 'Add File' and 'Delete' button on the UI.
      * This is typically true for local asset sources and false for remote sources.
      *
+     * ```javascript
+     * engine.asset.canManageAssets('asset-source-id');
+     * ```
+     *
      * @category Asset Information
      * @param sourceId - The ID of the asset source to check.
      * @returns True if the source supports asset management operations.
@@ -227,6 +383,19 @@ export declare class AssetAPI {
      * Only works with local asset sources that support asset management.
      * The asset will be validated against the source's supported MIME types.
      *
+     * ```javascript
+     * engine.asset.addAssetToSource('local-source', {
+     *   id: 'asset-id',
+     *   label: {
+     *     en: 'My Asset'
+     *   },
+     *   meta: {
+     *     uri: 'https://example.com/asset.jpg',
+     *     mimeType: 'image/jpeg'
+     *   }
+     * });
+     * ```
+     *
      * @category Asset Lifecycle
      * @param sourceId - The local asset source ID that the asset should be added to.
      * @param asset - The asset definition to add to the source.
@@ -238,6 +407,10 @@ export declare class AssetAPI {
      * Only works with local asset sources that support asset management.
      * The asset will be permanently deleted from the source.
      *
+     * ```javascript
+     * engine.asset.removeAssetFromSource('local-source', 'asset-id');
+     * ```
+     *
      * @category Asset Lifecycle
      * @param sourceId - The id of the local asset source that currently contains the asset.
      * @param assetId - The id of the asset to be removed.
@@ -249,6 +422,10 @@ export declare class AssetAPI {
      * Creates a new block configured according to the asset's properties and adds it to the scene.
      * The behavior can be customized by providing an `applyAsset` function when registering the asset source.
      *
+     * ```javascript
+     * await engine.asset.apply('asset-source-id', assetResult.assets[0]);
+     * ```
+     *
      * @category Asset Application
      * @param sourceId - The ID of the asset source.
      * @param assetResult - A single asset result from a `findAssets` query.
@@ -261,6 +438,10 @@ export declare class AssetAPI {
      * Modifies the target block's properties according to the asset's configuration.
      * The behavior can be customized by providing an `applyAssetToBlock` function when registering the asset source.
      *
+     * ```javascript
+     * await engine.asset.applyToBlock('asset-source-id', assetResult.assets[0]);
+     * ```
+     *
      * @category Asset Application
      * @param sourceId - The ID of the asset source.
      * @param assetResult - A single asset result from a `findAssets` query.
@@ -273,6 +454,15 @@ export declare class AssetAPI {
      * Allows applying individual properties (like colors, fonts, or effects) from an asset
      * without creating a new block. The behavior can be customized by providing an `applyAssetProperty` function.
      *
+     * ```javascript
+     * const asset = assetResult.assets[0];
+     * if (asset.payload && asset.payload.properties) {
+     *   for (const property of asset.payload.properties) {
+     *     await engine.asset.applyProperty('asset-source-id', asset, property);
+     *   }
+     * }
+     * ```
+     *
      * @category Asset Application
      * @param sourceId - The ID of the asset source.
      * @param assetResult - A single asset result from a `findAssets` query.
@@ -284,6 +474,30 @@ export declare class AssetAPI {
      *
      * The default implementation already handles various different kinds of assets and acts as a good starting point.
      *
+     * ```javascript
+     * engine.asset.addSource({
+     *   id: 'foobar',
+     *   async findAssets(queryData) {
+     *     return Promise.resolve({
+     *       assets: [
+     *         {
+     *           id: 'logo',
+     *           meta: {
+     *             uri: 'https://img.ly/static/ubq_samples/imgly_logo.jpg',
+     *           }
+     *         }
+     *       ],
+     *       total: 1,
+     *       currentPage: queryData.page,
+     *       nextPage: undefined
+     *     });
+     *   },
+     *   async applyAsset(assetResult) {
+     *     return engine.asset.defaultApplyAsset(assetResult);
+     *   },
+     * });
+     * ```
+     *
      * @category Asset Application
      * @param assetResult - A single asset result from a `findAssets` query.
      * @returns Promise resolving to the created block ID, or undefined if no block was created.
@@ -294,6 +508,30 @@ export declare class AssetAPI {
      *
      * The default implementation already handles various different kinds of assets and acts as a good starting point.
      *
+     * ```javascript
+     * engine.asset.addSource({
+     *   id: 'foobar',
+     *   async findAssets(queryData) {
+     *     return Promise.resolve({
+     *       assets: [
+     *         {
+     *           id: 'logo',
+     *           meta: {
+     *             uri: 'https://img.ly/static/ubq_samples/imgly_logo.jpg',
+     *           }
+     *         }
+     *       ],
+     *       total: 1,
+     *       currentPage: queryData.page,
+     *       nextPage: undefined
+     *     });
+     *   },
+     *   async applyAssetToBlock(assetResult, block) {
+     *     engine.asset.defaultApplyAssetToBlock(assetResult, block);
+     *   },
+     * });
+     * ```
+     *
      * @category Asset Application
      * @param assetResult - A single asset result from a `findAssets` query.
      * @param block - The block to apply the asset to.
@@ -302,6 +540,12 @@ export declare class AssetAPI {
     /**
      * Subscribe to asset source addition events.
      *
+     * ```javascript
+     * engine.asset.onAssetSourceAdded((sourceID) => {
+     *   console.log(`Added source: ${sourceID}`);
+     * });
+     * ```
+     *
      * @category Event Subscriptions
      * @param callback - The function called whenever an asset source is added.
      * @returns A method to unsubscribe from the event.
@@ -310,6 +554,12 @@ export declare class AssetAPI {
     /**
      * Subscribe to asset source removal events.
      *
+     * ```javascript
+     * engine.asset.onAssetSourceRemoved((sourceID) => {
+     *   console.log(`Removed source: ${sourceID}`);
+     * });
+     * ```
+     *
      * @category Event Subscriptions
      * @param callback - The function called whenever an asset source is removed.
      * @returns A method to unsubscribe from the event.
@@ -318,6 +568,12 @@ export declare class AssetAPI {
     /**
      * Subscribe to asset source content change events.
      *
+     * ```javascript
+     * engine.asset.onAssetSourceUpdated((sourceID) => {
+     *   console.log(`Updated source: ${sourceID}`);
+     * });
+     * ```
+     *
      * @category Event Subscriptions
      * @param callback - The function called whenever an asset source's contents are updated.
      * @returns A method to unsubscribe from the event.
@@ -329,6 +585,10 @@ export declare class AssetAPI {
      * This triggers refresh of any UI components that display assets from this source
      * and notifies subscribers to the asset source update events.
      *
+     * ```javascript
+     * engine.asset.assetSourceContentsChanged('asset-source-id');
+     * ```
+     *
      * @category Asset Lifecycle
      * @param sourceID - The asset source whose contents changed.
      */
@@ -1088,6 +1348,12 @@ export declare class BlockAPI {
     /**
      * Creates a new fill block.
      *
+     * ```javascript
+     * const solidColoFill = engine.block.createFill('color');
+     * // Longhand fill types are also supported
+     * const imageFill = engine.block.createFill('//ly.img.ubq/fill/image');
+     * ```
+     *
      * @category Block Fills
      * @param type - The type of the fill object that shall be created.
      * @returns The created fill's handle.
@@ -1112,13 +1378,21 @@ export declare class BlockAPI {
     /**
      * Gets the kind of a given block.
      *
+     * ```javascript
+     * const kind = engine.block.getKind(block);
+     * ```
+     *
      * @category Block Kind
      * @param id - The block to query.
      * @returns The block's kind.
      */
     getKind(id: DesignBlockId): string;
     /**
-     * Sets the kind of a given block.
+     * Sets the kind of a given block, a custom string for categorization of blocks.
+     *
+     * ```javascript
+     * engine.block.setKind(text, 'title');
+     * ```
      *
      * @category Block Kind
      * @param id - The block whose kind should be changed.
@@ -1174,6 +1448,12 @@ export declare class BlockAPI {
     /**
      * Checks if a set of blocks can be grouped.
      *
+     * A scene block or a block that is already part of a group cannot be grouped.
+     *
+     * ```javascript
+     * const groupable = engine.block.isGroupable([block1, block2])
+     * ```
+     *
      * @category Block Groups
      * @param ids - An array of block ids.
      * @returns Whether the blocks can be grouped together.
@@ -1182,6 +1462,12 @@ export declare class BlockAPI {
     /**
      * Groups multiple blocks into a new group block.
      *
+     * ```javascript
+     * if (engine.block.isGroupable([block1, block2])) {
+     *   const group = engine.block.group(block1, block2]);
+     * }
+     * ```
+     *
      * @category Block Groups
      * @param ids - A non-empty array of block ids.
      * @returns The block id of the created group.
@@ -1190,6 +1476,10 @@ export declare class BlockAPI {
     /**
      * Ungroups a group block, releasing its children.
      *
+     * ```javascript
+     * engine.block.ungroup(group);
+     * ```
+     *
      * @category Block Groups
      * @param id - The group id from a previous call to `group`.
      */
@@ -1199,6 +1489,10 @@ export declare class BlockAPI {
      *
      * Nothing happens if the target is not a group.
      *
+     * ```javascript
+     * engine.block.enterGroup(group);
+     * ```
+     *
      * @category Block Groups
      * @param id - The group id from a previous call to `group`.
      */
@@ -1208,6 +1502,10 @@ export declare class BlockAPI {
      *
      * Nothing happens if the block is not part of a group.
      *
+     * ```javascript
+     * engine.block.exitGroup(member1);
+     * ```
+     *
      * @category Block Groups
      * @param id - A block id.
      */
@@ -1278,6 +1576,10 @@ export declare class BlockAPI {
     /**
      * Finds all blocks with a given kind.
      *
+     * ```javascript
+     * const allTitles = engine.block.findByKind('title');
+     * ```
+     *
      * @category Block Exploration
      * @param kind - The kind to search for.
      * @returns A list of block ids.
@@ -1300,6 +1602,12 @@ export declare class BlockAPI {
     /**
      * Creates a new shape block of a given type.
      *
+     * ```javascript
+     * const star = engine.block.createShape('star');
+     * // Longhand shape types are also supported
+     * const rect = engine.block.createShape('//ly.img.ubq/shape/rect');
+     * ```
+     *
      * @category Block Shapes
      * @param type - The type of the shape object that shall be created.
      * @returns The created shape's handle.
@@ -1430,6 +1738,10 @@ export declare class BlockAPI {
      *
      * The position refers to the block's local space, relative to its parent with the origin at the top left.
      *
+     * ```javascript
+     * engine.block.setPositionX(block, 0.25);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to update.
      * @param value - The value of the x position.
@@ -1438,6 +1750,10 @@ export declare class BlockAPI {
     /**
      * Sets the mode for the block's X position.
      *
+     * ```javascript
+     * engine.block.setPositionXMode(block, 'Percent');
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to update.
      * @param mode - The x position mode: 'Absolute' or 'Percent'.
@@ -1448,6 +1764,10 @@ export declare class BlockAPI {
      *
      * The position refers to the block's local space, relative to its parent with the origin at the top left.
      *
+     * ```javascript
+     * engine.block.setPositionY(block, 0.25);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to update.
      * @param value - The value of the y position.
@@ -1456,6 +1776,10 @@ export declare class BlockAPI {
     /**
      * Sets the mode for the block's Y position.
      *
+     * ```javascript
+     * engine.block.setPositionYMode(block, 'Absolute');
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to update.
      * @param mode - The y position mode: 'Absolute' or 'Percent'.
@@ -1603,6 +1927,10 @@ export declare class BlockAPI {
     /**
      * Gets the width of a block.
      *
+     * ```javascript
+     * const width = engine.block.getWidth(block);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to query.
      * @returns The value of the block's width.
@@ -1611,6 +1939,10 @@ export declare class BlockAPI {
     /**
      * Gets the mode for the block's width.
      *
+     * ```javascript
+     * const widthMode = engine.block.getWidthMode(block);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to query.
      * @returns The current mode for the width: 'Absolute', 'Percent' or 'Auto'.
@@ -1619,6 +1951,10 @@ export declare class BlockAPI {
     /**
      * Gets the height of a block.
      *
+     * ```javascript
+     * const height = engine.block.getHeight(block);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to query.
      * @returns The value of the block's height.
@@ -1627,13 +1963,41 @@ export declare class BlockAPI {
     /**
      * Gets the mode for the block's height.
      *
+     * ```javascript
+     * const heightMode = engine.block.getHeightMode(block);
+     * ```
+     *
      * @category Block Layout
      * @param id - The block to query.
      * @returns The current mode for the height: 'Absolute', 'Percent' or 'Auto'.
      */
     getHeightMode(id: DesignBlockId): SizeMode;
     /**
-     * Sets the width of a block.
+     * Update a block's size.
+     * @param id - The block to update.
+     * @param width - The new width of the block.
+     * @param height - The new height of the block.
+     * @param options - Optional parameters for the size. Properties:
+     *   - `maintainCrop` - Whether or not the crop values, if available, should be automatically adjusted.
+     *   - `sizeMode` - The size mode: Absolute, Percent or Auto.
+     */
+    setSize(id: DesignBlockId, width: number, height: number, options?: {
+        maintainCrop?: boolean;
+        sizeMode?: SizeMode;
+    }): void;
+    /**
+     * Update a block's position.
+     * @param id - The block to update.
+     * @param x - The new x position of the block.
+     * @param y - The new y position of the block.
+     * @param options - Optional parameters for the position. Properties:
+     *   - `positionMode` - The position mode: absolute, percent or undefined.
+     */
+    setPosition(id: DesignBlockId, x: number, y: number, options?: {
+        positionMode?: PositionMode;
+    }): void;
+    /**
+     * Update a block's width and optionally maintain the crop.
      *
      * If the crop is maintained, the crop values will be automatically adjusted.
      *
@@ -1746,6 +2110,10 @@ export declare class BlockAPI {
     /**
      * Sets the content fill mode of a block.
      *
+     * ```javascript
+     * engine.block.setContentFillMode(image, 'Cover');
+     * ```
+     *
      * @category Block Fills
      * @param id - The block to update.
      * @param mode - The content fill mode: 'Crop', 'Cover' or 'Contain'.
@@ -1754,6 +2122,10 @@ export declare class BlockAPI {
     /**
      * Gets the content fill mode of a block.
      *
+     * ```javascript
+     * engine.block.getContentFillMode(image);
+     * ```
+     *
      * @category Block Fills
      * @param id - The block to query.
      * @returns The current mode: 'Crop', 'Cover' or 'Contain'.
@@ -1965,6 +2337,11 @@ export declare class BlockAPI {
      * Resizes blocks while adjusting content to fit.
      *
      * The content of the blocks is automatically adjusted to fit the new dimensions.
+     * Full-page blocks are resized to remain as full-page afterwards, while the blocks that are not full-page get resized as a group to the same scale factor and centered.
+     * ```javascript
+     * const pages = engine.scene.getPages();
+     * engine.block.resizeContentAware(pages, width: 100.0, 100.0);
+     * ```
      *
      * @category Block Layout
      * @param ids - The blocks to resize.
@@ -2033,6 +2410,10 @@ export declare class BlockAPI {
     /**
      * Sets a boolean property on a block.
      *
+     * ```javascript
+     * engine.block.setBool(scene, 'scene/aspectRatioLock', false);
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2042,6 +2423,10 @@ export declare class BlockAPI {
     /**
      * Gets a boolean property from a block.
      *
+     * ```javascript
+     * engine.block.getBool(scene, 'scene/aspectRatioLock');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2051,6 +2436,10 @@ export declare class BlockAPI {
     /**
      * Sets an integer property on a block.
      *
+     * ```javascript
+     * engine.block.setInt(starShape, 'shape/star/points', points + 2);
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2060,6 +2449,10 @@ export declare class BlockAPI {
     /**
      * Gets an integer property from a block.
      *
+     * ```javascript
+     * engine.block.setInt(starShape, 'shape/star/points', points + 2);
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2070,7 +2463,6 @@ export declare class BlockAPI {
      * Sets a float property on a block.
      *
      * ```javascript
-     * // Set the properties of a text block.
      * engine.block.setFloat(text, "text/letterSpacing", 0.2);
      * engine.block.setFloat(text, "text/lineHeight", 1.2);
      * ```
@@ -2084,6 +2476,10 @@ export declare class BlockAPI {
     /**
      * Gets a float property from a block.
      *
+     * ```javascript
+     * engine.block.getFloat(starShape, 'shape/star/innerDiameter');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2093,6 +2489,10 @@ export declare class BlockAPI {
     /**
      * Sets a double-precision float property on a block.
      *
+     * ```javascript
+     * engine.block.setDouble(audio, 'playback/duration', 1.0);
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2102,6 +2502,10 @@ export declare class BlockAPI {
     /**
      * Gets a double-precision float property from a block.
      *
+     * ```javascript
+     * engine.block.getDouble(audio, 'playback/duration');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2111,6 +2515,11 @@ export declare class BlockAPI {
     /**
      * Sets a string property on a block.
      *
+     * ```javascript
+     * engine.block.setString(text, 'text/text', 'Hello World');
+     * engine.block.setString(imageFill, 'fill/image/imageFileURI', 'https://example.com/sample.jpg');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2120,6 +2529,11 @@ export declare class BlockAPI {
     /**
      * Gets a string property from a block.
      *
+     * ```javascript
+     * engine.block.getString(text, 'text/text');
+     * engine.block.getString(imageFill, 'fill/image/imageFileURI');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2129,6 +2543,11 @@ export declare class BlockAPI {
     /**
      * Sets a color property on a block.
      *
+     * ```javascript
+     * // Set the block's fill color to white.
+     * engine.block.setColor(colorFill, 'fill/color/value', { r: 1, g: 1, b: 1, a: 1 });
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2138,6 +2557,10 @@ export declare class BlockAPI {
     /**
      * Gets a color property from a block.
      *
+     * ```javascript
+     * engine.block.getColor(colorFill, 'fill/color/value');
+     * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2201,6 +2624,13 @@ export declare class BlockAPI {
     /**
      * Sets the color stops for a gradient property.
      *
+     * ```javascript
+     * engine.block.setGradientColorStops(gradientFill, 'fill/gradient/colors', [
+     *   { color: { r: 1.0, g: 0.8, b: 0.2, a: 1.0 }, stop: 0 },
+     *   { color: { r: 0.3, g: 0.4, b: 0.7, a: 1.0 }, stop: 1 }
+     * ]);
+     * ```
+     *
      * @category Block Fills
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set, e.g. 'fill/gradient/colors'.
@@ -2210,6 +2640,10 @@ export declare class BlockAPI {
     /**
      * Gets the color stops from a gradient property.
      *
+     * ```
+     * engine.block.getGradientColorStops(gradientFill, 'fill/gradient/colors');
+     * ```
+     *
      * @category Block Fills
      * @param id - The block whose property should be queried.
      * @param property - The name of the property to query.
@@ -2219,6 +2653,10 @@ export declare class BlockAPI {
     /**
      * Gets the source set from a block property.
      *
+     * ```javascript
+     * const sourceSet = engine.block.getSourceSet(imageFill, 'fill/image/sourceSet');
+     * ```
+     *
      * @category Block Fills
      * @param id - The block that should be queried.
      * @param property - The name of the property to query, e.g. 'fill/image/sourceSet'.
@@ -2230,6 +2668,14 @@ export declare class BlockAPI {
      *
      * The crop and content fill mode of the associated block will be reset to default values.
      *
+     * ```javascript
+     * engine.block.setSourceSet(imageFill, 'fill/image/sourceSet', [{
+     *   uri: 'https://example.com/sample.jpg',
+     *   width: 800,
+     *   height: 600
+     * }]);
+     * ```
+     *
      * @category Block Fills
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2241,6 +2687,10 @@ export declare class BlockAPI {
      *
      * If an image with the same width already exists in the source set, it will be replaced.
      *
+     * ```javascript
+     * await engine.block.addImageFileURIToSourceSet(imageFill, 'fill/image/sourceSet', 'https://example.com/sample.jpg');
+     * ```
+     *
      * @category Block Fills
      * @param id - The block to update.
      * @param property - The name of the property to modify.
@@ -2253,6 +2703,10 @@ export declare class BlockAPI {
      *
      * If a video with the same width already exists in the source set, it will be replaced.
      *
+     * ```javascript
+     * await engine.block.addVideoFileURIToSourceSet(videoFill, 'fill/video/sourceSet', 'https://example.com/sample.mp4');
+     * ```
+     *
      * @category Block Fills
      * @param id - The block to update.
      * @param property - The name of the property to modify.
@@ -2267,6 +2721,7 @@ export declare class BlockAPI {
      * engine.block.setEnum(text, 'text/horizontalAlignment', 'Center');
      * engine.block.setEnum(text, 'text/verticalAlignment', 'Center');
      * ```
+     *
      * @category Block Properties
      * @param id - The block whose property should be set.
      * @param property - The name of the property to set.
@@ -2702,6 +3157,10 @@ export declare class BlockAPI {
     /**
      * Sets the enabled state of an effect block.
      *
+     * ```javascript
+     * engine.block.setEffectEnabled(effects[0], false);
+     * ```
+     *
      * @category Block Effects
      * @param effectId - The 'effect' block to update.
      * @param enabled - The new state.
@@ -2710,6 +3169,10 @@ export declare class BlockAPI {
     /**
      * Queries if an effect block is enabled.
      *
+     * ```javascript
+     * engine.block.isEffectEnabled(effects[0]);
+     * ```
+     *
      * @category Block Effects
      * @param effectId - The 'effect' block to query.
      * @returns True, if the effect is enabled. False otherwise.
@@ -2759,6 +3222,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the blur effect on a block.
      *
+     * ```javascript
+     * engine.block.setBlurEnabled(block, true);
+     * ```
+     *
      * @category Block Blur
      * @param id - The block to update.
      * @param enabled - The new enabled value.
@@ -2767,6 +3234,10 @@ export declare class BlockAPI {
     /**
      * Checks if blur is enabled for a block.
      *
+     * ```javascript
+     * const isBlurEnabled = engine.block.isBlurEnabled(block);
+     * ```
+     *
      * @category Block Blur
      * @param id - The block to query.
      * @returns True, if the blur is enabled. False otherwise.
@@ -2813,6 +3284,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the background of a block.
      *
+     * ```javascript
+     * engine.block.setBackgroundColorEnabled(block, true);
+     * ```
+     *
      * @category Block Appearance
      * @param id - The block whose background should be enabled or disabled.
      * @param enabled - If true, the background will be enabled.
@@ -2821,6 +3296,10 @@ export declare class BlockAPI {
     /**
      * Checks if the background of a block is enabled.
      *
+     * ```javascript
+     * const backgroundColorIsEnabled = engine.block.isBackgroundColorEnabled(block);
+     * ```
+     *
      * @category Block Appearance
      * @param id - The block whose background state should be queried.
      * @returns True, if background is enabled.
@@ -2846,6 +3325,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the stroke of a block.
      *
+     * ```javascript
+     * engine.block.setStrokeEnabled(block, true);
+     * ```
+     *
      * @category Block Strokes
      * @param id - The block whose stroke should be enabled or disabled.
      * @param enabled - If true, the stroke will be enabled.
@@ -2854,6 +3337,10 @@ export declare class BlockAPI {
     /**
      * Checks if the stroke of a block is enabled.
      *
+     * ```javascript
+     * const strokeIsEnabled = engine.block.isStrokeEnabled(block);
+     * ```
+     *
      * @category Block Strokes
      * @param id - The block whose stroke state should be queried.
      * @returns True if the block's stroke is enabled.
@@ -2980,6 +3467,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the drop shadow of a block.
      *
+     * ```javascript
+     * engine.block.setDropShadowEnabled(block, true);
+     * ```
+     *
      * @category Block Drop Shadow
      * @param id - The block whose drop shadow should be enabled or disabled.
      * @param enabled - If true, the drop shadow will be enabled.
@@ -2988,6 +3479,10 @@ export declare class BlockAPI {
     /**
      * Checks if the drop shadow of a block is enabled.
      *
+     * ```javascript
+     * const dropShadowIsEnabled = engine.block.isDropShadowEnabled(block);
+     * ```
+     *
      * @category Block Drop Shadow
      * @param id - The block whose drop shadow state should be queried.
      * @returns True if the block's drop shadow is enabled.
@@ -3502,6 +3997,10 @@ export declare class BlockAPI {
     /**
      * Checks if the fill of a block is enabled.
      *
+     * ```javascript
+     * engine.block.isFillEnabled(block);
+     * ```
+     *
      * @category Block Fills
      * @param id - The block whose fill state should be queried.
      * @returns The fill state.
@@ -3510,6 +4009,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the fill of a block.
      *
+     * ```javascript
+     * engine.block.setFillEnabled(block, false);
+     * ```
+     *
      * @category Block Fills
      * @param id - The block whose fill should be enabled or disabled.
      * @param enabled - If true, the fill will be enabled.
@@ -3555,6 +4058,12 @@ export declare class BlockAPI {
     /**
      * Enables or disables the placeholder function for a block.
      *
+     * When set to `true`, the placeholder capabilities are enabled in Adopter mode.
+     *
+     * ```javascript
+     * engine.block.setPlaceholderEnabled(block, true);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder function should be enabled or disabled.
      * @param enabled - Whether the function should be enabled or disabled.
@@ -3563,6 +4072,10 @@ export declare class BlockAPI {
     /**
      * Checks if the placeholder function for a block is enabled.
      *
+     * ```javascript
+     * const placeholderIsEnabled = engine.block.isPlaceholderEnabled(block);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder function state should be queried.
      * @returns The enabled state of the placeholder function.
@@ -3580,6 +4093,10 @@ export declare class BlockAPI {
     /**
      * Checks if a block supports placeholder behavior.
      *
+     * ```javascript
+     * const placeholderBehaviorSupported = engine.block.supportsPlaceholderBehavior(block);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block to query.
      * @returns True, if the block supports placeholder behavior.
@@ -3588,6 +4105,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the placeholder behavior for a block.
      *
+     * ```javascript
+     * engine.block.setPlaceholderBehaviorEnabled(block, true);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder behavior should be enabled or disabled.
      * @param enabled - Whether the placeholder behavior should be enabled or disabled.
@@ -3596,6 +4117,10 @@ export declare class BlockAPI {
     /**
      * Checks if the placeholder behavior for a block is enabled.
      *
+     * ```javascript
+     * engine.block.setPlaceholderBehaviorEnabled(block, true);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder behavior state should be queried.
      * @returns The enabled state of the placeholder behavior.
@@ -3621,6 +4146,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the placeholder overlay pattern.
      *
+     * ```javascript
+     * engine.block.setPlaceholderControlsOverlayEnabled(block, true);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder overlay should be enabled or disabled.
      * @param enabled - Whether the placeholder overlay should be shown or not.
@@ -3629,6 +4158,10 @@ export declare class BlockAPI {
     /**
      * Checks if the placeholder overlay pattern is enabled.
      *
+     * ```javascript
+     * const overlayEnabled = engine.block.isPlaceholderControlsOverlayEnabled(block);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder overlay visibility state should be queried.
      * @returns The visibility state of the block's placeholder overlay pattern.
@@ -3637,6 +4170,10 @@ export declare class BlockAPI {
     /**
      * Enables or disables the placeholder button.
      *
+     * ```javascript
+     * engine.block.setPlaceholderControlsButtonEnabled(block, true);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder button should be shown or not.
      * @param enabled - Whether the placeholder button should be shown or not.
@@ -3645,6 +4182,10 @@ export declare class BlockAPI {
     /**
      * Checks if the placeholder button is enabled.
      *
+     * ```javascript
+     * const buttonEnabled = engine.block.isPlaceholderControlsButtonEnabled(block);
+     * ```
+     *
      * @category Block Placeholder
      * @param id - The block whose placeholder button visibility state should be queried.
      * @returns The visibility state of the block's placeholder button.
@@ -3698,6 +4239,11 @@ export declare class BlockAPI {
     /**
      * Enables or disables a scope for a block.
      *
+     * ```javascript
+     * // Allow the user to move the image block.
+     * engine.block.setScopeEnabled(image, 'layer/move', true);
+     * ```
+     *
      * @category Block Scopes
      * @param id - The block whose scope should be enabled or disabled.
      * @param key - The scope to enable or disable.
@@ -3707,6 +4253,10 @@ export declare class BlockAPI {
     /**
      * Checks if a scope is enabled for a block.
      *
+     * ```javascript
+     * engine.block.isScopeEnabled(image, 'layer/move');
+     * ```
+     *
      * @category Block Scopes
      * @param id - The block whose scope state should be queried.
      * @param key - The scope to query.
@@ -3716,6 +4266,11 @@ export declare class BlockAPI {
     /**
      * Checks if an operation is allowed by a block's scopes.
      *
+     * ```javascript
+     * // This will return true when the global scope is set to 'Defer'.
+     * engine.block.isAllowedByScope(image, 'layer/move');
+     * ```
+     *
      * @category Block Scopes
      * @param id - The block to check.
      * @param key - The scope to check.
@@ -3952,6 +4507,10 @@ export declare class BlockAPI {
      *
      * When enabled, only this block's content will play while the rest of the scene remains paused.
      *
+     * ```javascript
+     * engine.block.setSoloPlaybackEnabled(videoFill, true);
+     * ```
+     *
      * @category Block Video
      * @param id - The block or fill to update.
      * @param enabled - Whether solo playback should be enabled.
@@ -3960,6 +4519,10 @@ export declare class BlockAPI {
     /**
      * Checks if solo playback is enabled for a block.
      *
+     * ```javascript
+     * engine.block.isSoloPlaybackEnabled(videoFill);
+     * ```
+     *
      * @category Block Video
      * @param id - The block or fill to query.
      * @returns Whether solo playback is enabled for this block.
@@ -4217,6 +4780,10 @@ export declare class BlockAPI {
      *
      * A block's state is determined by its own state and that of its shape, fill, and effects.
      *
+     * ```javascript
+     * const state = engine.block.getState(block);
+     * ```
+     *
      * @category Block State
      * @param id - The block to query.
      * @returns The block's state: 'Ready', 'Pending', or 'Error'.
@@ -4225,6 +4792,12 @@ export declare class BlockAPI {
     /**
      * Sets the state of a block.
      *
+     * ```javascript
+     * engine.block.setState(video, {type: 'Pending', progress: 0.5});
+     * engine.block.setState(page, {type: 'Ready'});
+     * engine.block.setState(image, {type: 'Error', error: 'ImageDecoding'});
+     * ```
+     *
      * @category Block State
      * @param id - The block whose state should be set.
      * @param state - The new state to set.
@@ -4235,6 +4808,12 @@ export declare class BlockAPI {
      *
      * The state is determined by the block and its associated shape, fill, and effects.
      *
+     * ```javascript
+     * const unsubscribe = engine.block.onStateChanged([], (blocks) => {
+     *   blocks.forEach(block => console.log(block));
+     * });
+     * ```
+     *
      * @category Block Events
      * @param ids - A list of block IDs to monitor. If empty, all blocks are monitored.
      * @param callback - The function to call when a state changes.
@@ -4251,6 +4830,72 @@ export declare class BlockAPI {
      * @returns A Promise that resolves once all resources have finished loading.
      */
     forceLoadResources(ids: DesignBlockId[]): Promise<void>;
+    /**
+     * Adds an image to the current page. The image will be automatically loaded
+     * and sized appropriately. In Video mode, timeline and animation options can be applied.
+     *
+     * @param url - URL or path to the image file
+     * @param options - Configuration options for the image
+     * @returns Promise that resolves to the ID of the created image block
+     * @throws Error if no current page exists
+     */
+    addImage(url: string, options?: AddImageOptions): Promise<DesignBlockId>;
+    /**
+     * Adds a video block to the current scene page. The video will be positioned and sized
+     * according to the provided parameters. Timeline and animation effects can be applied.
+     * Only works in Video mode, not in Design mode.
+     *
+     * @param url - URL or path to the video file
+     * @param width - Width of the video in scene design units
+     * @param height - Height of the video in scene design units
+     * @param options - Configuration options for the video
+     * @returns Promise that resolves to the ID of the created video block
+     * @throws Error if called in Design mode or if no current page exists
+     */
+    addVideo(url: string, width: number, height: number, options?: AddVideoOptions): Promise<DesignBlockId>;
+    /**
+     * Applies an animation to a block.
+     *
+     * @param block - The ID of the block to apply the animation to
+     * @param animation - The animation configuration options
+     */
+    applyAnimation(block: DesignBlockId, animation?: AnimationOptions): void;
+    /**
+     * Applies a drop shadow effect to any block.
+     *
+     * @param block - The ID of the block to apply the shadow to
+     * @param options - Shadow configuration options. If not provided, enables shadow with default settings
+     */
+    applyDropShadow(block: DesignBlockId, options?: DropShadowOptions): void;
+    /**
+     * Generates a thumbnail image of the scene at a specific time.
+     * Only works in Video mode, not in Design mode.
+     *
+     * @param height - Height of the thumbnail in scene design units (maximum 512)
+     * @param time - Time position in seconds to capture the thumbnail
+     * @returns Promise that resolves to a Blob containing the PNG thumbnail image
+     * @throws Error if no page exists, if called in Design mode, or if height exceeds 512 pixels
+     */
+    generateThumbnailAtTimeOffset(height: number, time: number): Promise<Blob>;
+    /**
+     * Gets the background track of the current scene.
+     * The background track is the track that determines the page duration.
+     * Only works in Video mode, not in Design mode.
+     *
+     * @returns The ID of the background track, or null if none exists
+     * @throws Error if called in Design mode
+     */
+    getBackgroundTrack(): DesignBlockId | null;
+    /**
+     * Moves a block to the background track.
+     * This is useful for organizing content in video scenes where you want
+     * certain elements to be part of the background layer.
+     * The background track is the track that determines the page duration.
+     *
+     * @param block - The ID of the block to move to the background track
+     * @throws Error if no background track is found
+     */
+    moveToBackgroundTrack(block: DesignBlockId): void;
 }
 
 /** @public */
@@ -4448,6 +5093,23 @@ export declare interface Configuration {
  */
 export declare type ContentFillMode = 'Crop' | 'Cover' | 'Contain';
 
+/**
+ * Options for creating a video scene.
+ * @public
+ */
+export declare type CreateSceneOptions = {
+    /** The page options */
+    page: {
+        /** The size of the page */
+        size: number | {
+            width: number;
+            height: number;
+        };
+        /** The background color of the page */
+        color?: Color;
+    };
+};
+
 /**
  * The CreativeEngine is the core processing unit of CE.SDK and handles state management, rendering, input handling, and much more.
  * It provides APIs to directly interact with assets, blocks, scenes, and variables. These APIs can be used in a headless environment
@@ -4704,6 +5366,29 @@ export declare type DesignBlockTypeShorthand = 'scene' | 'stack' | 'camera' | 'p
  */
 export declare type DesignUnit = 'Pixel' | 'Millimeter' | 'Inch';
 
+/**
+ * Options for configuring drop shadow effects on blocks.
+ * @public
+ */
+export declare type DropShadowOptions = {
+    /** The color of the drop shadow */
+    color?: Color;
+    /** The offset position of the shadow */
+    offset?: {
+        /** Horizontal offset in scene design units */
+        x?: number;
+        /** Vertical offset in scene design units */
+        y?: number;
+    };
+    /** The blur radius of the shadow */
+    blur?: {
+        /** Horizontal blur radius in scene design units */
+        x?: number;
+        /** Vertical blur radius in scene design units */
+        y?: number;
+    };
+};
+
 /** @public */
 export declare type EditMode = 'Transform' | 'Crop' | 'Text' | 'Playback' | 'Trim' | (string & {});
 
@@ -4820,6 +5505,10 @@ export declare class EditorAPI {
      *
      * Multiple histories can exist, but only one can be active at a time.
      *
+     * ```javascript
+     * const newHistory = engine.editor.createHistory();
+     * ```
+     *
      * @category History Management
      * @returns The handle of the created history.
      */
@@ -4827,6 +5516,10 @@ export declare class EditorAPI {
     /**
      * Destroy a history stack and free its resources.
      *
+     * ```javascript
+     * engine.editor.destroyHistory(oldHistory);
+     * ```
+     *
      * @category History Management
      * @param history - The history handle to destroy.
      * @throws Error if the handle doesn't refer to a valid history.
@@ -4837,6 +5530,10 @@ export declare class EditorAPI {
      *
      * All other histories lose their active state. Undo/redo operations only apply to the active history.
      *
+     * ```javascript
+     * engine.editor.setActiveHistory(newHistory);
+     * ```
+     *
      * @category History Management
      * @param history - The history handle to make active.
      * @throws Error if the handle doesn't refer to a valid history.
@@ -4847,6 +5544,10 @@ export declare class EditorAPI {
      *
      * Creates a new history if none exists.
      *
+     * ```javascript
+     * const oldHistory = engine.editor.getActiveHistory();
+     * ```
+     *
      * @category History Management
      * @returns The handle of the active history.
      */
@@ -4856,17 +5557,29 @@ export declare class EditorAPI {
      *
      * Only adds a state if undoable changes were made since the last undo step.
      *
+     * ```javascript
+     *   engine.editor.addUndoStep();
+     * ```
+     *
      * @category History Management
      */
     addUndoStep(): void;
     /**
-     * Undo one step in the active history.
+     * Undo one step in the active history if an undo step is available.
+     *
+     * ```javascript
+     * engine.editor.undo();
+     * ```
      *
      * @category History Management
      */
     undo(): void;
     /**
-     * Redo one step in the active history.
+     * Redo one step in the active history if a redo step is available.
+     *
+     * ```javascript
+     * engine.editor.redo();
+     * ```
      *
      * @category History Management
      */
@@ -4874,6 +5587,12 @@ export declare class EditorAPI {
     /**
      * Check if an undo step is available.
      *
+     * ```javascript
+     * if (engine.editor.canUndo()) {
+     *   engine.editor.undo();
+     * }
+     * ```
+     *
      * @category History Management
      * @returns True if an undo step is available.
      */
@@ -4881,6 +5600,12 @@ export declare class EditorAPI {
     /**
      * Check if a redo step is available.
      *
+     * ```javascript
+     * if (engine.editor.canRedo()) {
+     *   engine.editor.redo();
+     * }
+     * ```
+     *
      * @category History Management
      * @returns True if a redo step is available.
      */
@@ -4888,6 +5613,14 @@ export declare class EditorAPI {
     /**
      * Subscribe to undo/redo history changes.
      *
+     * ```javascript
+     * const unsubscribe = engine.editor.onHistoryUpdated(() => {
+     *   const canUndo = engine.editor.canUndo();
+     *   const canRedo = engine.editor.canRedo();
+     *   console.log("History updated", {canUndo, canRedo});
+     * })
+     * ```
+     *
      * @category Event Subscriptions
      * @param callback - Function called when the undo/redo history changes.
      * @returns A method to unsubscribe from the event.
@@ -5120,7 +5853,19 @@ export declare class EditorAPI {
      *
      * This function can be called more than once. Subsequent calls will overwrite previous calls.
      * To remove a previously set resolver, pass the value `null`.
-     * The given function must return an absolute path with a scheme. The input is allowed to be invalid URI, e.g., due to placeholders.
+     * The given function must return an absolute path with a scheme and cannot be asynchronous. The input is allowed to be invalid URI, e.g., due to placeholders.
+     *
+     * ```javascript
+     * // Replace all .jpg files with the IMG.LY logo
+     * engine.editor.setURIResolver((uri) => {
+     *   if (uri.endsWith('.jpg')) {
+     *     return 'https://img.ly/static/ubq_samples/imgly_logo.jpg';
+     *   }
+     *   // Make use of the default URI resolution behavior.
+     *   return engine.editor.defaultURIResolver(uri);
+     * });
+     * ```
+     *
      * @category Editor Settings
      * @param resolver - Custom resolution function. The resolution function
      *                   should not reference variables outside of its scope.
@@ -5132,6 +5877,11 @@ export declare class EditorAPI {
      * This is the default implementation for the URI resolver.
      *
      * It resolves the given path relative to the `basePath` setting.
+     *
+     * ```javascript
+     * engine.editor.defaultURIResolver(uri);
+     * ```
+     *
      * @category Editor Settings
      * @param relativePath - The relative path that should be resolved.
      * @returns The resolved absolute URI.
@@ -5143,6 +5893,7 @@ export declare class EditorAPI {
      * If a custom resolver has been set with `setURIResolver`, it invokes it with the given path.
      * Else, it resolves it as relative to the `basePath` setting.
      * This performs NO validation of whether a file exists at the specified location.
+     *
      * @category Editor Settings
      * @param relativePath - A relative path string
      * @returns The resolved absolute uri or an error if an invalid path was given.
@@ -5259,6 +6010,13 @@ export declare class EditorAPI {
     /**
      * Create a resizable buffer for arbitrary data.
      *
+     * ```javascript
+     * const buffer = engine.editor.createBuffer();
+     *
+     * // Reference the buffer resource from the audio block
+     * engine.block.setString(audioBlock, 'audio/fileURI', buffer);
+     * ```
+     *
      * @category Resource Management
      * @returns A URI to identify the created buffer.
      */
@@ -5266,6 +6024,10 @@ export declare class EditorAPI {
     /**
      * Destroy a buffer and free its resources.
      *
+     * ```javascript
+     * engine.editor.destroyBuffer(buffer);
+     * ```
+     *
      * @category Resource Management
      * @param uri - The URI of the buffer to destroy.
      */
@@ -5273,6 +6035,16 @@ export declare class EditorAPI {
     /**
      * Set the data of a buffer at a given offset.
      *
+     * ```javascript
+     * // Generate 10 seconds of stereo 48 kHz audio data
+     * const samples = new Float32Array(10 * 2 * 48000);
+     * for (let i = 0; i < samples.length; i += 2) {
+     *   samples[i] = samples[i + 1] = Math.sin((440 * i * Math.PI) / 48000);
+     * }
+     * // Assign the audio data to the buffer
+     * engine.editor.setBufferData(buffer, 0, new Uint8Array(samples.buffer));
+     * ```
+     *
      * @category Resource Management
      * @param uri - The URI of the buffer to update.
      * @param offset - The offset in bytes at which to start writing.
@@ -5282,6 +6054,15 @@ export declare class EditorAPI {
     /**
      * Get the data of a buffer at a given offset.
      *
+     * ```javascript
+     * engine.editor.findAllTransientResources().forEach((resource) => {
+     *   const bufferURI = resource.url;
+     *   const length = engine.editor.getBufferLength(buffer);
+     *   const data = engine.editor.getBufferData(buffer, 0, length);
+     *   const blob = new Blob([data]);
+     * })
+     * ```
+     *
      * @category Resource Management
      * @param uri - The URI of the buffer to query.
      * @param offset - The offset in bytes at which to start reading.
@@ -5292,6 +6073,12 @@ export declare class EditorAPI {
     /**
      * Set the length of a buffer.
      *
+     * ```javascript
+     * // Reduce the buffer to half its length
+     * const currentLength = engine.editor.getBufferLength(buffer);
+     * engine.editor.setBufferLength(buffer, currentLength / 2);
+     * ```
+     *
      * @category Resource Management
      * @param uri - The URI of the buffer to update.
      * @param length - The new length of the buffer in bytes.
@@ -5300,6 +6087,10 @@ export declare class EditorAPI {
     /**
      * Get the length of a buffer.
      *
+     * ```javascript
+     * const length = engine.editor.getBufferLength(buffer);
+     * ```
+     *
      * @category Resource Management
      * @param uri - The URI of the buffer to query.
      * @returns The length of the buffer in bytes.
@@ -5349,12 +6140,22 @@ export declare class EditorAPI {
     relocateResource(currentUrl: string, relocatedUrl: string): void;
     /**
      * Checks wether the block has selection and hover highlighting enabled or disabled.
+     *
+     * ```javascript
+     * const highlightingIsEnabled = engine.editor.isHighlightingEnabled(block);
+     * ```
+     *
      * @param id - The block to query.
      * @returns True if highlighting is enabled, false otherwise.
      */
     isHighlightingEnabled(id: DesignBlockId): boolean;
     /**
      * Enable or disable selection and hover highlighting for a block.
+     *
+     * ```javascript
+     * engine.editor.setHighlightingEnabled(block, true);
+     * ```
+     *
      * @param id - The block to update.
      * @param enabled - Whether or not the block should show highlighting when selected or hovered.
      */
@@ -6022,9 +6823,14 @@ export declare class SceneAPI {
      * ```
      *
      * @category Scene Creation
+     * @param sceneLayout - The layout of the scene.
+     * @param options - Optional parameters for the scene. Properties:
+     *   - `page` - Page options. Properties:
+     *     - `size` - The size of the page.
+     *     - `color` - Optional background color of the page.
      * @returns The scene's handle.
      */
-    create(sceneLayout?: SceneLayout): DesignBlockId;
+    create(sceneLayout?: SceneLayout, options?: CreateSceneOptions): DesignBlockId;
     /**
      * Create a new scene in video mode, along with its own camera.
      *
@@ -6033,9 +6839,13 @@ export declare class SceneAPI {
      * ```
      *
      * @category Scene Creation
+     * @param options - Optional parameters for the scene. Properties:
+     *   - `page` - Page options. Properties:
+     *     - `size` - The size of the page.
+     *     - `color` - Optional background color of the page.
      * @returns The scene's handle.
      */
-    createVideo(): DesignBlockId;
+    createVideo(options?: CreateSceneOptions): DesignBlockId;
     /**
      * Loads the given image and creates a scene with a single page showing the image.
      *
@@ -6224,6 +7034,16 @@ export declare class SceneAPI {
      * @returns The zoom level of the block's camera.
      */
     getZoomLevel(): number;
+    /**
+     * Sets the zoom and focus to show a block, optionally with animation.
+     * This only shows an effect if the zoom level is not handled/overwritten by the UI.
+     * Without padding, this results in a tight view on the block.
+     *
+     * @param id - The block that should be focused on.
+     * @param options - Configuration for padding and animation.
+     * @returns A promise that resolves once the zoom was set or rejects with an error otherwise.
+     */
+    zoomToBlock(id: DesignBlockId, options?: ZoomOptions): Promise<void>;
     /**
      * Sets the zoom and focus to show a block.
      *
@@ -6242,6 +7062,7 @@ export declare class SceneAPI {
      * @param paddingRight - Optional padding in screen pixels to the right of the block.
      * @param paddingBottom - Optional padding in screen pixels to the bottom of the block.
      * @returns A promise that resolves once the zoom was set or rejects with an error otherwise.
+     * @deprecated Use zoomToBlock with options object instead
      */
     zoomToBlock(id: DesignBlockId, paddingLeft?: number, paddingTop?: number, paddingRight?: number, paddingBottom?: number): Promise<void>;
     /**
@@ -6432,6 +7253,14 @@ export declare class SceneAPI {
      * @returns A method to unsubscribe.
      */
     onActiveChanged: (callback: () => void) => (() => void);
+    /**
+     * Starts or stops playback of the current scene.
+     * Only works in Video mode, not in Design mode.
+     *
+     * @param play - True to start playback, false to stop
+     * @throws Error if no page is available for playback
+     */
+    setPlaying(play: boolean): void;
 }
 
 /**
@@ -6790,4 +7619,30 @@ export declare type XYWH = [x: number, y: number, w: number, h: number];
  */
 export declare type ZoomAutoFitAxis = 'Horizontal' | 'Vertical' | 'Both';
 
+/**
+ * Options for zooming to a block with optional animation.
+ * @public
+ */
+export declare type ZoomOptions = {
+    /** Padding configuration around the block */
+    padding?: number | {
+        x?: number;
+        y?: number;
+    } | {
+        top?: number;
+        bottom?: number;
+        left?: number;
+        right?: number;
+    };
+    /** Animation configuration - boolean for default animation or object for custom settings */
+    animate?: boolean | {
+        /** Duration of the animation in seconds */
+        duration?: number;
+        /** Easing function for the animation */
+        easing?: AnimationEasing;
+        /** Whether the animation can be interrupted */
+        interruptible?: boolean;
+    };
+};
+
 export { }