@hailin-zheng/editor-core 1.0.1 → 1.0.3

package/lib/texteditor.js

@@ -0,0 +1,913 @@
+import { RenderContenxt } from './framework/render-context';
+import { ContextMenuElementEvent, EventMap } from './framework/element-event-define';
+import { DocumentPaint } from './framework/document-paint';
+import { ElementReader } from './framework/element-reader';
+import { DocumentEvent } from './framework/document-event';
+import { Subject } from 'rxjs';
+import { DocumentInput } from './framework/document-input-cursor';
+import { DocumentCursor, DocumentSelection } from './framework/document-selection';
+import { ElementUtil } from './framework/element-util';
+import { DocumentChange } from './framework/document-change';
+import { SelectionOverlays } from './framework/selection-overlays';
+import { BranchElement, DocMode, PageOptions, ViewOptions } from './framework/element-define';
+import { ElementSerialize } from './framework/element-serialize';
+import { TableElement } from './framework/impl/table/table-impl';
+import { documentPrint } from './framework/document-print';
+import { DocumentTemplate } from './framework/document-template';
+import { IsInSideDataElement, validateDataEle } from './framework/impl/data-element/data-element-base-impl';
+import { DocRule } from './doc-ruler';
+import { TextGroupElement } from './framework/impl/text/text-impl';
+import { ParagraphElement } from './framework/impl/paragraph/p-impl';
+import { TableUtil } from './framework/impl/table/table-util';
+import { EditorContext } from './framework/document-context';
+import { DocumentRenderObject } from './framework/impl/document/doc-impl';
+import { DocumentComment } from './framework/document-comment';
+import { CommContentBaseElement } from './framework/impl/comments/comment-content-impl';
+import { DocumentHistory } from './framework/document-history';
+import { TableRowElement } from './framework/impl/table/table-row-impl';
+import { getFocusTextSegment } from "@/med_editor/framework/document-segmenter";
+import { saveAs } from 'file-saver';
+import { DocumentBodyElement } from "@/med_editor/framework/impl/document/doc-body-impl";
+export class CanvasTextEditor {
+    docScroll;
+    holdSpace;
+    ruleCanvas;
+    editCanvasContainer;
+    editCanvas;
+    editInput;
+    editCursor;
+    cursorWrapper;
+    scaleContainer;
+    contentCtx;
+    viewOptions;
+    docCtx;
+    docComment;
+    renderContext;
+    documentPaint;
+    elementReader;
+    documentEvent;
+    documentSelection;
+    documentInput;
+    documentChange;
+    selectionOverlays;
+    docRule;
+    docHistory;
+    eventMap = new EventMap();
+    selectionChanged = new Subject();
+    beforeRenderSubject = new Subject();
+    afterRenderSubject = new Subject();
+    selectionState;
+    //显示右键菜单
+    onContextMenuItemChanged = new Subject();
+    //显示数据元编辑框
+    onShowDataElementEditPanelEvent = new Subject();
+    onDblClickEvent = new Subject();
+    onClickEvent = new Subject();
+    onScrollViewEvent = new Subject();
+    //文档改变事件:内容及样式，业务模块需要根据此事件，来追踪当前文档是否改变的状态
+    onDocChangedEvent = new Subject();
+    constructor(docScroll, holdSpace, ruleCanvas, editCanvasContainer, editCanvas, editInput, editCursor, cursorWrapper, scaleContainer) {
+        this.docScroll = docScroll;
+        this.holdSpace = holdSpace;
+        this.ruleCanvas = ruleCanvas;
+        this.editCanvasContainer = editCanvasContainer;
+        this.editCanvas = editCanvas;
+        this.editInput = editInput;
+        this.editCursor = editCursor;
+        this.cursorWrapper = cursorWrapper;
+        this.scaleContainer = scaleContainer;
+        this.viewOptions = new ViewOptions();
+        this.documentSelection = new DocumentSelection();
+        this.docCtx = new EditorContext(this.documentSelection.selectionState, this.viewOptions);
+        this.viewOptions.copyRightInfo = '万达信息电子病历编辑器,www.wondersgroup.com';
+        this.viewOptions.drawCharRectColor = 'green';
+        this.viewOptions.showLineRect = true;
+        this.viewOptions.docSpace = 20;
+        this.viewOptions.reviewWindowWidth = 200;
+        this.viewOptions.defaultFontName = '宋体';
+        //整个画布的尺寸
+        this.viewOptions.viewSettings = {
+            width: 1000,
+            height: this.getContainerHeight().height
+        };
+        this.viewOptions.editUser = {
+            id: '6666',
+            name: '管理员'
+        };
+        this.viewOptions.fullPageView = false;
+        this.viewOptions.enableUndo = true;
+        this.createDocViewer();
+        this.docComment = new DocumentComment(this.docCtx);
+        this.contentCtx = editCanvas.getContext('2d');
+        this.renderContext = new RenderContenxt(this.contentCtx, this.viewOptions, this.docCtx);
+        this.setCanvasProps();
+        this.selectionState = this.documentSelection.selectionState;
+        this.selectionOverlays = new SelectionOverlays(this.documentSelection.selectionState);
+        this.documentPaint = new DocumentPaint(this.viewOptions, this.renderContext, this.docCtx, this.selectionOverlays.selectedSets);
+        this.elementReader = new ElementReader(this.docCtx, this.viewOptions, this.renderContext);
+        this.documentEvent = new DocumentEvent(editCanvas, this.documentPaint, this.viewOptions, this.documentSelection.selectionState, this.docCtx);
+        this.docRule = new DocRule(this.ruleCanvas, this.viewOptions, this.documentSelection.selectionState);
+        this.documentChange = new DocumentChange(this.documentSelection.selectionState, this.viewOptions, this.elementReader, this.docCtx, this.docComment);
+        this.docHistory = new DocumentHistory(this.docCtx, this.elementReader, this.onDocChangedEvent);
+        this.documentInput = new DocumentInput(editInput, editCursor, cursorWrapper, this.docCtx);
+        this.documentEvent.hitInfoChanged.subscribe((hitInfo) => {
+            this.hitInfoChanged(hitInfo);
+        });
+        this.documentEvent.clickEvent.subscribe((evt) => {
+            this.docClickHandle(evt);
+        });
+        this.documentEvent.dblClickEvent.subscribe((evt) => {
+            this.docDblClickHandle(evt);
+        });
+        this.documentEvent.changeCursor.subscribe((cursor) => {
+            this.changeCursor(cursor);
+        });
+        this.documentEvent.contextMenu.subscribe(evt => {
+            this.onContextMenu(evt);
+        });
+        this.documentEvent.trackTipsChanged.subscribe(data => {
+        });
+        this.documentInput.onInputEvent.subscribe(data => {
+            this.documentChange.newInput(data);
+        });
+        this.documentInput.onBackspaceEvent.subscribe((evt) => {
+            this.documentChange.onBackspace(evt);
+        });
+        this.documentInput.onEnterEvent.subscribe(() => {
+            this.documentChange.onEnter();
+        });
+        this.documentInput.onCopyEvent.subscribe((evt) => {
+            this.documentChange.onCopy(evt);
+        });
+        this.documentInput.onCutEvent.subscribe((evt) => {
+            this.documentChange.onCut(evt);
+        });
+        this.documentInput.onPasteEvent.subscribe((evt) => {
+            this.documentChange.onPaste(evt);
+        });
+        this.documentInput.onInsertBr.subscribe(() => {
+            this.documentChange.insertSoftBr();
+        });
+        this.documentInput.onLeftEvent.subscribe(() => {
+            this.documentEvent.moveCursorToLeft();
+        });
+        this.documentInput.onRightEvent.subscribe(() => {
+            this.documentEvent.moveCursorToRight();
+        });
+        this.documentInput.onDeleteEvent.subscribe((evt) => this.documentChange.onDeleteKeyHandler(evt));
+        this.documentInput.onSelectAllEvent.subscribe(() => {
+            this.documentEvent.selectAll();
+        });
+        this.documentInput.onHomeEvent.subscribe(() => {
+            this.documentEvent.moveCursorToLineStart();
+        });
+        this.documentInput.onEndEvent.subscribe(() => {
+            this.documentEvent.moveCursorToLineEnd();
+        });
+        this.documentInput.onUpEvent.subscribe(() => {
+            this.documentEvent.moveCursorToUpOrDown(true);
+        });
+        this.documentInput.onDownEvent.subscribe(() => {
+            this.documentEvent.moveCursorToUpOrDown(false);
+        });
+        this.docCtx.docChange = this.documentChange;
+        this.listenContainerHeight();
+        this.refreshDocRule();
+        this.docCtx.syncRefresh = () => {
+            this.flushToSchedule();
+        };
+        this.viewOptions.onChange.subscribe((type) => {
+            this.resetViewer(type);
+        });
+    }
+    /**
+     * 设置标尺
+     */
+    refreshDocRule() {
+        let docLeft = 0; //CommonUtil.getOffsetX(this.editCanvas.parentElement as HTMLDivElement);
+        let pagePL = 0, pagePR = 0;
+        if (this.documentPaint.docContainer) {
+            docLeft += this.documentPaint.docContainer.rect.x;
+        }
+        if (this.docCtx.document?.props?.padding) {
+            const { left, right } = this.docCtx.document.props.padding;
+            pagePL = left;
+            pagePR = right;
+        }
+        this.docRule.setRuleOptions({ width: this.viewOptions.docPageSettings.width, pagePL, pagePR, docLeft });
+        this.docRule.refreshRule();
+    }
+    createDocViewer() {
+        this.viewOptions.mmToPixelsRatio = this.measureMMToPixs();
+        const width = Math.floor(210 * this.viewOptions.mmToPixelsRatio);
+        const height = Math.floor(297 * this.viewOptions.mmToPixelsRatio);
+        this.viewOptions.docPageSettings = new PageOptions(width, height);
+        this.docScroll.onscroll = (evt) => {
+            this.scrollView(evt);
+        };
+    }
+    measureMMToPixs() {
+        const div = document.createElement('div');
+        div.style.width = '100mm';
+        document.body.appendChild(div);
+        const width = div.getBoundingClientRect().width;
+        document.body.removeChild(div);
+        return width / 100;
+    }
+    flushTask;
+    flushTaskThen = [];
+    //是否用于跟踪修改状态，在初始化、数据元赋值等情况不需要跟踪修改标志
+    trackChangeState = true;
+    flushToSchedule() {
+        if (this.docCtx.refreshType === 'content') {
+            //触发动态脚本
+            this.docCtx.dynamicFunc.invokedScripts();
+            this.triggerDocChange();
+        }
+        if (this.flushTask) {
+            return;
+        }
+        this.flushTask = () => {
+            this.refreshDocument();
+            this.flushTaskThen.forEach(item => item());
+            this.flushTaskThen.length = 0;
+            this.flushTask = null;
+        };
+        Promise.resolve().then(() => {
+            if (this.flushTask) {
+                this.flushTask();
+            }
+        });
+    }
+    /**
+     * 触发文档改变事件
+     * @returns
+     */
+    triggerDocChange() {
+        if (!this.trackChangeState) {
+            return;
+        }
+        this.onDocChangedEvent.next();
+    }
+    /**
+     * fn函数执行时，不触发onDocChange
+     * @param fn
+     */
+    noEffectChange(fn) {
+        const prev = this.trackChangeState;
+        this.trackChangeState = false;
+        try {
+            fn();
+        }
+        catch (e) {
+            console.error(e);
+        }
+        this.trackChangeState = prev;
+    }
+    loadDoc(data) {
+        this.elementReader.read(data);
+        this.refreshDocument();
+        this.refreshDocRule();
+        this.docHistory.clear();
+    }
+    /**
+     * 更新文档容器高度尺寸
+     */
+    updateDocumentContainerSize() {
+        this.holdSpace.style.height = this.documentPaint.getDocumentContainerHeight() + 'px';
+    }
+    scrollView(evt) {
+        const target = evt.target;
+        const top = Math.floor(target.scrollTop);
+        this.editCanvasContainer.style.top = top + 'px';
+        this.cursorWrapper.style.transform = "translate(0,-" + top + "px)";
+        this.viewOptions.translateY = top;
+        this.documentPaint.refreshView();
+        this.documentEvent.onScrollView();
+        this.onScrollViewEvent.next(top);
+    }
+    refreshDocument() {
+        let rePaint = this.docCtx.refreshType === 'content';
+        if (rePaint) {
+            this.documentSelection.clearSnapshot();
+            this.docComment.readComments();
+            this.documentPaint.rePages();
+            this.beforeRenderSubject.next();
+        }
+        const ssChanged = this.documentSelection.updateSelectionState();
+        this.selectionOverlays.getSelectionTreeData();
+        this.documentPaint.refreshView(rePaint);
+        this.updateDocumentContainerSize();
+        this.setCursor();
+        ssChanged && this.selectionChanged.next(this.documentSelection.selectionState);
+        this.docRule.refreshRule();
+    }
+    hitInfoChanged(hitInfo) {
+        this.documentSelection.setSelectionState(hitInfo);
+        this.refreshDocument();
+        this.selectionChanged.next(this.documentSelection.selectionState);
+    }
+    /**
+     * 设置光标
+     */
+    setCursor() {
+        const { startControl, startOffset } = this.selectionState;
+        if (!this.canSetCursor()) {
+            this.selectionState.editable = false;
+            this.documentInput.setCursorVisibility(false);
+            return;
+        }
+        if (this.selectionState.afterSelectionChanged) {
+            //需要重新刷新，不触发GotCusor事件
+            if (this.selectionState.afterSelectionChanged(this.selectionState)) {
+                this.selectionState.afterSelectionChanged = null;
+                return;
+            }
+        }
+        const { startRegion, hitDocIndex } = this.documentEvent.startHitInfo;
+        const cursorPos = DocumentCursor.getElementCursorPos(startControl, startOffset, startRegion, hitDocIndex);
+        this.docCtx.cursorRect = ElementUtil.cloneRect(cursorPos.rect);
+        this.documentInput.setCursorPosition(cursorPos.rect);
+        this.selectionState.cursorPos = cursorPos.rect;
+        this.documentEvent.invokeCursor(startControl);
+    }
+    /**
+     * 判断是否光标可以设置接受编辑
+     * @returns
+     */
+    canSetCursor() {
+        const { startControl, startOffset, editable } = this.selectionState;
+        if (!startControl || !editable) {
+            return false;
+        }
+        if (this.viewOptions.docMode === DocMode.Design) {
+            return true;
+        }
+        //浏览模式
+        if (this.viewOptions.docMode === DocMode.View) {
+            return false;
+        }
+        //表单模式下，如果不在数据元素中，则不显示光标
+        if (this.viewOptions.docMode === DocMode.FormEdit) {
+            if (!IsInSideDataElement(startControl, startOffset)) {
+                return false;
+            }
+        }
+        if (!ElementUtil.verifyHitable(startControl)) {
+            return false;
+        }
+        //表单模式下，数据元不可编辑
+        if (this.viewOptions.docMode === DocMode.FormEdit && IsInSideDataElement(startControl, startOffset)) {
+            const dataEle = ElementUtil.getDataElement(startControl);
+            if (!dataEle.props.editable) {
+                return false;
+            }
+        }
+        return true;
+    }
+    /**
+     * 修改光标
+     * @param newCursor
+     */
+    changeCursor(newCursor) {
+        this.editCanvas.style.cursor = newCursor;
+        this.viewOptions.cursor = newCursor;
+    }
+    /**
+     * 文档点击事件
+     */
+    docClickHandle(evt) {
+        this.setCursor();
+        this.selectionOverlays.getSelectionTreeData();
+        this.onClickEvent.next(evt);
+    }
+    /**
+     * 文档双击事件
+     * 处理全选当前段落
+     */
+    docDblClickHandle(evt) {
+        const res = getFocusTextSegment(this.selectionState);
+        if (res) {
+            this.refreshDocument();
+        }
+        this.onDblClickEvent.next(evt);
+    }
+    /**
+     * 获取当前光标所在的数据元
+     * @returns
+     */
+    getCurrentDataElement() {
+        const selectionState = this.documentSelection.selectionState;
+        const { startControl } = selectionState;
+        if (startControl) {
+            if (!ElementUtil.verifyHitable(startControl)) {
+                return null;
+            }
+            return ElementUtil.getParent(startControl, validateDataEle);
+        }
+        return null;
+    }
+    /**
+     * 设置当前光标所在的数据元的值
+     * @param val
+     */
+    setCurrentDataElementValue(val) {
+        const dataEle = this.getCurrentDataElement();
+        if (dataEle) {
+            dataEle?.setValue(val);
+            this.selectionState.clear();
+        }
+    }
+    /**
+     * 获取数据元位置
+     * @param element
+     * @returns
+     */
+    getDataElementPosition(element) {
+        const startDecorateRender = this.documentPaint.elementPaint.getLeafElementPaintMap(element);
+        if (!startDecorateRender) {
+            console.error('未找到数据元开始渲染元素');
+            return;
+        }
+        const { x, height, y, width } = startDecorateRender.rect;
+        const pos = ElementUtil.getRenderAbsolutePaintPos(startDecorateRender);
+        const position = { x: pos.x + width, y: pos.y + height + 5, translateY: this.viewOptions.translateY };
+        return position;
+    }
+    /**
+     * 获取文档模型
+     * @returns
+     */
+    getDocSchema() {
+        return ElementSerialize.serialize(this.docCtx.document, this.viewOptions);
+    }
+    getDocSchemaJSON() {
+        const res = JSON.stringify(this.getDocSchema());
+        return res;
+    }
+    /**
+     * 右键菜单
+     * @param evt
+     */
+    onContextMenu(evt) {
+        evt.preventDefault();
+        const { selectionState } = this.documentSelection;
+        const { startControl } = selectionState;
+        if (!startControl) {
+            return;
+        }
+        const elementEvent = new ContextMenuElementEvent(this.docCtx);
+        elementEvent.source = startControl;
+        DocumentEvent.invokeEvent('ElementContextMenu', startControl, elementEvent, 'All', this.docCtx);
+        const position = { x: evt.offsetX + 10, y: evt.offsetY, translateY: this.viewOptions.translateY };
+        this.onContextMenuItemChanged.next({ pos: position, menus: elementEvent.menus });
+    }
+    resizeObserver = null;
+    listenContainerHeight() {
+        this.resizeObserver = new ResizeObserver(entries => {
+            this.updateDocHeight();
+        });
+        this.resizeObserver.observe(this.docScroll);
+        this.updateDocHeight();
+    }
+    updateDocHeight() {
+        const { width, height } = this.getContainerHeight();
+        this.viewOptions.viewSettings.width = width;
+        this.viewOptions.viewSettings.height = height;
+        if (width < this.viewOptions.ContentWidth) {
+            this.viewOptions.viewSettings.width = this.viewOptions.ContentWidth;
+        }
+        this.resetViewer();
+    }
+    resetViewer(type = undefined) {
+        const refreshType = type === 'force' ? 'content' : 'appearance';
+        if (refreshType === 'content') {
+            this.docCtx.document.pubOnChange('self');
+        }
+        this.setCanvasProps();
+        this.flushToSchedule();
+        this.flushTaskThen.push(() => {
+            this.refreshDocRule();
+        });
+    }
+    /**
+     * 缩放视图
+     * @param scale
+     * @returns
+     */
+    scaleView(scale) {
+        scale = scale < 0.5 ? 0.5 : scale;
+        scale = scale > 2 ? 2 : scale;
+        this.viewOptions.scale = scale;
+        this.scaleContainer.style.transform = `scale(${scale})`;
+        this.scaleContainer.style.transformOrigin = "center top";
+        if (scale === 1) {
+            this.scaleContainer.style.transform = '';
+            this.scaleContainer.style.transformOrigin = '';
+        }
+        this.setCanvasProps();
+        this.refreshDocRule();
+        this.flushToSchedule();
+        return scale;
+    }
+    getContainerHeight() {
+        let { height, width } = this.docScroll.getBoundingClientRect();
+        // const div=this.docScroll.children[0] as HTMLElement;
+        // const { height, width } = div.getBoundingClientRect();
+        return { height: Math.floor(height), width: Math.floor(width) };
+    }
+    setCanvasProps() {
+        this.renderContext?.clear();
+        this.renderContext.setCanvasProps();
+        this.renderContext?.clear();
+    }
+    /**
+     * 在当前位置插入表格
+     * @param row
+     * @param col
+     */
+    insertTable(rows, cols) {
+        const tb = TableElement.createTable(rows, cols);
+        this.documentChange.insertTable(tb);
+    }
+    /**
+     * 打印所有文档
+     */
+    printAllPages() {
+        documentPrint.print(this.documentSelection.selectionState, this.viewOptions, this.docCtx);
+    }
+    /**
+     * 导出所有页到base64
+     */
+    exportAllPagesToBase64(fileName) {
+        const imgs = documentPrint.exportCanvasNodes(this.documentSelection.selectionState, this.viewOptions, this.docCtx);
+        imgs.forEach((item, i) => item.toBlob(blog => {
+            if (blog) {
+                saveAs(blog, fileName + i + '.png');
+            }
+        }));
+    }
+    exportPDF() {
+        documentPrint.exportPDF('', this.documentSelection.selectionState, this.viewOptions, this.docCtx);
+    }
+    /**
+     * 清除文档
+     */
+    clearDoc() {
+        if (this.docCtx.document) {
+            this.docCtx.document.destroy();
+            this.documentSelection.selectionState.clear();
+            this.documentEvent.clearHitInfo();
+        }
+        this.docCtx.clear();
+    }
+    /**
+     * 新建文档
+     * @param options
+     */
+    createNewDoc(doc = null) {
+        //this.docCtx.clear();
+        const newDoc = doc ?? DocumentTemplate.createA4Doc();
+        // this.elementReader.setDocument(newDoc);
+        // this.refreshDocument('content');
+        this.loadDoc(ElementSerialize.serialize(newDoc, this.viewOptions));
+    }
+    destroy() {
+        this.docCtx.destroy();
+        this.documentEvent.clearSubEvent();
+        this.documentInput.destroy();
+        this.flushTask = null;
+    }
+    /**
+     * 获取选区文本属性
+     * @returns
+     */
+    getSelectionTextGroupProps() {
+        const selectionState = this.selectionState;
+        const range = selectionState.selectedRange;
+        if (!range) {
+            if (selectionState.collapsed) {
+                if (selectionState.startControl instanceof TextGroupElement) {
+                    return selectionState.startControl.props;
+                }
+            }
+            return null;
+        }
+        const startRange = ElementUtil.getFirstSelectedRange(range);
+        const endRange = ElementUtil.getLastSelectedRange(range);
+        if (startRange.target instanceof TextGroupElement) {
+            return startRange.target.props;
+        }
+        return null;
+    }
+    getSelectionParaProps() {
+        const selectionState = this.selectionState;
+        if (!selectionState || !selectionState.startControl) {
+            return null;
+        }
+        const para = ElementUtil.getParentByType(selectionState.startControl, ParagraphElement);
+        return para.props;
+    }
+    /**
+     * 设置文本字体大小
+     * @param fontSize
+     * @returns
+     */
+    setTextFontSize(fontSize) {
+        if (isNaN(fontSize)) {
+            return;
+        }
+        const setterFunc = (textProps) => {
+            textProps.fontSize = fontSize;
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 设置文本颜色
+     * @param color \
+     */
+    setTextColor(color) {
+        color = color || "rgb(0,0,0)";
+        const setterFunc = (textProps) => {
+            textProps.color = color;
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 设置文本字体名称
+     * @param font
+     */
+    setTextFont(font) {
+        font = font || "宋体";
+        const setterFunc = (textProps) => {
+            textProps.fontName = font;
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 应用选中文本格式,用于批量设置格式,例如：格式刷
+     * @param newStyle
+     */
+    applyStyle(newStyle) {
+        const setterFunc = (textProps) => {
+            textProps.setPropsValue(newStyle, textProps);
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 开启格式刷
+     */
+    enableFormatBrush() {
+        const startControl = this.selectionState.startControl;
+        if (startControl instanceof TextGroupElement) {
+            const selectedStyle = startControl.props.clone(null);
+            const selectionOverlayColor = this.viewOptions.selectionOverlaysColor;
+            this.viewOptions.selectionOverlaysColor = "rgba(0,58,140,0.8)";
+            const cancelToken = {};
+            const sub = this.onClickEvent.subscribe(() => {
+                sub.unsubscribe();
+                this.applyStyle(selectedStyle);
+                this.viewOptions.selectionOverlaysColor = selectionOverlayColor;
+                if (cancelToken.onFinish) {
+                    cancelToken.onFinish();
+                }
+            });
+            cancelToken.cancel = () => {
+                sub.unsubscribe();
+                this.viewOptions.selectionOverlaysColor = selectionOverlayColor;
+            };
+            return cancelToken;
+        }
+        return null;
+    }
+    /**
+     * 设置文本背景颜色
+     * @param color
+     */
+    setTextBackColor(color) {
+        const setterFunc = (textProps) => {
+            textProps.background = color;
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 切换文本加粗、下划线、删除等文本样式
+     * @param isEffective
+     * @param style
+     * @param matchValue
+     */
+    switchTextStyle(isEffective, style, matchValue, defaultValue = undefined) {
+        const setterFunc = (textProps) => {
+            if (isEffective) {
+                textProps[style] = defaultValue;
+                //delete textProps[style];
+            }
+            else {
+                textProps[style] = matchValue;
+            }
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 修改字间距
+     */
+    setLetterSpace(letterSpace) {
+        letterSpace = letterSpace <= 0 ? 0 : letterSpace;
+        const setterFunc = (textProps) => {
+            textProps.letterSpace = letterSpace;
+        };
+        DocumentChange.setTextStyle(this.selectionState, setterFunc);
+    }
+    /**
+     * 设置段落对齐
+     * @param align
+     */
+    switchParaAlign(align) {
+        const setterFunc = (paraProps) => {
+            paraProps.textAlign = align;
+        };
+        DocumentChange.setParaAlign(this.selectionState, setterFunc);
+    }
+    combineCell() {
+        TableUtil.mergeCells(this.selectionState);
+    }
+    /**
+     * 切换当前段落项目符号状态
+     */
+    setParagraphNumberType() {
+        this.documentChange.setParagraphNumberType();
+    }
+    /**
+     * 删除当前批注
+     * @param id
+     */
+    removeComment(id) {
+        this.docComment.removeComment(id);
+        this.selectionState.clear();
+    }
+    /**
+     * 移除焦点所在的批注
+     */
+    removeCurrentComment() {
+        const comment = ElementUtil.getParent(this.selectionState.startControl, (item => item instanceof CommContentBaseElement));
+        if (comment) {
+            this.removeComment(comment.props.id);
+        }
+    }
+    /**
+     * 插入批注
+     */
+    insertComment() {
+        this.documentChange.insertComment();
+    }
+    /**
+     * 清除所有批注
+     */
+    clearAllComments() {
+        this.docComment.clearAllComments();
+    }
+    cutTable() {
+        const row = ElementUtil.getParentByType(this.selectionState.startControl, TableRowElement);
+        const tb = row?.parent;
+        TableUtil.cutTable(tb, row.getIndex());
+        const para = new ParagraphElement();
+        tb.parent.addChild(para, tb.getIndex() + 1);
+    }
+    /**
+     * 初始化当前文档创建用户信息
+     * 一份文档只需要设置一次
+     */
+    initCurrentDocUser(userId, userName, date) {
+        const doc = this.docCtx.document;
+        doc.props.createUserId = userId;
+        doc.props.createUserName = userName;
+        doc.props.createDate = date;
+    }
+    /**
+     * 验证文档内容
+     * @returns
+     */
+    validate() {
+        this.docComment.clearAllValidates();
+        return this.documentChange.validate();
+    }
+    /**
+     * 撤销
+     */
+    undo() {
+        this.docHistory.undo();
+    }
+    /**
+     * 恢复
+     */
+    redo() {
+        this.docHistory.redo();
+    }
+    /**
+     * 是否可以撤销
+     */
+    canUndo() {
+        return this.docHistory.canUndo;
+    }
+    /**
+     * 是否可以恢复
+     */
+    canRedo() {
+        return this.docHistory.canRedo;
+    }
+    switchTrackChanges(eleCtx = null) {
+        eleCtx = eleCtx || this.docCtx.document;
+        const body = eleCtx.treeFind(item => item instanceof DocumentBodyElement);
+        if (body) {
+            body.trackChanges = !body.trackChanges;
+        }
+        else {
+            throw new Error('未找到doc-body');
+        }
+    }
+    get trackTipsChanged() {
+        return this.documentEvent.trackTipsChanged;
+    }
+    switchFullViewPage() {
+        this.viewOptions.fullPageView = !this.viewOptions.fullPageView;
+    }
+    getSelectedJSON() {
+        return ElementSerialize.getSelectedJSON(this.selectionState, this.viewOptions);
+    }
+    getSelectedText() {
+        const copySerializeStr = ElementSerialize.getSelectedStruct(this.selectionState, this.viewOptions);
+        return ElementSerialize.serializeString(copySerializeStr);
+    }
+    /**
+     * 设置纸张方向
+     * @param orientation
+     */
+    setPaperOrient(orientation) {
+        this.docCtx.document.props.orient = orientation;
+        this.viewOptions.docPageSettings.orient = orientation;
+        this.resetViewer('force');
+        this.selectionState.clear();
+    }
+    /**
+     * 设置纸张大小,单位为毫米(mm)
+     * @param width
+     * @param height
+     */
+    setPaperSize(width, height) {
+        const docProps = this.docCtx.document.props;
+        docProps.width = width;
+        docProps.height = height;
+        width = Math.floor(width * this.viewOptions.mmToPixelsRatio);
+        height = Math.floor(height * this.viewOptions.mmToPixelsRatio);
+        this.viewOptions.docPageSettings = new PageOptions(width, height, docProps.orient);
+        this.resetViewer('force');
+    }
+    /**
+     * 插入强制换页符
+     */
+    insertPageBreakPara() {
+        this.documentChange.insertPageBreakPara();
+    }
+    /**
+     * 显示当前元素到视图中
+     * @param element
+     */
+    bringToView(element) {
+        const ele = element instanceof BranchElement ? ElementUtil.getFirstLeafElement(element) : element;
+        if (ele) {
+            const region = ElementUtil.getElementRegion(ele);
+            const renderObj = ele.paintRenders[0];
+            const docRender = ElementUtil.getParentRender(renderObj, DocumentRenderObject);
+            const index = docRender.getIndex();
+            const cursorPos = DocumentCursor.getElementCursorPos(ele, 0, region, index);
+            this.selectionState.surround(element);
+            if (cursorPos.rect.y - this.viewOptions.translateY > 0 && cursorPos.rect.y - this.viewOptions.translateY < this.viewOptions.viewPaintHeight) {
+                return;
+            }
+            this.docScroll.scrollTo(cursorPos.rect.x, cursorPos.rect.y - this.viewOptions.translateY);
+        }
+    }
+    /**
+     * 设置当前文档页边距
+     */
+    setDocumentMargin(pageMargin) {
+        if (!this.docCtx.document) {
+            return;
+        }
+        this.docCtx.document.updateMargin(pageMargin);
+    }
+    /**
+     * 插入元素
+     * @param targetElement
+     * @param targetOffset
+     * @param destEleArray
+     * @returns
+     */
+    insertElement(targetElement, targetOffset, destEleArray) {
+        if (!this.selectionState.editable) {
+            return null;
+        }
+        return this.documentChange.insertElement(targetElement, targetOffset, destEleArray);
+    }
+}
+//# sourceMappingURL=texteditor.js.map