Bump Content model packages to 9.1.0, (#2573)

* code suport * markdown * adjust * demo site * WIP * fix code pen * fix demo site * Handle Tab key on whole table selection or last cell on Edit Plugin (#2536) * Implement indent whole table * implement tab on last cell new row * add Table selection and single cell handling * export clearSelectedCells * undefined check, simplify * add tests * add test for list in table edge case * Fix seelection on void element (#2551) * port hyphen * Implement movement with Tab key inside Table (#2529) * implement tab movement, tests * remove unused variable * fix name, normalisation, add test * fix wrong parethesis * restore normalizePos * fix tests * add formatTextSegmentBeforeSelectionMarker * Improve backspace on list (#2555) * fix selection with ctrl+a * refactor code using formatTextSegmentBeforeSelectionMarkerTest * remove getLinkSegment * Set default format in demo site (#2559) * clean demo site * clean * Enable selecting image when the only element in the range is an Image (#2554) * init * Address comment * Reuse isReverted from Range Selection * Fix build * Fix build * Unselect image when Up or Down, or it remains selected * remove unneeded changes and improve name of tests * Update --------- Co-authored-by: Julia Roldi <[email protected]> * fix markdown plugin * Port Hyperlink plugin (#2560) * Port Hyperlink plugin * improve --------- Co-authored-by: Bryan Valverde U <[email protected]> * export formatTextSegmentBeforeSelectionMarker * fix build * Prevent ScrollTop to be lost when the focus is done to the editor (#2564) * init * init --------- Co-authored-by: Julia Roldi <[email protected]> * Fix 265959: extra empty line generated when get plain text (#2566) Co-authored-by: Bryan Valverde U <[email protected]> * Fix #2500 Hyperlink misses color (#2570) * Fix #2500 * fix test * Update version.json * mac shortcuts * fix test --------- Co-authored-by: Júlia Roldi <[email protected]> Co-authored-by: Julia Roldi <[email protected]> Co-authored-by: Andres-CT98 <[email protected]> Co-authored-by: Jiuqing Song <[email protected]>
microsoft · Apr 12, 2024 · fb71360 · fb71360
1 parent 0cb9430
commit fb71360
Show file tree

Hide file tree

Showing 67 changed files with 5,721 additions and 1,628 deletions.
diff --git a/demo/scripts/controlsV2/demoButtons/exportContentButton.ts b/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: {

diff --git a/demo/scripts/controlsV2/mainPane/MainPane.tsx b/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);
     }
 }

diff --git a/demo/scripts/controlsV2/plugins/createLegacyPlugins.ts b/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,

diff --git a/demo/scripts/controlsV2/sidePane/editorOptions/ContentEditFeatures.tsx b/demo/scripts/controlsV2/sidePane/editorOptions/ContentEditFeatures.tsx
diff --git a/demo/scripts/controlsV2/sidePane/editorOptions/DefaultFormatPane.tsx b/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',

diff --git a/demo/scripts/controlsV2/sidePane/editorOptions/EditorOptionsPlugin.ts b/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: {},
     },
 };
 

diff --git a/demo/scripts/controlsV2/sidePane/editorOptions/OptionState.ts b/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;

diff --git a/demo/scripts/controlsV2/sidePane/editorOptions/OptionsPane.tsx b/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) {