@hailin-zheng/editor-core 2.1.18 → 2.1.19

package/index-cjs.js

@@ -582,6 +582,16 @@ class CommonUtil {
         }
         return str;
     }
+    //随机生成rgb颜色
+    static randomRgbColor(opacity = -1) {
+        let r = Math.floor(Math.random() * 256); //随机生成256以内r值
+        let g = Math.floor(Math.random() * 256); //随机生成256以内g值
+        let b = Math.floor(Math.random() * 256); //随机生成256以内b值
+        if (opacity === -1) {
+            return `rgb(${r},${g},${b})`; //返回rgb(r,g,b)格式颜色
+        }
+        return `rgba(${r},${g},${b},${opacity})`; //返回rgba(r,g,b,a)格式颜色
+    }
     /**
      * 判断一个数值是否在另一个数值的增益区间中
      * @param val
@@ -1101,6 +1111,40 @@ class SubjectSubscription$1 extends Subscription$1 {
 function fromEvent(dom, type) {
     return new DOMEventSource(dom, type);
 }
+class EventBus {
+    subs = new Map();
+    on(event, handler) {
+        let handlers = this.subs.get(event);
+        if (!handlers) {
+            handlers = [];
+            this.subs.set(event, handlers);
+        }
+        const sub = new Subject$1();
+        sub.subscribe(handler);
+        handlers.push(sub);
+    }
+    off(event) {
+        const subs = this.subs.get(event);
+        if (subs) {
+            subs.forEach(item => item.unsubscribe());
+        }
+        this.subs.delete(event);
+    }
+    emit(event, data) {
+        const subs = this.subs.get(event);
+        if (subs) {
+            subs.forEach(item => item.next(data));
+        }
+    }
+    clear() {
+        this.subs.forEach((subs) => {
+            subs.forEach((sub) => {
+                sub.unsubscribe();
+            });
+        });
+        this.subs.clear();
+    }
+}
 
 class Rect {
     x = 0;
@@ -1705,17 +1749,7 @@ class ViewOptions {
     //两个页的间距
     docSpace = 0;
     //是否显示审阅窗口
-    _showReviewWindow = false;
-    get showReviewWindow() {
-        return this._showReviewWindow;
-    }
-    set showReviewWindow(value) {
-        if (value === this._showReviewWindow) {
-            return;
-        }
-        this._showReviewWindow = value;
-        // this.onChange.next();
-    }
+    showReviewWindow = false;
     //审阅窗口宽度
     reviewWindowWidth = 200;
     //缩放
@@ -2400,32 +2434,47 @@ class CommContentProps extends INotifyPropertyChanged {
     createId;
     createName;
     createDate;
+    text;
     clone(dest) {
         const clone = dest ?? new CommContentProps();
         super.cloneAttachedProperty(clone);
         clone.id = this.id;
+        clone.text = this.text;
         return clone;
     }
     getSerializeProps(viewOptions) {
         return {
-            id: this.id
+            id: this.id,
+            text: this.text
         };
     }
 }
 class CommProps extends INotifyPropertyChanged {
     id;
     markType;
+    text;
+    userId;
+    userName;
+    date;
     clone(dest) {
         const clone = dest ?? new CommProps();
         super.cloneAttachedProperty(clone);
         clone.id = this.id;
         clone.markType = this.markType;
+        clone.text = this.text;
+        clone.userId = this.userId;
+        clone.userName = this.userName;
+        clone.date = this.date;
         return clone;
     }
     getSerializeProps(viewOptions) {
         return {
             id: this.id,
-            markType: this.markType
+            markType: this.markType,
+            text: this.text,
+            userId: this.userId,
+            userName: this.userName,
+            date: this.date
         };
     }
 }
@@ -2753,63 +2802,6 @@ class CommsContainerElement extends BlockContainerElement {
         }
         return clone;
     }
-    markPairs = [];
-    /**
-     * 清除所有的批注标识组合
-     */
-    clearMarkItems() {
-        this.markPairs.length = 0;
-    }
-    identifyCommMark(markElement) {
-        const { id } = markElement.props;
-        let matchItem = this.markPairs.find(item => item.id === id);
-        if (!matchItem) {
-            matchItem = { id };
-            this.markPairs.push(matchItem);
-        }
-        matchItem[markElement.props.markType] = markElement;
-    }
-    /**
-     * 根据id，移除批注标记以及批注内容
-     * @param id
-     */
-    removeCommMark(id) {
-        const matchIndex = this.markPairs.findIndex(item => item.id === id);
-        if (matchIndex >= 0) {
-            const matchItem = this.markPairs[matchIndex];
-            matchItem.start?.remove();
-            matchItem.end?.remove();
-            this.markPairs.splice(matchIndex, 1);
-        }
-        const commContent = this.getCommContent(id);
-        if (commContent) {
-            commContent.remove();
-        }
-    }
-    /**
-     * 清除所有批注
-     */
-    clearAllComms() {
-        for (let i = 0; i < this.markPairs.length; i++) {
-            const { start, end } = this.markPairs[i];
-            if (start) {
-                start.remove();
-            }
-            if (end) {
-                end.remove();
-            }
-        }
-        this.clearItems();
-    }
-    getCommContent(id) {
-        for (let i = 0; i < this.length; i++) {
-            const commContent = this.getChild(i);
-            if (commContent.props.id === id) {
-                return commContent;
-            }
-        }
-        return null;
-    }
 }
 class CommsContainerRenderObject extends BlockContainerRenderObject {
     //批注内容是否已经重组,只要重新绘制的时候组合一次即可
@@ -3271,7 +3263,7 @@ class DocumentElement extends BlockContainerElement {
     bodyElement;
     headerElement;
     footerElement;
-    commentsContainerElement;
+    //commentsContainerElement!: CommsContainerElement;
     headerEditState = false;
     constructor() {
         super('doc');
@@ -3349,6 +3341,49 @@ class DocumentElement extends BlockContainerElement {
         ss.clear();
         this.refreshView();
     }
+    markPairs = [];
+    /**
+     * 清除所有的批注标识组合
+     */
+    clearMarkItems() {
+        this.markPairs.length = 0;
+    }
+    identifyCommMark(markElement) {
+        const { id } = markElement.props;
+        let matchItem = this.markPairs.find(item => item.id === id);
+        if (!matchItem) {
+            matchItem = { id };
+            this.markPairs.push(matchItem);
+        }
+        matchItem[markElement.props.markType] = markElement;
+    }
+    /**
+     * 根据id，移除批注标记以及批注内容
+     * @param id
+     */
+    removeCommMark(id) {
+        const matchIndex = this.markPairs.findIndex(item => item.id === id);
+        if (matchIndex >= 0) {
+            const matchItem = this.markPairs[matchIndex];
+            matchItem.start?.remove();
+            matchItem.end?.remove();
+            this.markPairs.splice(matchIndex, 1);
+        }
+    }
+    /**
+     * 清除所有批注
+     */
+    clearAllComms() {
+        for (let i = 0; i < this.markPairs.length; i++) {
+            const { start, end } = this.markPairs[i];
+            if (start) {
+                start.remove();
+            }
+            if (end) {
+                end.remove();
+            }
+        }
+    }
 }
 class DocumentRenderObject extends BlockContainerRenderObject {
     constructor(ele) {
@@ -4706,7 +4741,7 @@ class TableRowRenderObject extends MuiltBlockLineRenderObject {
     //被截断的行是否需要重新计算高度
     remeasureState = true;
     //当前行是否存在合并单元格
-    hasMergeCells = false;
+    hasMergeCells = undefined;
     render(e) {
     }
     clone() {
@@ -5345,7 +5380,7 @@ class DocumentCursor {
 }
 
 class RangeUtil {
-    static getSelctionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl) {
+    static getSectionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl) {
         if (ancestorCommonControl instanceof TableElement || ancestorCommonControl instanceof TableRowElement) {
             const tbElement = ancestorCommonControl instanceof TableElement ? ancestorCommonControl : ancestorCommonControl.parent;
             return this.getTableSelectionRange(startControl, startOffset, endControl, endOffset, tbElement);
@@ -5424,7 +5459,7 @@ class RangeUtil {
                         });
                     }
                     else {
-                        const cellRange = this.getSelctionRange(cellFirstLeafElement, 0, cellLastLeafElement, 1, cell);
+                        const cellRange = this.getSectionRange(cellFirstLeafElement, 0, cellLastLeafElement, 1, cell);
                         cellRanges.push(cellRange);
                     }
                 }
@@ -7263,12 +7298,42 @@ class CommentsUtil {
     }
 }
 
+let activeEditorContext = null;
+function setActiveEditorContext(ctx) {
+    activeEditorContext = ctx;
+}
+function getActiveEditorContext() {
+    return activeEditorContext;
+}
+function createSignal(state) {
+    let _state = state;
+    const activeCtx = activeEditorContext;
+    const signal = {
+        get value() {
+            return _state;
+        },
+        set value(v) {
+            if (v === _state) {
+                return;
+            }
+            _state = v;
+            signal.onChange();
+        },
+        onChange: () => {
+            activeCtx?.onChange();
+        }
+    };
+    return signal;
+}
+
 class CommentElement extends LeafElement {
+    color;
     constructor() {
         super('comm');
         this.isDecorate = true;
         this.disableClick = true;
         this.props = new CommProps();
+        this.color = CommonUtil.randomRgbColor(0.5);
     }
     createRenderObject() {
         const render = new CommentRenderObject(this);
@@ -7321,6 +7386,7 @@ class CommentRenderObject extends LeafRenderObject {
                     }
                 }
             }];
+        this.createCommentTips(event);
         return t;
     }
     clone() {
@@ -7328,6 +7394,90 @@ class CommentRenderObject extends LeafRenderObject {
         clone.rect = ElementUtil.cloneRect(this.rect);
         return clone;
     }
+    createCommentTips(event) {
+        if (this.element.props.markType === 'end') {
+            return;
+        }
+        if (this.element.paintRenders.indexOf(this) !== 0) {
+            return;
+        }
+        const appCtx = getActiveEditorContext();
+        const opType = '批注：';
+        const content = this.element.props.text;
+        const left = 5;
+        let sel = 'div.tg-container';
+        const node = {
+            sel,
+            key: this.element.props.id,
+            data: {
+                style: {
+                    left: `${left}px`,
+                    top: `${event.globalPos.y}px`
+                },
+                on: {
+                    click: (e) => {
+                        e.stopPropagation();
+                        appCtx?.emit('comment-click', {
+                            ...this.element.props
+                        });
+                        //this.showCommentRange(appCtx!);
+                    },
+                    dblclick: (e) => {
+                        e.stopPropagation();
+                        appCtx?.emit('comment-dblclick', {
+                            ...this.element.props
+                        });
+                    }
+                }
+            },
+            children: [{
+                    sel: 'div.header',
+                    data: {},
+                    children: [{
+                            sel: 'span.header-user',
+                            data: {},
+                            text: this.element.props.userName,
+                        }, {
+                            sel: 'span.header-date',
+                            data: {},
+                            text: this.element.props.date,
+                        }]
+                }, {
+                    sel: 'div.content',
+                    data: {},
+                    text: opType + content
+                }, {
+                    sel: 'div.bg',
+                    data: {
+                        style: {
+                            background: this.element.color
+                        }
+                    }
+                }]
+        };
+        event.addChangeTips(node);
+        // <div class="container">
+        // <div class="header">
+        // <span class="header-user">张三</span>
+        //     <span class="header-date">2023.1.21 16:06</span>
+        // </div>
+        // <div class="content">修改了字符串</div>
+        //     </div>
+    }
+    /**
+     * 显示批注范围
+     * @private
+     */
+    showCommentRange(appCtx) {
+        const doc = ElementUtil.getParent(this.element, (item) => item.type === 'doc');
+        const commPair = doc.treeFilter(item => item instanceof CommentElement && item.props.id === this.element.props.id);
+        if (commPair.length === 2) {
+            const range = new SelectionRange();
+            range.setStart(commPair[0], 0);
+            range.setEnd(commPair[1], 1);
+            appCtx.selectionState.addRange(range);
+        }
+    }
 }
 class CommentFactory extends ElementFactory {
     match(type) {
@@ -7338,6 +7488,7 @@ class CommentFactory extends ElementFactory {
         const props = data.props;
         ele.props.id = props.id;
         ele.props.markType = props.markType;
+        ele.props.text = props.text;
         return ele;
     }
 }
@@ -8901,18 +9052,6 @@ class DataElementImage extends DataElementLeaf {
         this.props.clone(clone.props);
         return clone;
     }
-    loadImage(ctx) {
-        if (this.status === 'no') {
-            this.status = 'loading';
-            const onCallback = (status) => {
-                this.status = status;
-                if (status === 'completed') {
-                    this.refreshView();
-                }
-            };
-            ctx.imageLoader.loadImage(this.props.src, onCallback);
-        }
-    }
     destroy() {
         super.destroy();
     }
@@ -8928,38 +9067,6 @@ class DataElementImage extends DataElementLeaf {
 }
 class DataImageRenderObject extends ResizeLeafRenderObject {
     render(e) {
-        const { render, position, docCtx } = e;
-        const dataImgElement = this.element;
-        const picProps = dataImgElement.props;
-        if (dataImgElement.status === 'no') {
-            dataImgElement.loadImage(docCtx);
-            return;
-        }
-        if (dataImgElement.status === 'completed') {
-            const imageSource = docCtx.imageLoader.getImage(picProps.src);
-            if (!imageSource) {
-                return;
-            }
-            if (picProps.border === 'all') {
-                render.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, 'black');
-            }
-            render.contentContext.ctx.drawImage(imageSource, 0, 0, imageSource.naturalWidth, imageSource.naturalHeight, position.x + 2, position.y + 2, picProps.width, picProps.height);
-        }
-        if (render.drawMode === 'view') {
-            let { x, y } = position;
-            const { width, height } = this.rect;
-            const lineWidth = 5;
-            const paintColor = '#0050b3';
-            render.contentContext.strokeLines([{ x: x + lineWidth, y }, { x, y }, { x, y: y + height }, {
-                    x: x + lineWidth,
-                    y: y + height
-                }], 1, paintColor);
-            x = x + width;
-            render.contentContext.strokeLines([{ x: x - lineWidth, y }, { x, y }, { x, y: y + height }, {
-                    x: x - lineWidth,
-                    y: y + height
-                }], 1, paintColor);
-        }
     }
     clone() {
         const clone = new DataImageRenderObject(this.element);
@@ -9836,51 +9943,12 @@ class PictureElement extends LeafElement {
         this.props.clone(clone.props);
         return clone;
     }
-    loadImage(ctx) {
-        if (this.status === 'no') {
-            this.status = 'loading';
-            //this.imageSource = new Image();
-            //this.imageSource.src = this.props.src;
-            // const onload = (e: any) => {
-            //     this.isLoad = 'completed';
-            //     this.refreshView('appearance');
-            // };
-            // const onerror = (e: any) => {
-            //     this.isLoad = 'error';
-            //     console.error(e);
-            // };
-            const onCallback = (status) => {
-                this.status = status;
-                if (status === 'completed') {
-                    this.refreshView();
-                }
-            };
-            ctx.imageLoader.loadImage(this.props.src, onCallback);
-        }
-    }
     destroy() {
         super.destroy();
     }
 }
 class PictureRenderObject extends ResizeLeafRenderObject {
     render(e) {
-        const { render, position, docCtx } = e;
-        const picElement = this.element;
-        const picProps = picElement.props;
-        if (picElement.status === 'no') {
-            picElement.loadImage(docCtx);
-            return;
-        }
-        if (picElement.status === 'completed') {
-            const imageSource = docCtx.imageLoader.getImage(picProps.src);
-            if (!imageSource) {
-                return;
-            }
-            if (picProps.border === 'all') {
-                render.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, 'black');
-            }
-            render.contentContext.ctx.drawImage(imageSource, 0, 0, imageSource.naturalWidth, imageSource.naturalHeight, position.x + 2, position.y + 2, picProps.width, picProps.height);
-        }
     }
     clone() {
         const clone = new PictureRenderObject(this.element);
@@ -13297,29 +13365,29 @@ class ElementPaint {
                 this.renderCtx.contentContext.fillRect(currPosition.x, currPosition.y, renderObject.rect.width, renderObject.rect.height, this.viewOptions.selectionOverlaysColor);
             }
         }
-        if (inViewPort && this.viewOptions.showReviewWindow && this.docCtx.document.commentsContainerElement.cacheRender.selectedSet.has(element)) {
-            if (renderObject instanceof LeafRenderObject || renderObject instanceof DataElementRenderObject) {
-                const measureCommContainer = this.docCtx.document.commentsContainerElement.cacheRender;
-                const range = measureCommContainer.selectedSet.get(element);
-                if (range.isFullSelected) {
-                    let commentRangePaintColor = '#ffd591';
-                    for (let i = 0; i < measureCommContainer.commentRangeStatus.length; i++) {
-                        const commentRangeStatus = measureCommContainer.commentRangeStatus[i];
-                        if (commentRangeStatus.commContent.focus) {
-                            if (RangeUtil.checkElementFullInRange(commentRangeStatus.range, element)) {
-                                commentRangePaintColor = '#fa8c16';
-                            }
-                        }
-                    }
-                    const overlayRect = { x: currPosition.x, y: currPosition.y, width: rw, height: rh };
-                    const paraLinePos = ElementUtil.getParaLinePos(renderObject, {
-                        x: currPosition.x,
-                        y: currPosition.y
-                    });
-                    this.renderCtx.overlaysContext.fillRect(overlayRect.x, paraLinePos.y, overlayRect.width, paraLinePos.height, commentRangePaintColor);
-                }
-            }
-        }
+        // if (inViewPort && this.viewOptions.showReviewWindow && (<CommsContainerRenderObject>this.docCtx.document.commentsContainerElement.cacheRender).selectedSet.has(element)) {
+        //     if (renderObject instanceof LeafRenderObject || renderObject instanceof DataElementRenderObject) {
+        //         const measureCommContainer=<CommsContainerRenderObject>this.docCtx.document.commentsContainerElement.cacheRender;
+        //         const range = measureCommContainer.selectedSet.get(element) as SelectionContentRange;
+        //         if (range.isFullSelected) {
+        //             let commentRangePaintColor = '#ffd591';
+        //             for (let i = 0; i < measureCommContainer.commentRangeStatus.length; i++) {
+        //                 const commentRangeStatus = measureCommContainer.commentRangeStatus[i];
+        //                 if (commentRangeStatus.commContent.focus) {
+        //                     if (RangeUtil.checkElementFullInRange(commentRangeStatus.range, element)) {
+        //                         commentRangePaintColor = '#fa8c16';
+        //                     }
+        //                 }
+        //             }
+        //             const overlayRect = { x: currPosition.x, y: currPosition.y, width: rw, height: rh };
+        //             const paraLinePos = ElementUtil.getParaLinePos(renderObject, {
+        //                 x: currPosition.x,
+        //                 y: currPosition.y
+        //             });
+        //             this.renderCtx.overlaysContext.fillRect(overlayRect.x, paraLinePos.y, overlayRect.width, paraLinePos.height, commentRangePaintColor);
+        //         }
+        //     }
+        // }
     }
     /**
      * 触发页面绘制结束事件
@@ -13338,149 +13406,30 @@ class ElementPaint {
         const { x: rx, y: ry } = renderObject.rect;
         const currPosition = { x: rx + parent.x, y: ry + parent.y };
         if (renderObject instanceof BranchRenderObject) {
-            const nextRenderFn = onceTask(() => {
-                for (let i = 0; i < renderObject.length; i++) {
-                    const child = renderObject.getChild(i);
-                    this.drawPage(renderCtx, docCtx, child, currPosition);
-                }
-            });
-            const renderData = {
-                position: currPosition,
-                nextRender: nextRenderFn,
-                render: renderCtx,
-                docCtx
-            };
-            renderObject.render(renderData);
-            nextRenderFn();
-        }
-        else if (renderObject instanceof LeafRenderObject) {
-            const renderData = {
-                position: currPosition,
-                nextRender: () => { },
-                render: renderCtx,
-                docCtx: docCtx
-            };
-            renderObject.render(renderData);
-        }
-    }
-}
-
-/**
- * 用于处理选区拖蓝
- */
-class SelectionOverlays {
-    selectionState;
-    selectionRange;
-    selectedSets = new Map();
-    constructor(selectionState) {
-        this.selectionState = selectionState;
-    }
-    getSelectionTreeData() {
-        let { ancestorCommonControl, startControl, startOffset, endControl, endOffset, collapsed } = this.selectionState;
-        this.selectedSets.clear();
-        if (this.selectionRange) {
-            this.selectionRange.selectedChildren.length = 0;
-        }
-        this.selectionRange = null;
-        if (!startControl || !endControl || !ancestorCommonControl) {
-            //this.selectionRange?.selectedChildren.length=0;
-            this.selectionState.selectedRange = null;
-            return;
-        }
-        if (collapsed) {
-            const commonRange = RangeUtil.getSelctionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl);
-            this.selectionState.selectedRange = commonRange;
-            this.selectedSets.clear();
-            return;
-        }
-        const fixStartElement = this.fixStartSelectionElement(startControl, startOffset, ancestorCommonControl);
-        startControl = fixStartElement.element;
-        startOffset = fixStartElement.offset;
-        const fixEndElement = this.fixEndSelectionElement(endControl, endOffset, ancestorCommonControl);
-        endControl = fixEndElement.element;
-        endOffset = fixEndElement.offset;
-        const commonRange = RangeUtil.getSelctionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl);
-        //console.log(commonRange);
-        this.selectionRange = commonRange;
-        this.convertSelectRangeToSet();
-        this.selectionState.selectedRange = commonRange;
-    }
-    convertSelectRangeToSet() {
-        this.selectedSets.clear();
-        if (this.selectionRange) {
-            SelectionOverlays.addToSets(this.selectionRange, this.selectedSets);
-        }
-    }
-    static addToSets(range, set) {
-        set.set(range.target, range);
-        for (let i = 0; i < range.selectedChildren.length; i++) {
-            //单元格全部选中效果，单元格整个拖蓝即可
-            if (range.isFullSelected && range.target.type === 'tbc') {
-                continue;
-            }
-            this.addToSets(range.selectedChildren[i], set);
-        }
-    }
-    /**
-     * 添加到批注集合
-     * @param range
-     * @param set
-     */
-    static addToCommentSets(range, set) {
-        set.set(range.target, range);
-        for (let i = 0; i < range.selectedChildren.length; i++) {
-            this.addToCommentSets(range.selectedChildren[i], set);
-        }
-    }
-    /**
-     * 修正开始选区内容
-     * 1.如果当前选区开始于表格内容，结束选区位于表格外，则需要开始选区内容重定位到单元格第一个元素
-     */
-    fixStartSelectionElement(element, offset, ancestorCommonControl) {
-        if (!(ancestorCommonControl instanceof TableElement)) {
-            const lookupParentCell = ElementUtil.getParentByType(element, TableCellElement);
-            if (lookupParentCell) {
-                if (!lookupParentCell.parent || !lookupParentCell.parent.parent) ;
-                const lookupParentTbIndex = ElementUtil.getControlIndex(lookupParentCell.parent.parent);
-                const ancestorCommonControlIndex = ElementUtil.getControlIndex(ancestorCommonControl);
-                if (ancestorCommonControlIndex < lookupParentTbIndex) {
-                    const rowFirstLeafElement = ElementUtil.getFirstLeafElement(lookupParentCell.parent);
-                    if (!rowFirstLeafElement) {
-                        throw new Error('当前元素处于表格内元素，未能定位到当前单元格首个元素');
-                    }
-                    return {
-                        element: rowFirstLeafElement,
-                        offset: 0
-                    };
-                }
-            }
-        }
-        return { element, offset };
-    }
-    /**
-     * 修正开始选区内容
-     * 1.如果当前选区开始于表格内容，结束选区位于表格外，则需要开始选区内容重定位到单元格第一个元素
-     */
-    fixEndSelectionElement(element, offset, ancestorCommonControl) {
-        if (!(ancestorCommonControl instanceof TableElement)) {
-            const lookupParentCell = ElementUtil.getParentByType(element, TableCellElement);
-            if (lookupParentCell) {
-                const lookupParentTbIndex = ElementUtil.getControlIndex(lookupParentCell.parent.parent);
-                const ancestorCommonControlIndex = ElementUtil.getControlIndex(ancestorCommonControl);
-                if (ancestorCommonControlIndex < lookupParentTbIndex) {
-                    const rowLastLeafElement = ElementUtil.getLastLeafElement(lookupParentCell.parent);
-                    if (!rowLastLeafElement) {
-                        ElementUtil.getLastLeafElement(lookupParentCell.parent);
-                        throw new Error('当前元素处于表格内元素，未能定位到当前单元格首个元素');
-                    }
-                    return {
-                        element: rowLastLeafElement,
-                        offset: 1
-                    };
+            const nextRenderFn = onceTask(() => {
+                for (let i = 0; i < renderObject.length; i++) {
+                    const child = renderObject.getChild(i);
+                    this.drawPage(renderCtx, docCtx, child, currPosition);
                 }
-            }
+            });
+            const renderData = {
+                position: currPosition,
+                nextRender: nextRenderFn,
+                render: renderCtx,
+                docCtx
+            };
+            renderObject.render(renderData);
+            nextRenderFn();
+        }
+        else if (renderObject instanceof LeafRenderObject) {
+            const renderData = {
+                position: currPosition,
+                nextRender: () => { },
+                render: renderCtx,
+                docCtx: docCtx
+            };
+            renderObject.render(renderData);
         }
-        return { element, offset };
     }
 }
 
@@ -13532,78 +13481,6 @@ class DocumentEvalFunc {
     }
 }
 
-class DocumentImagesBaseLoader {
-    images = [];
-    clear() {
-        this.images.length = 0;
-    }
-    loadImage(src, onCallback) {
-        if (!src) {
-            return;
-        }
-        //已经存在的资源不需要重新加载
-        let matchItem = this.images.find(item => item.src === src);
-        if (matchItem) {
-            if (matchItem.loadStatus === 'no') {
-                matchItem.cbs.push(onCallback);
-            }
-            else {
-                onCallback(matchItem.loadStatus);
-            }
-            return;
-        }
-        const task = this.createRequestImage(src);
-        const imgItem = {
-            ele: undefined,
-            src,
-            cbs: [onCallback],
-            loadStatus: 'no',
-            task
-        };
-        this.images.push(imgItem);
-        // if (this.viewOptions.resourceMode === 'immediate') {
-        //     ele.onload = (e) => { this.invokeImgLoad(src, 'completed'); };
-        //     ele.onerror = (e) => { this.invokeImgLoad(src, 'error'); };
-        // }
-    }
-    invokeImgLoad(src, status, data) {
-        const img = this.images.find(item => item.src === src);
-        if (img) {
-            img.loadStatus = status;
-            img.cbs.forEach(cb => cb(status));
-            img.ele = data;
-        }
-    }
-    getLoadTasks() {
-        return this.images.map(item => item.task);
-    }
-    getImage(src) {
-        const img = this.images.find(item => item.src === src);
-        return img?.ele;
-    }
-    /**
-     * 判断图片是否都已经加载完毕
-     * 用于打印时判断，如果当前图片没有加载完毕就打印，图片是打印不出来
-     * @returns
-     */
-    imagesLoadCompleted() {
-        if (this.images.length === 0) {
-            return true;
-        }
-        return this.images.every(item => ['completed', 'error'].includes(item.loadStatus));
-    }
-}
-class DocumentImagesLoader extends DocumentImagesBaseLoader {
-    createRequestImage(url) {
-        const ele = new Image();
-        ele.src = url;
-        return new Promise((r, i) => {
-            ele.onload = (e) => { this.invokeImgLoad(url, 'completed', ele); r(); };
-            ele.onerror = (e) => { this.invokeImgLoad(url, 'error', ele); r(); };
-        });
-    }
-}
-
 /**
  * 当前打开的文档的上下文信息，当前文档所有的属性设置都暴露在上下文中
  */
@@ -13616,7 +13493,7 @@ class EditorContext {
     //文档刷新的订阅事件
     //refSub!: Subscription;
     syncRefresh;
-    imageLoader;
+    //imageLoader: IImageLoader;
     dynamicFunc;
     docChange;
     clearPrevDocCb;
@@ -13626,7 +13503,7 @@ class EditorContext {
         this.selectionState = selectionState;
         this.viewOptions = viewOptions;
         this.dynamicFunc = new DocumentEvalFunc(this);
-        this.imageLoader = new DocumentImagesLoader();
+        //this.imageLoader = new DocumentImagesLoader();
         this.selectionState.onChangedEvent.subscribe(() => {
             this.syncRefresh?.();
         });
@@ -13667,7 +13544,7 @@ class EditorContext {
     }
     clear() {
         this.selectionState.clear();
-        this.imageLoader.clear();
+        //this.imageLoader.clear();
         this.dynamicFunc.destroyScripts();
         this.isDirty = false;
     }
@@ -13709,7 +13586,7 @@ class EditorContext {
         this.document.destroy();
         this.clearPrevDocCb?.();
         //this.ele_types_handlers.length = 0;
-        this.imageLoader.clear();
+        //this.imageLoader.clear();
         this._document = null;
     }
     /**
@@ -13744,6 +13621,17 @@ class EditorContext {
         return this._document.modifyFlag === exports.ModifyFlag.None ? 'appearance' : 'content';
     }
 }
+// export interface IImageLoader {
+//     clear(): void;
+//
+//     loadImage(src: string, onCallback: (status: ImgLoadStatus) => void): void;
+//
+//     getImage(src: string): HTMLImageElement | undefined;
+//
+//     imagesLoadCompleted(): boolean;
+//
+//     getLoadTasks(): Array<Promise<void>>;
+// }
 /**
  * 文档上下文
  */
@@ -14637,13 +14525,139 @@ class ParagraphMeasure {
     }
 }
 
+/**
+ * 用于处理选区拖蓝
+ */
+class SelectionOverlays {
+    selectionState;
+    selectionRange;
+    //选区对象集合
+    selectionEleSets = new Map();
+    //批注对象集合
+    commRangeSets = new Map();
+    constructor(selectionState) {
+        this.selectionState = selectionState;
+    }
+    getSelectionTreeData() {
+        let { ancestorCommonControl, startControl, startOffset, endControl, endOffset, collapsed } = this.selectionState;
+        this.selectionEleSets.clear();
+        if (this.selectionRange) {
+            this.selectionRange.selectedChildren.length = 0;
+        }
+        this.selectionRange = null;
+        if (!startControl || !endControl || !ancestorCommonControl) {
+            //this.selectionRange?.selectedChildren.length=0;
+            this.selectionState.selectedRange = null;
+            return;
+        }
+        if (collapsed) {
+            const commonRange = RangeUtil.getSectionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl);
+            this.selectionState.selectedRange = commonRange;
+            this.selectionEleSets.clear();
+            return;
+        }
+        const fixStartElement = this.fixStartSelectionElement(startControl, startOffset, ancestorCommonControl);
+        startControl = fixStartElement.element;
+        startOffset = fixStartElement.offset;
+        const fixEndElement = this.fixEndSelectionElement(endControl, endOffset, ancestorCommonControl);
+        endControl = fixEndElement.element;
+        endOffset = fixEndElement.offset;
+        const commonRange = RangeUtil.getSectionRange(startControl, startOffset, endControl, endOffset, ancestorCommonControl);
+        //console.log(commonRange);
+        this.selectionRange = commonRange;
+        this.convertSelectRangeToSet();
+        this.selectionState.selectedRange = commonRange;
+    }
+    convertSelectRangeToSet() {
+        this.selectionEleSets.clear();
+        if (this.selectionRange) {
+            SelectionOverlays.addToSets(this.selectionRange, this.selectionEleSets);
+        }
+    }
+    static addToSets(range, set) {
+        set.set(range.target, range);
+        for (let i = 0; i < range.selectedChildren.length; i++) {
+            //单元格全部选中效果，单元格整个拖蓝即可
+            if (range.isFullSelected && range.target.type === 'tbc') {
+                continue;
+            }
+            this.addToSets(range.selectedChildren[i], set);
+        }
+    }
+    /**
+     * 添加到批注集合
+     * @param range
+     * @param set
+     * @param rangeColor 用以显示批注区间的颜色
+     */
+    static addToCommentSets(range, set, rangeColor) {
+        range['rangeColor'] = rangeColor;
+        set.set(range.target, range);
+        for (let i = 0; i < range.selectedChildren.length; i++) {
+            this.addToCommentSets(range.selectedChildren[i], set, rangeColor);
+        }
+    }
+    /**
+     * 修正开始选区内容
+     * 1.如果当前选区开始于表格内容，结束选区位于表格外，则需要开始选区内容重定位到单元格第一个元素
+     */
+    fixStartSelectionElement(element, offset, ancestorCommonControl) {
+        if (!(ancestorCommonControl instanceof TableElement)) {
+            const lookupParentCell = ElementUtil.getParentByType(element, TableCellElement);
+            if (lookupParentCell) {
+                if (!lookupParentCell.parent || !lookupParentCell.parent.parent) ;
+                const lookupParentTbIndex = ElementUtil.getControlIndex(lookupParentCell.parent.parent);
+                const ancestorCommonControlIndex = ElementUtil.getControlIndex(ancestorCommonControl);
+                if (ancestorCommonControlIndex < lookupParentTbIndex) {
+                    const rowFirstLeafElement = ElementUtil.getFirstLeafElement(lookupParentCell.parent);
+                    if (!rowFirstLeafElement) {
+                        throw new Error('当前元素处于表格内元素，未能定位到当前单元格首个元素');
+                    }
+                    return {
+                        element: rowFirstLeafElement,
+                        offset: 0
+                    };
+                }
+            }
+        }
+        return { element, offset };
+    }
+    /**
+     * 修正开始选区内容
+     * 1.如果当前选区开始于表格内容，结束选区位于表格外，则需要开始选区内容重定位到单元格第一个元素
+     */
+    fixEndSelectionElement(element, offset, ancestorCommonControl) {
+        if (!(ancestorCommonControl instanceof TableElement)) {
+            const lookupParentCell = ElementUtil.getParentByType(element, TableCellElement);
+            if (lookupParentCell) {
+                const lookupParentTbIndex = ElementUtil.getControlIndex(lookupParentCell.parent.parent);
+                const ancestorCommonControlIndex = ElementUtil.getControlIndex(ancestorCommonControl);
+                if (ancestorCommonControlIndex < lookupParentTbIndex) {
+                    const rowLastLeafElement = ElementUtil.getLastLeafElement(lookupParentCell.parent);
+                    if (!rowLastLeafElement) {
+                        ElementUtil.getLastLeafElement(lookupParentCell.parent);
+                        throw new Error('当前元素处于表格内元素，未能定位到当前单元格首个元素');
+                    }
+                    return {
+                        element: rowLastLeafElement,
+                        offset: 1
+                    };
+                }
+            }
+        }
+        return { element, offset };
+    }
+}
+
 class DocumentArrange {
     docCtx;
     renderCtx;
+    seo;
     options;
-    constructor(docCtx, renderCtx) {
+    constructor(docCtx, renderCtx, seo) {
         this.docCtx = docCtx;
         this.renderCtx = renderCtx;
+        this.seo = seo;
         this.options = this.docCtx.viewOptions;
     }
     /**
@@ -14665,24 +14679,25 @@ class DocumentArrange {
                 parser: new DynamicContextParser(doc, this.docCtx.selectionState),
                 createParaFn: () => this.createDefaultPara()
             };
-            doc.commentsContainerElement.clearMarkItems();
+            doc.clearMarkItems();
             this.clearPaintCache(doc, data);
-            this.docCtx.viewOptions.showReviewWindow = this.docCtx.document.commentsContainerElement.markPairs.length > 0;
+            //this.docCtx.viewOptions.showReviewWindow = this.docCtx.document.commentsContainerElement.markPairs.length > 0;
             const docRenders = this.arrangeDoc();
             this.setMeasureCompletedModifyFlag(doc);
             this.cacheDocRenders(docRenders);
+            this.generateCommRange();
             return docRenders;
         });
     }
-    commentsRender;
+    //commentsRender!: CommsContainerRenderObject;
     arrangeDoc() {
         const doc = this.docCtx.document;
         const docRender = doc.createRenderObject();
         const innerRect = docRender.getInnerRect();
         const headerRender = this.measureControl(doc.headerElement, innerRect.width);
         const footerRender = this.measureControl(doc.footerElement, innerRect.width);
-        const commentsRender = this.measureControl(doc.commentsContainerElement, this.options.reviewWindowWidth);
-        this.commentsRender = commentsRender;
+        //const commentsRender = this.measureControl(doc.commentsContainerElement, this.options.reviewWindowWidth) as CommsContainerRenderObject;
+        //this.commentsRender = commentsRender;
         const { headerLine, footerLine } = docRender;
         let bodyMarginTop = headerLine + headerRender.rect.height + 6;
         let bodyMarginBottom = footerLine + footerRender.rect.height;
@@ -14777,15 +14792,15 @@ class DocumentArrange {
             cloneFooterRender.rect.x = limitRect.x;
             cloneFooterRender.rect.y = documentRender.rect.height - bodyMarginBottom;
             currColumn === 0 && documentRender.addChild(cloneFooterRender);
-            //审阅模式，添加审阅窗口
-            if (this.options.showReviewWindow && commentsRender) {
-                const commentsContainer = this.createRenderObject(commentsRender.element);
-                commentsContainer.padding.top = bodyMarginTop;
-                commentsContainer.rect.height = documentRender.rect.height;
-                documentRender.addChild(commentsContainer);
-                commentsContainer.rect.x = documentRender.rect.x + documentRender.rect.width;
-                documentRender.rect.width += this.options.reviewWindowWidth;
-            }
+            // //审阅模式，添加审阅窗口
+            // if (this.options.showReviewWindow && commentsRender) {
+            //     const commentsContainer = this.createRenderObject(commentsRender.element) as CommsContainerRenderObject;
+            //     commentsContainer.padding.top = bodyMarginTop;
+            //     commentsContainer.rect.height = documentRender.rect.height;
+            //     documentRender.addChild(commentsContainer);
+            //     commentsContainer.rect.x = documentRender.rect.x + documentRender.rect.width;
+            //     documentRender.rect.width += this.options.reviewWindowWidth;
+            // }
             currColumn++;
             if (currColumn === docColumns) {
                 currColumn = 0;
@@ -14813,8 +14828,7 @@ class DocumentArrange {
         }
         if (element instanceof BlockContentElement) {
             const pRange = new ParagraphMeasure(this.options, this.renderCtx);
-            const innerLineRects = pRange.measureParagraph(element, maxWidth);
-            return innerLineRects;
+            return pRange.measureParagraph(element, maxWidth);
         }
         else if (element instanceof BlockContainerElement) {
             const renders = [];
@@ -14952,7 +14966,6 @@ class DocumentArrange {
      * 切割渲染元素
      * @param tbRender 被切割的对象
      * @param limitHeight
-     * @param addFunc
      * @returns
      */
     cutTable(tbRender, limitHeight) {
@@ -14982,6 +14995,10 @@ class DocumentArrange {
         while (currRow) {
             const rowContentHeight = this.getBlockLineHeight(currRow);
             if (rowContentHeight + sumHeight > limitHeight) {
+                //行存在最小高度，且当前行跨页的情况下，不截断该行
+                if (currRow.element.props.minHeight) {
+                    break;
+                }
                 //限制的外框尺寸
                 const availHeight = limitHeight - sumHeight;
                 const limitRenderInnerHeight = ElementUtil.innerRectMaxHeight(tbRender, availHeight);
@@ -15222,7 +15239,7 @@ class DocumentArrange {
     }
     identifyComment(ele) {
         if (ele instanceof CommentElement) {
-            this.docCtx.document.commentsContainerElement.identifyCommMark(ele);
+            this.docCtx.document.identifyCommMark(ele);
         }
     }
     cacheDoc;
@@ -15233,6 +15250,22 @@ class DocumentArrange {
         });
         this.cacheDoc = null;
     }
+    /**
+     * 生成批注区间信息
+     * @param renderTree
+     */
+    generateCommRange() {
+        this.seo.commRangeSets.clear();
+        const commMarks = this.docCtx.document.markPairs;
+        for (let i = 0; i < commMarks.length; i++) {
+            const commMark = commMarks[i];
+            if (commMark.start && commMark.end) {
+                const ancestor = DocumentSelection.getAncestorCommonControl(commMark.start, commMark.end);
+                const range = RangeUtil.getSectionRange(commMark.start, 0, commMark.end, 1, ancestor);
+                SelectionOverlays.addToCommentSets(range, this.seo.commRangeSets, commMark.start.color);
+            }
+        }
+    }
     cacheRenders(renderTree) {
         if (renderTree.element) {
             renderTree.element.paintRenders.push(renderTree);
@@ -16328,7 +16361,7 @@ class ElementRenderCut {
 class DocumentPaint {
     renderContext;
     docCtx;
-    selectedSets;
+    seo;
     elementMeasure;
     elementRenderCut;
     elementPaint;
@@ -16336,10 +16369,10 @@ class DocumentPaint {
     docContainer;
     //commsContainer!: CommsContainerRenderObject;
     viewOptions;
-    constructor(renderContext, docCtx, selectedSets) {
+    constructor(renderContext, docCtx, seo) {
         this.renderContext = renderContext;
         this.docCtx = docCtx;
-        this.selectedSets = selectedSets;
+        this.seo = seo;
         this.viewOptions = this.docCtx.viewOptions;
         this.elementMeasure = new ElementMeasure(this.docCtx, this.renderContext);
         this.elementRenderCut = new ElementRenderCut(this.viewOptions, this.renderContext);
@@ -16361,7 +16394,7 @@ class DocumentPaint {
         // //console.timeEnd('排版计时');
         // //console.time('断页计时');
         // const docPages = this.elementRenderCut.cutPage(documentRender, this.docCtx.document);
-        const newMeasure = new DocumentArrange(this.docCtx, this.renderContext);
+        const newMeasure = new DocumentArrange(this.docCtx, this.renderContext, this.seo);
         const docPages = newMeasure.measureDoc();
         // this.commsContainer = newMeasure.commentsRender as CommsContainerRenderObject;
         // if (this.commsContainer) {
@@ -16458,7 +16491,7 @@ class DocumentPaint {
         }
     }
     refreshView() {
-        this.elementPaint.drawPages(this.docContainer, this.selectedSets);
+        this.elementPaint.drawPages(this.docContainer, this.seo.selectionEleSets);
     }
     getDocPages() {
         return this.docPages;
@@ -16473,31 +16506,31 @@ class DocumentPaint {
         if (!this.viewOptions.showReviewWindow) {
             return;
         }
-        const cce = this.docCtx.document.commentsContainerElement;
-        const set = new Map();
-        const commentRangeStatus = [];
-        for (let i = 0; i < cce.length; i++) {
-            const commContent = cce.getChild(i);
-            const commMarkPair = cce.markPairs.find(item => item.id === commContent.props.id);
-            if (commMarkPair) {
-                if (commMarkPair.start) {
-                    commContent.startMark = commMarkPair.start;
-                }
-                if (commMarkPair.end) {
-                    commContent.endMark = commMarkPair.end;
-                }
-            }
-            const { startMark, endMark, props: { id }, focus } = commContent;
-            const ancestorCommonControl = DocumentSelection.getAncestorCommonControl(startMark, endMark);
-            const commonRange = RangeUtil.getSelctionRange(startMark, 0, endMark, 1, ancestorCommonControl);
-            SelectionOverlays.addToCommentSets(commonRange, set);
-            commentRangeStatus.push({
-                commContent,
-                range: commonRange
-            });
-        }
-        cce.cacheRender.selectedSet = set;
-        cce.cacheRender.commentRangeStatus = commentRangeStatus;
+        // const cce = this.docCtx.document.commentsContainerElement;
+        // const set = new Map<Element, SelectionContentRange>();
+        // const commentRangeStatus: Array<CommentRangeStatus> = [];
+        // for (let i = 0; i < cce.length; i++) {
+        //     const commContent = cce.getChild(i) as CommContentElement;
+        //     const commMarkPair = cce.markPairs.find(item => item.id === commContent.props.id);
+        //     if (commMarkPair) {
+        //         if (commMarkPair.start) {
+        //             commContent.startMark = commMarkPair.start;
+        //         }
+        //         if (commMarkPair.end) {
+        //             commContent.endMark = commMarkPair.end;
+        //         }
+        //     }
+        //     const {startMark, endMark, props: {id}, focus} = commContent;
+        //     const ancestorCommonControl = DocumentSelection.getAncestorCommonControl(startMark, endMark);
+        //     const commonRange = RangeUtil.getSectionRange(startMark, 0, endMark, 1, ancestorCommonControl);
+        //     SelectionOverlays.addToCommentSets(commonRange, set);
+        //     commentRangeStatus.push({
+        //         commContent,
+        //         range: commonRange
+        //     })
+        // }
+        // (<CommsContainerRenderObject>cce.cacheRender).selectedSet = set;
+        // (<CommsContainerRenderObject>cce.cacheRender).commentRangeStatus = commentRangeStatus;
     }
 }
 
@@ -16697,15 +16730,15 @@ class ElementReader {
         document.bodyElement = document.find((item) => item instanceof DocumentBodyElement);
         document.headerElement = document.find((item) => item instanceof DocumentHeaderElement);
         document.footerElement = document.find((item) => item instanceof DocumentFooterElement);
-        document.commentsContainerElement = document.find((item) => item instanceof CommsContainerElement);
-        if (!document.commentsContainerElement) {
-            document.commentsContainerElement = new CommsContainerElement();
-        }
+        // document.commentsContainerElement = document.find((item) => item instanceof CommsContainerElement) as CommsContainerElement;
+        // if (!document.commentsContainerElement) {
+        //     document.commentsContainerElement = new CommsContainerElement();
+        // }
         document.clearItems();
         document.addChild(document.headerElement);
         document.addChild(document.bodyElement);
         document.addChild(document.footerElement);
-        document.addChild(document.commentsContainerElement);
+        //document.addChild(document.commentsContainerElement);
         this.docCtx.document = document;
         document.viewOptions = this.docCtx.viewOptions;
         const width = Math.floor(document.props.width * this.docCtx.viewOptions.mmToPixelsRatio);
@@ -16713,7 +16746,7 @@ class ElementReader {
         this.docCtx.viewOptions.docPageSettings = new PageOptions(width, height, document.props.orient);
         //this.viewOptions.viewSettings.width = this.viewOptions.docPageSettings.width + 10;
     }
-    readElement(data) {
+    readElement(data, strictMode = false) {
         if (typeof data === 'string') {
             data = JSON.parse(data);
         }
@@ -16728,19 +16761,27 @@ class ElementReader {
                     const children = data.children || [];
                     for (const child of children) {
                         //element.addChild(this.readElement(child));
-                        childArr.push(this.readElement(child));
+                        const childEle = this.readElement(child);
+                        childEle && childArr.push(childEle);
                     }
                 }
                 factory.readCompleted(element, childArr);
                 return element;
             }
         }
-        throw new Error('未知的元素类型:' + type);
+        if (strictMode) {
+            throw new Error('未知的元素类型:' + type, data);
+        }
+        else {
+            console.error('未知的元素类型:' + type, data);
+            return null;
+        }
     }
-    // propsReadFuncs: Map<string, (data: any) => any> = new Map();
-    // registerReadFunc<T>(propName: string, func: (data: T) => T): void {
-    //     this.propsReadFuncs.set(propName, func);
-    // }
+    /**
+     * 读取扩展属性
+     * @param data
+     * @param element
+     */
     readExtendsProps(data, element) {
         if (!data.props) {
             return;
@@ -19588,7 +19629,7 @@ class DocumentChange {
             return paragraph;
         }
         const last = ElementUtil.getLastLeafElement(paragraph);
-        const selectedParaRange = RangeUtil.getSelctionRange(startControl, startOffset, last, 1, paragraph);
+        const selectedParaRange = RangeUtil.getSectionRange(startControl, startOffset, last, 1, paragraph);
         selectedParaRange.isFullSelected = false;
         const breakPara = ElementUtil.cloneRange(selectedParaRange, true);
         ElementUtil.fixParagraphContent(paragraph);
@@ -20210,22 +20251,26 @@ class DocumentChange {
         const id = nanoid.nanoid(5);
         const startCommMark = new CommentElement();
         startCommMark.props.id = id;
+        startCommMark.props.userId = this.viewOptions.editUser.id;
+        startCommMark.props.userName = this.viewOptions.editUser.name;
+        startCommMark.props.date = CommonUtil.formatNow('YYYY-MM-DD HH:mm:ss');
         startCommMark.props.markType = 'start';
         const endCommMark = new CommentElement();
         endCommMark.props.id = id;
         endCommMark.props.markType = 'end';
         this.insertElement(endControl, endOffset, [endCommMark]);
         this.insertElement(startControl, startOffset, [startCommMark]);
-        const commContent = new CommContentElement();
-        commContent.props.id = id;
-        commContent.props.createId = this.viewOptions.editUser.id;
-        commContent.props.createName = this.viewOptions.editUser.name;
-        commContent.props.createDate = new Date();
-        const pos = this.docComment.getCommMarkIndex(startCommMark);
-        if (pos < 0) {
-            throw new Error('获取插入的批注位置不正确');
-        }
-        this.docCtx.document.commentsContainerElement.addChild(commContent, pos);
+        startCommMark.props.text = '插入测试批注信息' + new Date();
+        // const commContent = new CommContentElement();
+        // commContent.props.id = id;
+        // commContent.props.createId = this.viewOptions.editUser.id;
+        // commContent.props.createName = this.viewOptions.editUser.name;
+        // commContent.props.createDate = new Date();
+        // const pos = this.docComment.getCommMarkIndex(startCommMark);
+        // if (pos < 0) {
+        //     throw new Error('获取插入的批注位置不正确');
+        // }
+        // this.docCtx.document.commentsContainerElement.addChild(commContent, pos);
         this.selectionState.clear();
     }
     validate() {
@@ -20249,8 +20294,8 @@ class DocumentChange {
             validateElement.props.title = caption + '验证';
             validateElement.props.id = id;
             validateElement.setContent(item.error);
-            const pos = this.docComment.getCommMarkIndex(startCommMark);
-            this.docCtx.document.commentsContainerElement.addChild(validateElement, pos);
+            this.docComment.getCommMarkIndex(startCommMark);
+            //this.docCtx.document.commentsContainerElement.addChild(validateElement, pos);
         });
         this.docCtx.selectionState.clear();
         return false;
@@ -20676,7 +20721,6 @@ class DocumentComment {
         // }
         // this.commMarkList = commList;
         // this.commContentList = commContentList;
-        this.docCtx.viewOptions.showReviewWindow = this.docCtx.document.commentsContainerElement.markPairs.length > 0;
         this.isDirty = false;
     }
     /**
@@ -20712,28 +20756,46 @@ class DocumentComment {
             if (!endRange) {
                 return;
             }
-            const commPairs = [];
-            const markPairs = this.docCtx.document.commentsContainerElement.markPairs;
-            for (let i = 0; i < markPairs.length; i++) {
-                const { start: startMark, end: endMark } = markPairs[i];
-                if (!startMark || !endMark) {
-                    continue;
-                }
-                const commPair = {
-                    startMark,
-                    endMark,
-                    startMarkStatus: RangeUtil.checkElementFullInRange(selectedRange, startMark),
-                    endMarkStatus: RangeUtil.checkElementFullInRange(selectedRange, endMark),
-                };
-                commPairs.push(commPair);
-            }
-            for (let i = 0; i < commPairs.length; i++) {
-                const commPair = commPairs[i];
-                if (commPair.endMarkStatus) {
-                    this.removeComment(commPair.endMark.props.id);
+            const selectedComms = [];
+            RangeUtil.recursionTraversalRangeHandler(selectedRange, (range) => {
+                if (range.target instanceof CommentElement && range.isFullSelected) {
+                    selectedComms.push(range.target);
                 }
-                else if (commPair.startMarkStatus) ;
+            });
+            if (selectedComms.length > 0) {
+                const ids = selectedComms.map(item => item.props.id);
+                const commList = this.docCtx.document.treeFilter(item => item.type === 'comm' && ids.indexOf(item.props.id) >= 0);
+                commList.forEach(item => item.remove());
+                return;
             }
+            return;
+            //     const commPairs: Array<CommMarkSelectedStatus> = [];
+            //     const markPairs = this.docCtx.document.commentsContainerElement.markPairs;
+            //     for (let i = 0; i < markPairs.length; i++) {
+            //         const {start: startMark, end: endMark} = markPairs[i];
+            //         if (!startMark || !endMark) {
+            //             continue;
+            //         }
+            //         const commPair: CommMarkSelectedStatus = {
+            //             startMark,
+            //             endMark,
+            //             startMarkStatus: RangeUtil.checkElementFullInRange(selectedRange, startMark),
+            //             endMarkStatus: RangeUtil.checkElementFullInRange(selectedRange, endMark),
+            //         };
+            //         commPairs.push(commPair)
+            //     }
+            //
+            //     for (let i = 0; i < commPairs.length; i++) {
+            //         const commPair = commPairs[i];
+            //         if (commPair.endMarkStatus) {
+            //             this.removeComment(commPair.endMark.props.id);
+            //         } else if (commPair.startMarkStatus) {
+            //             // const newStartMark = new CommentElement();
+            //             // newStartMark.props.id = commPair.startMark.props.id;
+            //             // commPair.startMark.isDecorate = false;
+            //             // DocumentChange.insertElement(endRange.target, endRange.endOffset, [newStartMark]);
+            //         }
+            //     }
         }
     }
     /**
@@ -20741,7 +20803,7 @@ class DocumentComment {
      * @param id
      */
     removeComment(id) {
-        this.docCtx.document.commentsContainerElement.removeCommMark(id);
+        this.docCtx.document.removeCommMark(id);
     }
     getCommMarkIndex(commMark) {
         const markType = commMark.props.markType;
@@ -20753,7 +20815,7 @@ class DocumentComment {
      * 清除所有批注
      */
     clearAllComments() {
-        this.docCtx.document.commentsContainerElement.clearAllComms();
+        this.docCtx.document.clearAllComms();
         this.docCtx.selectionState.clear();
     }
     /**
@@ -21179,15 +21241,15 @@ class ElementTrackManage {
 
 class DocumentSvg {
     viewOptions;
-    selectedSets;
+    sso;
     renderCtx;
     highlights = [];
     mode = "view";
     //当前页位置
     pagePos;
-    constructor(viewOptions, selectedSets, renderCtx) {
+    constructor(viewOptions, sso, renderCtx) {
         this.viewOptions = viewOptions;
-        this.selectedSets = selectedSets;
+        this.sso = sso;
         this.renderCtx = renderCtx;
     }
     getVNode(render, selectionRects, parentPos) {
@@ -21197,22 +21259,8 @@ class DocumentSvg {
             width: render.rect.width,
             height: render.rect.height
         };
-        if (this.selectedSets.has(render.element)) {
-            const range = this.selectedSets.get(render.element);
-            if (render.element && render instanceof LeafRenderObject) {
-                if (range.isFullSelected) {
-                    selectionRects.push(currPos);
-                }
-                else {
-                    if (render.element instanceof TextGroupElement && range.endOffset > range.startOffset) {
-                        const { startX, endX } = ElementUtil.getTextRenderHorX(render, range.startOffset, range.endOffset);
-                        const width = endX - startX;
-                        const x = currPos.x + startX;
-                        selectionRects.push({ x, y: currPos.y, width, height: currPos.height });
-                    }
-                }
-            }
-        }
+        //处理选区遮罩
+        this.createSelectionRect(render, selectionRects, currPos);
         //审阅窗口重新计算位置
         if (this.viewOptions.showReviewWindow && render instanceof CommsContainerRenderObject) {
             CommentsUtil.arrangeComments(render);
@@ -21276,12 +21324,18 @@ class DocumentSvg {
             if (selectionRectsTemp.length > 0) {
                 const startX = selectionRectsTemp[0].x;
                 const endX = selectionRectsTemp[selectionRectsTemp.length - 1].x + selectionRectsTemp[selectionRectsTemp.length - 1].width;
-                selectionRects.push({ x: startX, y: currPos.y, width: endX - startX, height: currPos.height });
+                selectionRects.push({
+                    x: startX,
+                    y: currPos.y,
+                    width: endX - startX,
+                    height: currPos.height,
+                    color: selectionRectsTemp[0].color
+                });
                 selectionRectsTemp.length = 0;
             }
         }
         else if (render instanceof TableCellRenderObject) {
-            if (this.selectedSets.has(render.element) && this.selectedSets.get(render.element)?.isFullSelected) {
+            if (this.sso.selectionEleSets.has(render.element) && this.sso.selectionEleSets.get(render.element)?.isFullSelected) {
                 selectionRects.push(currPos);
                 selectionRectsTemp.length = 0;
             }
@@ -21323,11 +21377,39 @@ class DocumentSvg {
         }
         return currVNode;
     }
+    createSelectionRect(render, selectionRects, currPos) {
+        const items = [this.sso.selectionEleSets, this.sso.commRangeSets];
+        for (const item of items) {
+            if (item.has(render.element)) {
+                const range = item.get(render.element);
+                if (render.element && render instanceof LeafRenderObject) {
+                    if (range.isFullSelected) {
+                        selectionRects.push({ ...currPos, color: range['rangeColor'] });
+                    }
+                    else {
+                        if (render.element instanceof TextGroupElement && range.endOffset > range.startOffset) {
+                            const { startX, endX } = ElementUtil.getTextRenderHorX(render, range.startOffset, range.endOffset);
+                            const width = endX - startX;
+                            const x = currPos.x + startX;
+                            // @ts-ignore
+                            selectionRects.push({
+                                x,
+                                y: currPos.y,
+                                width,
+                                height: currPos.height,
+                                color: range['rangeColor']
+                            });
+                        }
+                    }
+                }
+            }
+        }
+    }
     getHTMLVNode(docRenders) {
         this.counterMap = {};
-        const pageNodes = docRenders.filter(item => this.checkInViewBox(item)).map(item => {
+        return docRenders.filter(item => this.checkInViewBox(item)).map(item => {
             const pageSvg = this.getPageSvgVNode(item);
-            const pageUnit = {
+            return {
                 sel: 'div.page-unit',
                 data: {
                     style: {
@@ -21342,9 +21424,7 @@ class DocumentSvg {
                 },
                 children: [pageSvg]
             };
-            return pageUnit;
         });
-        return pageNodes;
     }
     /**
      * 判断当前元素是否在视窗内
@@ -21382,7 +21462,7 @@ class DocumentSvg {
                 ns: 'http://www.w3.org/2000/svg',
                 attrs: {
                     stroke: 'none',
-                    fill: 'rgb(85,165,255)',
+                    fill: item.color ?? 'rgb(85,165,255)',
                     'paint-order': 'stroke fill markers',
                     d: `M${item.x} ${item.y} L${item.x + item.width} ${item.y} L${item.x + item.width} ${item.y + item.height} L${item.x} ${item.y + item.height} Z`,
                     'fill-opacity': '0.5'
@@ -26392,7 +26472,10 @@ class DocumentPrintOffscreenBase {
         const ss = new SelectionState();
         this.docCtx = new EditorContext(ss, this.viewOptions);
         this.renderCtx = this.createRenderCtx(ctx, this.viewOptions, this.docCtx);
-        this.documentPaint = new DocumentPaint(this.renderCtx, this.docCtx, new Map());
+        this.documentPaint = new DocumentPaint(this.renderCtx, this.docCtx, {
+            selectionEleSets: new Map(),
+            commRangeSets: new Map()
+        });
         this.elementReader = new ElementReader(this.docCtx);
         this.docCtx.syncRefresh = () => {
         };
@@ -26407,8 +26490,8 @@ class DocumentPrintOffscreenBase {
     //     const docProps = this.docCtx.document.props;
     //     printNodes(canvasNodes, {...docProps});
     // }
-    async print(data, ranges = null) {
-        await this.prepare(data);
+    print(data, ranges = null) {
+        this.prepare(data);
         const canvasNodes = this.getSvgNodes(this.documentPaint.docPages, ranges);
         if (!canvasNodes.length) {
             console.warn('无可打印页');
@@ -26423,7 +26506,7 @@ class DocumentPrintOffscreenBase {
     /**
      * 续打
      */
-    async printForContinuation(data, options) {
+    printForContinuation(data, options) {
         this.afterRenderEvent.subscribe((event) => {
             const { index, renderCtx, docRender, pageSvgVNode } = event;
             if (index === options.startDocIndex && options.startY !== 0) {
@@ -26437,7 +26520,7 @@ class DocumentPrintOffscreenBase {
                 pageSvgVNode.data.attrs['clip-path'] = `url(#${'page-clip-' + index})`;
             }
         });
-        await this.prepare(data);
+        this.prepare(data);
         const printRanges = new Array(this.documentPaint.docPages.length).fill(0).map((item, index) => index).filter(index => index >= options.startDocIndex);
         let svgNodes = this.getSvgNodes(this.documentPaint.docPages, printRanges);
         if (!svgNodes.length) {
@@ -26462,8 +26545,8 @@ class DocumentPrintOffscreenBase {
     //     }
     //     return canvasNodes.map(node => node.toDataURL());
     // }
-    async getPrintNodes(data, ranges = null) {
-        await this.prepare(data);
+    getPrintNodes(data, ranges = null) {
+        this.prepare(data);
         const canvasNodes = this.getSvgNodes(this.documentPaint.docPages, ranges);
         return canvasNodes;
     }
@@ -26474,11 +26557,11 @@ class DocumentPrintOffscreenBase {
      * 读取数据，排版
      * @param data
      */
-    async prepare(data) {
+    prepare(data) {
         //将doc的json格式数据读取转化为DocumentElement的树
         this.elementReader.read(data);
         this.documentPaint.rePages();
-        await Promise.all(this.docCtx.imageLoader.getLoadTasks());
+        //await Promise.all(this.docCtx.imageLoader.getLoadTasks());
         const { scale, docPageSettings: { width, height } } = this.viewOptions;
         this.renderCtx.update({ scale, width, height });
         ElementUtil.setCanvasProps(this.renderCtx.mainContext.ctx.canvas, this.renderCtx.mainContext.ctx, {
@@ -26513,7 +26596,10 @@ class DocumentPrintOffscreenBase {
     //     return canvasList;
     // }
     getSvgNodes(docRenders, printRanges = null) {
-        const docSvgHelper = new DocumentSvg(this.viewOptions, new Map(), this.renderCtx); //.getHTMLVNode(docRenders) as Array<EditorVNodeObject>;
+        const docSvgHelper = new DocumentSvg(this.viewOptions, {
+            selectionEleSets: new Map,
+            commRangeSets: new Map()
+        }, this.renderCtx); //.getHTMLVNode(docRenders) as Array<EditorVNodeObject>;
         docSvgHelper.mode = 'print';
         const patch = init([
             modules.class,
@@ -26557,31 +26643,6 @@ class DocumentPrintOffscreen extends DocumentPrintOffscreenBase {
     }
 }
 
-let activeEditorContext = null;
-function setActiveEditorContext(ctx) {
-    activeEditorContext = ctx;
-}
-function createSignal(state) {
-    let _state = state;
-    const activeCtx = activeEditorContext;
-    const signal = {
-        get value() {
-            return _state;
-        },
-        set value(v) {
-            if (v === _state) {
-                return;
-            }
-            _state = v;
-            signal.onChange();
-        },
-        onChange: () => {
-            activeCtx?.onChange();
-        }
-    };
-    return signal;
-}
-
 /**
  * 渲染日历虚拟节点处理类
  */
@@ -27450,6 +27511,8 @@ class DocEditor {
     onDestroy = new Subject$1();
     beforeNodePatch = new Subject$1();
     afterNodePatch = new Subject$1();
+    //自定义事件传递消息
+    eventBus;
     editInput;
     scrollContainer;
     constructor(svgContainer) {
@@ -27480,13 +27543,14 @@ class DocEditor {
         this.renderContext.init({ width: 500, height: 500, scale: 1 });
         this.selectionState = this.documentSelection.selectionState;
         this.selectionOverlays = new SelectionOverlays(this.documentSelection.selectionState);
-        this.documentPaint = new DocumentPaint(this.renderContext, this.docCtx, this.selectionOverlays.selectedSets);
+        this.documentPaint = new DocumentPaint(this.renderContext, this.docCtx, this.selectionOverlays);
         this.documentInput = new DocumentInput(this.docCtx);
         this.docComment = new DocumentComment(this.docCtx);
         this.elementReader = new ElementReader(this.docCtx);
         this.documentChange = new DocumentChange(this.elementReader, this.docCtx, this.docComment, this.documentInput);
         this.documentEvent = new DocumentEvent(this.documentPaint, this.docCtx, this.documentInput);
         this.historyMange = new ElementTrackManage(this.docCtx, this.elementReader);
+        this.eventBus = new EventBus();
         this.createPatch();
         this.documentEvent.hitInfoChanged.subscribe((hitInfo) => {
             this.hitInfoChanged(hitInfo);
@@ -28071,6 +28135,7 @@ class DocEditor {
         this.docCtx.destroy();
         this.documentEvent.clearSubEvent();
         this.selectionState.destroy();
+        this.eventBus.clear();
         this.destroyDOM();
         this.flushTask = null;
         Object.keys(this).forEach(key => {
@@ -28584,7 +28649,7 @@ class DocEditor {
                 this.tipContainer = tipsContainer;
                 docContent.data.style.height = this.documentPaint.getDocumentContainerHeight().height + 'px';
                 const docRenders = this.documentPaint.docContainer.getItems();
-                const svgGenerator = new DocumentSvg(this.viewOptions, this.selectionOverlays.selectedSets, this.renderContext);
+                const svgGenerator = new DocumentSvg(this.viewOptions, this.selectionOverlays, this.renderContext);
                 const vNode = svgGenerator.getHTMLVNode(docRenders);
                 const children = docContent.children;
                 children.push(tipsContainer);
@@ -28891,7 +28956,7 @@ class DocEditor {
         rule.setRuleOptions({ width: this.viewOptions.docPageSettings.width, pagePL, pagePR, docLeft });
     }
     version() {
-        return "2.1.18";
+        return "2.1.19";
     }
     switchPageHeaderEditor() {
         this.docCtx.document.switchPageHeaderEditor(this.selectionState, null);
@@ -28901,6 +28966,9 @@ class DocEditor {
         const paraTexts = paras.map(item => ElementSerialize.serializeString(item, { all: false }));
         return paraTexts.join('\n');
     }
+    emit(event, args) {
+        this.eventBus.emit(event, args);
+    }
 }
 
 /**
@@ -29172,8 +29240,6 @@ exports.DocumentFooterRenderObject = DocumentFooterRenderObject;
 exports.DocumentHeaderElement = DocumentHeaderElement;
 exports.DocumentHeaderFactory = DocumentHeaderFactory;
 exports.DocumentHeaderRenderObject = DocumentHeaderRenderObject;
-exports.DocumentImagesBaseLoader = DocumentImagesBaseLoader;
-exports.DocumentImagesLoader = DocumentImagesLoader;
 exports.DocumentInput = DocumentInput;
 exports.DocumentPaint = DocumentPaint;
 exports.DocumentPrintOffscreen = DocumentPrintOffscreen;
@@ -29191,6 +29257,7 @@ exports.ElementPaint = ElementPaint;
 exports.ElementReader = ElementReader;
 exports.ElementSerialize = ElementSerialize;
 exports.ElementUtil = ElementUtil;
+exports.EventBus = EventBus;
 exports.EventMap = EventMap;
 exports.EventSourceCore = EventSourceCore$1;
 exports.FillNullSpaceElement = FillNullSpaceElement;