roosterjs 8.6.1 → 8.10.0

package/dist/rooster.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for roosterjs (Version 8.6.1)
+// Type definitions for roosterjs (Version 8.10.0)
 // Generated by dts tool from roosterjs
 // Project: https://github.com/Microsoft/roosterjs
 
@@ -61,7 +61,8 @@ interface BrowserInfo {
 
     /**
  * Command strings for Document.execCommand() API
- * https: */
+ * https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand
+ */
 const enum DocumentCommand {
     /**
      * Changes the browser auto-link behavior (Internet Explorer only)
@@ -276,7 +277,8 @@ const enum DocumentCommand {
 
     /**
  * The is essentially an enum representing result from browser compareDocumentPosition API
- * https: */
+ * https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition
+ */
 const enum DocumentPosition {
     /**
      * Same node
@@ -304,12 +306,29 @@ const enum DocumentPosition {
     ContainedBy = 16
 }
 
-    /** @internal */
+    /**
+ * The link preview pasted info provided by Edge
+ */
 interface EdgeLinkPreview {
+    /**
+     * Domain of the source page
+     */
     domain: string;
+    /**
+     * Preferred paste format
+     */
     preferred_format: string;
+    /**
+     * Title of the source page
+     */
     title: string;
+    /**
+     * Type of the paste content
+     */
     type: string;
+    /**
+     * Url of the source page
+     */
     url: string;
 }
 
@@ -349,7 +368,8 @@ const enum Keys {
 
     /**
  * The is essentially an enum represents the type of the node
- * https: * Values not listed here are deprecated.
+ * https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
+ * Values not listed here are deprecated.
  */
 const enum NodeType {
     /**
@@ -637,7 +657,17 @@ const enum EntityOperation {
      * This event will provide a cloned DOM tree for each entity, do NOT compare the DOM nodes with cached nodes
      * because it will always return false.
      */
-    ReplaceTemporaryContent = 8
+    ReplaceTemporaryContent = 8,
+    /**
+     * Notify plugins that editor has attached shadow root for an entity.
+     * Plugins can handle this event to do extra operations to the shadow root
+     */
+    AddShadowRoot = 9,
+    /**
+     * Notify plugins that editor has removed the shadow root of an entity
+     * Plugins can handle this event to do any necessary clean up for shadow root
+     */
+    RemoveShadowRoot = 10
 }
 
     /**
@@ -679,7 +709,15 @@ const enum ExperimentalFeatures {
     /**
      * Crop an inline image (requires ImageEdit plugin)
      */
-    ImageCrop = "ImageCrop"
+    ImageCrop = "ImageCrop",
+    /**
+     * Check if the element has a style attribute, if not, apply the default format
+     */
+    AlwaysApplyDefaultFormat = "AlwaysApplyDefaultFormat",
+    /**
+     * Paste the Html instead of the Img when the Html Body only have one IMG Child node
+     */
+    ConvertSingleImageBody = "ConvertSingleImageBody"
 }
 
     /**
@@ -890,7 +928,43 @@ const enum TableOperation {
     /**
      * Split current table cell vertically
      */
-    SplitVertically = 12
+    SplitVertically = 12,
+    /**
+     * Align current table at the center
+     */
+    AlignCenter = 13,
+    /**
+     * Align current table at the left
+     */
+    AlignLeft = 14,
+    /**
+     * Align current table at the right
+     */
+    AlignRight = 15,
+    /**
+     * Align current content table cell at the left
+     */
+    AlignCellLeft = 16,
+    /**
+     * Align current content table cell at the center
+     */
+    AlignCellCenter = 17,
+    /**
+     * Align current content table cell at the right
+     */
+    AlignCellRight = 18,
+    /**
+     * Align current content table cell at the top
+     */
+    AlignCellTop = 19,
+    /**
+     * Align current table cell at the middle
+     */
+    AlignCellMiddle = 20,
+    /**
+     * Align current table cell at the bottom
+     */
+    AlignCellBottom = 21
 }
 
     /**
@@ -931,6 +1005,65 @@ const enum ImageEditOperation {
     All = 15
 }
 
+    /**
+ * Represents the strategy to clear the format of the current editor selection
+ */
+const enum ClearFormatMode {
+    /**
+     * Inline format. Remove text format.
+     */
+    Inline = 0,
+    /**
+     * BLock format. Remove text and structure format of the block.
+     */
+    Block = 1,
+    /**
+     * Detect Inline or Block format based on the current editor selectior.
+     */
+    AutoDetect = 2
+}
+
+    /**
+ * Index of known CreateElementData used by createElement function
+ */
+const enum KnownCreateElementDataIndex {
+    /**
+     * Set a none value to help createElement funciton ignore falsy value
+     */
+    None = 0,
+    /**
+     * An empty line without format
+     */
+    EmptyLine = 1,
+    /**
+     * Wrapper for blockquote
+     */
+    BlockquoteWrapper = 2,
+    /**
+     * Temp DIV for copy/paste
+     */
+    CopyPasteTempDiv = 3,
+    /**
+     * ListItem with block style
+     */
+    BlockListItem = 4,
+    /**
+     * Wrapper element for context menu
+     */
+    ContextMenuWrapper = 5,
+    /**
+     * Wrapper element for image edit
+     */
+    ImageEditWrapper = 6,
+    /**
+     * Table resizers
+     */
+    TableHorizontalResizer = 7,
+    TableVerticalResizer = 8,
+    TableResizerLTR = 9,
+    TableResizerRTL = 10
+}
+
     /**
  * Provides a chance for plugin to change the content before it is copied from editor.
  */
@@ -1007,6 +1140,17 @@ interface BeforePasteEvent extends BasePluginEvent<PluginEventType.BeforePaste>
     htmlAttributes: Record<string, string>;
 }
 
+    /**
+ * The event to be triggered before SetContent API is called.
+ * Handle this event to cache anything you need from editor before it is gone.
+ */
+interface BeforeSetContentEvent extends BasePluginEvent<PluginEventType.BeforeSetContent> {
+    /**
+     * New content HTML that is about to set to editor
+     */
+    newContent: string;
+}
+
     /**
  * Represents a change to the editor made by another plugin
  */
@@ -1069,6 +1213,18 @@ interface EntityOperationEvent extends BasePluginEvent<PluginEventType.EntityOpe
      * Optional raw event. Need to do null check before use its value
      */
     rawEvent?: Event;
+    /**
+     * A document fragment for entity based on Shadow DOM. This property is only available for NewEntity operation.
+     * Putting DOM nodes under this fragment will cause a shadow root to be attached to the entity wrapper
+     * with these DOM nodes under it.
+     *
+     * If there is already cached DOM nodes, they will also be put under this fragment.
+     * Plugin need to decide:
+     * 1. Apply the cache: do nothing and the DOM nodes will be appended as shadow DOM entity content
+     * 2. Discard the cache and use new content instead: clear the fragment and append new DOM nodes, then new DOM nodes will be used
+     * 3. Dehydrate this entity: clear the fragment, and leave it empty
+     */
+    contentForShadowEntity?: DocumentFragment;
 }
 
     /**
@@ -1182,7 +1338,7 @@ interface PluginScrollEvent extends PluginDomEventBase<PluginEventType.Scroll, U
     /**
  * Editor plugin event interface
  */
-type PluginEvent = BeforeCutCopyEvent | BeforePasteEvent | ContentChangedEvent | EntityOperationEvent | ExtractContentWithDomEvent | PluginDomEvent | EditorReadyEvent | BeforeDisposeEvent | PendingFormatStateChangedEvent | EnterShadowEditEvent | LeaveShadowEditEvent | EditImageEvent;
+type PluginEvent = BeforeCutCopyEvent | BeforePasteEvent | ContentChangedEvent | EntityOperationEvent | ExtractContentWithDomEvent | PluginDomEvent | EditorReadyEvent | BeforeDisposeEvent | PendingFormatStateChangedEvent | EnterShadowEditEvent | LeaveShadowEditEvent | EditImageEvent | BeforeSetContentEvent;
 
     /**
  * Editor plugin event type
@@ -1270,7 +1426,12 @@ const enum PluginEventType {
     /**
      * Content of image is being changed from client side
      */
-    EditImage = 19
+    EditImage = 19,
+    /**
+     * Content of editor is about to be cleared by SetContent API, handle this event to cache anything you need
+     * before it is gone
+     */
+    BeforeSetContent = 20
 }
 
     /**
@@ -1390,6 +1551,10 @@ interface ClipboardData {
      * BASE64 encoded data uri of the image if any
      */
     imageDataUri?: string;
+    /**
+     * Array of tag names of the first level child nodes
+     */
+    htmlFirstLevelChildTags?: string[];
     /**
      * Value of custom paste type. By default it is always empty.
      * To allow custom paste type, pass the allowed types to EditorOptions.allowedCustomPasteType
@@ -1834,7 +1999,10 @@ interface LinkData {
     normalizedUrl: string;
 }
 
-    interface ModeIndependentColor {
+    /**
+ * A color object contains both light mode and dark mode color
+ */
+interface ModeIndependentColor {
     /**
      * The color to be used in dark mode, if enabled.
      */
@@ -2605,8 +2773,9 @@ interface IEditor {
     /**
      * Run a callback function asynchronously
      * @param callback The callback function to run
+     * @returns a function to cancel this async run
      */
-    runAsync(callback: (editor: IEditor) => void): void;
+    runAsync(callback: (editor: IEditor) => void): () => void;
     /**
      * Set DOM attribute of editor content DIV
      * @param name Name of the attribute
@@ -2635,6 +2804,12 @@ interface IEditor {
      * Get style based format state from current selection, including font name/size and colors
      */
     getStyleBasedFormatState(node?: Node): StyleBasedFormatState;
+    /**
+     * Get the pendable format state from the current selection, incluing formats as underline, bold, italics
+     * @param forceGetStateFromDOM If set to true, will not consider the cached format and will get the format state directly from DOM tree
+     * @return The pending format state of editor.
+     */
+    getPendableFormatState(forceGetStateFromDOM?: boolean): PendableFormatState;
     /**
      * Ensure user will type into a container element rather than into the editor content DIV directly
      * @param position The position that user is about to type to
@@ -2673,6 +2848,13 @@ interface IEditor {
      * @param feature The feature to check
      */
     isFeatureEnabled(feature: ExperimentalFeatures): boolean;
+    /**
+     * Get a function to convert HTML string to trusted HTML string.
+     * By default it will just return the input HTML directly. To override this behavior,
+     * pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler
+     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types
+     */
+    getTrustedHTMLHandler(): TrustedHTMLHandler;
 }
 
     /**
@@ -2799,6 +2981,7 @@ interface CorePlugins {
      */
     readonly mouseUp: EditorPlugin;
     /**
+     * @deprecated after Firefox update
      * TypeAfterLinkPlugin plugin helps workaround a Firefox bug to allow type outside a hyperlink
      */
     readonly typeAfterLink: EditorPlugin;
@@ -2817,17 +3000,17 @@ interface CorePlugins {
 }
 
     /**
- * @internal
+ * Names of core plugins
  */
 type PluginKey = keyof CorePlugins;
 
     /**
- * @internal
+ * Names of the core plugins that have plugin state
  */
 type KeyOfStatePlugin<Key extends PluginKey> = CorePlugins[Key] extends PluginWithState<infer U> ? Key : never;
 
     /**
- * @internal
+ * A type map from name of plugin with state to its plugin type
  */
 type GenericPluginState<Key extends PluginKey> = {
     [P in StatePluginKeys<Key>]: TypeOfStatePlugin<P>;
@@ -2839,14 +3022,14 @@ type GenericPluginState<Key extends PluginKey> = {
 type PluginState = GenericPluginState<PluginKey>;
 
     /**
- * @internal
+ * All names of plugins with plugin state
  */
 type StatePluginKeys<Key extends PluginKey> = {
     [P in Key]: KeyOfStatePlugin<P>;
 }[Key];
 
     /**
- * @internal
+ * Get type of a plugin with state
  */
 type TypeOfStatePlugin<Key extends PluginKey> = CorePlugins[Key] extends PluginWithState<infer U> ? U : never;
 
@@ -2866,6 +3049,12 @@ interface EditorCore extends PluginState  {
      * Core API map of this editor
      */
     readonly api: CoreApiMap;
+    /**
+     * A handler to convert HTML string to a trust HTML string.
+     * By default it will just return the original HTML string directly.
+     * To override, pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler
+     */
+    readonly trustedHTMLHandler: TrustedHTMLHandler;
 }
 
     /**
@@ -2885,7 +3074,11 @@ type AddUndoSnapshot = (core: EditorCore, callback: (start: NodePosition, end: N
  */
 type AttachDomEvent = (core: EditorCore, eventMap: Record<string, DOMEventHandler>) => () => void;
 
-    interface CoreApiMap {
+    /**
+ * The interface for the map of core API.
+ * Editor can call call API from this map under EditorCore object
+ */
+interface CoreApiMap {
     /**
      * Call an editing callback with adding undo snapshots around, and trigger a ContentChanged event if change source is specified.
      * Undo snapshot will not be added if this call is nested inside another addUndoSnapshot() call.
@@ -2945,6 +3138,13 @@ type AttachDomEvent = (core: EditorCore, eventMap: Record<string, DOMEventHandle
      * @param node The node to get style from
      */
     getStyleBasedFormatState: GetStyleBasedFormatState;
+    /**
+     * Get the pendable format such as underline and bold
+     * @param core The EditorCore object
+     *@param forceGetStateFromDOM If set to true, will force get the format state from DOM tree.
+     * @return The pending format state of editor.
+     */
+    getPendableFormatState: GetPendableFormatState;
     /**
      * Check if the editor has focus now
      * @param core The EditorCore object
@@ -3052,6 +3252,14 @@ type GetSelectionRange = (core: EditorCore, tryGetFromCache: boolean) => Range;
  */
 type GetStyleBasedFormatState = (core: EditorCore, node: Node) => StyleBasedFormatState;
 
+    /**
+ * Get the pendable format such as underline and bold
+ * @param core The EditorCore object
+ * @param forceGetStateFromDOM If set to true, will force get the format state from DOM tree.
+ * @return The pending format state of editor.
+ */
+type GetPendableFormatState = (core: EditorCore, forceGetStateFromDOM: boolean) => PendableFormatState;
+
     /**
  * Check if the editor has focus now
  * @param core The EditorCore object
@@ -3196,6 +3404,12 @@ interface EditorOptions {
      * Only text types are supported, and do not add "text/" prefix to the type values
      */
     allowedCustomPasteType?: string[];
+    /**
+     * Customized trusted type handler used for sanitizing HTML string before assign to DOM tree
+     * This is required when trusted-type Content-Security-Policy (CSP) is enabled.
+     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types
+     */
+    trustedHTMLHandler?: TrustedHTMLHandler;
 }
 
     /**
@@ -3406,6 +3620,13 @@ interface CustomReplacement {
      * Whether the matching should be case sensitive
      */
     matchSourceCaseSensitive: boolean;
+    /**
+     * A callback to check if the string should be replaced
+     * @param content the content where the string is
+     * @param sourceString string to be replaced
+     * @return true, if the string should be replaced, else return false
+     */
+    shouldReplace?: (replacement: CustomReplacement, content: string) => boolean;
 }
 
     /**
@@ -3607,12 +3828,48 @@ interface ImageEditOptions {
      */
     imageSelector?: string;
     /**
+     * @deprecated
      * HTML for the rotate icon
      * @default A predefined SVG icon
      */
     rotateIconHTML?: string;
 }
 
+    /**
+ * An interface represents the data for creating element used by createElemnet()
+ */
+interface CreateElementData {
+    /**
+     * Tag name of this element.
+     * It can be just a tag, or in format "namespace:tag"
+     */
+    tag: string;
+    /**
+     * Namespace of this tag
+     */
+    namespace?: string;
+    /**
+     * CSS class name
+     */
+    className?: string;
+    /**
+     * CSS style
+     */
+    style?: string;
+    /**
+     * Dataset of this element
+     */
+    dataset?: Record<string, string>;
+    /**
+     * Additional attributes of this element
+     */
+    attributes?: Record<string, string>;
+    /**
+     * Child nodes of this element, can be another CreateElementData, or a string which represents a text node
+     */
+    children?: (CreateElementData | string)[];
+}
+
     /**
  * The state object for DOMEventPlugin
  */
@@ -3654,9 +3911,10 @@ interface EditPluginState {
  */
 interface EntityPluginState {
     /**
+     * @deprecated
      * Last clicking point when mouse down event happens
      */
-    clickingPoint: {
+    clickingPoint?: {
         pageX: number;
         pageY: number;
     };
@@ -3664,6 +3922,12 @@ interface EntityPluginState {
      * All known entity elements
      */
     knownEntityElements: HTMLElement[];
+    /**
+     * Cache for the hydrated content of shadow DOM entity.
+     * When set content to replace the whole editor, we will cache the hydrated content
+     * before it is gone, then after that we can use the cached content to rehydrate entity
+     */
+    shadowEntityCache: Record<string, HTMLElement>;
 }
 
     /**
@@ -3832,6 +4096,11 @@ interface DOMEventHandlerObject {
  */
 type DOMEventHandler = PluginEventType | DOMEventHandlerFunction | DOMEventHandlerObject;
 
+    /**
+ * A handler type to convert HTML string to a trust HTML string
+ */
+type TrustedHTMLHandler = (html: string) => string;
+
     /**
  * This produces a block element from a a node
  * It needs to account for various HTML structure. Examples:
@@ -4282,6 +4551,7 @@ function contains(container: Node, contained: Range): boolean;
 function findClosestElementAncestor(node: Node, root?: Node, selector?: string): HTMLElement;
 
     /**
+ * @deprecated
  * Creates an HTML node array from html
  * @param html the html string to create HTML elements from
  * @param ownerDocument Owner document of the result HTML elements
@@ -4413,7 +4683,8 @@ function unwrap(node: Node): Node;
 function wrap<T extends keyof HTMLElementTagNameMap>(nodes: Node | Node[], wrapper?: T): HTMLElementTagNameMap[T];
 
     /**
- * Wrap all the node with html and return the wrapped node, and put the wrapper node under the parent of the first node
+ * @deprecated
+ * Wrap all the nodes with html and return the wrapped node, and put the wrapper node under the parent of the first node
  * @param nodes The node or node array to wrap
  * @param wrapper The wrapper HTML string, default value is DIV
  * @returns The wrapper element
@@ -4421,13 +4692,20 @@ function wrap<T extends keyof HTMLElementTagNameMap>(nodes: Node | Node[], wrapp
 function wrap(nodes: Node | Node[], wrapper?: string): HTMLElement;
 
     /**
- * Wrap all the node with html and return the wrapped node, and put the wrapper node under the parent of the first node
+ * Wrap all the nodes with html and return the wrapped node, and put the wrapper node under the parent of the first node
  * @param nodes The node or node array to wrap
  * @param wrapper The wrapper HTML element, default value is a new DIV element
  * @returns The wrapper element
  */
 function wrap(nodes: Node | Node[], wrapper?: HTMLElement): HTMLElement;
 
+    /**
+ * Wrapp all the nodes with CreateElementData or an index of a known CreateElementData
+ * @param nodes The nodes to wrap
+ * @param wrapper The CreateElementData or an index of a known CreateElementData
+ */
+function wrap(nodes: Node | Node[], wrapper?: CreateElementData | KnownCreateElementDataIndex): HTMLElement;
+
     /**
  * This walks forwards DOM tree to get next meaningful node
  * @param rootNode Root node to scope the leaf sibling node
@@ -4531,7 +4809,14 @@ function readFile(file: File, callback: (dataUrl: string) => void): void;
  */
 function getInnerHTML(node: HTMLElement | DocumentFragment): string;
 
-    function setColor(element: HTMLElement, color: string | ModeIndependentColor, isBackgroundColor: boolean, isDarkMode?: boolean): void;
+    /**
+ * Set text color or background color to the given element
+ * @param element The element to set color to
+ * @param color The color to set, it can be a string of color name/value or a ModeIndependentColor object
+ * @param isBackgroundColor Whether set background color or text color
+ * @param isDarkMode Whether current mode is dark mode. @default false
+ */
+function setColor(element: HTMLElement, color: string | ModeIndependentColor, isBackgroundColor: boolean, isDarkMode?: boolean): void;
 
     /**
  * A wrapper function of Element.matches
@@ -4540,6 +4825,45 @@ function getInnerHTML(node: HTMLElement | DocumentFragment): string;
  */
 function matchesSelector(element: Node, selector: string): boolean;
 
+    /**
+ *
+ * @param root the contentDiv of the ditor
+ * @param nodeToInsert the node to be inserted
+ * @param position the position of the node to be inserted
+ * @param range the range current or cached range of the editor
+ * @returns the adjusted position of the inserted node
+ */
+function adjustInsertPosition(root: HTMLElement, nodeToInsert: Node, position: NodePosition, range: Range): NodePosition;
+
+    /**
+ * Create DOM element from the given CreateElementData
+ * @param elementData The CreateElementData or an index of a known CreateElementData used for creating this element
+ * @param document The document to create the element from
+ * @returns The root DOM element just created
+ */
+function createElement(elementData: CreateElementData | KnownCreateElementDataIndex, document: Document): Element;
+
+    /**
+ * All known CreateElementData used by roosterjs to create elements
+ */
+const KnownCreateElementData: Record<KnownCreateElementDataIndex, CreateElementData>;
+
+    /**
+ * Replace all child nodes of the given target node to the child nodes of source node.
+ * @param target Target node, all child nodes of this node will be removed if keepExistingChildren is not set to true
+ * @param source (Optional) source node, all child nodes of this node will be move to target node
+ * @param keepExistingChildren (Optional) When set to true, all existing child nodes of target will be kept
+ */
+function moveChildNodes(target: Node, source?: Node, keepExistingChildren?: boolean): void;
+
+    /**
+ * Set the Style of a List Item provided, with the styles that the inline child elements have
+ * If the child inline elements have different styles, it will not modify the styles of the list item
+ * @param element the LI Element to set the styles
+ * @param styles The styles that should be applied to the element.
+ */
+function setListItemStyle(element: HTMLLIElement, styles: string[]): void;
+
     /**
  * A virtual table class, represent an HTML table, by expand all merged cells to each separated cells
  */
@@ -4701,6 +5025,12 @@ class VList {
      * After that, this VList becomes unavailable because we set this.rootList to null
      */
     writeBack(): void;
+    /**
+     * Sets the New List Start Property, that is going to be used to create a new List in the WriteBack function
+     * @param separator The HTML element that indicates when to split the VList
+     * @param startNumber The start number of the new List
+     */
+    split(separator: HTMLElement, startNumber: number): void;
     /**
      * Set indentation of the given range of this list
      * @param start Start position to operate from
@@ -4746,7 +5076,6 @@ class VList {
 }
 
     /**
- * @internal
  * !!! Never directly create instance of this class. It should be created within VList class !!!
  *
  * Represent a list item.
@@ -4754,12 +5083,12 @@ class VList {
  * A list item is normally wrapped using a LI tag. But this class is only a logical item,
  * it can be a LI tag, or another other type of node which means it is actually not a list item.
  * That can happen after we do "outdent" on a 1-level list item, then it becomes not a list item.
- * @internal
  */
 class VListItem {
     private listTypes;
     private node;
     private dummy;
+    private newListStart;
     /**
      * Construct a new instance of VListItem class
      * @param node The DOM node for this item
@@ -4779,6 +5108,10 @@ class VListItem {
      * Get DOM node of this list item
      */
     getNode(): HTMLLIElement;
+    /**
+     * Get the Start Number of the new List
+     */
+    getNewListStart(): number | undefined;
     /**
      * Check if a given node is contained by this list item
      * @param node The node to check
@@ -4822,6 +5155,11 @@ class VListItem {
      * @param isDummy Whether the item is a dummy item
      */
     setIsDummy(isDummy: boolean): void;
+    /**
+     * Set the start Number of the new list
+     * @param isDummy Whether the item is a dummy item
+     */
+    setNewListStart(startNumber: number): void;
     /**
      * Write the change result back into DOM
      * @param listStack current stack of list elements
@@ -4831,7 +5169,7 @@ class VListItem {
 }
 
     /**
- * @internal
+ * Create a VList object from the given region.
  * @param region The region to get VList from
  * @param includeSiblingLists True to also try get lists before and after the selection and merge them together,
  * false to only include the list for the selected blocks
@@ -5085,7 +5423,7 @@ function getHtmlWithSelectionPath(rootNode: HTMLElement | DocumentFragment, rang
  * @param html The html to restore
  * @returns A selection range if the html contains a valid selection path, otherwise null
  */
-function setHtmlWithSelectionPath(rootNode: HTMLElement, html: string): Range;
+function setHtmlWithSelectionPath(rootNode: HTMLElement, html: string, trustedHTMLHandler?: TrustedHTMLHandler): Range;
 
     /**
  * Add the given range into selection of the given document
@@ -5233,7 +5571,7 @@ function createDefaultHtmlSanitizerOptions(): Required<HtmlSanitizerOptions>;
  * If the same property got multiple callbacks, the final return value will be the return
  * value of the latest callback
  */
-function chainSanitizerCallback<T extends any[], R>(map: Record<string, (...args: T) => R>, name: string, newCallback: (...args: T) => R): void;
+function chainSanitizerCallback<TOriginalArgs extends any[], TChainedFn extends (...args: TOriginalArgs) => R, R>(map: Record<string, (...args: TOriginalArgs) => R>, name: string, newCallback: TChainedFn): void;
 
     /**
  * Commit information of an entity (type, isReadonly, id) into the wrapper node as CSS Classes
@@ -5252,7 +5590,7 @@ function commitEntity(wrapper: HTMLElement, type: string, isReadonly: boolean, i
 function getEntityFromElement(element: HTMLElement): Entity;
 
     /**
- * @internal Get a selector string for specified entity type and id
+ * Get a selector string for specified entity type and id
  * @param type (Optional) Type of entity
  * @param id (Optional) Id of entity
  */
@@ -5294,7 +5632,7 @@ function isCharacterValue(event: KeyboardEvent): boolean;
  * @param event A Keyboard event or Mouse event object
  * @returns True if Ctrl key is pressed on Windows or Meta key is pressed on Mac
  */
-const isCtrlOrMetaPressed: (event: KeyboardEvent | MouseEvent) => boolean;
+function isCtrlOrMetaPressed(event: KeyboardEvent | MouseEvent): boolean;
 
     /**
  * Get CSS styles of a given element in name-value pair format
@@ -5557,8 +5895,9 @@ class Editor implements IEditor  {
     /**
      * Run a callback function asynchronously
      * @param callback The callback function to run
+     * @returns a function to cancel this async run
      */
-    runAsync(callback: (editor: IEditor) => void): void;
+    runAsync(callback: (editor: IEditor) => void): () => void;
     /**
      * Set DOM attribute of editor content DIV
      * @param name Name of the attribute
@@ -5587,6 +5926,12 @@ class Editor implements IEditor  {
      * Get style based format state from current selection, including font name/size and colors
      */
     getStyleBasedFormatState(node?: Node): StyleBasedFormatState;
+    /**
+     * Get the pendable format such as underline and bold
+     * @param forceGetStateFromDOM If set to true, will force get the format state from DOM tree.
+     * @returns The pending format state
+     */
+    getPendableFormatState(forceGetStateFromDOM?: boolean): PendableFormatState;
     /**
      * Ensure user will type into a container element rather than into the editor content DIV directly
      * @param position The position that user is about to type to
@@ -5625,6 +5970,13 @@ class Editor implements IEditor  {
      * @param feature The feature to check
      */
     isFeatureEnabled(feature: ExperimentalFeatures): boolean;
+    /**
+     * Get a function to convert HTML string to trusted HTML string.
+     * By default it will just return the input HTML directly. To override this behavior,
+     * pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler
+     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types
+     */
+    getTrustedHTMLHandler(): TrustedHTMLHandler;
 }
 
     /**
@@ -5642,8 +5994,7 @@ function changeFontSize(editor: IEditor, change: FontSizeChange, fontSizes?: num
 const FONT_SIZES: number[];
 
     /**
- * Clear all formats of selected blocks.
- * When selection is collapsed, only clear format of current block.
+ * @deprecated Use clearFormat instead and pass the ClearFormatMode.Block as parameter
  * @param editor The editor instance
  */
 function clearBlockFormat(editor: IEditor): void;
@@ -5653,8 +6004,9 @@ function clearBlockFormat(editor: IEditor): void;
  * changed to default format. The format that get cleaned include B/I/U/font name/
  * font size/text color/background color/align left/align right/align center/superscript/subscript
  * @param editor The editor instance
+ * @param formatType type of format to apply
  */
-function clearFormat(editor: IEditor): void;
+function clearFormat(editor: IEditor, formatType?: ClearFormatMode): void;
 
     /**
  * Insert a hyperlink at cursor.
@@ -5811,8 +6163,9 @@ function setBackgroundColor(editor: IEditor, color: string | ModeIndependentColo
  * Currently there's no validation to the string, if the passed string is invalid, it won't take affect
  * Alternatively, you can pass a @typedef ModeIndependentColor. If in light mode, the lightModeColor property will be used.
  * If in dark mode, the darkModeColor will be used and the lightModeColor will be used when converting back to light mode.
+ * @param shouldApplyInlineStyle Optional callback function to be invoked to verify if the current element should have the inline Style applied
  */
-function setTextColor(editor: IEditor, color: string | ModeIndependentColor): void;
+function setTextColor(editor: IEditor, color: string | ModeIndependentColor, shouldApplyInlineStyle?: (element: HTMLElement) => boolean): void;
 
     /**
  * Change direction for the blocks/paragraph at selection
@@ -5843,7 +6196,8 @@ function setFontSize(editor: IEditor, fontSize: string): void;
  * in selection, do nothing.
  * The alt attribute provides alternative information for an image if a user for some reason
  * cannot view it (because of slow connection, an error in the src attribute, or if the user
- * uses a screen reader). See https: * @param editor The editor instance
+ * uses a screen reader). See https://www.w3schools.com/tags/att_img_alt.asp
+ * @param editor The editor instance
  * @param altText The image alt text
  */
 function setImageAltText(editor: IEditor, altText: string): void;
@@ -5909,6 +6263,14 @@ function toggleItalic(editor: IEditor): void;
  */
 function toggleNumbering(editor: IEditor, startNumber?: number): void;
 
+    /**
+ * Resets Ordered List Numbering back to the value of the parameter startNumber
+ * @param editor The editor instance
+ * @param separator The HTML element that indicates when to split the VList
+ * @param startNumber The number of that the splitted list should start
+ */
+function setOrderedListNumbering(editor: IEditor, separator: HTMLLIElement, startNumber?: number): void;
+
     /**
  * Toggle blockquote at selection, if selection already contains any blockquote elements,
  * the blockquote elements will be unquote and other elements will take no effect
@@ -5978,6 +6340,30 @@ function toggleUnderline(editor: IEditor): void;
  */
 function toggleHeader(editor: IEditor, level: number): void;
 
+    /**
+ * Toggle List Type at selection
+ * If ListType Provided is Ordered:
+ *      If selection contains numbering in deep level, toggle numbering will decrease the numbering level by one
+ *      If selection contains bullet list, toggle numbering will convert the bullet list into number list
+ *      If selection contains both bullet/numbering and normal text, the behavior is decided by corresponding
+ *       realization of browser execCommand API
+ * If ListType Provided is Unordered:
+ *      If selection contains bullet in deep level, toggle bullet will decrease the bullet level by one
+ *      If selection contains number list, toggle bullet will convert the number list into bullet list
+ *      If selection contains both bullet/numbering and normal text, the behavior is decided by corresponding
+ *      browser execCommand API
+ * @param editor The editor instance
+ * @param listType The list type to toggle
+ * @param startNumber (Optional) Start number of the list
+ * @param includeSiblingLists Sets wether the operation should include Sibling Lists, by default true
+ */
+function toggleListType(editor: IEditor, listType: ListType, startNumber?: number, includeSiblingLists?: boolean): void;
+
+    /**
+ * Split selection into regions, and perform a block-wise formatting action for each region.
+ */
+function blockFormat(editor: IEditor, callback: (region: Region, start: NodePosition, end: NodePosition, chains: VListChain[]) => void, beforeRunCallback?: () => boolean): void;
+
     /**
  * Commit changes of all list changes when experiment features are allowed
  * @param editor The Editor object
@@ -6067,9 +6453,27 @@ class ContextMenu<T> implements EditorPlugin  {
     private onDismiss;
 }
 
-    interface ContextMenuOptions<T> {
+    /**
+ * Context Menu options for ContextMenu plugin
+ */
+interface ContextMenuOptions<T> {
+    /**
+     * Render function for the context menu
+     * @param container The container HTML element, it will be located at the mouse click position,
+     * so the callback just need to render menu content into this container
+     * @param onDismiss The onDismiss callback, some menu render need to know this callback so that
+     * it can handle the dismiss event
+     */
     render: (container: HTMLElement, items: (T | null)[], onDismiss: () => void) => void;
+    /**
+     * Dismiss function for the context menu, it will be called when user wants to dismiss this context menu
+     * e.g. user click away so the menu should be dismissed
+     * @param container The container HTML element
+     */
     dismiss?: (container: HTMLElement) => void;
+    /**
+     * Whether the default context menu is allowed. @default false
+     */
     allowDefaultMenu?: boolean;
 }
 
@@ -6222,6 +6626,10 @@ class ImageEdit implements EditorPlugin  {
     private editInfo;
     private lastSrc;
     private dndHelpers;
+    /**
+     * Identify if the image was resized by the user.
+     */
+    private wasResized;
     /**
      * Create a new instance of ImageEdit
      * @param options Image editing options
@@ -6328,6 +6736,30 @@ function isResizedTo(image: HTMLImageElement, percentage: number): boolean;
  */
 function resetImage(editor: IEditor, image: HTMLImageElement): void;
 
+    /**
+ * @deprecated Use ImageEdit plugin instead
+ */
+class ImageResize extends ImageEdit  {
+    /**
+     * Create a new instance of ImageResize
+     * @param minWidth Minimum width of image when resize in pixel, default value is 10
+     * @param minHeight Minimum height of image when resize in pixel, default value is 10
+     * @param selectionBorderColor Color of resize border and handles, default value is #DB626C
+     * @param forcePreserveRatio Whether always preserve width/height ratio when resize, default value is false
+     * @param resizableImageSelector Selector for picking which image is resizable (e.g. for all images not placeholders), note
+     * that the tag must be IMG regardless what the selector is
+     */
+    constructor(minWidth?: number, minHeight?: number, selectionBorderColor?: string, forcePreserveRatio?: boolean, resizableImageSelector?: string);
+    /**
+     * @deprecated
+     */
+    showResizeHandle(img: HTMLImageElement): void;
+    /**
+     * @deprecated
+     */
+    hideResizeHandle(selectImageAfterUnSelect?: boolean): void;
+}
+
     /**
  * Paste plugin, handles BeforePaste event and reformat some special content, including:
  * 1. Content copied from Word
@@ -6336,6 +6768,7 @@ function resetImage(editor: IEditor, image: HTMLImageElement): void;
  */
 class Paste implements EditorPlugin  {
     private unknownTagReplacement;
+    private editor;
     /**
      * Construct a new instance of Paste class
      * @param unknownTagReplacement Replace solution of unknown tags, default behavior is to replace with SPAN
@@ -6349,7 +6782,7 @@ class Paste implements EditorPlugin  {
      * Initialize this plugin. This should only be called from Editor
      * @param editor Editor instance
      */
-    initialize(): void;
+    initialize(editor: IEditor): void;
     /**
      * Dispose this plugin
      */
@@ -6370,7 +6803,8 @@ class Paste implements EditorPlugin  {
  *
  * PickerPlugin doesn't provide any UI, it just wraps related DOM events and invoke callback functions.
  * To show a picker UI, you need to build your own UI component. Please reference to
- * https: */
+ * https://github.com/microsoft/roosterjs/tree/master/demo/scripts/controls/samplepicker
+ */
 class PickerPlugin<T extends PickerDataProvider = PickerDataProvider> implements EditorPlugin  {
     readonly dataProvider: T;
     private pickerOptions;