@hailin-zheng/editor-core 1.0.6 → 1.0.9

package/{lib/framework/impl/checkbox/checkbox-impl.js → src/med_editor/framework/impl/checkbox/checkbox-impl.ts}

@@ -1,47 +1,53 @@
-import { ElementFactory, LeafElement } from "@/med_editor/framework/element-define";
-import { CheckBoxProps } from "@/med_editor/framework/element-props";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { LeafRenderObject } from "@/med_editor/framework/render-define";
-export class CheckBoxElement extends LeafElement {
+import { ElementFactory, LeafElement, readElementProps, SerializeProps, ViewOptions } from "../../element-define";
+import { CheckBoxProps } from "../../element-props";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
+import { ElementEvent } from "../../element-event-define";
+
+export class CheckBoxElement extends LeafElement<CheckBoxProps> {
     //props: CheckBoxProps;
     constructor() {
         super('ckb');
         this.props = new CheckBoxProps();
         //this.addPropValueChangedSub(this.props);
-        this.cursorType = 'default';
-        this.addEvent('ElementClick', (evt) => { this.changeState(evt); });
+        this.cursorType = 'default'
+        this.addEvent('ElementClick', (evt) => { this.changeState(evt) });
     }
-    createRenderObject() {
+    createRenderObject(): CheckBoxRenderObject {
         const render = new CheckBoxRenderObject(this);
         render.rect.width = this.props.size + 4;
         render.rect.height = this.props.size;
         return render;
     }
-    changeState(e) {
+
+    changeState(e: ElementEvent): void {
         this.props.isChecked = !this.props.isChecked;
     }
-    serialize(viewOptions) {
+
+    serialize(viewOptions: ViewOptions): SerializeProps {
         return {
             type: 'ckb',
             props: {
                 ...this.props.getSerializeProps(viewOptions)
             }
-        };
+        }
     }
-    clone() {
+    clone(): CheckBoxElement {
         const clone = new CheckBoxElement();
         this.props.clone(clone.props);
         return clone;
     }
-    getType() {
+    getType(): string {
         return 'ckb';
     }
 }
-export class CheckBoxFactory extends ElementFactory {
-    match(type) {
+
+export class CheckBoxFactory extends ElementFactory<CheckBoxProps> {
+    match(type: string): boolean {
         return type === 'ckb';
     }
-    createElement(data, renderCtx) {
+    createElement(data: readElementProps<CheckBoxProps>, renderCtx: RenderContenxtType): CheckBoxElement {
         const props = data.props;
         const ckbElement = new CheckBoxElement();
         const ckbProps = ckbElement.props;
@@ -51,14 +57,15 @@ export class CheckBoxFactory extends ElementFactory {
         return ckbElement;
     }
 }
-export class CheckBoxRenderObject extends LeafRenderObject {
-    render(ctx, position) {
+
+export class CheckBoxRenderObject extends LeafRenderObject<CheckBoxElement> {
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         ctx.contentContext.drawCheckBox(position.x + 2, position.y, this.element.props.size, this.element.props.size, this.element.props.isChecked);
     }
-    clone(cloneData = true) {
+    clone(cloneData = true): RenderObject {
         const clone = new CheckBoxRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         return clone;
     }
+
 }
-//# sourceMappingURL=checkbox-impl.js.map

package/{lib/framework/impl/comments/comment-content-impl.js → src/med_editor/framework/impl/comments/comment-content-impl.ts}

@@ -1,84 +1,94 @@
-import { BlockContainerElement, ElementFactory } from "../../element-define";
+import { BlockContainerElement, ElementFactory, Position, readElementProps, Rect, SelectionContentRange, SerializeProps, ViewOptions } from "../../element-define";
 import { CommContentProps, TextProps } from "../../element-props";
+import { Element } from "../../element-define"
 import { ElementUtil } from "../../element-util";
-import { BlockContainerRenderObject } from "../../render-define";
+import { RenderContenxtType } from "../../render-context";
+import { BlockContainerRenderObject, RenderObject } from "../../render-define";
 import { DocumentRenderObject } from "../document/doc-impl";
+import { CommentElement } from "./comment-element-impl";
 import moment from "moment";
-export class CommContentBaseElement extends BlockContainerElement {
-    startMark;
-    endMark;
-    focus = false;
-    constructor(type) {
+
+export abstract class CommContentBaseElement<P extends object = { id: string }> extends BlockContainerElement<P>{
+    startMark!: CommentElement;
+    endMark!: CommentElement;
+    focus: boolean = false;
+    protected constructor(type: string) {
         super(type);
         this.addEvent('GotCursor', () => {
             this.focus = true;
-            this.refreshView();
+            this.refreshView()
         });
         this.addEvent('LostCursor', () => {
             this.focus = false;
-            this.refreshView();
-        });
+            this.refreshView()
+        })
     }
 }
-export class CommContentBaseRenderObject extends BlockContainerRenderObject {
-    commMarkRender;
+
+export abstract class CommContentBaseRenderObject<E extends CommContentBaseElement> extends BlockContainerRenderObject<E> {
+    commMarkRender!: { render: RenderObject, pos: Position };
 }
-export class CommContentElement extends CommContentBaseElement {
+
+export class CommContentElement extends CommContentBaseElement<CommContentProps> {
     constructor() {
         super("comm-content");
         this.props = new CommContentProps();
     }
-    createRenderObject(options, renderCtx) {
+    createRenderObject(options: ViewOptions, renderCtx: RenderContenxtType): RenderObject {
         const render = new CommContentRenderObject(this);
         render.padding.left = 14;
         render.padding.top = 24;
         return render;
     }
-    serialize(viewOptions) {
+    serialize(viewOptions: ViewOptions): SerializeProps {
         return {
             type: this.type,
             props: { ...this.props.getSerializeProps(viewOptions) }
-        };
+        }
     }
-    clone(data) {
+    clone(data: boolean): Element {
         throw new Error('不支持');
     }
 }
-export class CommContentRenderObject extends CommContentBaseRenderObject {
-    beginRender(ctx, position) {
+
+export class CommContentRenderObject extends CommContentBaseRenderObject<CommContentElement> {
+    beginRender(ctx: RenderContenxtType, position: Position): void {
         let borderColor = this.element.focus ? '#fa8c16' : '#ffd591';
         ctx.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, borderColor);
-        ctx.contentContext.fillRect(position.x, position.y, 8, this.rect.height, '#871400');
-        const docRender = ElementUtil.getParentRender(this.commMarkRender.render, DocumentRenderObject);
+        ctx.contentContext.fillRect(position.x, position.y, 8, this.rect.height, '#871400')
+        const docRender = ElementUtil.getParentRender(this.commMarkRender.render, DocumentRenderObject) as DocumentRenderObject;
         //获取审阅标记的绘制坐标
         let commMarkPos = ElementUtil.getRenderAbsolutePaintPos(this.commMarkRender.render, { x: 0, y: -ctx.viewOptions.translateY });
         const commMarkLinePos = ElementUtil.getParaLinePos(this.commMarkRender.render, commMarkPos);
         commMarkPos.y = commMarkLinePos.y + 2;
+
         const docRenderPos = ElementUtil.getRenderAbsolutePaintPos(docRender, { x: 0, y: -ctx.viewOptions.translateY });
         const marginLeft = commMarkPos.x - docRenderPos.x - docRender.padding.left;
         const marginRight = ctx.viewOptions.docPageSettings.width - marginLeft - docRender.padding.right * 2;
         ctx.overlaysContext.drawDashLine([commMarkPos, { x: commMarkPos.x + marginRight, y: commMarkPos.y }], [1, 1], 'red');
         ctx.overlaysContext.drawDashLine([{ x: commMarkPos.x + marginRight, y: commMarkPos.y }, position], [1, 1], 'red');
+
         this.renderTitle(ctx, position);
     }
-    renderTitle(ctx, position) {
+
+    renderTitle(ctx: RenderContenxtType, position: Position): void {
         const topPadding = 24;
         const { props } = this.element;
         const textProps = new TextProps();
         textProps.fontSize = 12;
         textProps.fontName = '楷体';
         textProps.color = "rgb(0,0,0)";
-        const createDate = moment(props.createDate).format('YYYY-MM-DD HH:mm');
+        const createDate = moment(props.createDate).format('YYYY-MM-DD HH:mm')
         const commTitle = `${props.createName}:${createDate}`;
         const { width, height } = ctx.contentContext.measureText(commTitle, textProps);
-        const rect = { x: position.x + this.padding.left, y: position.y, width, height, maxHeight: 0, maxWidth: 0 };
+        const rect: Rect = { x: position.x + this.padding.left, y: position.y, width, height, maxHeight: 0, maxWidth: 0 }
         rect.y += (topPadding - rect.height) / 2;
         ctx.contentContext.drawText(commTitle, textProps, rect.x, rect.y, rect.width, rect.height);
     }
-    endRender(ctx, position) {
+    endRender(ctx: RenderContenxtType, position: Position): void {
         //throw new Error("Method not implemented.");
     }
-    clone() {
+    clone(): RenderObject {
         const clone = new CommContentRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         clone.padding = this.padding.clone();
@@ -88,12 +98,17 @@ export class CommContentRenderObject extends CommContentBaseRenderObject {
         return clone;
     }
 }
-export class CommentContentFactory extends ElementFactory {
-    match(type) {
+
+export interface CommentRangeStatus {
+    range: SelectionContentRange, commContent: CommContentBaseElement
+}
+
+export class CommentContentFactory extends ElementFactory<CommContentProps> {
+    match(type: string): boolean {
         return type === "comm-content";
     }
-    createElement(data, renderCtx) {
-        const props = data.props;
+    createElement(data: readElementProps<CommContentProps>, renderCtx: RenderContenxtType): Element {
+        const props = data.props as CommContentProps;
         const commentEle = new CommContentElement();
         commentEle.props.id = props.id;
         commentEle.props.createDate = props.createDate;
@@ -102,4 +117,3 @@ export class CommentContentFactory extends ElementFactory {
         return commentEle;
     }
 }
-//# sourceMappingURL=comment-content-impl.js.map

package/{lib/framework/impl/comments/comment-element-impl.js → src/med_editor/framework/impl/comments/comment-element-impl.ts}

@@ -1,62 +1,65 @@
-import { ElementFactory, LeafElement } from "@/med_editor/framework/element-define";
-import { CommProps } from "@/med_editor/framework/element-props";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { LeafRenderObject } from "@/med_editor/framework/render-define";
-export class CommentElement extends LeafElement {
+import { Element, ElementFactory, LeafElement, readElementProps, SerializeProps, ViewOptions } from "../../element-define";
+import { CommProps } from "../../element-props";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
+
+export class CommentElement extends LeafElement<CommProps> {
     constructor() {
         super('comm');
         this.isDecorate = true;
         this.disableClick = true;
         this.props = new CommProps();
     }
-    createRenderObject(options, renderCtx) {
+    createRenderObject(options: ViewOptions, renderCtx: RenderContenxtType): RenderObject {
         const render = new CommentRenderObject(this);
         render.rect.width = 0;
         render.rect.height = 14;
         return render;
     }
-    serialize(viewOptions) {
-        if (this.isDecorate) {
-            return null;
+    serialize(viewOptions: ViewOptions): SerializeProps|null {
+        if(this.isDecorate){
+            return  null;
         }
         return {
             type: this.type,
             props: {
                 ...this.props.getSerializeProps(viewOptions)
             }
-        };
+        }
     }
-    clone() {
+    clone(): Element {
         const clone = new CommentElement();
         this.props.clone(clone.props);
         return clone;
     }
 }
-export class CommentRenderObject extends LeafRenderObject {
-    render(ctx, position) {
+
+export class CommentRenderObject extends LeafRenderObject<CommentElement> {
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         if (!ctx.viewOptions.showReviewWindow) {
             return;
         }
         const paraLinePos = ElementUtil.getParaLinePos(this, { x: position.x, y: position.y });
         const color = '#ff4d4f';
-        ctx.contentContext.fillRect(position.x - 1, paraLinePos.y, 2, paraLinePos.height, color);
+        ctx.contentContext.fillRect(position.x - 1, paraLinePos.y, 2, paraLinePos.height, color)
     }
-    clone() {
+    clone(): RenderObject {
         const clone = new CommentRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         return clone;
     }
 }
-export class CommentFactory extends ElementFactory {
-    match(type) {
+
+export class CommentFactory extends ElementFactory<CommProps> {
+    match(type: string): boolean {
         return type === "comm";
     }
-    createElement(data, renderCtx) {
+    createElement(data: readElementProps<CommProps>, renderCtx: RenderContenxtType): Element {
         const ele = new CommentElement();
-        const props = data.props;
+        const props = data.props as CommProps;
         ele.props.id = props.id;
         ele.props.markType = props.markType;
         return ele;
     }
 }
-//# sourceMappingURL=comment-element-impl.js.map

package/{lib/framework/impl/comments/comments-container-impl.js → src/med_editor/framework/impl/comments/comments-container-impl.ts}

@@ -1,24 +1,27 @@
-import { BlockContainerElement, ElementFactory } from "@/med_editor/framework/element-define";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { BlockContainerRenderObject } from "@/med_editor/framework/render-define";
+import { BlockContainerElement, Element, ElementFactory, Position, SelectionContentRange, SerializeProps, ViewOptions } from "../../element-define";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { BlockContainerRenderObject, RenderObject } from "../../render-define";
+import { CommentRangeStatus } from "./comment-content-impl";
+
 export class CommsContainerElement extends BlockContainerElement {
     constructor() {
         super('comm-list');
         this.noFillEmpty = true;
     }
-    createRenderObject(options, renderCtx) {
+    createRenderObject(options: ViewOptions, renderCtx: RenderContenxtType): RenderObject {
         const render = new CommsContainerRenderObject(this);
         render.rect.maxWidth = options.reviewWindowWidth;
         render.rect.width = render.rect.maxWidth;
         return render;
     }
-    serialize(viewOptions) {
+    serialize(viewOptions: ViewOptions): SerializeProps {
         return {
             type: this.type,
             props: {}
         };
     }
-    clone(data) {
+    clone(data: boolean): Element {
         const clone = new CommsContainerElement();
         if (data) {
             for (let i = 0; i < this.length; i++) {
@@ -28,20 +31,22 @@ export class CommsContainerElement extends BlockContainerElement {
         return clone;
     }
 }
+
 export class CommsContainerRenderObject extends BlockContainerRenderObject {
     //批注内容是否已经重组,只要重新绘制的时候组合一次即可
-    isMeasureComm;
-    selectedSet;
-    commentRangeStatus = [];
-    beginRender(ctx, position) {
+    isMeasureComm!: boolean;
+    selectedSet!: Map<Element, SelectionContentRange>;
+    commentRangeStatus: Array<CommentRangeStatus> = [];
+    beginRender(ctx: RenderContenxtType, position: Position): void {
         if (this.rect.height === 0) {
             return;
         }
         ctx.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, 'black', 0.5);
     }
-    endRender(ctx, position) {
+    endRender(ctx: RenderContenxtType, position: Position): void {
+
     }
-    clone() {
+    clone(): RenderObject {
         const clone = new CommsContainerRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         for (let i = 0; i < this.length; i++) {
@@ -50,13 +55,14 @@ export class CommsContainerRenderObject extends BlockContainerRenderObject {
         return clone;
     }
 }
-export class CommentsFactory extends ElementFactory {
-    match(type) {
+
+
+export class CommentsFactory extends ElementFactory<null> {
+    match(type: string): boolean {
         return type === "comm-list";
     }
-    createElement(data, renderCtx) {
+    createElement(data: any, renderCtx: RenderContenxtType): Element {
         const commentsEle = new CommsContainerElement();
         return commentsEle;
     }
 }
-//# sourceMappingURL=comments-container-impl.js.map

package/{lib/framework/impl/comments/comments-util.js → src/med_editor/framework/impl/comments/comments-util.ts}

@@ -1,22 +1,37 @@
-import { ElementUtil } from "../../element-util";
-import { DocumentRenderObject } from "../document/doc-impl";
+import {Position} from "../../element-define";
+import {RenderContenxtType} from "../../render-context";
+import {RenderObject} from "../../render-define";
+import {ElementUtil} from "../../element-util";
+import {DocumentRenderObject} from "../document/doc-impl";
+import {CommContentBaseElement, CommContentBaseRenderObject,} from "./comment-content-impl";
+import {CommentElement, CommentRenderObject} from "./comment-element-impl";
+import {CommsContainerRenderObject} from "./comments-container-impl";
+
+interface CommMapProps {
+    commMarkRender: CommentRenderObject,
+    commMarkPos: Position,
+    commContentRender: CommContentBaseRenderObject<any>,
+    commContentPos?: Position
+}
+
 export class CommentsUtil {
-    static remeasureComments(ctx, commWindow, commContainer, map) {
-        const commMap = [];
-        const docRender = ElementUtil.getParentRender(commWindow, DocumentRenderObject);
+    static remeasureComments(ctx: RenderContenxtType, commWindow: CommsContainerRenderObject, commContainer: CommsContainerRenderObject, map: Array<{ ele: CommentElement, render: RenderObject, pos: Position }>): void {
+        const commMap: Array<CommMapProps> = [];
+        const docRender = ElementUtil.getParentRender(commWindow, DocumentRenderObject) as DocumentRenderObject;
         for (let i = 0; i < commContainer.length; i++) {
             const commRender = commContainer.getChild(i);
-            const commEle = commRender.element;
+            const commEle = commRender.element as CommContentBaseElement;
             const mapComm = map.find(item => item.ele.props.id === commEle.props.id);
             if (mapComm) {
                 const commMarkLinePos = ElementUtil.getParaLinePos(mapComm.render, mapComm.pos);
                 mapComm.pos.y = commMarkLinePos.y + 2;
-                const commContentRender = commRender.clone();
+
+                const commContentRender = commRender.clone() as CommContentBaseRenderObject<any>;
                 commContentRender.rect.x = 0;
                 commContentRender.rect.y = mapComm.pos.y;
                 commWindow.addChild(commContentRender);
                 commMap.push({
-                    commMarkRender: mapComm.render,
+                    commMarkRender: <CommentRenderObject>mapComm.render,
                     commMarkPos: mapComm.pos,
                     commContentRender: commContentRender
                 });
@@ -26,22 +41,23 @@ export class CommentsUtil {
         for (let i = 0; i < commMap.length; i++) {
             const map = commMap[i];
             const prevRender = commMap[i - 1]?.commContentRender;
-            const { commContentRender } = map;
+            const {commContentRender} = map;
             sumCommentHeight += commContentRender.rect.height + 5;
             if (prevRender) {
-                const { y: prevY, height: prevHeight } = prevRender.rect;
+                const {y: prevY, height: prevHeight} = prevRender.rect;
                 if (commContentRender.rect.y < prevY + prevHeight) {
                     commContentRender.rect.y = prevY + prevHeight + 5;
                 }
             }
-            commContentRender.commMarkRender = { render: map.commMarkRender, pos: map.commMarkPos };
+            commContentRender.commMarkRender = {render: map.commMarkRender, pos: map.commMarkPos};
         }
         if (!commMap.length) {
             return;
         }
         const lastCommentMap = commMap[commMap.length - 1];
-        const { commContentRender: lastCommContentRender } = lastCommentMap;
-        const { rect: lastRect } = lastCommContentRender;
+        const {commContentRender: lastCommContentRender} = lastCommentMap;
+        const {rect: lastRect} = lastCommContentRender;
+
         //批注内容超出文档，需要重新排序
         if (lastRect.y + lastRect.height > docRender.rect.height) {
             //总内容小于容器高度,则进行倒排
@@ -51,17 +67,18 @@ export class CommentsUtil {
                 for (let i = commMap.length - 1; i >= 0; i--) {
                     const map = commMap[i];
                     const prevRender = commMap[i + 1]?.commContentRender;
-                    const { commContentRender } = map;
+                    const {commContentRender} = map;
                     if (prevRender) {
-                        const { y: prevY } = prevRender.rect;
+                        const {y: prevY} = prevRender.rect;
                         if (commContentRender.rect.y + commContentRender.rect.height > prevY) {
                             commContentRender.rect.y = prevY - commContentRender.rect.height - 5;
                         }
                     }
-                    commContentRender.commMarkRender = { render: map.commMarkRender, pos: map.commMarkPos };
+                    commContentRender.commMarkRender = {render: map.commMarkRender, pos: map.commMarkPos};
                 }
             }
         }
+
     }
+
 }
-//# sourceMappingURL=comments-util.js.map

package/{lib/framework/impl/comments/validate-msg-impl.js → src/med_editor/framework/impl/comments/validate-msg-impl.ts}

@@ -1,60 +1,72 @@
+import { ViewOptions, Element, SerializeProps, Position, Rect } from "../../element-define";
 import { TextProps, ValidateProps } from "../../element-props";
 import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { RenderObject } from "../../render-define";
 import { CommContentBaseElement, CommContentBaseRenderObject } from "./comment-content-impl";
-import { ParagraphElement } from "@/med_editor/framework/impl/paragraph/p-impl";
-import { TextGroupElement } from "@/med_editor/framework/impl/text/text-impl";
+import { ParagraphElement } from "../paragraph/p-impl";
+import { TextGroupElement } from "../text/text-impl";
 import { DocumentRenderObject } from "../document/doc-impl";
+
 /**
  * 数据元验证提示
  */
-export class ValidateElement extends CommContentBaseElement {
+export class ValidateElement extends CommContentBaseElement<ValidateProps> {
     constructor() {
         super('validate');
         this.props = new ValidateProps();
         this.isDecorate = true;
     }
-    createRenderObject(options, renderCtx) {
+
+    createRenderObject(options: ViewOptions, renderCtx: RenderContenxtType): RenderObject | null {
         const render = new ValidateRenderObject(this);
         render.padding.left = 14;
         render.padding.top = 24;
         return render;
     }
-    serialize(viewOptions) {
+
+    serialize(viewOptions: ViewOptions): SerializeProps | null {
         return null;
     }
-    clone(data) {
+
+    clone(data: boolean): Element {
         throw new Error("Method not implemented.");
     }
-    setContent(content) {
+
+    setContent(content: string): void {
         this.clearItems();
         const para = new ParagraphElement();
         const text = new TextGroupElement();
         text.props.fontSize = 14;
         text.props.fontName = '等线';
-        text.props.color = '#000000';
+        text.props.color = '#000000'
         text.text = content;
         para.addChild(text);
         this.addChild(para);
     }
 }
-export class ValidateRenderObject extends CommContentBaseRenderObject {
-    beginRender(ctx, position) {
+
+export class ValidateRenderObject extends CommContentBaseRenderObject<ValidateElement> {
+    beginRender(ctx: RenderContenxtType, position: Position): void {
         let borderColor = this.element.focus ? '#fa8c16' : '#ffd591';
         ctx.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, borderColor);
-        ctx.contentContext.fillRect(position.x, position.y, 8, this.rect.height, '#871400');
-        const docRender = ElementUtil.getParentRender(this.commMarkRender.render, DocumentRenderObject);
+        ctx.contentContext.fillRect(position.x, position.y, 8, this.rect.height, '#871400')
+        const docRender = ElementUtil.getParentRender(this.commMarkRender.render, DocumentRenderObject) as DocumentRenderObject;
         //获取审阅标记的绘制坐标
         let commMarkPos = ElementUtil.getRenderAbsolutePaintPos(this.commMarkRender.render, { x: 0, y: -ctx.viewOptions.translateY });
         const commMarkLinePos = ElementUtil.getParaLinePos(this.commMarkRender.render, commMarkPos);
         commMarkPos.y = commMarkLinePos.y + 2;
+
         const docRenderPos = ElementUtil.getRenderAbsolutePaintPos(docRender, { x: 0, y: -ctx.viewOptions.translateY });
         const marginLeft = commMarkPos.x - docRenderPos.x - docRender.padding.left;
         const marginRight = ctx.viewOptions.docPageSettings.width - marginLeft - docRender.padding.right * 2;
         ctx.overlaysContext.drawDashLine([commMarkPos, { x: commMarkPos.x + marginRight, y: commMarkPos.y }], [1, 1], 'red');
         ctx.overlaysContext.drawDashLine([{ x: commMarkPos.x + marginRight, y: commMarkPos.y }, position], [1, 1], 'red');
+
         this.renderTitle(ctx, position);
     }
-    renderTitle(ctx, position) {
+
+    renderTitle(ctx: RenderContenxtType, position: Position): void {
         const topPadding = 24;
         const { props } = this.element;
         const textProps = new TextProps();
@@ -63,14 +75,14 @@ export class ValidateRenderObject extends CommContentBaseRenderObject {
         textProps.color = "rgb(0,0,0)";
         const title = this.element.props.title;
         const { width, height } = ctx.contentContext.measureText(title, textProps);
-        const rect = { x: position.x + this.padding.left, y: position.y, width, height, maxHeight: 0, maxWidth: 0 };
+        const rect: Rect = { x: position.x + this.padding.left, y: position.y, width, height, maxHeight: 0, maxWidth: 0 }
         rect.y += (topPadding - rect.height) / 2;
         ctx.contentContext.drawText(title, textProps, rect.x, rect.y, rect.width, rect.height);
     }
-    endRender(ctx, position) {
+    endRender(ctx: RenderContenxtType, position: Position): void {
         //throw new Error("Method not implemented.");
     }
-    clone() {
+    clone(): RenderObject {
         const clone = new ValidateRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         clone.padding = this.padding.clone();
@@ -80,4 +92,3 @@ export class ValidateRenderObject extends CommContentBaseRenderObject {
         return clone;
     }
 }
-//# sourceMappingURL=validate-msg-impl.js.map