@adobe/ccweb-add-on-sdk-types 1.4.0 → 1.5.1

package/package.json

@@ -1,57 +1,57 @@
 {
-    "name": "@adobe/ccweb-add-on-sdk-types",
-    "version": "1.4.0",
-    "author": "Adobe",
-    "license": "MIT",
-    "description": "Type definitions for Adobe Creative Cloud Web Add-on SDK.",
-    "keywords": [
-        "adobe",
-        "creative cloud web",
-        "express",
-        "add-on",
-        "typescript",
-        "sdk",
-        "typings"
-    ],
-    "main": "",
-    "exports": {
-        ".": "./index.d.ts",
-        "./iframe-ui": "./ui/ui-sdk.d.ts",
-        "./express-document-sdk": "./sandbox/express-document-sdk.d.ts",
-        "./add-on-sdk-document-sandbox": "./sandbox/add-on-sdk-document-sandbox.d.ts"
-    },
-    "typesVersions": {
-        "*": {
-            "iframe-ui": [
-                "./ui/ui-sdk.d.ts"
-            ],
-            "express-document-sdk": [
-                "./sandbox/express-document-sdk.d.ts"
-            ],
-            "add-on-sdk-document-sandbox": [
-                "./sandbox/add-on-sdk-document-sandbox.d.ts"
-            ]
-        }
-    },
-    "types": "index.d.ts",
-    "repository": {
-        "url": "https://github.com/adobe/create-ccweb-add-on"
-    },
-    "scripts": {
-        "clean": "",
-        "ibuild": "",
-        "build": "",
-        "build:release": "",
-        "test": ""
-    },
-    "dependencies": {
-        "tslib": "2.4.0",
-        "gl-matrix": "3.3.0"
-    },
-    "devDependencies": {
-        "@types/node": "16.11.62",
-        "prettier": "2.8.0",
-        "ts-node": "10.9.1",
-        "typescript": "4.8.4"
+  "name": "@adobe/ccweb-add-on-sdk-types",
+  "version": "1.5.1",
+  "author": "Adobe",
+  "license": "MIT",
+  "description": "Type definitions for Adobe Creative Cloud Web Add-on SDK.",
+  "keywords": [
+    "adobe",
+    "creative cloud web",
+    "express",
+    "add-on",
+    "typescript",
+    "sdk",
+    "typings"
+  ],
+  "main": "",
+  "exports": {
+    ".": "./index.d.ts",
+    "./iframe-ui": "./ui/ui-sdk.d.ts",
+    "./express-document-sdk": "./sandbox/express-document-sdk.d.ts",
+    "./add-on-sdk-document-sandbox": "./sandbox/add-on-sdk-document-sandbox.d.ts"
+  },
+  "typesVersions": {
+    "*": {
+      "iframe-ui": [
+        "./ui/ui-sdk.d.ts"
+      ],
+      "express-document-sdk": [
+        "./sandbox/express-document-sdk.d.ts"
+      ],
+      "add-on-sdk-document-sandbox": [
+        "./sandbox/add-on-sdk-document-sandbox.d.ts"
+      ]
     }
-}
+  },
+  "types": "index.d.ts",
+  "repository": {
+    "url": "https://github.com/adobe/create-ccweb-add-on"
+  },
+  "dependencies": {
+    "tslib": "2.4.0",
+    "gl-matrix": "3.3.0"
+  },
+  "devDependencies": {
+    "@types/node": "16.11.62",
+    "prettier": "2.8.0",
+    "ts-node": "10.9.1",
+    "typescript": "4.8.4"
+  },
+  "scripts": {
+    "clean": "",
+    "ibuild": "",
+    "build": "",
+    "build:release": "",
+    "test": ""
+  }
+}

package/sandbox/express-document-sdk.d.ts

@@ -59,7 +59,9 @@ declare enum ArrowHeadType {
 export declare class ArtboardList extends RestrictedItemList<ArtboardNode> {
     /**
      * Create a new artboard and add it to the end of the list. The artboard size is the same as others on this page. The
-     * artboard background is set to default fill color {@link DEFAULT_ARTBOARD_FILL_COLOR}.
+     * artboard background is set to default fill color {@link DEFAULT_ARTBOARD_FILL_COLOR}. The new artboard becomes the
+     * default target for newly inserted content (see insertionParent) and the timeline advances to show this artboard
+     * in the current viewport.
      * @returns the newly added artboard.
      */
     addArtboard(): ArtboardNode;
@@ -70,7 +72,7 @@ export declare class ArtboardList extends RestrictedItemList<ArtboardNode> {
  *
  * When multiple artboards exist on a page, the artboards represent "scenes" in a linear timeline sequence.
  */
-export declare class ArtboardNode extends BaseNode implements IRectangularNode, ContainerNode {
+export declare class ArtboardNode extends VisualNode implements IRectangularNode, ContainerNode {
     /**
      * Returns a read-only list of all children of the node. General-purpose content containers such as ArtboardNode or
      * GroupNode also provide a mutable {@link ContainerNode.children} list. Other nodes with a more specific structure can
@@ -84,6 +86,11 @@ export declare class ArtboardNode extends BaseNode implements IRectangularNode,
      * The node's children. Use the methods on this ItemList object to get, add, and remove children.
      */
     get children(): ItemList<Node>;
+    /**
+     * The background fill of the artboard. Artboards must always have a fill.
+     */
+    set fill(fill: Fill);
+    get fill(): Readonly<Fill>;
     /**
      * The node's parent. Undefined if the node is an orphan.
      */
@@ -96,11 +103,6 @@ export declare class ArtboardNode extends BaseNode implements IRectangularNode,
      * The height of the artboard.
      */
     get height(): number;
-    /**
-     * The background fill of the artboard. Artboards must always have a fill.
-     */
-    get fill(): Readonly<Fill>;
-    set fill(fill: Fill);
 }
 
 /**
@@ -110,6 +112,11 @@ export declare class ArtboardNode extends BaseNode implements IRectangularNode,
  * properties.
  */
 export declare class BaseNode {
+    /**
+     * A unique identifier for this node that stays the same when the file is closed & reopened, or if the node is
+     * moved to a different part of the document.
+     */
+    get id(): string;
     /**
      * Returns a read-only list of all children of the node. General-purpose content containers such as ArtboardNode or
      * GroupNode also provide a mutable {@link ContainerNode.children} list. Other nodes with a more specific structure can
@@ -120,12 +127,6 @@ export declare class BaseNode {
      * to guarantee all their children are full-fledged Node instances.
      */
     get allChildren(): Readonly<Iterable<BaseNode>>;
-
-    /**
-     * A unique identifier for this node that stays the same when the file is closed & reopened, or if the node is
-     * moved to a different part of the document.
-     */
-    get id(): string;
     /**
      * The node's type.
      */
@@ -169,7 +170,7 @@ export declare interface BitmapImage {
  * <InlineAlert slots="text" variant="warning"/>
  * *Do not depend on the literal numeric values of these constants*, as they may change. Always reference the enum identifiers in your code.
  *
- * Determines how a scenende is composited on top of the content rendered below it.
+ * Determines how a scenenode is composited on top of the content rendered below it.
  *
  * If a node is inside a container whose blend mode anything other than {@link passThrough}, then the node's blend mode only
  * interacts with other siblings within the same container. See documentation below for details.
@@ -234,7 +235,7 @@ export declare interface Color {
 /**
  * Represents a solid-color fill.
  *
- * The most convenient way to create a stroke is via `Editor.makeColorFill()`.
+ * The most convenient way to create a fill is via `Editor.makeColorFill()`.
  */
 export declare interface ColorFill extends Fill {
     /**
@@ -297,9 +298,9 @@ export declare const constants: typeof ApiConstants;
  * also hold children in specified "slots." Use {@link Node.allChildren} for read access to children regardless of node type.
  *
  * Some ContainerNode classes may be full-fledged Node subclasses (such as Group), while others may be a subclass of the
- * more minimal BaseNode (such as Artboard).
+ * more minimal VisualNode (such as Artboard).
  */
-export declare interface ContainerNode extends BaseNode {
+export declare interface ContainerNode extends VisualNode {
     /**
      * The node's children. Use the methods on this ItemList object to get, add, and remove children.
      */
@@ -337,12 +338,52 @@ export declare class Context {
      * other UI state.
      */
     get insertionParent(): ContainerNode;
+    /**
+     * @returns The currently viewed page.
+     */
+    get currentPage(): PageNode;
 }
 
 /**
  * Entry point for APIs that read or modify the document's content.
  */
 export declare class Editor {
+    /**
+     * Enqueues a function to be run at a later time when edits to the user's document may be performed. You can always edit
+     * the document immediately when invoked in response to your add-on's UI code. However, if you delay to await an
+     * asynchronous operation such as {@link loadBitmapImage}, any edits following this pause must be scheduled using
+     * queueAsyncEdit(). This ensures the edit is properly tracked for saving and undo.
+     *
+     * The delay before your edit function is executed is typically just a few milliseconds, so it will appear instantaneous
+     * to users. However, note that queueAsyncEdit() will return *before* your function has been run.
+     * If you need to trigger any code after the edit has been performed, either include this in the lambda you are enqueuing
+     * or await the Promise returned by queueAsyncEdit().
+     *
+     * Generally, calling any setter or method is treated as an edit; but simple getters may be safely called at any time.
+     *
+     * Example of typical usage:
+     * ```javascript
+     * // Assume insertImage() is called from your UI code, and given a Blob containing image data
+     * async function insertImage(blob) {
+     *     // This function was invoked from the UI iframe, so we can make any edits we want synchronously here.
+     *     // Initially load the bitmap - an async operation
+     *     const bitmapImage = await editor.loadBitmapImage(blob);
+     *
+     *     // Execution doesn't arrive at this line until an async delay, due to the Promise 'await' above
+     *
+     *     // Further edits need to be queued to run at a safe time
+     *     editor.queueAsyncEdit(() => {
+     *          // Create scenenode to display the image, and add it to the current artboard
+     *          const mediaContainer = editor.createImageContainer(bitmapImage);
+     *          editor.context.insertionParent.children.append(mediaContainer);
+     *     });
+     * }
+     * ```
+     *
+     * @param lambda - a function which edits the document model.
+     * @returns a Promise that resolves when the lambda has finished running, or rejects if the lambda throws an error.
+     */
+    queueAsyncEdit(lambda: () => void): Promise<void>;
     /**
      * User's current selection context
      */
@@ -381,7 +422,7 @@ export declare class Editor {
      * container's mediaRectangle and maskShape children.
      *
      * Image creation involves some asynchronous steps. The image will be visible in this client almost instantly, but will
-     * render as a gray placeholder on other clients until it has been uploaded to storage and then downloaded by those clients.
+     * render as a gray placeholder on other clients until it has been uploaded to DCX and then downloaded by those clients.
      * This local client will act as having unsaved changes until the upload has finished.
      *
      * @param bitmapData - BitmapImage resource (e.g. returned from loadBitmapImage()).
@@ -410,7 +451,7 @@ export declare class Editor {
      *
      * @param bitmapData - Encoded image data in PNG or JPEG format.
      */
-    loadBitmapImage(bitmapData: Blob): Promise<BitmapImage>;
+    loadBitmapImage(rendition: Blob): Promise<BitmapImage>;
     /**
      * Convenience helper to create a complete Stroke value given just a subset of its fields. All other fields are
      * populated with default values.
@@ -426,14 +467,6 @@ export declare class Editor {
      * @returns a stroke configured with the given options.
      */
     makeStroke(options?: Partial<Stroke>): Stroke;
-    /**
-     * @returns a path node with a default stroke and no initial fill.
-     * @param path - a string representing any [SVG path element](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths).
-     * Note that the path data will be normalized, and therefore the `path` getter may return a different SVG string from the path creation input.
-     * For example, "M 10 80 Q 52.5 10, 95 80 T 180 80" becomes "M 10 80 C 38.33 33.33 66.67 33.33 95 80...".
-     * Throws if the input is empty or is not legal SVG path syntax.
-     */
-    createPath(path: string): PathNode;
     /**
      * @returns a text node with default styles. The text content is initially empty, so the text node will be
      * invisible until its `text` property is set. Creates point text, so the node's width will automatically
@@ -441,41 +474,13 @@ export declare class Editor {
      */
     createText(): TextNode;
     /**
-     * Enqueues a function to be run at a later time when edits to the user's document may be performed. You can always edit
-     * the document immediately when invoked in response to your add-on's UI code. However, if you delay to await an
-     * asynchronous operation such as {@link loadBitmapImage}, any edits following this pause must be scheduled using
-     * queueAsyncEdit(). This ensures the edit is properly tracked for saving and undo.
-     *
-     * The delay before your edit function is executed is typically just a few milliseconds, so it will appear instantaneous
-     * to users. However, note that queueAsyncEdit() will return *before* your function has been run.
-     * If you need to trigger any code after the edit has been performed, either include this in the lambda you are enqueuing
-     * or await the Promise returned by queueAsyncEdit().
-     *
-     * Generally, calling any setter or method is treated as an edit; but simple getters may be safely called at any time.
-     *
-     * Example of typical usage:
-     * ```javascript
-     * // Assume insertImage() is called from your UI code, and given a Blob containing image data
-     * async function insertImage(blob) {
-     *     // This function was invoked from the UI iframe, so we can make any edits we want synchronously here.
-     *     // Initially load the bitmap - an async operation
-     *     const bitmapImage = await editor.loadBitmapImage(blob);
-     *
-     *     // Execution doesn't arrive at this line until an async delay, due to the Promise 'await' above
-     *
-     *     // Further edits need to be queued to run at a safe time
-     *     editor.queueAsyncEdit(() => {
-     *          // Create scenenode to display the image, and add it to the current artboard
-     *          const mediaContainer = editor.createImageContainer(bitmapImage);
-     *          editor.context.insertionParent.children.append(mediaContainer);
-     *     });
-     * }
-     * ```
-     *
-     * @param lambda - a function which edits the document model.
-     * @returns a Promise that resolves when the lambda has finished running, or rejects if the lambda throws an error.
+     * @returns a path node with a default stroke and no initial fill.
+     * @param path - a string representing any [SVG path element](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths).
+     * Note that the path data will be normalized, and therefore the `path` getter may return a different SVG string from the path creation input.
+     * For example, "M 10 80 Q 52.5 10, 95 80 T 180 80" becomes "M 10 80 C 38.33 33.33 66.67 33.33 95 80...".
+     * Throws if the input is empty or is not legal SVG path syntax.
      */
-    queueAsyncEdit(lambda: () => void): Promise<void>;
+    createPath(path: string): PathNode;
 }
 
 export declare const editor: ExpressEditor;
@@ -543,8 +548,8 @@ export declare class FillableNode extends StrokableNode implements IFillableNode
     /**
      * The fill applied to the shape, if any.
      */
-    get fill(): Readonly<Fill> | undefined;
     set fill(fill: Fill | undefined);
+    get fill(): Readonly<Fill> | undefined;
 }
 
 /**
@@ -573,10 +578,15 @@ declare enum FillType {
 }
 
 /**
- * A GridLayoutNode represents a grid layout in the scenegraph. The GridLayoutNode is used to
- * create a layout grid that other content can be placed into.
+ * A GridLayoutNode represents a grid layout in the scenegraph. The GridLayoutNode is used to create
+ * a layout grid that other content can be placed into.
  */
-export declare class GridLayoutNode extends Node implements IRectangularNode {
+export declare class GridLayoutNode extends Node implements Readonly<IRectangularNode> {
+    /**
+     * The background fill of the GridLayout.
+     */
+    set fill(fill: Fill);
+    get fill(): Readonly<Fill>;
     /**
      * The width of the node.
      */
@@ -585,11 +595,6 @@ export declare class GridLayoutNode extends Node implements IRectangularNode {
      * The height of the node.
      */
     get height(): number;
-    /**
-     * The background fill of the GridLayout.
-     */
-    get fill(): Readonly<Fill>;
-    set fill(fill: Fill);
 }
 
 /**
@@ -614,6 +619,12 @@ export declare class GroupNode extends Node implements ContainerNode {
      * @throws if the given node type cannot be used as a vector mask.
      */
     set maskShape(mask: FillableNode | undefined);
+    /**
+     * @override
+     * Note: If this group has a maskShape, group's bounds are always identical to the maskShape's, regardless of the
+     * group's other content.
+     */
+    get boundsLocal(): Readonly<Rect>;
 }
 
 /**
@@ -783,11 +794,13 @@ export declare class MediaContainerNode extends Node {
 
 /**
  * A Node represents an object in the scenegraph, the document's visual content tree. Most tangible visual content is a
- * subclass of Node, but note that some abstract top-level structural nodes (such as PageNode) only extend the more minimal
- * BaseNode. As a general rule, if you can click or drag an object with the select/move tool in the UI, then it extends
- * from Node.
+ * subclass of Node, but note that some abstract top-level structural nodes (such as PageNode) only extend the more
+ * minimal VisualNode or BaseNode. As a general rule, if you can click or drag an object with the select/move
+ * tool in the UI, then it extends from Node.
+ *
+ * A Node’s parent is always a VisualContentNode but may not be another Node (e.g. if the parent is an ArtboardNode)
  */
-declare class Node extends BaseNode {
+declare class Node extends VisualNode {
     /**
      * Returns a read-only list of all children of the node. General-purpose content containers such as ArtboardNode or
      * GroupNode also provide a mutable {@link ContainerNode.children} list. Other nodes with a more specific structure can
@@ -797,16 +810,27 @@ declare class Node extends BaseNode {
      * The children of a Node are always other Node classes (never the more minimal BaseNode).
      */
     get allChildren(): Readonly<Iterable<Node>>;
+    /**
+     * An axis-aligned box in the parent’s coordinate space encompassing the node’s layout bounds (its
+     * {@link boundsLocal}, as transformed by its position and rotation relative to the parent). If the node has
+     * rotation, the top-left of its boundsLocal box (aligned to its own axes) is not necessarily located at the
+     * top-left of the boundsInParent box (since it's aligned to the parent's axes). This value is well-defined
+     * even for an orphan node with no parent.
+     */
+    get boundsInParent(): Readonly<Rect>;
+    /**
+     * Convert the node's {@link boundsLocal} to an axis-aligned bounding box in the coordinate space of the target
+     * node. Both nodes must share the same {@link visualRoot}, but can lie anywhere within that subtree
+     * relative to one another (the target node need not be an ancestor of this node, nor vice versa).
+     */
+    boundsInNode(targetNode: VisualNode): Readonly<Rect>;
     /**
      * The translation of the node along its parent's axes. This is identical to the translation component of
      * `transformMatrix`. It is often simpler to set a node's position using `setPositionInParent` than by
      * setting translation directly.
      */
-    get translation(): Readonly<{
-        x: number;
-        y: number;
-    }>;
-    set translation(value: { x: number; y: number });
+    get translation(): Readonly<Point>;
+    set translation(value: Point);
     /**
      * Move the node so the given `localRegistrationPoint` in its local coordinates is placed at the given
      * `parentPoint` in its parent's coordinates (taking into account any rotation on this node, etc.).
@@ -831,7 +855,7 @@ declare class Node extends BaseNode {
      * Set the node’s rotation angle relative to its parent to exactly the given value, keeping the given point in the
      * node’s local coordinate space at a fixed location within the parent. Disregards any rotation the node may already
      * have had. The angle set here may not be the absolute rotation angle seen on screen, if the parent or other
-     * ancestors have any rotation of their own.
+     * ancestors also have rotation of their own.
      * @param angleInDegrees - Angle in degrees.
      * @param localRotationPoint - Point to rotate around, in node's local coordinates.
      * @example
@@ -884,6 +908,7 @@ export declare class PageList extends RestrictedItemList<PageNode> {
      * with the same defaults as in {@link ArtboardList.addArtboard}. The page's artboard becomes the default target for
      * newly inserted content ({@link Context.insertionParent}) and the viewport switches to display this artboard.
      * @param geometry - The size of the new page.
+     *
      */
     addPage(geometry: RectangleGeometry): PageNode;
 }
@@ -912,6 +937,15 @@ export declare class PageNode extends BaseNode implements Readonly<IRectangularN
      */
     get name(): string | undefined;
     set name(name: string | undefined);
+    /**
+     * Clones this page, all artboards within it, and all content within those artboards. The cloned page is the same size
+     * as the original. Adds the new page immediately after this one in the pages list. The first artboard in the cloned
+     * page becomes the default target for newly inserted content ({@link Context.insertionParent}) and the viewport
+     * switches to display this artboard.
+     * @returns the cloned page.
+     *
+     */
+    cloneInPlace(): PageNode;
 }
 
 /**
@@ -930,12 +964,11 @@ export declare class PathNode extends FillableNode {
      * has multiple disjoint parts. The default value is nonZero.
      */
     get fillRule(): FillRule;
-    set fillRule(fillRule: FillRule);
+    set fillRule(rule: FillRule);
 }
 
 /**
  * Represents a 2D position.
- * @public
  */
 export declare interface Point {
     x: number;
@@ -982,6 +1015,13 @@ export declare class ReadOnlyItemList<T extends ListItem> {
     toArray(): Readonly<T[]>;
 }
 
+declare interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+
 export declare interface RectangleGeometry {
     width: number;
     height: number;
@@ -1062,6 +1102,7 @@ export declare class RectangleNode extends FillableNode implements IRectangularN
 declare class RestrictedItemList<T extends ListItem> extends ReadOnlyItemList<T> {
     /**
      * Remove the items from the list. The items need not be contiguous.
+     *
      * @throws If any of the items are not in the list, or if it is illegal to remove any of the items from this parent.
      */
     remove(...items: T[]): void;
@@ -1137,8 +1178,8 @@ export declare class StrokableNode extends Node implements IStrokableNode {
     /**
      * The stroke applied to the shape, if any.
      */
-    get stroke(): Readonly<Stroke> | undefined;
     set stroke(stroke: Stroke | undefined);
+    get stroke(): Readonly<Stroke> | undefined;
 }
 
 /**
@@ -1222,4 +1263,50 @@ export declare class TextNode extends Node {
  */
 export declare class UnknownNode extends Node {}
 
+/**
+ * A "node" represents an object in the scenegraph, the document's visual content tree. This class represents any node
+ * that can be visually perceived in the content. Most visual content is a subclass of the richer Node class which extends
+ * VisualNode with more properties, but the overall ArtboardNode container only supports the VisualNode APIs
+ * (and higher-level more abstract containers like PageNode extend only the minimal BaseNode class).
+ *
+ * Some VisualNodes might have a non-visual parent such as a PageNode.
+ */
+export declare class VisualNode extends BaseNode {
+    /**
+     * The highest ancestor that still has visual presence in the document. Typically an Artboard, but for orphaned
+     * content, it will be the root of the deleted content (which might be this node itself).
+     *
+     * Nodes that are both in the same visualRoot subtree lie within the same "visual space" of the document's
+     * structure. Nodes that are in different visual roots have no spatial relation to one another; there is no
+     * meaningful comparison or conversion between the bounds or coordinate spaces of such nodes.
+     */
+    get visualRoot(): VisualNode;
+    /**
+     * The bounding box of the node, expressed in the node's local coordinate space (which may be shifted or rotated
+     * relative to its parent). Generally matches the selection outline seen in the UI, encompassing the vector path
+     * "spine" of the shape as well as its stroke, but excluding effects such as shadows.
+     *
+     * The top-left corner of the bounding box corresponds to the visual top-left corner of the node, but this value is
+     * *not* necessarily (0,0) – this is especially true for Text and Path nodes.
+     */
+    get boundsLocal(): Readonly<Rect>;
+    /**
+     * Position of the node's centerpoint in its own local coordinate space, i.e. the center of the boundsLocal
+     * box.
+     */
+    get centerPointLocal(): Readonly<Point>;
+    /**
+     * Position of the node's top-left corner in its own local coordinate space, equal to (boundsLocal.x,
+     * boundsLocal.y). If the node is rotated, this is not the same as the top-left corner of
+     * boundsInParent.
+     */
+    get topLeftLocal(): Readonly<Point>;
+    /**
+     * Convert a point given in the node’s local coordinate space to a point in the coordinate space of the target node.
+     * Both nodes must share the same {@link visualRoot}, but can lie anywhere within that subtree relative to one
+     * another (the target node need not be an ancestor of this node, nor vice versa).
+     */
+    localPointInNode(localPoint: Point, targetNode: VisualNode): Readonly<Point>;
+}
+
 export {};

package/ui/ui-sdk.d.ts

@@ -215,7 +215,13 @@ declare interface ApplicationBase {
      * @returns DisableDragToDocument - Callback to undo the changes made by enableDragToDocument
      */
     enableDragToDocument(element: HTMLElement, dragCallbacks: DragCallbacks): DisableDragToDocument;
-
+    /**
+     * @experimental - Experimental API
+     * Register iframe with the add-on SDK.
+     * @param element - HTMLIframeElement to be registered.
+     * @returns UnregisterIframe - Callback to unregister iframe from the add-on SDK.
+     */
+    registerIframe(element: HTMLIFrameElement): UnregisterIframe;
     /**
      * Show a modal dialog
      * @param dialogOptions - dialog options such as title, description, etc.
@@ -467,6 +473,8 @@ declare namespace Constants {
         RuntimeType,
         BleedUnit,
         VideoResolution,
+        EditorPanel,
+        PanelActionType,
         AuthorizationStatus
     };
 }
@@ -671,6 +679,45 @@ export declare interface DragCompletionData {
 
 export declare type DragPreviewCallback = (element: HTMLElement) => URL;
 
+export declare enum EditorPanel {
+    /**
+     * Editor search panel
+     */
+    search = "search",
+    /**
+     * Editor your stuff panel
+     */
+    yourStuff = "yourStuff",
+    /**
+     * Editor templates panel
+     */
+    templates = "templates",
+    /**
+     * Editor media panel
+     */
+    media = "media",
+    /**
+     * Editor text panel
+     */
+    text = "text",
+    /**
+     * Editor elements panel
+     */
+    elements = "elements",
+    /**
+     * Editor grids panel
+     */
+    grids = "grids",
+    /**
+     * Editor brands panel
+     */
+    brands = "brands",
+    /**
+     * Editor addOns panel
+     */
+    addOns = "addOns"
+}
+
 export declare interface Field {
     /**
      * Label
@@ -925,6 +972,23 @@ export declare interface PageRendition extends Rendition {
     metadata: PageMetadata;
 }
 
+/**
+ * Represents the action to be performed on opening an Editor panel.
+ */
+export declare interface PanelAction {
+    /**
+     * Type of action to be performed on the Editor panel {@link PanelActionType}.
+     */
+    type: PanelActionType;
+}
+
+export declare enum PanelActionType {
+    /**
+     * Action type to perform search action on Editor panel.
+     */
+    search = "search"
+}
+
 /**
  * Represents a PDF Page box
  */
@@ -1237,6 +1301,20 @@ export declare enum RuntimeType {
     documentSandbox = "documentSandbox"
 }
 
+/**
+ * Search Action that can be performed on Editor Panel.
+ */
+export declare interface SearchAction extends PanelAction {
+    /**
+     * Search action type.
+     */
+    type: PanelActionType.search;
+    /**
+     * Query used to perform search action.
+     */
+    searchString: string;
+}
+
 export declare type SimpleDialogOptions = AlertDialogOptions | InputDialogOptions;
 
 /**
@@ -1255,6 +1333,13 @@ export declare interface UI {
      * Supported locales of the application
      */
     readonly locales: string[];
+    /**
+     * @experimental - Experimental API
+     * Opens an Editor Panel
+     * @param panel - one of {@link EditorPanel}
+     * @param action - optional action to be performed on the panel {@link PanelAction}
+     */
+    openEditorPanel(panel: EditorPanel, action?: PanelAction): void;
 }
 
 declare type UiTheme = "light" | "dark" | "lightest" | "darkest";
@@ -1272,6 +1357,12 @@ declare type Unpromisify<P> = P extends Promise<infer T> ? T : P;
  */
 declare type UnproxyOrClone<T> = T extends RemoteObject<ProxyMarked> ? Local<T> : T;
 
+/**
+ * @experimental - Experimental API
+ * Callback to unregister iframe from the add-on SDK.
+ */
+declare type UnregisterIframe = () => void;
+
 /**
  * Types of dialog variants supported.
  */