roosterjs-content-model-types 0.28.0 → 9.1.0

package/README.md

@@ -6,13 +6,17 @@ Rooster is a framework-independent JavaScript rich-text editor neatly nested
 inside one HTML `<div>` element. Editing operations performed by end users are
 handled in simple ways to generate the final HTML.
 
-To view the sample site, please click the link below:
+Rooster is working on top of a middle layer data structure called "Content Model".
+All format API and editing operation are using this Content Model layer as content format,
+and finally convert to HTML and show it in editor.
 
-[RoosterJs Sample Site](https://microsoft.github.io/roosterjs/index.html).
+To view the demo site, please click the link below:
 
-## Upgrade from RoosterJs 7.\*
+[RoosterJs Demo Site](https://microsoft.github.io/roosterjs/index.html).
 
-Please see [here](https://github.com/microsoft/roosterjs/wiki/RoosterJs-8).
+## Upgrade from RoosterJs 8.\*
+
+Please see [here](https://github.com/microsoft/roosterjs/wiki/RoosterJs-9).
 
 ## Features
 
@@ -25,24 +29,22 @@ Rooster contains 6 basic packages.
    `createEditor()` function in roosterjs to create an editor with default
    configurations.
 
-2. [roosterjs-editor-core](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_core.html):
-   Defines the core editor and plugin infrastructure. Use `roosterjs-editor-core`
+2. [roosterjs-content-model-core](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_content_model_core.html):
+   Defines the core editor and plugin infrastructure. Use `roosterjs-content-model-core`
    instead of `roosterjs` to build and customize your own editor.
 
-3. [roosterjs-editor-api](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_api.html):
+3. [roosterjs-content-model-api](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_content_model_api.html):
    Defines APIs for editor operations. Use these APIs to modify content and
-   formatting in the editor you built using `roosterjs-editor-core`.
+   formatting in the editor you built using `roosterjs-content-model-core`.
 
-4. [roosterjs-editor-dom](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_dom.html):
-   Defines APIs for DOM operations. Use `roosterjs-editor-api` instead unless
-   you want to access DOM API directly.
+4. [roosterjs-content-model-dom](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_content_model_dom.html):
+   Defines APIs for Content Model and DOM operations. This package do conversion between DOM tree and roosterjs Content Model.
 
-5. [roosterjs-editor-plugins](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_plugins.html):
-   Defines basic plugins for common features. Examples: making hyperlinks,
-   pasting HTML content, inserting inline images.
+5. [roosterjs-content-model-plugins](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_content_model_plugins.html):
+   Defines basic plugins for common features.
 
-6. [roosterjs-editor-types](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_types.html):
-   Defines public interfaces and enumerations.
+6. [roosterjs-content-model-types](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_content_model_types.html):
+   Defines public interfaces and enumerations, including Content Model types, API parameters and other types.
 
 There are also some extension packages to provide additional functionalities.
 
@@ -52,30 +54,38 @@ There are also some extension packages to provide additional functionalities.
 2. [roosterjs-react](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_react.html):
    Provide a React wrapper of roosterjs so it can be easily used with React.
 
-3. [roosterjs-editor-types-compatible](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_types_compatible.html):
-   Provide types that are compatible with isolatedModules mode. When using isolatedModules mode,
-   "const enum" will not work correctly, this package provides enums with prefix "Compatible" in
-   their names and they have the same value with const enums in roosterjs-editor-types package
+To be compatible with old (8.\*) versions, you can use `EditorAdapter` class from the following package which can act as a 8.\* Editor:
+
+1. [roosterjs-editor-adapter](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_adapter.html):
+   Provide a adapter class `EditorAdapter` to work with Editor (9.\*) and legacy plugins (via [EditorAdapterOptions.legacyPlugins](https://microsoft.github.io/roosterjs/docs/interfaces/roosterjs_editor_adapter.editoradapteroptions.html#legacyplugins))
+
+And the following packages are for old (8.\*) compatibility:
+
+1. [roosterjs-editor-core](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_core.html):
+2. [roosterjs-editor-api](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_api.html):
+3. [roosterjs-editor-dom](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_dom.html):
+4. [roosterjs-editor-plugins](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_plugins.html):
+5. [roosterjs-editor-types](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_types.html):
+6. [roosterjs-editor-types-compatible](https://microsoft.github.io/roosterjs/docs/modules/roosterjs_editor_types_compatible.html):
 
 ### APIs
 
-Rooster provides DOM level APIs (in `roosterjs-editor-dom`), core APIs (in `roosterjs-editor-core`), and formatting APIs
-(in `roosterjs-editor-api`) to perform editing operations.
+Rooster provides Content Model level APIs (in `roosterjs-content-model-dom`), core APIs (in `roosterjs-content-model-core`), and formatting APIs
+(in `roosterjs-content-modelapi`) to perform editing operations.
 
-`roosterjs-editor-dom` provides several levels of DOM operations:
+`roosterjs-content-model-dom` provides several levels of Content Model operations:
 
--   Perform basic DOM operations such as `wrap()`, `unwrap()`, ...
--   Wrap a given DOM node with `InlineElement` or `BlockElement` and perform
-    operations with DOM Walker API.
--   Perform DOM operations on a given scope using scopers.
--   Travel among `InlineElements` and `BlockElements` with scope using
-    ContentTraverser API.
+-   Create Content Model elements
+-   Convert DOM tree to Content Model
+-   Convert Content Model to DOM tree
+-   Format handlers
+-   A few DOM level API
 
-`roosterjs-editor-core` provides APIs for editor core. Editor class will call such
-APIs to perform basic editor operations. These APIs are overridable by specifying
+`roosterjs-content-model-core` provides APIs for editor core. Editor class will call such
+APIs to perform basic editor operations. These APIs can be overridden by specifying
 API overrides in Editor options when creating the editor.
 
-`roosterjs-editor-api` provides APIs for scenario-based operations triggered by
+`roosterjs-content-model-api` provides APIs for scenario-based operations triggered by
 user interaction.
 
 ## Plugins
@@ -99,7 +109,7 @@ class HelloRooster implements EditorPlugin {
     dispose() {}
 
     onPluginEvent(e: PluginEvent) {
-        if (e.eventType == PluginEventType.KeyPress && e.rawEvent.which == 65) {
+        if (e.eventType == 'input' && e.rawEvent.which == 65) {
             alert('Hello Rooster');
         }
     }
@@ -114,9 +124,9 @@ Install via NPM or Yarn:
 
 You can also install sub packages separately:
 
-`yarn add roosterjs-editor-core`
+`yarn add roosterjs-content-model-core`
 
-`yarn add roosterjs-editor-api`
+`yarn add roosterjs-content-model-api`
 
 `...`
 
@@ -161,9 +171,9 @@ In order to run the code below, you may also need to install [webpack](https://w
 
 ## Sample code
 
-To view the sample site, please click [here](https://microsoft.github.io/roosterjs/index.html).
+To view the demo site, please click [here](https://microsoft.github.io/roosterjs/index.html).
 
-To build the sample site code yourself, follow these instructions:
+To build the demo site code yourself, follow these instructions:
 
 1. Get dependencies using [yarn](https://yarnpkg.com) or [npm](https://www.npmjs.com/):
 

package/lib/context/DomIndexer.d.ts

@@ -1,3 +1,4 @@
+import type { CacheSelection } from '../pluginState/CachePluginState';
 import type { ContentModelDocument } from '../group/ContentModelDocument';
 import type { ContentModelParagraph } from '../block/ContentModelParagraph';
 import type { ContentModelSegment } from '../segment/ContentModelSegment';
@@ -33,5 +34,5 @@ export interface DomIndexer {
      * @param oldSelection @optional Original selection before this change
      * @returns True if reconcile successfully, otherwise false
      */
-    reconcileSelection: (model: ContentModelDocument, newSelection: DOMSelection, oldSelection?: DOMSelection) => boolean;
+    reconcileSelection: (model: ContentModelDocument, newSelection: DOMSelection, oldSelection?: CacheSelection) => boolean;
 }

package/lib/context/DomIndexer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DomIndexer.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomIndexer.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { ContentModelParagraph } from '../block/ContentModelParagraph';\nimport type { ContentModelSegment } from '../segment/ContentModelSegment';\nimport type { ContentModelTable } from '../block/ContentModelTable';\nimport type { DOMSelection } from '../selection/DOMSelection';\n\n/**\n * Represents an indexer object which provides methods to help build backward relationship\n * from DOM node to Content Model\n */\nexport interface DomIndexer {\n    /**\n     * Invoked when processing a segment\n     * @param segmentNode The new DOM node for this segment\n     * @param paragraph Parent paragraph of this segment\n     * @param segments The source segments\n     */\n    onSegment: (\n        segmentNode: Node,\n        paragraph: ContentModelParagraph,\n        segments: ContentModelSegment[]\n    ) => void;\n\n    /**\n     * Invoked when new paragraph node is created in DOM tree\n     * @param paragraphElement The new DOM node for this paragraph\n     */\n    onParagraph: (paragraphElement: HTMLElement) => void;\n\n    /**\n     * Invoked when new table node is created in DOM tree\n     * @param tableElement The new DOM node for this table\n     */\n    onTable: (tableElement: HTMLTableElement, tableModel: ContentModelTable) => void;\n\n    /**\n     * When document content or selection is changed by user, we need to use this function to update the content model\n     * to reflect the latest document. This process can fail since the selected node may not have a related model data structure.\n     * @param model Current cached content model\n     * @param newSelection Latest selection\n     * @param oldSelection @optional Original selection before this change\n     * @returns True if reconcile successfully, otherwise false\n     */\n    reconcileSelection: (\n        model: ContentModelDocument,\n        newSelection: DOMSelection,\n        oldSelection?: DOMSelection\n    ) => boolean;\n}\n"]}
+{"version":3,"file":"DomIndexer.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomIndexer.ts"],"names":[],"mappings":"","sourcesContent":["import type { CacheSelection } from '../pluginState/CachePluginState';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { ContentModelParagraph } from '../block/ContentModelParagraph';\nimport type { ContentModelSegment } from '../segment/ContentModelSegment';\nimport type { ContentModelTable } from '../block/ContentModelTable';\nimport type { DOMSelection } from '../selection/DOMSelection';\n\n/**\n * Represents an indexer object which provides methods to help build backward relationship\n * from DOM node to Content Model\n */\nexport interface DomIndexer {\n    /**\n     * Invoked when processing a segment\n     * @param segmentNode The new DOM node for this segment\n     * @param paragraph Parent paragraph of this segment\n     * @param segments The source segments\n     */\n    onSegment: (\n        segmentNode: Node,\n        paragraph: ContentModelParagraph,\n        segments: ContentModelSegment[]\n    ) => void;\n\n    /**\n     * Invoked when new paragraph node is created in DOM tree\n     * @param paragraphElement The new DOM node for this paragraph\n     */\n    onParagraph: (paragraphElement: HTMLElement) => void;\n\n    /**\n     * Invoked when new table node is created in DOM tree\n     * @param tableElement The new DOM node for this table\n     */\n    onTable: (tableElement: HTMLTableElement, tableModel: ContentModelTable) => void;\n\n    /**\n     * When document content or selection is changed by user, we need to use this function to update the content model\n     * to reflect the latest document. This process can fail since the selected node may not have a related model data structure.\n     * @param model Current cached content model\n     * @param newSelection Latest selection\n     * @param oldSelection @optional Original selection before this change\n     * @returns True if reconcile successfully, otherwise false\n     */\n    reconcileSelection: (\n        model: ContentModelDocument,\n        newSelection: DOMSelection,\n        oldSelection?: CacheSelection\n    ) => boolean;\n}\n"]}

package/lib/context/DomToModelOption.d.ts

@@ -17,6 +17,15 @@ export interface DomToModelOption {
      */
     additionalFormatParsers?: Partial<FormatParsersPerCategory>;
 }
+/**
+ * Options for creating DomToModelContext, used by formatContentModel and createContentModel API
+ */
+export interface DomToModelOptionForCreateModel extends DomToModelOption {
+    /**
+     * When set to true, it will try to reuse cached content model if any
+     */
+    tryGetFromCache: boolean;
+}
 /**
  * Options for DOM to Content Model conversion for paste only
  */

package/lib/context/DomToModelOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"DomToModelOption.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomToModelOption.ts"],"names":[],"mappings":"","sourcesContent":["import type { ValueSanitizer } from '../parameter/ValueSanitizer';\nimport type {\n    ElementProcessorMap,\n    FormatParsers,\n    FormatParsersPerCategory,\n} from './DomToModelSettings';\n\n/**\n * Options for creating DomToModelContext\n */\nexport interface DomToModelOption {\n    /**\n     * Overrides default element processors\n     */\n    processorOverride?: Partial<ElementProcessorMap>;\n\n    /**\n     * Overrides default format handlers\n     */\n    formatParserOverride?: Partial<FormatParsers>;\n\n    /**\n     * Provide additional format parsers for each format type\n     */\n    additionalFormatParsers?: Partial<FormatParsersPerCategory>;\n}\n\n/**\n * Options for DOM to Content Model conversion for paste only\n */\nexport interface DomToModelOptionForSanitizing extends Required<DomToModelOption> {\n    /**\n     * Additional allowed HTML tags in lower case. Element with these tags will be preserved\n     */\n    readonly additionalAllowedTags: Lowercase<string>[];\n\n    /**\n     * Additional disallowed HTML tags in lower case. Elements with these tags will be dropped\n     */\n    readonly additionalDisallowedTags: Lowercase<string>[];\n\n    /**\n     * Additional sanitizers for CSS styles\n     */\n    readonly styleSanitizers: Record<string, ValueSanitizer>;\n\n    /**\n     * Additional sanitizers for CSS styles\n     */\n    readonly attributeSanitizers: Record<string, ValueSanitizer>;\n}\n"]}
+{"version":3,"file":"DomToModelOption.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomToModelOption.ts"],"names":[],"mappings":"","sourcesContent":["import type { ValueSanitizer } from '../parameter/ValueSanitizer';\nimport type {\n    ElementProcessorMap,\n    FormatParsers,\n    FormatParsersPerCategory,\n} from './DomToModelSettings';\n\n/**\n * Options for creating DomToModelContext\n */\nexport interface DomToModelOption {\n    /**\n     * Overrides default element processors\n     */\n    processorOverride?: Partial<ElementProcessorMap>;\n\n    /**\n     * Overrides default format handlers\n     */\n    formatParserOverride?: Partial<FormatParsers>;\n\n    /**\n     * Provide additional format parsers for each format type\n     */\n    additionalFormatParsers?: Partial<FormatParsersPerCategory>;\n}\n\n/**\n * Options for creating DomToModelContext, used by formatContentModel and createContentModel API\n */\nexport interface DomToModelOptionForCreateModel extends DomToModelOption {\n    /**\n     * When set to true, it will try to reuse cached content model if any\n     */\n    tryGetFromCache: boolean;\n}\n\n/**\n * Options for DOM to Content Model conversion for paste only\n */\nexport interface DomToModelOptionForSanitizing extends Required<DomToModelOption> {\n    /**\n     * Additional allowed HTML tags in lower case. Element with these tags will be preserved\n     */\n    readonly additionalAllowedTags: Lowercase<string>[];\n\n    /**\n     * Additional disallowed HTML tags in lower case. Elements with these tags will be dropped\n     */\n    readonly additionalDisallowedTags: Lowercase<string>[];\n\n    /**\n     * Additional sanitizers for CSS styles\n     */\n    readonly styleSanitizers: Record<string, ValueSanitizer>;\n\n    /**\n     * Additional sanitizers for CSS styles\n     */\n    readonly attributeSanitizers: Record<string, ValueSanitizer>;\n}\n"]}

package/lib/context/DomToModelSettings.d.ts

@@ -64,6 +64,11 @@ export declare type ElementProcessorMap = {
      * Processor for text node
      */
     '#text': ElementProcessor<Text>;
+    /**
+     * Processor for text node with selection.
+     * This is an internal processor used by #text processor
+     */
+    textWithSelection: ElementProcessor<Text>;
     /**
      * Processor for entity
      */

package/lib/context/DomToModelSettings.js.map

@@ -1 +1 @@
-{"version":3,"file":"DomToModelSettings.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomToModelSettings.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { ContentModelFormatBase } from '../format/ContentModelFormatBase';\nimport type { ContentModelFormatMap } from '../format/ContentModelFormatMap';\nimport type { DomToModelContext } from './DomToModelContext';\nimport type { ElementProcessor } from './ElementProcessor';\nimport type { FormatHandlerTypeMap, FormatKey } from '../format/FormatHandlerTypeMap';\n\n/**\n * A type of Default style map, from tag name string (in upper case) to a static style object\n */\nexport type DefaultStyleMap = {\n    [key in keyof HTMLElementDeprecatedTagNameMap]?: Readonly<Partial<CSSStyleDeclaration>>;\n} &\n    {\n        [key in keyof HTMLElementTagNameMap]?: Readonly<Partial<CSSStyleDeclaration>>;\n    } & {\n        // Workaround typescript 4.4.4 which does not have these elements in its declaration file\n        center?: Partial<CSSStyleDeclaration>;\n        strike?: Partial<CSSStyleDeclaration>;\n    };\n\n/**\n * Parse format from the given HTML element and default style\n * @param format The format object to parse into\n * @param element The HTML element to parse format from\n * @param context The context object that provide related context information\n * @param defaultStyle Default CSS style of the given HTML element\n */\nexport type FormatParser<TFormat extends ContentModelFormatBase> = (\n    format: TFormat,\n    element: HTMLElement,\n    context: DomToModelContext,\n    defaultStyle: Readonly<Partial<CSSStyleDeclaration>>\n) => void;\n\n/**\n * Parse format from the given text node\n * @param format The format object to parse into\n * @param textNode The text node to parse format from\n * @param context The context object that provide related context information\n */\nexport type TextFormatParser<\n    TFormat extends ContentModelSegmentFormat = ContentModelSegmentFormat\n> = (format: TFormat, textNode: Text, context: DomToModelContext) => void;\n\n/**\n * All format parsers\n */\nexport type FormatParsers = {\n    [Key in FormatKey]: FormatParser<FormatHandlerTypeMap[Key]> | null;\n};\n\n/**\n * A map from format parser category name to an array of parsers. This is for HTML Element only\n */\nexport type ElementFormatParserPerCategory = {\n    [Key in keyof ContentModelFormatMap]: (FormatParser<ContentModelFormatMap[Key]> | null)[];\n};\n\n/**\n * A map from format parser category name to an array of parsers\n */\nexport type FormatParsersPerCategory = ElementFormatParserPerCategory & {\n    text: TextFormatParser[];\n};\n\n/**\n * A map from element processor name to its processor type\n */\nexport type ElementProcessorMap = {\n    [key in keyof HTMLElementDeprecatedTagNameMap]?: ElementProcessor<\n        HTMLElementDeprecatedTagNameMap[key]\n    >;\n} &\n    {\n        [key in keyof HTMLElementTagNameMap]?: ElementProcessor<HTMLElementTagNameMap[key]>;\n    } & {\n        /**\n         * Processors for all other HTML elements\n         */\n        '*': ElementProcessor<HTMLElement>;\n\n        /**\n         * Processor for text node\n         */\n        '#text': ElementProcessor<Text>;\n\n        /**\n         * Processor for entity\n         */\n        entity: ElementProcessor<HTMLElement>;\n\n        /**\n         * Common processor dispatch for all elements\n         */\n        element: ElementProcessor<HTMLElement>;\n\n        /**\n         * Common processor for child nodes of a given element\n         */\n        child: ElementProcessor<ParentNode>;\n\n        /**\n         * Workaround for typescript 4.4.4 that doesn't have element \"strike\" in its element type\n         */\n        strike?: ElementProcessor<HTMLElement>;\n\n        /**\n         * Workaround for typescript 4.4.4 that doesn't have element \"center\" in its element type\n         */\n        center?: ElementProcessor<HTMLElement>;\n\n        /**\n         * Processor for Inline Readonly Delimiters\n         */\n        delimiter?: ElementProcessor<Node>;\n    };\n\n/**\n * Represents settings to customize DOM to Content Model conversion\n */\nexport interface DomToModelSettings {\n    /**\n     * Map of element processors\n     */\n    elementProcessors: ElementProcessorMap;\n\n    /**\n     * Map of format parsers\n     */\n    formatParsers: FormatParsersPerCategory;\n\n    /**\n     * Default DOM to Content Model processors before overriding.\n     * This provides a way to call original processor from an overridden processor function\n     */\n    defaultElementProcessors: Readonly<ElementProcessorMap>;\n\n    /**\n     * Default format parsers before overriding.\n     * This provides a way to call original format parser from an overridden parser function\n     */\n    defaultFormatParsers: Readonly<FormatParsers>;\n}\n"]}
+{"version":3,"file":"DomToModelSettings.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/context/DomToModelSettings.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { ContentModelFormatBase } from '../format/ContentModelFormatBase';\nimport type { ContentModelFormatMap } from '../format/ContentModelFormatMap';\nimport type { DomToModelContext } from './DomToModelContext';\nimport type { ElementProcessor } from './ElementProcessor';\nimport type { FormatHandlerTypeMap, FormatKey } from '../format/FormatHandlerTypeMap';\n\n/**\n * A type of Default style map, from tag name string (in upper case) to a static style object\n */\nexport type DefaultStyleMap = {\n    [key in keyof HTMLElementDeprecatedTagNameMap]?: Readonly<Partial<CSSStyleDeclaration>>;\n} &\n    {\n        [key in keyof HTMLElementTagNameMap]?: Readonly<Partial<CSSStyleDeclaration>>;\n    } & {\n        // Workaround typescript 4.4.4 which does not have these elements in its declaration file\n        center?: Partial<CSSStyleDeclaration>;\n        strike?: Partial<CSSStyleDeclaration>;\n    };\n\n/**\n * Parse format from the given HTML element and default style\n * @param format The format object to parse into\n * @param element The HTML element to parse format from\n * @param context The context object that provide related context information\n * @param defaultStyle Default CSS style of the given HTML element\n */\nexport type FormatParser<TFormat extends ContentModelFormatBase> = (\n    format: TFormat,\n    element: HTMLElement,\n    context: DomToModelContext,\n    defaultStyle: Readonly<Partial<CSSStyleDeclaration>>\n) => void;\n\n/**\n * Parse format from the given text node\n * @param format The format object to parse into\n * @param textNode The text node to parse format from\n * @param context The context object that provide related context information\n */\nexport type TextFormatParser<\n    TFormat extends ContentModelSegmentFormat = ContentModelSegmentFormat\n> = (format: TFormat, textNode: Text, context: DomToModelContext) => void;\n\n/**\n * All format parsers\n */\nexport type FormatParsers = {\n    [Key in FormatKey]: FormatParser<FormatHandlerTypeMap[Key]> | null;\n};\n\n/**\n * A map from format parser category name to an array of parsers. This is for HTML Element only\n */\nexport type ElementFormatParserPerCategory = {\n    [Key in keyof ContentModelFormatMap]: (FormatParser<ContentModelFormatMap[Key]> | null)[];\n};\n\n/**\n * A map from format parser category name to an array of parsers\n */\nexport type FormatParsersPerCategory = ElementFormatParserPerCategory & {\n    text: TextFormatParser[];\n};\n\n/**\n * A map from element processor name to its processor type\n */\nexport type ElementProcessorMap = {\n    [key in keyof HTMLElementDeprecatedTagNameMap]?: ElementProcessor<\n        HTMLElementDeprecatedTagNameMap[key]\n    >;\n} &\n    {\n        [key in keyof HTMLElementTagNameMap]?: ElementProcessor<HTMLElementTagNameMap[key]>;\n    } & {\n        /**\n         * Processors for all other HTML elements\n         */\n        '*': ElementProcessor<HTMLElement>;\n\n        /**\n         * Processor for text node\n         */\n        '#text': ElementProcessor<Text>;\n\n        /**\n         * Processor for text node with selection.\n         * This is an internal processor used by #text processor\n         */\n        textWithSelection: ElementProcessor<Text>;\n\n        /**\n         * Processor for entity\n         */\n        entity: ElementProcessor<HTMLElement>;\n\n        /**\n         * Common processor dispatch for all elements\n         */\n        element: ElementProcessor<HTMLElement>;\n\n        /**\n         * Common processor for child nodes of a given element\n         */\n        child: ElementProcessor<ParentNode>;\n\n        /**\n         * Workaround for typescript 4.4.4 that doesn't have element \"strike\" in its element type\n         */\n        strike?: ElementProcessor<HTMLElement>;\n\n        /**\n         * Workaround for typescript 4.4.4 that doesn't have element \"center\" in its element type\n         */\n        center?: ElementProcessor<HTMLElement>;\n\n        /**\n         * Processor for Inline Readonly Delimiters\n         */\n        delimiter?: ElementProcessor<Node>;\n    };\n\n/**\n * Represents settings to customize DOM to Content Model conversion\n */\nexport interface DomToModelSettings {\n    /**\n     * Map of element processors\n     */\n    elementProcessors: ElementProcessorMap;\n\n    /**\n     * Map of format parsers\n     */\n    formatParsers: FormatParsersPerCategory;\n\n    /**\n     * Default DOM to Content Model processors before overriding.\n     * This provides a way to call original processor from an overridden processor function\n     */\n    defaultElementProcessors: Readonly<ElementProcessorMap>;\n\n    /**\n     * Default format parsers before overriding.\n     * This provides a way to call original format parser from an overridden parser function\n     */\n    defaultFormatParsers: Readonly<FormatParsers>;\n}\n"]}

package/lib/editor/EditorCore.d.ts

@@ -8,7 +8,7 @@ import type { EntityState } from '../parameter/FormatContentModelContext';
 import type { DarkColorHandler } from '../context/DarkColorHandler';
 import type { ContentModelDocument } from '../group/ContentModelDocument';
 import type { DOMSelection } from '../selection/DOMSelection';
-import type { DomToModelOption } from '../context/DomToModelOption';
+import type { DomToModelOptionForCreateModel } from '../context/DomToModelOption';
 import type { EditorContext } from '../context/EditorContext';
 import type { EditorEnvironment } from '../parameter/EditorEnvironment';
 import type { ModelToDomOption } from '../context/ModelToDomOption';
@@ -29,7 +29,7 @@ export declare type CreateEditorContext = (core: EditorCore, saveIndex: boolean)
  * @param selectionOverride When passed a valid selection, use this selection range instead of current selection in editor.
  * When pass "none", it means we don't need a selection in content model
  */
-export declare type CreateContentModel = (core: EditorCore, option?: DomToModelOption, selectionOverride?: DOMSelection | 'none') => ContentModelDocument;
+export declare type CreateContentModel = (core: EditorCore, option?: DomToModelOptionForCreateModel, selectionOverride?: DOMSelection | 'none') => ContentModelDocument;
 /**
  * Get current DOM selection from editor
  * @param core The EditorCore object
@@ -50,6 +50,12 @@ export declare type SetContentModel = (core: EditorCore, model: ContentModelDocu
  * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent
  */
 export declare type SetDOMSelection = (core: EditorCore, selection: DOMSelection | null, skipSelectionChangedEvent?: boolean) => void;
+/**
+ * Set a new logical root (most likely due to focus change)
+ * @param core The EditorCore object
+ * @param logicalRoot The new logical root (has to be child of physicalRoot or null to use physicalRoot as logical root)
+ */
+export declare type SetLogicalRoot = (core: EditorCore, logicalRoot: HTMLDivElement | null) => void;
 /**
  * The general API to do format change with Content Model
  * It will grab a Content Model for current editor content, and invoke a callback function
@@ -59,7 +65,7 @@ export declare type SetDOMSelection = (core: EditorCore, selection: DOMSelection
  * @param formatter Formatter function, see ContentModelFormatter
  * @param options More options, see FormatContentModelOptions
  */
-export declare type FormatContentModel = (core: EditorCore, formatter: ContentModelFormatter, options?: FormatContentModelOptions) => void;
+export declare type FormatContentModel = (core: EditorCore, formatter: ContentModelFormatter, options?: FormatContentModelOptions, domToModelOptions?: DomToModelOptionForCreateModel) => void;
 /**
  * Switch the Shadow Edit mode of editor On/Off
  * @param core The EditorCore object
@@ -104,6 +110,17 @@ export declare type AttachDomEvent = (core: EditorCore, eventMap: Record<string,
  * @param step Steps to move, can be 0, positive or negative
  */
 export declare type RestoreUndoSnapshot = (core: EditorCore, snapshot: Snapshot) => void;
+/**
+ * Add CSS rules for editor
+ * @param core The EditorCore object
+ * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.
+ * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception. Pass null to remove existing rules
+ * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be
+ * combined with root selector together to build a separate rule. It also accepts pseudo classes "before" and "after" to create pseudo class rule "::before"
+ * and "::after" to the editor root element itself
+ * @param maxRuleLength @optional Set maximum length for a single rule. This is used by test code only
+ */
+export declare type SetEditorStyle = (core: EditorCore, key: string, cssRule: string | null, subSelectors?: 'before' | 'after' | string[], maxRuleLength?: number) => void;
 /**
  * The interface for the map of core API for Editor.
  * Editor can call call API from this map under EditorCore object
@@ -142,6 +159,12 @@ export interface CoreApiMap {
      * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent
      */
     setDOMSelection: SetDOMSelection;
+    /**
+     * Set a new logical root (most likely due to focus change)
+     * @param core The StandaloneEditorCore object
+     * @param logicalRoot The new logical root (has to be child of physicalRoot)
+     */
+    setLogicalRoot: SetLogicalRoot;
     /**
      * The general API to do format change with Content Model
      * It will grab a Content Model for current editor content, and invoke a callback function
@@ -196,6 +219,15 @@ export interface CoreApiMap {
      * @param broadcast Set to true to skip the shouldHandleEventExclusively check
      */
     triggerEvent: TriggerEvent;
+    /**
+     * Add CSS rules for editor
+     * @param core The EditorCore object
+     * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.
+     * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception
+     * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be
+     * combined with root selector together to build a separate rule.
+     */
+    setEditorStyle: SetEditorStyle;
 }
 /**
  * Represents the core data structure of an editor

package/lib/editor/EditorCore.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditorCore.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/EditorCore.ts"],"names":[],"mappings":"","sourcesContent":["import type { DOMHelper } from '../parameter/DOMHelper';\nimport type { PluginEvent } from '../event/PluginEvent';\nimport type { PluginState } from '../pluginState/PluginState';\nimport type { EditorPlugin } from './EditorPlugin';\nimport type { DOMEventRecord } from '../parameter/DOMEventRecord';\nimport type { Snapshot } from '../parameter/Snapshot';\nimport type { EntityState } from '../parameter/FormatContentModelContext';\nimport type { DarkColorHandler } from '../context/DarkColorHandler';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { DOMSelection } from '../selection/DOMSelection';\nimport type { DomToModelOption } from '../context/DomToModelOption';\nimport type { EditorContext } from '../context/EditorContext';\nimport type { EditorEnvironment } from '../parameter/EditorEnvironment';\nimport type { ModelToDomOption } from '../context/ModelToDomOption';\nimport type { OnNodeCreated } from '../context/ModelToDomSettings';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\nimport type { Rect } from '../parameter/Rect';\nimport type {\n    ContentModelFormatter,\n    FormatContentModelOptions,\n} from '../parameter/FormatContentModelOptions';\n\n/**\n * Create a EditorContext object used by ContentModel API\n * @param core The EditorCore object\n * @param saveIndex True to allow saving index info into node using domIndexer, otherwise false\n */\nexport type CreateEditorContext = (core: EditorCore, saveIndex: boolean) => EditorContext;\n\n/**\n * Create Content Model from DOM tree in this editor\n * @param core The EditorCore object\n * @param option The option to customize the behavior of DOM to Content Model conversion\n * @param selectionOverride When passed a valid selection, use this selection range instead of current selection in editor.\n * When pass \"none\", it means we don't need a selection in content model\n */\nexport type CreateContentModel = (\n    core: EditorCore,\n    option?: DomToModelOption,\n    selectionOverride?: DOMSelection | 'none'\n) => ContentModelDocument;\n\n/**\n * Get current DOM selection from editor\n * @param core The EditorCore object\n */\nexport type GetDOMSelection = (core: EditorCore) => DOMSelection | null;\n\n/**\n * Set content with content model. This is the replacement of core API getSelectionRangeEx\n * @param core The EditorCore object\n * @param model The content model to set\n * @param option Additional options to customize the behavior of Content Model to DOM conversion\n * @param onNodeCreated An optional callback that will be called when a DOM node is created\n */\nexport type SetContentModel = (\n    core: EditorCore,\n    model: ContentModelDocument,\n    option?: ModelToDomOption,\n    onNodeCreated?: OnNodeCreated\n) => DOMSelection | null;\n\n/**\n * Set current DOM selection from editor. This is the replacement of core API select\n * @param core The EditorCore object\n * @param selection The selection to set\n * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent\n */\nexport type SetDOMSelection = (\n    core: EditorCore,\n    selection: DOMSelection | null,\n    skipSelectionChangedEvent?: boolean\n) => void;\n\n/**\n * The general API to do format change with Content Model\n * It will grab a Content Model for current editor content, and invoke a callback function\n * to do format change. Then according to the return value, write back the modified content model into editor.\n * If there is cached model, it will be used and updated.\n * @param core The EditorCore object\n * @param formatter Formatter function, see ContentModelFormatter\n * @param options More options, see FormatContentModelOptions\n */\nexport type FormatContentModel = (\n    core: EditorCore,\n    formatter: ContentModelFormatter,\n    options?: FormatContentModelOptions\n) => void;\n\n/**\n * Switch the Shadow Edit mode of editor On/Off\n * @param core The EditorCore object\n * @param isOn True to switch On, False to switch Off\n */\nexport type SwitchShadowEdit = (core: EditorCore, isOn: boolean) => void;\n\n/**\n * Trigger a plugin event\n * @param core The EditorCore object\n * @param pluginEvent The event object to trigger\n * @param broadcast Set to true to skip the shouldHandleEventExclusively check\n */\nexport type TriggerEvent = (core: EditorCore, pluginEvent: PluginEvent, broadcast: boolean) => void;\n\n/**\n * Add an undo snapshot to current undo snapshot stack\n * @param core The EditorCore object\n * @param canUndoByBackspace True if this action can be undone when user press Backspace key (aka Auto Complete).\n * @param entityStates @optional Entity states related to this snapshot.\n * Each entity state will cause an EntityOperation event with operation = EntityOperation.UpdateEntityState\n * when undo/redo to this snapshot\n */\nexport type AddUndoSnapshot = (\n    core: EditorCore,\n    canUndoByBackspace: boolean,\n    entityStates?: EntityState[]\n) => Snapshot | null;\n\n/**\n * Retrieves the rect of the visible viewport of the editor.\n * @param core The EditorCore object\n */\nexport type GetVisibleViewport = (core: EditorCore) => Rect | null;\n\n/**\n * Focus to editor. If there is a cached selection range, use it as current selection\n * @param core The EditorCore object\n */\nexport type Focus = (core: EditorCore) => void;\n\n/**\n * Attach a DOM event to the editor content DIV\n * @param core The EditorCore object\n * @param eventMap A map from event name to its handler\n */\nexport type AttachDomEvent = (\n    core: EditorCore,\n    eventMap: Record<string, DOMEventRecord>\n) => () => void;\n\n/**\n * Restore an undo snapshot into editor\n * @param core The EditorCore object\n * @param step Steps to move, can be 0, positive or negative\n */\nexport type RestoreUndoSnapshot = (core: EditorCore, snapshot: Snapshot) => void;\n\n/**\n * The interface for the map of core API for Editor.\n * Editor can call call API from this map under EditorCore object\n */\nexport interface CoreApiMap {\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param core The EditorCore object\n     * @param option The option to customize the behavior of DOM to Content Model conversion\n     * @param selectionOverride When passed a valid selection, use this selection range instead of current selection in editor.\n     * When pass \"none\", it means we don't need a selection in content model\n     */\n    createEditorContext: CreateEditorContext;\n\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param core The EditorCore object\n     * @param option The option to customize the behavior of DOM to Content Model conversion\n     */\n    createContentModel: CreateContentModel;\n\n    /**\n     * Get current DOM selection from editor\n     * @param core The EditorCore object\n     */\n    getDOMSelection: GetDOMSelection;\n\n    /**\n     * Set content with content model\n     * @param core The EditorCore object\n     * @param model The content model to set\n     * @param option Additional options to customize the behavior of Content Model to DOM conversion\n     */\n    setContentModel: SetContentModel;\n\n    /**\n     * Set current DOM selection from editor. This is the replacement of core API select\n     * @param core The EditorCore object\n     * @param selection The selection to set\n     * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent\n     */\n    setDOMSelection: SetDOMSelection;\n\n    /**\n     * The general API to do format change with Content Model\n     * It will grab a Content Model for current editor content, and invoke a callback function\n     * to do format change. Then according to the return value, write back the modified content model into editor.\n     * If there is cached model, it will be used and updated.\n     * @param core The EditorCore object\n     * @param formatter Formatter function, see ContentModelFormatter\n     * @param options More options, see FormatContentModelOptions\n     */\n    formatContentModel: FormatContentModel;\n\n    /**\n     * Switch the Shadow Edit mode of editor On/Off\n     * @param core The EditorCore object\n     * @param isOn True to switch On, False to switch Off\n     */\n    switchShadowEdit: SwitchShadowEdit;\n\n    /**\n     * Retrieves the rect of the visible viewport of the editor.\n     * @param core The EditorCore object\n     */\n    getVisibleViewport: GetVisibleViewport;\n\n    /**\n     * Focus to editor. If there is a cached selection range, use it as current selection\n     * @param core The EditorCore object\n     */\n    focus: Focus;\n\n    /**\n     * Add an undo snapshot to current undo snapshot stack\n     * @param core The EditorCore object\n     * @param canUndoByBackspace True if this action can be undone when user press Backspace key (aka Auto Complete).\n     * @param entityStates @optional Entity states related to this snapshot.\n     * Each entity state will cause an EntityOperation event with operation = EntityOperation.UpdateEntityState\n     * when undo/redo to this snapshot\n     */\n    addUndoSnapshot: AddUndoSnapshot;\n\n    /**\n     * Restore an undo snapshot into editor\n     * @param core The editor core object\n     * @param step Steps to move, can be 0, positive or negative\n     */\n    restoreUndoSnapshot: RestoreUndoSnapshot;\n\n    /**\n     * Attach a DOM event to the editor content DIV\n     * @param core The EditorCore object\n     * @param eventMap A map from event name to its handler\n     */\n    attachDomEvent: AttachDomEvent;\n\n    /**\n     * Trigger a plugin event\n     * @param core The EditorCore object\n     * @param pluginEvent The event object to trigger\n     * @param broadcast Set to true to skip the shouldHandleEventExclusively check\n     */\n    triggerEvent: TriggerEvent;\n}\n\n/**\n * Represents the core data structure of an editor\n */\nexport interface EditorCore extends PluginState {\n    /**\n     * The root DIV element of this editor (formerly contentDiv)\n     */\n    readonly physicalRoot: HTMLDivElement;\n\n    /**\n     * The content DIV element that operations should be applied to\n     * By default, the logical root is the same as the physical root,\n     * but if nested editors are used, the logical root changes to that of the inner editor\n     */\n    logicalRoot: HTMLDivElement;\n\n    /**\n     * Core API map of this editor\n     */\n    readonly api: CoreApiMap;\n\n    /**\n     * Original API map of this editor. Overridden core API can use API from this map to call the original version of core API.\n     */\n    readonly originalApi: CoreApiMap;\n\n    /**\n     * An array of editor plugins.\n     */\n    readonly plugins: EditorPlugin[];\n\n    /**\n     * Editor running environment\n     */\n    readonly environment: EditorEnvironment;\n\n    /**\n     * Dark model handler for the editor, used for variable-based solution.\n     * If keep it null, editor will still use original dataset-based dark mode solution.\n     */\n    readonly darkColorHandler: DarkColorHandler;\n\n    /**\n     * A handler to convert HTML string to a trust HTML string.\n     * By default it will just return the original HTML string directly.\n     * To override, pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler\n     */\n    readonly trustedHTMLHandler: TrustedHTMLHandler;\n\n    /**\n     * A helper class to provide DOM access APIs\n     */\n    readonly domHelper: DOMHelper;\n\n    /**\n     * A callback to be invoked when any exception is thrown during disposing editor\n     * @param plugin The plugin that causes exception\n     * @param error The error object we got\n     */\n    readonly disposeErrorHandler?: (plugin: EditorPlugin, error: Error) => void;\n}\n"]}
+{"version":3,"file":"EditorCore.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/EditorCore.ts"],"names":[],"mappings":"","sourcesContent":["import type { DOMHelper } from '../parameter/DOMHelper';\nimport type { PluginEvent } from '../event/PluginEvent';\nimport type { PluginState } from '../pluginState/PluginState';\nimport type { EditorPlugin } from './EditorPlugin';\nimport type { DOMEventRecord } from '../parameter/DOMEventRecord';\nimport type { Snapshot } from '../parameter/Snapshot';\nimport type { EntityState } from '../parameter/FormatContentModelContext';\nimport type { DarkColorHandler } from '../context/DarkColorHandler';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { DOMSelection } from '../selection/DOMSelection';\nimport type { DomToModelOptionForCreateModel } from '../context/DomToModelOption';\nimport type { EditorContext } from '../context/EditorContext';\nimport type { EditorEnvironment } from '../parameter/EditorEnvironment';\nimport type { ModelToDomOption } from '../context/ModelToDomOption';\nimport type { OnNodeCreated } from '../context/ModelToDomSettings';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\nimport type { Rect } from '../parameter/Rect';\nimport type {\n    ContentModelFormatter,\n    FormatContentModelOptions,\n} from '../parameter/FormatContentModelOptions';\n\n/**\n * Create a EditorContext object used by ContentModel API\n * @param core The EditorCore object\n * @param saveIndex True to allow saving index info into node using domIndexer, otherwise false\n */\nexport type CreateEditorContext = (core: EditorCore, saveIndex: boolean) => EditorContext;\n\n/**\n * Create Content Model from DOM tree in this editor\n * @param core The EditorCore object\n * @param option The option to customize the behavior of DOM to Content Model conversion\n * @param selectionOverride When passed a valid selection, use this selection range instead of current selection in editor.\n * When pass \"none\", it means we don't need a selection in content model\n */\nexport type CreateContentModel = (\n    core: EditorCore,\n    option?: DomToModelOptionForCreateModel,\n    selectionOverride?: DOMSelection | 'none'\n) => ContentModelDocument;\n\n/**\n * Get current DOM selection from editor\n * @param core The EditorCore object\n */\nexport type GetDOMSelection = (core: EditorCore) => DOMSelection | null;\n\n/**\n * Set content with content model. This is the replacement of core API getSelectionRangeEx\n * @param core The EditorCore object\n * @param model The content model to set\n * @param option Additional options to customize the behavior of Content Model to DOM conversion\n * @param onNodeCreated An optional callback that will be called when a DOM node is created\n */\nexport type SetContentModel = (\n    core: EditorCore,\n    model: ContentModelDocument,\n    option?: ModelToDomOption,\n    onNodeCreated?: OnNodeCreated\n) => DOMSelection | null;\n\n/**\n * Set current DOM selection from editor. This is the replacement of core API select\n * @param core The EditorCore object\n * @param selection The selection to set\n * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent\n */\nexport type SetDOMSelection = (\n    core: EditorCore,\n    selection: DOMSelection | null,\n    skipSelectionChangedEvent?: boolean\n) => void;\n\n/**\n * Set a new logical root (most likely due to focus change)\n * @param core The EditorCore object\n * @param logicalRoot The new logical root (has to be child of physicalRoot or null to use physicalRoot as logical root)\n */\nexport type SetLogicalRoot = (core: EditorCore, logicalRoot: HTMLDivElement | null) => void;\n\n/**\n * The general API to do format change with Content Model\n * It will grab a Content Model for current editor content, and invoke a callback function\n * to do format change. Then according to the return value, write back the modified content model into editor.\n * If there is cached model, it will be used and updated.\n * @param core The EditorCore object\n * @param formatter Formatter function, see ContentModelFormatter\n * @param options More options, see FormatContentModelOptions\n */\nexport type FormatContentModel = (\n    core: EditorCore,\n    formatter: ContentModelFormatter,\n    options?: FormatContentModelOptions,\n    domToModelOptions?: DomToModelOptionForCreateModel\n) => void;\n\n/**\n * Switch the Shadow Edit mode of editor On/Off\n * @param core The EditorCore object\n * @param isOn True to switch On, False to switch Off\n */\nexport type SwitchShadowEdit = (core: EditorCore, isOn: boolean) => void;\n\n/**\n * Trigger a plugin event\n * @param core The EditorCore object\n * @param pluginEvent The event object to trigger\n * @param broadcast Set to true to skip the shouldHandleEventExclusively check\n */\nexport type TriggerEvent = (core: EditorCore, pluginEvent: PluginEvent, broadcast: boolean) => void;\n\n/**\n * Add an undo snapshot to current undo snapshot stack\n * @param core The EditorCore object\n * @param canUndoByBackspace True if this action can be undone when user press Backspace key (aka Auto Complete).\n * @param entityStates @optional Entity states related to this snapshot.\n * Each entity state will cause an EntityOperation event with operation = EntityOperation.UpdateEntityState\n * when undo/redo to this snapshot\n */\nexport type AddUndoSnapshot = (\n    core: EditorCore,\n    canUndoByBackspace: boolean,\n    entityStates?: EntityState[]\n) => Snapshot | null;\n\n/**\n * Retrieves the rect of the visible viewport of the editor.\n * @param core The EditorCore object\n */\nexport type GetVisibleViewport = (core: EditorCore) => Rect | null;\n\n/**\n * Focus to editor. If there is a cached selection range, use it as current selection\n * @param core The EditorCore object\n */\nexport type Focus = (core: EditorCore) => void;\n\n/**\n * Attach a DOM event to the editor content DIV\n * @param core The EditorCore object\n * @param eventMap A map from event name to its handler\n */\nexport type AttachDomEvent = (\n    core: EditorCore,\n    eventMap: Record<string, DOMEventRecord>\n) => () => void;\n\n/**\n * Restore an undo snapshot into editor\n * @param core The EditorCore object\n * @param step Steps to move, can be 0, positive or negative\n */\nexport type RestoreUndoSnapshot = (core: EditorCore, snapshot: Snapshot) => void;\n\n/**\n * Add CSS rules for editor\n * @param core The EditorCore object\n * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.\n * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception. Pass null to remove existing rules\n * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be\n * combined with root selector together to build a separate rule. It also accepts pseudo classes \"before\" and \"after\" to create pseudo class rule \"::before\"\n * and \"::after\" to the editor root element itself\n * @param maxRuleLength @optional Set maximum length for a single rule. This is used by test code only\n */\nexport type SetEditorStyle = (\n    core: EditorCore,\n    key: string,\n    cssRule: string | null,\n    subSelectors?: 'before' | 'after' | string[],\n    maxRuleLength?: number\n) => void;\n\n/**\n * The interface for the map of core API for Editor.\n * Editor can call call API from this map under EditorCore object\n */\nexport interface CoreApiMap {\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param core The EditorCore object\n     * @param option The option to customize the behavior of DOM to Content Model conversion\n     * @param selectionOverride When passed a valid selection, use this selection range instead of current selection in editor.\n     * When pass \"none\", it means we don't need a selection in content model\n     */\n    createEditorContext: CreateEditorContext;\n\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param core The EditorCore object\n     * @param option The option to customize the behavior of DOM to Content Model conversion\n     */\n    createContentModel: CreateContentModel;\n\n    /**\n     * Get current DOM selection from editor\n     * @param core The EditorCore object\n     */\n    getDOMSelection: GetDOMSelection;\n\n    /**\n     * Set content with content model\n     * @param core The EditorCore object\n     * @param model The content model to set\n     * @param option Additional options to customize the behavior of Content Model to DOM conversion\n     */\n    setContentModel: SetContentModel;\n\n    /**\n     * Set current DOM selection from editor. This is the replacement of core API select\n     * @param core The EditorCore object\n     * @param selection The selection to set\n     * @param skipSelectionChangedEvent @param Pass true to skip triggering a SelectionChangedEvent\n     */\n    setDOMSelection: SetDOMSelection;\n\n    /**\n     * Set a new logical root (most likely due to focus change)\n     * @param core The StandaloneEditorCore object\n     * @param logicalRoot The new logical root (has to be child of physicalRoot)\n     */\n    setLogicalRoot: SetLogicalRoot;\n\n    /**\n     * The general API to do format change with Content Model\n     * It will grab a Content Model for current editor content, and invoke a callback function\n     * to do format change. Then according to the return value, write back the modified content model into editor.\n     * If there is cached model, it will be used and updated.\n     * @param core The EditorCore object\n     * @param formatter Formatter function, see ContentModelFormatter\n     * @param options More options, see FormatContentModelOptions\n     */\n    formatContentModel: FormatContentModel;\n\n    /**\n     * Switch the Shadow Edit mode of editor On/Off\n     * @param core The EditorCore object\n     * @param isOn True to switch On, False to switch Off\n     */\n    switchShadowEdit: SwitchShadowEdit;\n\n    /**\n     * Retrieves the rect of the visible viewport of the editor.\n     * @param core The EditorCore object\n     */\n    getVisibleViewport: GetVisibleViewport;\n\n    /**\n     * Focus to editor. If there is a cached selection range, use it as current selection\n     * @param core The EditorCore object\n     */\n    focus: Focus;\n\n    /**\n     * Add an undo snapshot to current undo snapshot stack\n     * @param core The EditorCore object\n     * @param canUndoByBackspace True if this action can be undone when user press Backspace key (aka Auto Complete).\n     * @param entityStates @optional Entity states related to this snapshot.\n     * Each entity state will cause an EntityOperation event with operation = EntityOperation.UpdateEntityState\n     * when undo/redo to this snapshot\n     */\n    addUndoSnapshot: AddUndoSnapshot;\n\n    /**\n     * Restore an undo snapshot into editor\n     * @param core The editor core object\n     * @param step Steps to move, can be 0, positive or negative\n     */\n    restoreUndoSnapshot: RestoreUndoSnapshot;\n\n    /**\n     * Attach a DOM event to the editor content DIV\n     * @param core The EditorCore object\n     * @param eventMap A map from event name to its handler\n     */\n    attachDomEvent: AttachDomEvent;\n\n    /**\n     * Trigger a plugin event\n     * @param core The EditorCore object\n     * @param pluginEvent The event object to trigger\n     * @param broadcast Set to true to skip the shouldHandleEventExclusively check\n     */\n    triggerEvent: TriggerEvent;\n\n    /**\n     * Add CSS rules for editor\n     * @param core The EditorCore object\n     * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.\n     * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception\n     * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be\n     * combined with root selector together to build a separate rule.\n     */\n    setEditorStyle: SetEditorStyle;\n}\n\n/**\n * Represents the core data structure of an editor\n */\nexport interface EditorCore extends PluginState {\n    /**\n     * The root DIV element of this editor (formerly contentDiv)\n     */\n    readonly physicalRoot: HTMLDivElement;\n\n    /**\n     * The content DIV element that operations should be applied to\n     * By default, the logical root is the same as the physical root,\n     * but if nested editors are used, the logical root changes to that of the inner editor\n     */\n    logicalRoot: HTMLDivElement;\n\n    /**\n     * Core API map of this editor\n     */\n    readonly api: CoreApiMap;\n\n    /**\n     * Original API map of this editor. Overridden core API can use API from this map to call the original version of core API.\n     */\n    readonly originalApi: CoreApiMap;\n\n    /**\n     * An array of editor plugins.\n     */\n    readonly plugins: EditorPlugin[];\n\n    /**\n     * Editor running environment\n     */\n    readonly environment: EditorEnvironment;\n\n    /**\n     * Dark model handler for the editor, used for variable-based solution.\n     * If keep it null, editor will still use original dataset-based dark mode solution.\n     */\n    readonly darkColorHandler: DarkColorHandler;\n\n    /**\n     * A handler to convert HTML string to a trust HTML string.\n     * By default it will just return the original HTML string directly.\n     * To override, pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler\n     */\n    readonly trustedHTMLHandler: TrustedHTMLHandler;\n\n    /**\n     * A helper class to provide DOM access APIs\n     */\n    readonly domHelper: DOMHelper;\n\n    /**\n     * A callback to be invoked when any exception is thrown during disposing editor\n     * @param plugin The plugin that causes exception\n     * @param error The error object we got\n     */\n    readonly disposeErrorHandler?: (plugin: EditorPlugin, error: Error) => void;\n}\n"]}

package/lib/editor/EditorOptions.d.ts

@@ -21,9 +21,11 @@ export interface EditorOptions {
      */
     defaultModelToDomOptions?: ModelToDomOption;
     /**
-     * Reuse existing DOM structure if possible, and update the model when content or selection is changed
+     * Whether content model should be cached in order to improve editing performance.
+     * Pass true to disable the cache.
+     * @default false
      */
-    cacheModel?: boolean;
+    disableCache?: boolean;
     /**
      * List of plugins.
      * The order of plugins here determines in what order each event will be dispatched.

package/lib/editor/EditorOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditorOptions.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/EditorOptions.ts"],"names":[],"mappings":"","sourcesContent":["import type { PasteType } from '../enum/PasteType';\nimport type { Colors, ColorTransformFunction } from '../context/DarkColorHandler';\nimport type { EditorPlugin } from './EditorPlugin';\nimport type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { CoreApiMap } from './EditorCore';\nimport type { DomToModelOption } from '../context/DomToModelOption';\nimport type { ModelToDomOption } from '../context/ModelToDomOption';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { Snapshots } from '../parameter/Snapshot';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\n\n/**\n * Options for editor\n */\nexport interface EditorOptions {\n    /**\n     * Default options used for DOM to Content Model conversion\n     */\n    defaultDomToModelOptions?: DomToModelOption;\n\n    /**\n     * Default options used for Content Model to DOM conversion\n     */\n    defaultModelToDomOptions?: ModelToDomOption;\n\n    /**\n     * Reuse existing DOM structure if possible, and update the model when content or selection is changed\n     */\n    cacheModel?: boolean;\n\n    /**\n     * List of plugins.\n     * The order of plugins here determines in what order each event will be dispatched.\n     * Plugins not appear in this list will not be added to editor, including built-in plugins.\n     * Default value is empty array.\n     */\n    plugins?: EditorPlugin[];\n\n    /**\n     * Default format of editor content. This will be applied to empty content.\n     * If there is already content inside editor, format of existing content will not be changed.\n     * Default value is the computed style of editor content DIV\n     */\n    defaultSegmentFormat?: ContentModelSegmentFormat;\n\n    /**\n     * Allowed custom content type when paste besides text/plain, text/html and images\n     * Only text types are supported, and do not add \"text/\" prefix to the type values\n     */\n    allowedCustomPasteType?: string[];\n\n    /**\n     * The scroll container to get scroll event from.\n     * By default, the scroll container will be the same with editor content DIV\n     */\n    scrollContainer?: HTMLElement;\n\n    /**\n     * A util function to transform light mode color to dark mode color\n     * Default value is to return the original light color\n     */\n    getDarkColor?: ColorTransformFunction;\n\n    /**\n     * Existing known color pairs\n     */\n    knownColors?: Record<string, Colors>;\n\n    /**\n     * Customized trusted type handler used for sanitizing HTML string before assign to DOM tree\n     * This is required when trusted-type Content-Security-Policy (CSP) is enabled.\n     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types\n     */\n    trustedHTMLHandler?: TrustedHTMLHandler;\n\n    /**\n     * A function map to override default core API implementation\n     * Default value is null\n     */\n    coreApiOverride?: Partial<CoreApiMap>;\n\n    /**\n     * Color of the border of a selectedImage. Default color: '#DB626C'\n     */\n    imageSelectionBorderColor?: string;\n\n    /**\n     * Initial Content Model\n     */\n    initialModel?: ContentModelDocument;\n\n    /**\n     * Whether to skip the adjust editor process when for light/dark mode\n     */\n    doNotAdjustEditorColor?: boolean;\n\n    /**\n     * If the editor is currently in dark mode\n     */\n    inDarkMode?: boolean;\n\n    /**\n     * Undo snapshot. Use this parameter to provide an external storage of undo snapshots\n     */\n    snapshots?: Snapshots;\n\n    /**\n     * A callback to be invoked when any exception is thrown during disposing editor\n     * @param plugin The plugin that causes exception\n     * @param error The error object we got\n     */\n    disposeErrorHandler?: (plugin: EditorPlugin, error: Error) => void;\n\n    /**\n     * Default paste type. By default will use the normal (as-is) paste type.\n     */\n    defaultPasteType?: PasteType;\n}\n"]}
+{"version":3,"file":"EditorOptions.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/EditorOptions.ts"],"names":[],"mappings":"","sourcesContent":["import type { PasteType } from '../enum/PasteType';\nimport type { Colors, ColorTransformFunction } from '../context/DarkColorHandler';\nimport type { EditorPlugin } from './EditorPlugin';\nimport type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { CoreApiMap } from './EditorCore';\nimport type { DomToModelOption } from '../context/DomToModelOption';\nimport type { ModelToDomOption } from '../context/ModelToDomOption';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { Snapshots } from '../parameter/Snapshot';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\n\n/**\n * Options for editor\n */\nexport interface EditorOptions {\n    /**\n     * Default options used for DOM to Content Model conversion\n     */\n    defaultDomToModelOptions?: DomToModelOption;\n\n    /**\n     * Default options used for Content Model to DOM conversion\n     */\n    defaultModelToDomOptions?: ModelToDomOption;\n\n    /**\n     * Whether content model should be cached in order to improve editing performance.\n     * Pass true to disable the cache.\n     * @default false\n     */\n    disableCache?: boolean;\n\n    /**\n     * List of plugins.\n     * The order of plugins here determines in what order each event will be dispatched.\n     * Plugins not appear in this list will not be added to editor, including built-in plugins.\n     * Default value is empty array.\n     */\n    plugins?: EditorPlugin[];\n\n    /**\n     * Default format of editor content. This will be applied to empty content.\n     * If there is already content inside editor, format of existing content will not be changed.\n     * Default value is the computed style of editor content DIV\n     */\n    defaultSegmentFormat?: ContentModelSegmentFormat;\n\n    /**\n     * Allowed custom content type when paste besides text/plain, text/html and images\n     * Only text types are supported, and do not add \"text/\" prefix to the type values\n     */\n    allowedCustomPasteType?: string[];\n\n    /**\n     * The scroll container to get scroll event from.\n     * By default, the scroll container will be the same with editor content DIV\n     */\n    scrollContainer?: HTMLElement;\n\n    /**\n     * A util function to transform light mode color to dark mode color\n     * Default value is to return the original light color\n     */\n    getDarkColor?: ColorTransformFunction;\n\n    /**\n     * Existing known color pairs\n     */\n    knownColors?: Record<string, Colors>;\n\n    /**\n     * Customized trusted type handler used for sanitizing HTML string before assign to DOM tree\n     * This is required when trusted-type Content-Security-Policy (CSP) is enabled.\n     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types\n     */\n    trustedHTMLHandler?: TrustedHTMLHandler;\n\n    /**\n     * A function map to override default core API implementation\n     * Default value is null\n     */\n    coreApiOverride?: Partial<CoreApiMap>;\n\n    /**\n     * Color of the border of a selectedImage. Default color: '#DB626C'\n     */\n    imageSelectionBorderColor?: string;\n\n    /**\n     * Initial Content Model\n     */\n    initialModel?: ContentModelDocument;\n\n    /**\n     * Whether to skip the adjust editor process when for light/dark mode\n     */\n    doNotAdjustEditorColor?: boolean;\n\n    /**\n     * If the editor is currently in dark mode\n     */\n    inDarkMode?: boolean;\n\n    /**\n     * Undo snapshot. Use this parameter to provide an external storage of undo snapshots\n     */\n    snapshots?: Snapshots;\n\n    /**\n     * A callback to be invoked when any exception is thrown during disposing editor\n     * @param plugin The plugin that causes exception\n     * @param error The error object we got\n     */\n    disposeErrorHandler?: (plugin: EditorPlugin, error: Error) => void;\n\n    /**\n     * Default paste type. By default will use the normal (as-is) paste type.\n     */\n    defaultPasteType?: PasteType;\n}\n"]}

package/lib/editor/IEditor.d.ts

@@ -1,3 +1,4 @@
+import type { DomToModelOptionForCreateModel } from '../context/DomToModelOption';
 import type { DOMHelper } from '../parameter/DOMHelper';
 import type { PluginEventData, PluginEventFromType } from '../event/PluginEventData';
 import type { PluginEventType } from '../event/PluginEventType';
@@ -26,12 +27,10 @@ export interface IEditor {
      * - disconnected: Returns a disconnected clone of Content Model from editor which you can do any change on it and it won't impact the editor content.
      * If there is any entity in editor, the returned object will contain cloned copy of entity wrapper element.
      * If editor is in dark mode, the cloned entity will be converted back to light mode.
-     * - reduced: Returns a reduced Content Model that only contains the model of current selection. If there is already a up-to-date cached model, use it
-     * instead to improve performance. This is mostly used for retrieve current format state.
      * - clean: Similar with disconnected, this will return a disconnected model, the difference is "clean" mode will not include any selection info.
      * This is usually used for exporting content
      */
-    getContentModelCopy(mode: 'connected' | 'disconnected' | 'reduced' | 'clean'): ContentModelDocument;
+    getContentModelCopy(mode: 'connected' | 'disconnected' | 'clean'): ContentModelDocument;
     /**
      * Get current running environment, such as if editor is running on Mac
      */
@@ -47,6 +46,12 @@ export interface IEditor {
      * @param selection The selection to set
      */
     setDOMSelection(selection: DOMSelection | null): void;
+    /**
+     * Set a new logical root (most likely due to focus change)
+     * @param core The StandaloneEditorCore object
+     * @param logicalRoot The new logical root (has to be child of physicalRoot or null to use physicalRoot as logical root)
+     */
+    setLogicalRoot(logicalRoot: HTMLDivElement | null): void;
     /**
      * The general API to do format change with Content Model
      * It will grab a Content Model for current editor content, and invoke a callback function
@@ -55,7 +60,7 @@ export interface IEditor {
      * @param formatter Formatter function, see ContentModelFormatter
      * @param options More options, see FormatContentModelOptions
      */
-    formatContentModel(formatter: ContentModelFormatter, options?: FormatContentModelOptions): void;
+    formatContentModel(formatter: ContentModelFormatter, options?: FormatContentModelOptions, domToModelOption?: DomToModelOptionForCreateModel): void;
     /**
      * Get pending format of editor if any, or return null
      */
@@ -162,4 +167,12 @@ export interface IEditor {
      * Retrieves the rect of the visible viewport of the editor.
      */
     getVisibleViewport(): Rect | null;
+    /**
+     * Add CSS rules for editor
+     * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.
+     * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception. Pass null to clear existing rules
+     * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be
+     * combined with root selector together to build a separate rule.
+     */
+    setEditorStyle(key: string, cssRule: string | null, subSelectors?: 'before' | 'after' | string[]): void;
 }

package/lib/editor/IEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"IEditor.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/IEditor.ts"],"names":[],"mappings":"","sourcesContent":["import type { DOMHelper } from '../parameter/DOMHelper';\nimport type { PluginEventData, PluginEventFromType } from '../event/PluginEventData';\nimport type { PluginEventType } from '../event/PluginEventType';\nimport type { DOMEventRecord } from '../parameter/DOMEventRecord';\nimport type { SnapshotsManager } from '../parameter/SnapshotsManager';\nimport type { Snapshot } from '../parameter/Snapshot';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { DOMSelection } from '../selection/DOMSelection';\nimport type { EditorEnvironment } from '../parameter/EditorEnvironment';\nimport type {\n    ContentModelFormatter,\n    FormatContentModelOptions,\n} from '../parameter/FormatContentModelOptions';\nimport type { DarkColorHandler } from '../context/DarkColorHandler';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\nimport type { Rect } from '../parameter/Rect';\nimport type { EntityState } from '../parameter/FormatContentModelContext';\n\n/**\n * An interface of Editor, built on top of Content Model\n */\nexport interface IEditor {\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param mode What kind of Content Model we want. Currently we support the following values:\n     * - connected: Returns a connect Content Model object. \"Connected\" means if there is any entity inside editor, the returned Content Model will\n     * contain the same wrapper element for entity. This option should only be used in some special cases. In most cases we should use \"disconnected\"\n     * to get a fully disconnected Content Model so that any change to the model will not impact editor content.\n     * - disconnected: Returns a disconnected clone of Content Model from editor which you can do any change on it and it won't impact the editor content.\n     * If there is any entity in editor, the returned object will contain cloned copy of entity wrapper element.\n     * If editor is in dark mode, the cloned entity will be converted back to light mode.\n     * - reduced: Returns a reduced Content Model that only contains the model of current selection. If there is already a up-to-date cached model, use it\n     * instead to improve performance. This is mostly used for retrieve current format state.\n     * - clean: Similar with disconnected, this will return a disconnected model, the difference is \"clean\" mode will not include any selection info.\n     * This is usually used for exporting content\n     */\n    getContentModelCopy(\n        mode: 'connected' | 'disconnected' | 'reduced' | 'clean'\n    ): ContentModelDocument;\n\n    /**\n     * Get current running environment, such as if editor is running on Mac\n     */\n    getEnvironment(): EditorEnvironment;\n\n    /**\n     * Get current DOM selection.\n     * This is the replacement of IEditor.getSelectionRangeEx.\n     */\n    getDOMSelection(): DOMSelection | null;\n\n    /**\n     * Set DOMSelection into editor content.\n     * This is the replacement of IEditor.select.\n     * @param selection The selection to set\n     */\n    setDOMSelection(selection: DOMSelection | null): void;\n\n    /**\n     * The general API to do format change with Content Model\n     * It will grab a Content Model for current editor content, and invoke a callback function\n     * to do format change. Then according to the return value, write back the modified content model into editor.\n     * If there is cached model, it will be used and updated.\n     * @param formatter Formatter function, see ContentModelFormatter\n     * @param options More options, see FormatContentModelOptions\n     */\n    formatContentModel(formatter: ContentModelFormatter, options?: FormatContentModelOptions): void;\n\n    /**\n     * Get pending format of editor if any, or return null\n     */\n    getPendingFormat(): ContentModelSegmentFormat | null;\n\n    /**\n     * Get whether this editor is disposed\n     * @returns True if editor is disposed, otherwise false\n     */\n    isDisposed(): boolean;\n\n    /**\n     * Get a DOM Helper object to help access DOM tree in editor\n     */\n    getDOMHelper(): DOMHelper;\n\n    /**\n     * Get document which contains this editor\n     * @returns The HTML document which contains this editor\n     */\n    getDocument(): Document;\n\n    /**\n     * Focus to this editor, the selection was restored to where it was before, no unexpected scroll.\n     */\n    focus(): void;\n\n    /**\n     * Trigger an event to be dispatched to all plugins\n     * @param eventType Type of the event\n     * @param data data of the event with given type, this is the rest part of PluginEvent with the given type\n     * @param broadcast indicates if the event needs to be dispatched to all plugins\n     * True means to all, false means to allow exclusive handling from one plugin unless no one wants that\n     * @returns the event object which is really passed into plugins. Some plugin may modify the event object so\n     * the result of this function provides a chance to read the modified result\n     */\n    triggerEvent<T extends PluginEventType>(\n        eventType: T,\n        data: PluginEventData<T>,\n        broadcast?: boolean\n    ): PluginEventFromType<T>;\n\n    /**\n     * Get undo snapshots manager\n     */\n    getSnapshotsManager(): SnapshotsManager;\n\n    /**\n     * Check if the editor is in dark mode\n     * @returns True if the editor is in dark mode, otherwise false\n     */\n    isDarkMode(): boolean;\n\n    /**\n     * Set the dark mode state and transforms the content to match the new state.\n     * @param isDarkMode The next status of dark mode. True if the editor should be in dark mode, false if not.\n     */\n    setDarkModeState(isDarkMode?: boolean): void;\n\n    /**\n     * Add a single undo snapshot to undo stack\n     * @param entityState @optional State for entity if we want to add entity state for this snapshot\n     */\n    takeSnapshot(entityState?: EntityState): Snapshot | null;\n\n    /**\n     * Restore an undo snapshot into editor\n     * @param snapshot The snapshot to restore\n     */\n    restoreSnapshot(snapshot: Snapshot): void;\n\n    /**\n     * Attach a DOM event to the editor content DIV\n     * @param eventMap A map from event name to its handler\n     */\n    attachDomEvent(eventMap: Record<string, DOMEventRecord>): () => void;\n\n    /**\n     * Check if editor is in Shadow Edit mode\n     */\n    isInShadowEdit(): boolean;\n\n    /**\n     * Make the editor in \"Shadow Edit\" mode.\n     * In Shadow Edit mode, all format change will finally be ignored.\n     * This can be used for building a live preview feature for format button, to allow user\n     * see format result without really apply it.\n     * This function can be called repeated. If editor is already in shadow edit mode, we can still\n     * use this function to do more shadow edit operation.\n     */\n    startShadowEdit(): void;\n\n    /**\n     * Leave \"Shadow Edit\" mode, all changes made during shadow edit will be discarded\n     */\n    stopShadowEdit(): void;\n\n    /**\n     * Get a darkColorHandler object for this editor.\n     */\n    getColorManager(): DarkColorHandler;\n\n    /**\n     * Dispose this editor, dispose all plugins and custom data\n     */\n    dispose(): void;\n\n    /**\n     * Check if focus is in editor now\n     * @returns true if focus is in editor, otherwise false\n     */\n    hasFocus(): boolean;\n\n    /**\n     * Get a function to convert HTML string to trusted HTML string.\n     * By default it will just return the input HTML directly. To override this behavior,\n     * pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler\n     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types\n     */\n    getTrustedHTMLHandler(): TrustedHTMLHandler;\n\n    /**\n     * Get the scroll container of the editor\n     */\n    getScrollContainer(): HTMLElement;\n\n    /**\n     * Retrieves the rect of the visible viewport of the editor.\n     */\n    getVisibleViewport(): Rect | null;\n}\n"]}
+{"version":3,"file":"IEditor.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/editor/IEditor.ts"],"names":[],"mappings":"","sourcesContent":["import type { DomToModelOptionForCreateModel } from '../context/DomToModelOption';\nimport type { DOMHelper } from '../parameter/DOMHelper';\nimport type { PluginEventData, PluginEventFromType } from '../event/PluginEventData';\nimport type { PluginEventType } from '../event/PluginEventType';\nimport type { DOMEventRecord } from '../parameter/DOMEventRecord';\nimport type { SnapshotsManager } from '../parameter/SnapshotsManager';\nimport type { Snapshot } from '../parameter/Snapshot';\nimport type { ContentModelDocument } from '../group/ContentModelDocument';\nimport type { ContentModelSegmentFormat } from '../format/ContentModelSegmentFormat';\nimport type { DOMSelection } from '../selection/DOMSelection';\nimport type { EditorEnvironment } from '../parameter/EditorEnvironment';\nimport type {\n    ContentModelFormatter,\n    FormatContentModelOptions,\n} from '../parameter/FormatContentModelOptions';\nimport type { DarkColorHandler } from '../context/DarkColorHandler';\nimport type { TrustedHTMLHandler } from '../parameter/TrustedHTMLHandler';\nimport type { Rect } from '../parameter/Rect';\nimport type { EntityState } from '../parameter/FormatContentModelContext';\n\n/**\n * An interface of Editor, built on top of Content Model\n */\nexport interface IEditor {\n    /**\n     * Create Content Model from DOM tree in this editor\n     * @param mode What kind of Content Model we want. Currently we support the following values:\n     * - connected: Returns a connect Content Model object. \"Connected\" means if there is any entity inside editor, the returned Content Model will\n     * contain the same wrapper element for entity. This option should only be used in some special cases. In most cases we should use \"disconnected\"\n     * to get a fully disconnected Content Model so that any change to the model will not impact editor content.\n     * - disconnected: Returns a disconnected clone of Content Model from editor which you can do any change on it and it won't impact the editor content.\n     * If there is any entity in editor, the returned object will contain cloned copy of entity wrapper element.\n     * If editor is in dark mode, the cloned entity will be converted back to light mode.\n     * - clean: Similar with disconnected, this will return a disconnected model, the difference is \"clean\" mode will not include any selection info.\n     * This is usually used for exporting content\n     */\n    getContentModelCopy(mode: 'connected' | 'disconnected' | 'clean'): ContentModelDocument;\n\n    /**\n     * Get current running environment, such as if editor is running on Mac\n     */\n    getEnvironment(): EditorEnvironment;\n\n    /**\n     * Get current DOM selection.\n     * This is the replacement of IEditor.getSelectionRangeEx.\n     */\n    getDOMSelection(): DOMSelection | null;\n\n    /**\n     * Set DOMSelection into editor content.\n     * This is the replacement of IEditor.select.\n     * @param selection The selection to set\n     */\n    setDOMSelection(selection: DOMSelection | null): void;\n\n    /**\n     * Set a new logical root (most likely due to focus change)\n     * @param core The StandaloneEditorCore object\n     * @param logicalRoot The new logical root (has to be child of physicalRoot or null to use physicalRoot as logical root)\n     */\n    setLogicalRoot(logicalRoot: HTMLDivElement | null): void;\n\n    /**\n     * The general API to do format change with Content Model\n     * It will grab a Content Model for current editor content, and invoke a callback function\n     * to do format change. Then according to the return value, write back the modified content model into editor.\n     * If there is cached model, it will be used and updated.\n     * @param formatter Formatter function, see ContentModelFormatter\n     * @param options More options, see FormatContentModelOptions\n     */\n    formatContentModel(\n        formatter: ContentModelFormatter,\n        options?: FormatContentModelOptions,\n        domToModelOption?: DomToModelOptionForCreateModel\n    ): void;\n\n    /**\n     * Get pending format of editor if any, or return null\n     */\n    getPendingFormat(): ContentModelSegmentFormat | null;\n\n    /**\n     * Get whether this editor is disposed\n     * @returns True if editor is disposed, otherwise false\n     */\n    isDisposed(): boolean;\n\n    /**\n     * Get a DOM Helper object to help access DOM tree in editor\n     */\n    getDOMHelper(): DOMHelper;\n\n    /**\n     * Get document which contains this editor\n     * @returns The HTML document which contains this editor\n     */\n    getDocument(): Document;\n\n    /**\n     * Focus to this editor, the selection was restored to where it was before, no unexpected scroll.\n     */\n    focus(): void;\n\n    /**\n     * Trigger an event to be dispatched to all plugins\n     * @param eventType Type of the event\n     * @param data data of the event with given type, this is the rest part of PluginEvent with the given type\n     * @param broadcast indicates if the event needs to be dispatched to all plugins\n     * True means to all, false means to allow exclusive handling from one plugin unless no one wants that\n     * @returns the event object which is really passed into plugins. Some plugin may modify the event object so\n     * the result of this function provides a chance to read the modified result\n     */\n    triggerEvent<T extends PluginEventType>(\n        eventType: T,\n        data: PluginEventData<T>,\n        broadcast?: boolean\n    ): PluginEventFromType<T>;\n\n    /**\n     * Get undo snapshots manager\n     */\n    getSnapshotsManager(): SnapshotsManager;\n\n    /**\n     * Check if the editor is in dark mode\n     * @returns True if the editor is in dark mode, otherwise false\n     */\n    isDarkMode(): boolean;\n\n    /**\n     * Set the dark mode state and transforms the content to match the new state.\n     * @param isDarkMode The next status of dark mode. True if the editor should be in dark mode, false if not.\n     */\n    setDarkModeState(isDarkMode?: boolean): void;\n\n    /**\n     * Add a single undo snapshot to undo stack\n     * @param entityState @optional State for entity if we want to add entity state for this snapshot\n     */\n    takeSnapshot(entityState?: EntityState): Snapshot | null;\n\n    /**\n     * Restore an undo snapshot into editor\n     * @param snapshot The snapshot to restore\n     */\n    restoreSnapshot(snapshot: Snapshot): void;\n\n    /**\n     * Attach a DOM event to the editor content DIV\n     * @param eventMap A map from event name to its handler\n     */\n    attachDomEvent(eventMap: Record<string, DOMEventRecord>): () => void;\n\n    /**\n     * Check if editor is in Shadow Edit mode\n     */\n    isInShadowEdit(): boolean;\n\n    /**\n     * Make the editor in \"Shadow Edit\" mode.\n     * In Shadow Edit mode, all format change will finally be ignored.\n     * This can be used for building a live preview feature for format button, to allow user\n     * see format result without really apply it.\n     * This function can be called repeated. If editor is already in shadow edit mode, we can still\n     * use this function to do more shadow edit operation.\n     */\n    startShadowEdit(): void;\n\n    /**\n     * Leave \"Shadow Edit\" mode, all changes made during shadow edit will be discarded\n     */\n    stopShadowEdit(): void;\n\n    /**\n     * Get a darkColorHandler object for this editor.\n     */\n    getColorManager(): DarkColorHandler;\n\n    /**\n     * Dispose this editor, dispose all plugins and custom data\n     */\n    dispose(): void;\n\n    /**\n     * Check if focus is in editor now\n     * @returns true if focus is in editor, otherwise false\n     */\n    hasFocus(): boolean;\n\n    /**\n     * Get a function to convert HTML string to trusted HTML string.\n     * By default it will just return the input HTML directly. To override this behavior,\n     * pass your own trusted HTML handler to EditorOptions.trustedHTMLHandler\n     * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types\n     */\n    getTrustedHTMLHandler(): TrustedHTMLHandler;\n\n    /**\n     * Get the scroll container of the editor\n     */\n    getScrollContainer(): HTMLElement;\n\n    /**\n     * Retrieves the rect of the visible viewport of the editor.\n     */\n    getVisibleViewport(): Rect | null;\n\n    /**\n     * Add CSS rules for editor\n     * @param key A string to identify the CSS rule type. When set CSS rules with the same key again, existing rules with the same key will be replaced.\n     * @param cssRule The CSS rule string, must be a valid CSS rule string, or browser may throw exception. Pass null to clear existing rules\n     * @param subSelectors @optional If the rule is used for child element under editor, use this parameter to specify the child elements. Each item will be\n     * combined with root selector together to build a separate rule.\n     */\n    setEditorStyle(\n        key: string,\n        cssRule: string | null,\n        subSelectors?: 'before' | 'after' | string[]\n    ): void;\n}\n"]}

package/lib/enum/EntityOperation.d.ts

@@ -18,6 +18,11 @@ export declare type EntityLifecycleOperation =
  * because it will always return false.
  */
  | 'replaceTemporaryContent'
+/**
+ * This event is triggered when an undo snapshot is taken while a custom logical root is used
+ * Plugins can handle this event to include entity state to include in the snapshot
+ */
+ | 'snapshotEntityState'
 /**
  * Notify plugins that a new entity state need to be updated to an entity.
  * This is normally happened when user undo/redo the content with an entity snapshot added by a plugin that handles entity

package/lib/enum/EntityOperation.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityOperation.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/enum/EntityOperation.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Define entity lifecycle related operations\n */\nexport type EntityLifecycleOperation =\n    /**\n     * Notify plugins that there is a new plugin was added into editor.\n     * Plugin can handle this event to entity hydration.\n     * This event will be only fired once for each entity DOM node.\n     * After undo, or copy/paste, since new DOM nodes were added, this event will be fired\n     * for those entities represented by newly added nodes.\n     */\n    | 'newEntity'\n\n    /**\n     * Notify plugins that editor is generating HTML content for save.\n     * Plugin should use this event to remove any temporary content, and only leave DOM nodes that\n     * should be saved as HTML string.\n     * This event will provide a cloned DOM tree for each entity, do NOT compare the DOM nodes with cached nodes\n     * because it will always return false.\n     */\n    | 'replaceTemporaryContent'\n    /**\n     * Notify plugins that a new entity state need to be updated to an entity.\n     * This is normally happened when user undo/redo the content with an entity snapshot added by a plugin that handles entity\n     */\n    | 'updateEntityState'\n\n    /**\n     * Notify plugins that user is clicking target to an entity\n     */\n    | 'click';\n\n/**\n * Define entity removal related operations\n */\nexport type EntityRemovalOperation =\n    /**\n     * Notify plugins that user is removing an entity from its start position using DELETE key\n     */\n    | 'removeFromStart'\n\n    /**\n     * Notify plugins that user is remove an entity from its end position using BACKSPACE key\n     */\n    | 'removeFromEnd'\n\n    /**\n     * Notify plugins that an entity is being overwritten.\n     * This can be caused by key in, cut, paste, delete, backspace ... on a selection\n     * which contains some entities.\n     */\n    | 'overwrite';\n\n/**\n * Define possible operations to an entity\n */\nexport type EntityOperation = EntityLifecycleOperation | EntityRemovalOperation;\n"]}
+{"version":3,"file":"EntityOperation.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/enum/EntityOperation.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Define entity lifecycle related operations\n */\nexport type EntityLifecycleOperation =\n    /**\n     * Notify plugins that there is a new plugin was added into editor.\n     * Plugin can handle this event to entity hydration.\n     * This event will be only fired once for each entity DOM node.\n     * After undo, or copy/paste, since new DOM nodes were added, this event will be fired\n     * for those entities represented by newly added nodes.\n     */\n    | 'newEntity'\n\n    /**\n     * Notify plugins that editor is generating HTML content for save.\n     * Plugin should use this event to remove any temporary content, and only leave DOM nodes that\n     * should be saved as HTML string.\n     * This event will provide a cloned DOM tree for each entity, do NOT compare the DOM nodes with cached nodes\n     * because it will always return false.\n     */\n    | 'replaceTemporaryContent'\n\n    /**\n     * This event is triggered when an undo snapshot is taken while a custom logical root is used\n     * Plugins can handle this event to include entity state to include in the snapshot\n     */\n    | 'snapshotEntityState'\n\n    /**\n     * Notify plugins that a new entity state need to be updated to an entity.\n     * This is normally happened when user undo/redo the content with an entity snapshot added by a plugin that handles entity\n     */\n    | 'updateEntityState'\n\n    /**\n     * Notify plugins that user is clicking target to an entity\n     */\n    | 'click';\n\n/**\n * Define entity removal related operations\n */\nexport type EntityRemovalOperation =\n    /**\n     * Notify plugins that user is removing an entity from its start position using DELETE key\n     */\n    | 'removeFromStart'\n\n    /**\n     * Notify plugins that user is remove an entity from its end position using BACKSPACE key\n     */\n    | 'removeFromEnd'\n\n    /**\n     * Notify plugins that an entity is being overwritten.\n     * This can be caused by key in, cut, paste, delete, backspace ... on a selection\n     * which contains some entities.\n     */\n    | 'overwrite';\n\n/**\n * Define possible operations to an entity\n */\nexport type EntityOperation = EntityLifecycleOperation | EntityRemovalOperation;\n"]}

package/lib/event/LogicalRootChangedEvent.d.ts

@@ -0,0 +1,10 @@
+import type { BasePluginEvent } from './BasePluginEvent';
+/**
+ * Fired when the logical root changes
+ */
+export interface LogicalRootChangedEvent extends BasePluginEvent<'logicalRootChanged'> {
+    /**
+     * The new logical root element
+     */
+    logicalRoot: HTMLDivElement;
+}

package/lib/event/LogicalRootChangedEvent.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=LogicalRootChangedEvent.js.map

package/lib/event/LogicalRootChangedEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LogicalRootChangedEvent.js","sourceRoot":"","sources":["../../../../packages/roosterjs-content-model-types/lib/event/LogicalRootChangedEvent.ts"],"names":[],"mappings":"","sourcesContent":["import type { BasePluginEvent } from './BasePluginEvent';\n\n/**\n * Fired when the logical root changes\n */\nexport interface LogicalRootChangedEvent extends BasePluginEvent<'logicalRootChanged'> {\n    /**\n     * The new logical root element\n     */\n    logicalRoot: HTMLDivElement;\n}\n"]}