Bump Content model packages to 9.1.0,

demo/scripts/controlsV2/demoButtons/exportContentButton.ts

@@ -4,7 +4,10 @@ import type { RibbonButton } from '../roosterjsReact/ribbon';
 /**
  * Key of localized strings of Zoom button
  */
-export type ExportButtonStringKey = 'buttonNameExport';
+export type ExportButtonStringKey =
+    | 'buttonNameExport'
+    | 'menuNameExportHTML'
+    | 'menuNameExportText';
 
 /**
  * "Export content" button on the format ribbon
@@ -14,9 +17,22 @@ export const exportContentButton: RibbonButton<ExportButtonStringKey> = {
     unlocalizedText: 'Export',
     iconName: 'Export',
     flipWhenRtl: true,
-    onClick: editor => {
+    dropDownMenu: {
+        items: {
+            menuNameExportHTML: 'as HTML',
+            menuNameExportText: 'as Plain Text',
+        },
+    },
+    onClick: (editor, key) => {
         const win = editor.getDocument().defaultView.open();
-        const html = exportContent(editor);
+        let html = '';
+
+        if (key == 'menuNameExportHTML') {
+            html = exportContent(editor);
+        } else if (key == 'menuNameExportText') {
+            html = `<pre>${exportContent(editor, 'PlainText')}</pre>`;
+        }
+
         win.document.write(editor.getTrustedHTMLHandler()(html));
     },
     commandBarProperties: {

demo/scripts/controlsV2/mainPane/MainPane.tsx

@@ -24,7 +24,7 @@ import { getDarkColor } from 'roosterjs-color-utils';
 import { getPresetModelById } from '../sidePane/presets/allPresets/allPresets';
 import { getTabs, tabNames } from '../tabs/getTabs';
 import { getTheme } from '../theme/themes';
-import { OptionState } from '../sidePane/editorOptions/OptionState';
+import { OptionState, UrlPlaceholder } from '../sidePane/editorOptions/OptionState';
 import { popoutButton } from '../demoButtons/popoutButton';
 import { PresetPlugin } from '../sidePane/presets/PresetPlugin';
 import { redoButton } from '../roosterjsReact/ribbon/buttons/redoButton';
@@ -47,6 +47,7 @@ import {
 import {
     AutoFormatPlugin,
     EditPlugin,
+    HyperlinkPlugin,
     MarkdownPlugin,
     PastePlugin,
     ShortcutPlugin,
@@ -474,33 +475,31 @@ export class MainPane extends React.Component<{}, MainPaneState> {
             tableMenu,
             imageMenu,
             watermarkText,
+            markdownOptions,
+            autoFormatOptions,
+            linkTitle,
         } = this.state.initState;
         return [
-            pluginList.autoFormat &&
-                new AutoFormatPlugin({
-                    autoBullet: true,
-                    autoNumbering: true,
-                    autoUnlink: true,
-                    autoLink: true,
-                }),
+            pluginList.autoFormat && new AutoFormatPlugin(autoFormatOptions),
             pluginList.edit && new EditPlugin(),
             pluginList.paste && new PastePlugin(allowExcelNoBorderTable),
             pluginList.shortcut && new ShortcutPlugin(),
             pluginList.tableEdit && new TableEditPlugin(),
             pluginList.watermark && new WatermarkPlugin(watermarkText),
-            pluginList.markdown &&
-                new MarkdownPlugin({
-                    bold: true,
-                    italic: true,
-                    strikethrough: true,
-                }),
+            pluginList.markdown && new MarkdownPlugin(markdownOptions),
             pluginList.emoji && createEmojiPlugin(),
             pluginList.pasteOption && createPasteOptionPlugin(),
             pluginList.sampleEntity && new SampleEntityPlugin(),
             pluginList.contextMenu && createContextMenuPlugin(),
             pluginList.contextMenu && listMenu && createListEditMenuProvider(),
             pluginList.contextMenu && tableMenu && createTableEditMenuProvider(),
             pluginList.contextMenu && imageMenu && createImageEditMenuProvider(),
+            pluginList.hyperlink &&
+                new HyperlinkPlugin(
+                    linkTitle?.indexOf(UrlPlaceholder) >= 0
+                        ? url => linkTitle.replace(UrlPlaceholder, url)
+                        : linkTitle
+                ),
         ].filter(x => !!x);
     }
 }

demo/scripts/controlsV2/plugins/createLegacyPlugins.ts

@@ -1,31 +1,11 @@
+import { Announce, CustomReplace, ImageEdit } from 'roosterjs-editor-plugins';
 import { EditorPlugin as LegacyEditorPlugin, KnownAnnounceStrings } from 'roosterjs-editor-types';
-import {
-    Announce,
-    ContentEdit,
-    CustomReplace,
-    HyperLink,
-    ImageEdit,
-} from 'roosterjs-editor-plugins';
-import {
-    LegacyPluginList,
-    OptionState,
-    UrlPlaceholder,
-} from '../sidePane/editorOptions/OptionState';
+import { LegacyPluginList, OptionState } from '../sidePane/editorOptions/OptionState';
 
 export function createLegacyPlugins(initState: OptionState): LegacyEditorPlugin[] {
-    const { pluginList, linkTitle } = initState;
+    const { pluginList } = initState;
 
     const plugins: Record<keyof LegacyPluginList, LegacyEditorPlugin | null> = {
-        contentEdit: pluginList.contentEdit ? new ContentEdit(initState.contentEditFeatures) : null,
-        hyperlink: pluginList.hyperlink
-            ? new HyperLink(
-                  linkTitle?.indexOf(UrlPlaceholder) >= 0
-                      ? url => linkTitle.replace(UrlPlaceholder, url)
-                      : linkTitle
-                      ? () => linkTitle
-                      : null
-              )
-            : null,
         imageEdit: pluginList.imageEdit
             ? new ImageEdit({
                   preserveRatio: initState.forcePreserveRatio,

demo/scripts/controlsV2/sidePane/editorOptions/DefaultFormatPane.tsx

@@ -39,6 +39,7 @@ export class DefaultFormatPane extends React.Component<DefaultFormatProps, {}> {
                             [NOT_SET]: 'Not Set',
                             '8pt': '8',
                             '10pt': '10',
+                            '11pt': '11',
                             '12pt': '12',
                             '16pt': '16',
                             '20pt': '20',

demo/scripts/controlsV2/sidePane/editorOptions/EditorOptionsPlugin.ts

@@ -1,4 +1,3 @@
-import { getDefaultContentEditFeatureSettings } from './getDefaultContentEditFeatureSettings';
 import { OptionPaneProps, OptionState, UrlPlaceholder } from './OptionState';
 import { OptionsPane } from './OptionsPane';
 import { SidePaneElementProps } from '../SidePaneElement';
@@ -17,16 +16,18 @@ const initialState: OptionState = {
         pasteOption: true,
         sampleEntity: true,
         markdown: true,
+        hyperlink: true,
 
         // Legacy plugins
-        contentEdit: false,
-        hyperlink: false,
         imageEdit: false,
         customReplace: false,
         announce: false,
     },
-    contentEditFeatures: getDefaultContentEditFeatureSettings(),
-    defaultFormat: {},
+    defaultFormat: {
+        fontFamily: 'Calibri',
+        fontSize: '11pt',
+        textColor: '#000000',
+    },
     linkTitle: 'Ctrl+Click to follow the link:' + UrlPlaceholder,
     watermarkText: 'Type content here ...',
     forcePreserveRatio: false,
@@ -43,6 +44,13 @@ const initialState: OptionState = {
         autoLink: true,
         autoNumbering: true,
         autoUnlink: false,
+        autoHyphen: true,
+    },
+    markdownOptions: {
+        bold: true,
+        italic: true,
+        strikethrough: true,
+        codeFormat: {},
     },
 };
 

demo/scripts/controlsV2/sidePane/editorOptions/OptionState.ts

@@ -1,11 +1,8 @@
-import { AutoFormatOptions } from 'roosterjs-content-model-plugins';
-import type { ContentEditFeatureSettings } from 'roosterjs-editor-types';
+import { AutoFormatOptions, MarkdownOptions } from 'roosterjs-content-model-plugins';
 import type { SidePaneElementProps } from '../SidePaneElement';
 import type { ContentModelSegmentFormat } from 'roosterjs-content-model-types';
 
 export interface LegacyPluginList {
-    contentEdit: boolean;
-    hyperlink: boolean;
     imageEdit: boolean;
     customReplace: boolean;
     announce: boolean;
@@ -23,6 +20,7 @@ export interface NewPluginList {
     pasteOption: boolean;
     sampleEntity: boolean;
     markdown: boolean;
+    hyperlink: boolean;
 }
 
 export interface BuildInPluginList extends LegacyPluginList, NewPluginList {}
@@ -37,9 +35,9 @@ export interface OptionState {
     imageMenu: boolean;
     watermarkText: string;
     autoFormatOptions: AutoFormatOptions;
+    markdownOptions: MarkdownOptions;
 
     // Legacy plugin options
-    contentEditFeatures: ContentEditFeatureSettings;
     defaultFormat: ContentModelSegmentFormat;
     linkTitle: string;
     forcePreserveRatio: boolean;

demo/scripts/controlsV2/sidePane/editorOptions/OptionsPane.tsx

@@ -127,7 +127,6 @@ export class OptionsPane extends React.Component<OptionPaneProps, OptionState> {
             linkTitle: this.state.linkTitle,
             watermarkText: this.state.watermarkText,
             pluginList: { ...this.state.pluginList },
-            contentEditFeatures: { ...this.state.contentEditFeatures },
             defaultFormat: { ...this.state.defaultFormat },
             forcePreserveRatio: this.state.forcePreserveRatio,
             applyChangesOnMouseUp: this.state.applyChangesOnMouseUp,
@@ -139,6 +138,7 @@ export class OptionsPane extends React.Component<OptionPaneProps, OptionState> {
             tableMenu: this.state.tableMenu,
             imageMenu: this.state.imageMenu,
             autoFormatOptions: { ...this.state.autoFormatOptions },
+            markdownOptions: { ...this.state.markdownOptions },
         };
 
         if (callback) {