Content Model Editor 1: Rename interface IExperimentalContentModelEditor

demo/scripts/controls/contentModel/plugins/FormatPainterPlugin.ts

@@ -3,7 +3,7 @@ import {
     applySegmentFormat,
     ContentModelSegmentFormat,
     getSegmentFormat,
-    IExperimentalContentModelEditor,
+    IContentModelEditor,
 } from 'roosterjs-content-model';
 
 const FORMATPAINTERCURSOR_SVG = require('./formatpaintercursor.svg');
@@ -15,14 +15,14 @@ interface FormatPainterFormatHolder {
 }
 
 export default class FormatPainterPlugin implements EditorPlugin {
-    private editor: IExperimentalContentModelEditor | null = null;
+    private editor: IContentModelEditor | null = null;
 
     getName() {
         return 'FormatPainter';
     }
 
     initialize(editor: IEditor) {
-        this.editor = editor as IExperimentalContentModelEditor;
+        this.editor = editor as IContentModelEditor;
     }
 
     dispose() {
@@ -42,7 +42,7 @@ export default class FormatPainterPlugin implements EditorPlugin {
         }
     }
 
-    static startFormatPainter(editor: IExperimentalContentModelEditor) {
+    static startFormatPainter(editor: IContentModelEditor) {
         const formatHolder = getFormatHolder(editor);
         const format = getSegmentFormat(editor);
 

demo/scripts/controls/editor/ExperimentalContentModelEditor.ts

@@ -7,7 +7,7 @@ import {
     domToContentModel,
     DomToModelOption,
     EditorContext,
-    IExperimentalContentModelEditor,
+    IContentModelEditor,
     ModelToDomOption,
 } from 'roosterjs-content-model';
 
@@ -16,8 +16,7 @@ import {
  *
  * Experimental editor to support Content Model
  */
-export default class ExperimentalContentModelEditor extends Editor
-    implements IExperimentalContentModelEditor {
+export default class ExperimentalContentModelEditor extends Editor implements IContentModelEditor {
     private getDarkColor: ((lightColor: string) => string) | undefined;
 
     /**

demo/scripts/controls/editor/isContentModelEditor.ts

@@ -1,10 +1,8 @@
+import { IContentModelEditor } from 'roosterjs-content-model';
 import { IEditor } from 'roosterjs-editor-types';
-import { IExperimentalContentModelEditor } from 'roosterjs-content-model';
 
-export default function isContentModelEditor(
-    editor: IEditor
-): editor is IExperimentalContentModelEditor {
-    const experimentalEditor = editor as IExperimentalContentModelEditor;
+export default function isContentModelEditor(editor: IEditor): editor is IContentModelEditor {
+    const experimentalEditor = editor as IContentModelEditor;
 
     return !!experimentalEditor.createContentModel && 'contentDiv' in experimentalEditor;
 }

demo/scripts/controls/ribbonButtons/contentModel/ContentModelRibbonPlugin.ts

@@ -1,10 +1,10 @@
 import { FormatState, PluginEvent, PluginEventType } from 'roosterjs-editor-types';
-import { getFormatState, IExperimentalContentModelEditor } from 'roosterjs-content-model';
+import { getFormatState, IContentModelEditor } from 'roosterjs-content-model';
 import { getObjectKeys } from 'roosterjs-editor-dom';
 import { LocalizedStrings, RibbonButton, RibbonPlugin, UIUtilities } from 'roosterjs-react';
 
 export class ContentModelRibbonPlugin implements RibbonPlugin {
-    private editor: IExperimentalContentModelEditor | null = null;
+    private editor: IContentModelEditor | null = null;
     private onFormatChanged: ((formatState: FormatState) => void) | null = null;
     private timer = 0;
     private formatState: FormatState | null = null;
@@ -27,7 +27,7 @@ export class ContentModelRibbonPlugin implements RibbonPlugin {
      * Initialize this plugin
      * @param editor The editor instance
      */
-    initialize(editor: IExperimentalContentModelEditor) {
+    initialize(editor: IContentModelEditor) {
         this.editor = editor;
     }
 

packages/roosterjs-content-model/lib/domToModel/context/createDomToModelContext.ts

@@ -2,7 +2,7 @@ import { defaultFormatParsers, getFormatParsers } from '../../formatHandlers/def
 import { defaultProcessorMap } from './defaultProcessors';
 import { defaultStyleMap } from '../../formatHandlers/utils/defaultStyles';
 import { DomToModelContext } from '../../publicTypes/context/DomToModelContext';
-import { DomToModelOption } from '../../publicTypes/IExperimentalContentModelEditor';
+import { DomToModelOption } from '../../publicTypes/IContentModelEditor';
 import { EditorContext } from '../../publicTypes/context/EditorContext';
 import { SelectionRangeTypes } from 'roosterjs-editor-types';
 

packages/roosterjs-content-model/lib/index.ts

@@ -174,7 +174,7 @@ export { ContentModelHandler } from './publicTypes/context/ContentModelHandler';
 export { Border } from './publicTypes/interface/Border';
 
 export {
-    IExperimentalContentModelEditor,
+    IContentModelEditor,
     DomToModelOption,
     ModelToDomOption,
-} from './publicTypes/IExperimentalContentModelEditor';
+} from './publicTypes/IContentModelEditor';

packages/roosterjs-content-model/lib/modelToDom/context/createModelToDomContext.ts

@@ -2,7 +2,7 @@ import { defaultContentModelHandlers } from './defaultContentModelHandlers';
 import { defaultImplicitFormatMap } from '../../formatHandlers/utils/defaultStyles';
 import { EditorContext } from '../../publicTypes/context/EditorContext';
 import { ModelToDomContext } from '../../publicTypes/context/ModelToDomContext';
-import { ModelToDomOption } from '../../publicTypes/IExperimentalContentModelEditor';
+import { ModelToDomOption } from '../../publicTypes/IContentModelEditor';
 import {
     defaultFormatAppliers,
     getFormatAppliers,

packages/roosterjs-content-model/lib/publicApi/block/setAlignment.ts

@@ -1,5 +1,5 @@
 import { formatParagraphWithContentModel } from '../utils/formatParagraphWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 const ResultMap: Record<
     'left' | 'center' | 'right',
@@ -25,7 +25,7 @@ const ResultMap: Record<
  * @param alignment Alignment value: left, center or right
  */
 export default function setAlignment(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     alignment: 'left' | 'center' | 'right'
 ) {
     formatParagraphWithContentModel(editor, 'setAlignment', para => {

packages/roosterjs-content-model/lib/publicApi/block/setDirection.ts

@@ -1,15 +1,12 @@
 import { formatParagraphWithContentModel } from '../utils/formatParagraphWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * Set text direction of selected paragraphs (Left to right or Right to left)
  * @param editor The editor to set alignment
  * @param direction Direction value: ltr (Left to right) or rtl (Right to left)
  */
-export default function setDirection(
-    editor: IExperimentalContentModelEditor,
-    direction: 'ltr' | 'rtl'
-) {
+export default function setDirection(editor: IContentModelEditor, direction: 'ltr' | 'rtl') {
     formatParagraphWithContentModel(editor, 'setDirection', para => {
         const isOldValueRtl = para.format.direction == 'rtl';
         const isNewValueRtl = direction == 'rtl';

packages/roosterjs-content-model/lib/publicApi/block/setHeaderLevel.ts

@@ -3,7 +3,7 @@ import { ContentModelSegmentFormat } from '../../publicTypes/format/ContentModel
 import { defaultImplicitFormatMap } from '../../formatHandlers/utils/defaultStyles';
 import { formatParagraphWithContentModel } from '../utils/formatParagraphWithContentModel';
 import { getObjectKeys } from 'roosterjs-editor-dom';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 type HeaderLevelTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 
@@ -13,7 +13,7 @@ type HeaderLevelTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
  * @param headerLevel Level of header, from 1 to 6. Set to 0 means set it back to a regular paragraph
  */
 export default function setHeaderLevel(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     headerLevel: 0 | 1 | 2 | 3 | 4 | 5 | 6
 ) {
     formatParagraphWithContentModel(editor, 'setHeaderLevel', para => {

packages/roosterjs-content-model/lib/publicApi/block/setIndentation.ts

@@ -1,5 +1,5 @@
 import { formatWithContentModel } from '../utils/formatWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { setModelIndentation } from '../../modelApi/block/setModelIndentation';
 
 /**
@@ -9,7 +9,7 @@ import { setModelIndentation } from '../../modelApi/block/setModelIndentation';
  * @param length The length of pixel to indent/outdent @default 40
  */
 export default function setIndentation(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     indentation: 'indent' | 'outdent',
     length?: number
 ) {

packages/roosterjs-content-model/lib/publicApi/block/toggleBlockQuote.ts

@@ -1,7 +1,7 @@
 import { ContentModelBlockFormat } from '../../publicTypes/format/ContentModelBlockFormat';
 import { ContentModelSegmentFormat } from '../../publicTypes/format/ContentModelSegmentFormat';
 import { formatWithContentModel } from '../utils/formatWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { toggleModelBlockQuote } from '../../modelApi/block/toggleModelBlockQuote';
 
 const DefaultQuoteFormat: ContentModelBlockFormat = {
@@ -27,7 +27,7 @@ const BuildInQuoteFormat: ContentModelBlockFormat = {
  * @param segmentFormat @optional Segment format for the content of model
  */
 export default function toggleBlockQuote(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     quoteFormat: ContentModelBlockFormat = DefaultQuoteFormat,
     segmentFormat: ContentModelSegmentFormat = DefaultSegmentFormat
 ) {

packages/roosterjs-content-model/lib/publicApi/contentModelToDom.ts

@@ -5,7 +5,7 @@ import { EditorContext } from '../publicTypes/context/EditorContext';
 import { isNodeOfType } from '../domUtils/isNodeOfType';
 import { ModelToDomBlockAndSegmentNode } from '../publicTypes/context/ModelToDomSelectionContext';
 import { ModelToDomContext } from '../publicTypes/context/ModelToDomContext';
-import { ModelToDomOption } from '../publicTypes/IExperimentalContentModelEditor';
+import { ModelToDomOption } from '../publicTypes/IContentModelEditor';
 import { optimize } from '../modelToDom/optimizers/optimize';
 import {
     NodePosition,

packages/roosterjs-content-model/lib/publicApi/domToContentModel.ts

@@ -1,7 +1,7 @@
 import { ContentModelDocument } from '../publicTypes/group/ContentModelDocument';
 import { createContentModelDocument } from '../modelApi/creators/createContentModelDocument';
 import { createDomToModelContext } from '../domToModel/context/createDomToModelContext';
-import { DomToModelOption } from '../publicTypes/IExperimentalContentModelEditor';
+import { DomToModelOption } from '../publicTypes/IContentModelEditor';
 import { EditorContext } from '../publicTypes/context/EditorContext';
 import { normalizeContentModel } from '../modelApi/common/normalizeContentModel';
 import { parseFormat } from '../domToModel/utils/parseFormat';

packages/roosterjs-content-model/lib/publicApi/format/clearFormat.ts

@@ -5,15 +5,15 @@ import { ContentModelSegment } from '../../publicTypes/segment/ContentModelSegme
 import { ContentModelSegmentFormat } from '../../publicTypes/format/ContentModelSegmentFormat';
 import { ContentModelTable } from '../../publicTypes/block/ContentModelTable';
 import { formatWithContentModel } from '../utils/formatWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { normalizeContentModel } from '../../modelApi/common/normalizeContentModel';
 
 /**
  * Clear format of selection
  * @param editor The editor to clear format from
  */
 export default function clearFormat(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     defaultSegmentFormat?: ContentModelSegmentFormat
 ) {
     formatWithContentModel(editor, 'clearFormat', model => {

packages/roosterjs-content-model/lib/publicApi/format/getFormatState.ts

@@ -1,15 +1,15 @@
 import { FormatState } from 'roosterjs-editor-types';
 import { formatWithContentModel } from '../utils/formatWithContentModel';
 import { getPendingFormat } from './pendingFormat';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { reducedModelChildProcessor } from '../../domToModel/processors/reducedModelChildProcessor';
 import { retrieveModelFormatState } from '../../modelApi/common/retrieveModelFormatState';
 
 /**
  * Get current format state
  * @param editor The editor to get format from
  */
-export default function getFormatState(editor: IExperimentalContentModelEditor): FormatState {
+export default function getFormatState(editor: IContentModelEditor): FormatState {
     let result: FormatState = {
         ...editor.getUndoState(),
 

packages/roosterjs-content-model/lib/publicApi/format/getSegmentFormat.ts

@@ -1,7 +1,7 @@
 import { ContentModelSegmentFormat } from '../../publicTypes/format/ContentModelSegmentFormat';
 import { formatWithContentModel } from '../utils/formatWithContentModel';
 import { getPendingFormat } from './pendingFormat';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { iterateSelections } from '../../modelApi/selection/iterateSelections';
 import { reducedModelChildProcessor } from '../../domToModel/processors/reducedModelChildProcessor';
 
@@ -10,7 +10,7 @@ import { reducedModelChildProcessor } from '../../domToModel/processors/reducedM
  * @param editor The editor to get format from
  */
 export default function getSegmentFormat(
-    editor: IExperimentalContentModelEditor
+    editor: IContentModelEditor
 ): ContentModelSegmentFormat | null {
     let result = getPendingFormat(editor);
 

packages/roosterjs-content-model/lib/publicApi/format/pendingFormat.ts

@@ -1,14 +1,12 @@
 import { ContentModelSegmentFormat } from '../../publicTypes/format/ContentModelSegmentFormat';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * @internal
  * Get pending segment format from editor if any, otherwise null
  * @param editor The editor to get format from
  */
-export function getPendingFormat(
-    editor: IExperimentalContentModelEditor
-): ContentModelSegmentFormat | null {
+export function getPendingFormat(editor: IContentModelEditor): ContentModelSegmentFormat | null {
     return getPendingFormatHolder(editor).format;
 }
 
@@ -19,7 +17,7 @@ export function getPendingFormat(
  * @param format The format to set. Pass null to clear existing format
  */
 export function setPendingFormat(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     format: ContentModelSegmentFormat | null
 ) {
     getPendingFormatHolder(editor).format = format;
@@ -31,7 +29,7 @@ interface PendingFormatHolder {
 
 const PendingFormatHolderKey = '__ContentModelPendingFormat';
 
-function getPendingFormatHolder(editor: IExperimentalContentModelEditor): PendingFormatHolder {
+function getPendingFormatHolder(editor: IContentModelEditor): PendingFormatHolder {
     return editor.getCustomData<PendingFormatHolder>(PendingFormatHolderKey, () => ({
         format: null,
     }));

packages/roosterjs-content-model/lib/publicApi/image/adjustImageSelection.ts

@@ -1,14 +1,14 @@
 import { adjustSegmentSelection } from '../../modelApi/selection/adjustSegmentSelection';
 import { ContentModelImage } from '../../publicTypes/segment/ContentModelImage';
 import { formatWithContentModel } from '../utils/formatWithContentModel';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * Adjust selection to make sure select an image if any
  * @return Content Model Image object if an image is select, or null
  */
 export default function adjustImageSelection(
-    editor: IExperimentalContentModelEditor
+    editor: IContentModelEditor
 ): ContentModelImage | null {
     let image: ContentModelImage | null = null;
 

packages/roosterjs-content-model/lib/publicApi/image/changeImage.ts

@@ -1,14 +1,14 @@
 import formatImageWithContentModel from '../utils/formatImageWithContentModel';
 import { ContentModelImage } from '../../publicTypes/segment/ContentModelImage';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 import { readFile } from 'roosterjs-editor-dom';
 
 /**
  * Change the selected image src
  * @param editor The editor instance
  * @param file The image file
  */
-export default function changeImage(editor: IExperimentalContentModelEditor, file: File) {
+export default function changeImage(editor: IContentModelEditor, file: File) {
     readFile(file, dataUrl => {
         if (dataUrl && !editor.isDisposed()) {
             formatImageWithContentModel(editor, 'changeImage', (image: ContentModelImage) => {

packages/roosterjs-content-model/lib/publicApi/image/setImageAltText.ts

@@ -1,14 +1,14 @@
 import formatImageWithContentModel from '../utils/formatImageWithContentModel';
 import { ContentModelImage } from '../../publicTypes/segment/ContentModelImage';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * Set image alt text for all selected images at selection. If no images is contained
  * in selection, do nothing.
  * @param editor The editor instance
  * @param altText The image alt text
  */
-export default function setImageAltText(editor: IExperimentalContentModelEditor, altText: string) {
+export default function setImageAltText(editor: IContentModelEditor, altText: string) {
     formatImageWithContentModel(editor, 'setImageAltText', (image: ContentModelImage) => {
         image.alt = altText;
     });

packages/roosterjs-content-model/lib/publicApi/image/setImageBorder.ts

@@ -2,7 +2,7 @@ import applyImageBorderFormat from '../../modelApi/image/applyImageBorderFormat'
 import formatImageWithContentModel from '../utils/formatImageWithContentModel';
 import { Border } from '../../publicTypes/interface/Border';
 import { ContentModelImage } from '../../publicTypes/segment/ContentModelImage';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * Set image border style for all selected images at selection.
@@ -12,7 +12,7 @@ import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimental
  * @param borderRadius the border radius value, if undefined, the border radius will keep the actual value
  */
 export default function setImageBorder(
-    editor: IExperimentalContentModelEditor,
+    editor: IContentModelEditor,
     border: Border,
     borderRadius?: string
 ) {

packages/roosterjs-content-model/lib/publicApi/image/setImageBoxShadow.ts

@@ -1,16 +1,13 @@
 import formatImageWithContentModel from '../utils/formatImageWithContentModel';
 import { ContentModelImage } from '../../publicTypes/segment/ContentModelImage';
-import { IExperimentalContentModelEditor } from '../../publicTypes/IExperimentalContentModelEditor';
+import { IContentModelEditor } from '../../publicTypes/IContentModelEditor';
 
 /**
  * Set image box shadow for all selected images at selection.
  * @param editor The editor instance
  * @param boxShadow The image box shadow
  */
-export default function setImageBoxShadow(
-    editor: IExperimentalContentModelEditor,
-    boxShadow: string
-) {
+export default function setImageBoxShadow(editor: IContentModelEditor, boxShadow: string) {
     formatImageWithContentModel(editor, 'setImageBoxShadow', (image: ContentModelImage) => {
         image.format.boxShadow = boxShadow;
     });