communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
56 lines • 2.59 kB
JavaScript
/* @conditional-compile-remove(rich-text-editor-image-upload) */
import { PluginEventType, scrollToBottomRichTextEditor, getInsertedInlineImages } from '../../utils/RichTextEditorUtils';
/* @conditional-compile-remove(rich-text-editor-image-upload) */
import { getInlineImageAttributes } from '../../utils/RichTextEditorUtils';
/* @conditional-compile-remove(rich-text-editor-image-upload) */
import { ChangeSource } from 'roosterjs-content-model-dom';
/**
* UndoRedoPlugin is a plugin for additional handling undo and redo events in the editor.
*/
export default class UndoRedoPlugin {
constructor() {
/* @conditional-compile-remove(rich-text-editor-image-upload) */
this.editor = null;
this.onUpdateContent = null;
}
getName() {
return 'CustomUndoRedoPlugin';
}
initialize(editor) {
/* @conditional-compile-remove(rich-text-editor-image-upload) */
this.editor = editor;
}
dispose() { }
onPluginEvent(event) {
// handle when new images are added to the editor because of undo/redo
/* @conditional-compile-remove(rich-text-editor-image-upload) */
if (this.editor && event.eventType === PluginEventType.BeforeSetContent && this.onInsertInlineImage) {
handleBeforeSetEvent(event, this.editor, this.onInsertInlineImage);
}
// handle deleted images and updated content
/* @conditional-compile-remove(rich-text-editor-image-upload) */
if (this.onUpdateContent &&
event.eventType === PluginEventType.ContentChanged &&
event.source === ChangeSource.SetContent) {
this.onUpdateContent();
}
/* @conditional-compile-remove(rich-text-editor-image-upload) */
if (this.editor &&
!this.editor.isDisposed() &&
event.eventType === PluginEventType.ContentChanged &&
event.source === ChangeSource.SetContent) {
// scroll the editor to the correct position after undo/redo actions
scrollToBottomRichTextEditor();
}
}
}
/* @conditional-compile-remove(rich-text-editor-image-upload) */
const handleBeforeSetEvent = (event, editor, onInsertInlineImage) => {
const currentImagesList = editor.getDocument().querySelectorAll('img');
const insertedImages = getInsertedInlineImages(event.newContent, currentImagesList);
insertedImages.forEach((image) => {
const imageAttributes = getInlineImageAttributes(image);
onInsertInlineImage(imageAttributes);
});
};
//# sourceMappingURL=UndoRedoPlugin.js.map