Rooster Version bump (#2977)

* Support undeletable anchor Step 1: Support hidden properties (#2970)

* Support undeletable anchor Step 1: Support hidden properties

* improve comments

* Support undeletable anchor Step 2: Add undeletable property to link (#2971)

* Support undeletable anchor Step 1: Support hidden properties

* Support undeletable anchor step 2

* improve comments

* Support undeletable anchor Step 3: Support anchor (#2972)

* Support undeletable anchor Step 1: Support hidden properties

* Support undeletable anchor step 2

* improve comments

* Support undeletable anchor Step 3

* Find previously marked paragraph (#2975)

* Support undeletable anchor Step 4: Prevent deleting undeletable anchor (#2973)

* Support undeletable anchor Step 1: Support hidden properties

* Support undeletable anchor step 2

* improve comments

* Support undeletable anchor Step 3

* Support undeletable anchor Step 4

* improve

* add test

* fix typo

* bump version

* fix version

---------

Co-authored-by: Jiuqing Song <jisong@microsoft.com>

Author: juliaroldi

demo/scripts/controlsV2/mainPane/MainPane.tsx

@@ -4,6 +4,7 @@ import SampleEntityPlugin from '../plugins/SampleEntityPlugin';
 import { ApiPlaygroundPlugin } from '../sidePane/apiPlayground/ApiPlaygroundPlugin';
 import { ContentModelPanePlugin } from '../sidePane/contentModel/ContentModelPanePlugin';
 import { darkModeButton } from '../demoButtons/darkModeButton';
+import { defaultDomToModelOption } from '../options/defaultDomToModelOption';
 import { Editor } from 'roosterjs-content-model-core';
 import { EditorOptionsPlugin } from '../sidePane/editorOptions/EditorOptionsPlugin';
 import { EventViewPlugin } from '../sidePane/eventViewer/EventViewPlugin';
@@ -27,6 +28,7 @@ import { SnapshotPlugin } from '../sidePane/snapshot/SnapshotPlugin';
 import { ThemeProvider } from '@fluentui/react/lib/Theme';
 import { TitleBar } from '../titleBar/TitleBar';
 import { trustedHTMLHandler } from '../../utils/trustedHTMLHandler';
+import { undeletableLinkChecker } from '../options/demoUndeletableAnchorParser';
 import { UpdateContentPlugin } from '../plugins/UpdateContentPlugin';
 import { WindowProvider } from '@fluentui/react/lib/WindowProvider';
 import { zoomButton } from '../demoButtons/zoomButton';
@@ -58,6 +60,7 @@ import {
     AutoFormatPlugin,
     CustomReplacePlugin,
     EditPlugin,
+    HiddenPropertyPlugin,
     HyperlinkPlugin,
     ImageEditPlugin,
     MarkdownPlugin,
@@ -376,6 +379,7 @@ export class MainPane extends React.Component<{}, MainPaneState> {
                             experimentalFeatures={Array.from(
                                 this.state.initState.experimentalFeatures
                             )}
+                            defaultDomToModelOptions={defaultDomToModelOption}
                         />
                     )}
                 </div>
@@ -527,6 +531,10 @@ export class MainPane extends React.Component<{}, MainPaneState> {
                         : linkTitle
                 ),
             pluginList.customReplace && new CustomReplacePlugin(customReplacements),
+            pluginList.hiddenProperty &&
+                new HiddenPropertyPlugin({
+                    undeletableLinkChecker: undeletableLinkChecker,
+                }),
         ].filter(x => !!x);
     }
 }

demo/scripts/controlsV2/options/defaultDomToModelOption.ts

@@ -0,0 +1,8 @@
+import { demoUndeletableAnchorParser } from './demoUndeletableAnchorParser';
+import { DomToModelOption } from 'roosterjs-content-model-types';
+
+export const defaultDomToModelOption: DomToModelOption = {
+    additionalFormatParsers: {
+        link: [demoUndeletableAnchorParser],
+    },
+};

demo/scripts/controlsV2/options/demoUndeletableAnchorParser.ts

@@ -0,0 +1,13 @@
+import { FormatParser, UndeletableFormat } from 'roosterjs-content-model-types';
+
+const DemoUndeletableName = 'DemoUndeletable';
+
+export function undeletableLinkChecker(a: HTMLAnchorElement): boolean {
+    return a.getAttribute('name') == DemoUndeletableName;
+}
+
+export const demoUndeletableAnchorParser: FormatParser<UndeletableFormat> = (format, element) => {
+    if (undeletableLinkChecker(element as HTMLAnchorElement)) {
+        format.undeletable = true;
+    }
+};

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

@@ -21,6 +21,7 @@ const initialState: OptionState = {
         imageEditPlugin: true,
         hyperlink: true,
         customReplace: true,
+        hiddenProperty: true,
     },
     defaultFormat: {
         fontFamily: 'Calibri',

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

@@ -22,6 +22,7 @@ export interface BuildInPluginList {
     hyperlink: boolean;
     imageEditPlugin: boolean;
     customReplace: boolean;
+    hiddenProperty: boolean;
 }
 
 export interface OptionState {

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

@@ -305,6 +305,7 @@ export class Plugins extends PluginsBase<keyof BuildInPluginList> {
                     )}
                     {this.renderPluginItem('customReplace', 'Custom Replace')}
                     {this.renderPluginItem('imageEditPlugin', 'ImageEditPlugin')}
+                    {this.renderPluginItem('hiddenProperty', 'Hidden Property')}
                 </tbody>
             </table>
         );

packages/roosterjs-content-model-core/lib/coreApi/createEditorContext/createEditorContext.ts

@@ -20,6 +20,7 @@ export const createEditorContext: CreateEditorContext = (core, saveIndex) => {
         domIndexer: saveIndex ? cache.domIndexer : undefined,
         zoomScale: domHelper.calculateZoomScale(),
         experimentalFeatures: core.experimentalFeatures ?? [],
+        paragraphMap: core.cache.paragraphMap,
         ...getRootComputedStyleForContext(logicalRoot.ownerDocument),
     };
 

packages/roosterjs-content-model-core/lib/coreApi/formatContentModel/formatContentModel.ts

@@ -33,6 +33,7 @@ export const formatContentModel: FormatContentModel = (
         deletedEntities: [],
         rawEvent,
         newImages: [],
+        paragraphIndexer: core.cache.paragraphMap,
     };
 
     const hasFocus = core.domHelper.hasFocus();

packages/roosterjs-content-model-core/lib/corePlugin/cache/CachePlugin.ts

@@ -1,4 +1,5 @@
 import { areSameSelections } from './areSameSelections';
+import { createParagraphMap } from './ParagraphMapImpl';
 import { createTextMutationObserver } from './textMutationObserver';
 import { DomIndexerImpl } from './domIndexerImpl';
 import { updateCache } from './updateCache';
@@ -32,6 +33,7 @@ class CachePlugin implements PluginWithState<CachePluginState> {
                           option.experimentalFeatures.indexOf('PersistCache') >= 0
                   ),
                   textMutationObserver: createTextMutationObserver(contentDiv, this.onMutation),
+                  paragraphMap: createParagraphMap(),
               };
     }
 
@@ -172,6 +174,10 @@ class CachePlugin implements PluginWithState<CachePluginState> {
         if (!this.editor?.isInShadowEdit()) {
             this.state.cachedModel = undefined;
             this.state.cachedSelection = undefined;
+
+            // Clear paragraph indexer to prevent stale references to old paragraphs
+            // It will be rebuild next time when we create a new Content Model
+            this.state.paragraphMap?.clear();
         }
     }
 

packages/roosterjs-content-model-core/lib/corePlugin/cache/ParagraphMapImpl.ts

@@ -0,0 +1,101 @@
+import { getParagraphMarker, setParagraphMarker } from 'roosterjs-content-model-dom';
+import type {
+    ContentModelParagraph,
+    ContentModelParagraphCommon,
+    ParagraphIndexer,
+    ParagraphMap,
+    ReadonlyContentModelParagraph,
+} from 'roosterjs-content-model-types';
+
+interface ParagraphWithMarker extends ContentModelParagraphCommon {
+    _marker?: string;
+}
+
+/**
+ * @internal, used by test code only
+ */
+export interface ParagraphMapReset {
+    _reset(): void;
+    _getMap(): { [key: string]: ReadonlyContentModelParagraph };
+}
+
+const idPrefix = 'paragraph';
+
+class ParagraphMapImpl implements ParagraphMap, ParagraphIndexer, ParagraphMapReset {
+    private static prefixNum = 0;
+    private nextId = 0;
+    private paragraphMap: { [key: string]: ReadonlyContentModelParagraph } = {};
+
+    constructor() {
+        ParagraphMapImpl.prefixNum++;
+    }
+
+    assignMarkerToModel(element: HTMLElement, paragraph: ContentModelParagraph): void {
+        const marker = getParagraphMarker(element);
+        const paragraphWithMarker = paragraph as ParagraphWithMarker;
+
+        if (marker) {
+            paragraphWithMarker._marker = marker;
+
+            this.paragraphMap[marker] = paragraph;
+        } else {
+            paragraphWithMarker._marker = this.generateId();
+
+            this.applyMarkerToDom(element, paragraph);
+        }
+    }
+
+    applyMarkerToDom(element: HTMLElement, paragraph: ContentModelParagraph): void {
+        const paragraphWithMarker = paragraph as ParagraphWithMarker;
+
+        if (!paragraphWithMarker._marker) {
+            paragraphWithMarker._marker = this.generateId();
+        }
+
+        const marker = paragraphWithMarker._marker;
+
+        if (marker) {
+            setParagraphMarker(element, marker);
+
+            this.paragraphMap[marker] = paragraph;
+        }
+    }
+
+    /**
+     * Get paragraph using a previously marked paragraph
+     * @param markedParagraph The previously marked paragraph to get
+     */
+    getParagraphFromMarker(
+        markerParagraph: ReadonlyContentModelParagraph
+    ): ReadonlyContentModelParagraph | null {
+        const marker = (markerParagraph as ParagraphWithMarker)._marker;
+
+        return marker ? this.paragraphMap[marker] || null : null;
+    }
+
+    clear() {
+        this.paragraphMap = {};
+    }
+
+    //#region For test code only
+    _reset() {
+        ParagraphMapImpl.prefixNum = 0;
+        this.nextId = 0;
+    }
+
+    _getMap() {
+        return this.paragraphMap;
+    }
+    //#endregion
+
+    private generateId() {
+        return `${idPrefix}_${ParagraphMapImpl.prefixNum}_${this.nextId++}`;
+    }
+}
+
+/**
+ * @internal
+ */
+export function createParagraphMap(): ParagraphMap & ParagraphIndexer {
+    return new ParagraphMapImpl();
+}