@hailin-zheng/editor-core 1.0.6 → 1.0.9

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

@@ -1,37 +1,45 @@
-import { ElementFactory, LeafElement, ResizeLeafRenderObject } from "@/med_editor/framework/element-define";
-import { PictureProps } from "@/med_editor/framework/element-props";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-export class PictureElement extends LeafElement {
+import { Element, ElementFactory, ImgLoadStatus, LeafElement, Position, ResizeLeafRenderObject, SerializeProps, ViewOptions } from "../../element-define";
+import { PictureProps } from "../../element-props";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
+
+
+interface IResizeElement {
+    resizeable: boolean;
+}
+export class PictureElement extends LeafElement<PictureProps> implements IResizeElement {
     //props: PictureProps;
-    status = 'no';
-    resizeable = true;
+    status: ImgLoadStatus = 'no';
+    resizeable: boolean = true;
     constructor() {
         super('img');
         this.props = new PictureProps();
         //this.addPropValueChangedSub(this.props);
-        this.cursorType = 'move';
+        this.cursorType = 'move'
         this.focusable = true;
     }
-    createRenderObject() {
+    createRenderObject(): LeafRenderObject {
         const render = new PictureRenderObject(this);
         render.rect.width = this.props.width + 2;
         render.rect.height = this.props.height + 2;
         return render;
     }
-    serialize(options) {
+    serialize(options: ViewOptions): SerializeProps {
         return {
             type: 'img',
             props: {
                 ...this.props.getSerializeProps(options)
             }
-        };
+        }
     }
-    clone(data) {
+    clone(data: boolean): Element {
         const clone = new PictureElement();
         this.props.clone(clone.props);
         return clone;
     }
-    loadImage(ctx) {
+
+    loadImage(ctx: RenderContenxtType): void {
         if (this.status === 'no') {
             this.status = 'loading';
             //this.imageSource = new Image();
@@ -44,22 +52,23 @@ export class PictureElement extends LeafElement {
             //     this.isLoad = 'error';
             //     console.error(e);
             // };
-            const onCallback = (status) => {
+            const onCallback = (status: ImgLoadStatus) => {
                 this.status = status;
                 if (status === 'completed') {
                     this.refreshView();
                 }
-            };
+            }
             ctx.docCtx.imageLoader.loadImage(this.props.src, onCallback);
         }
     }
-    destroy() {
+    destroy(): void {
         super.destroy();
     }
 }
+
 export class PictureRenderObject extends ResizeLeafRenderObject {
-    render(ctx, position) {
-        const picElement = this.element;
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
+        const picElement = this.element as PictureElement;
         const picProps = picElement.props;
         if (picElement.status === 'no') {
             picElement.loadImage(ctx);
@@ -76,12 +85,13 @@ export class PictureRenderObject extends ResizeLeafRenderObject {
             ctx.contentContext.drawImage(imageSource, 0, 0, imageSource.naturalWidth, imageSource.naturalHeight, position.x + 2, position.y + 2, picProps.width, picProps.height);
         }
     }
-    clone() {
+    clone(): RenderObject {
         const clone = new PictureRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         return clone;
     }
-    pagePaintCompleted(ctx, pos) {
+
+    pagePaintCompleted(ctx: RenderContenxtType, pos: Position): void {
         if (this.element.isFocused) {
             const { width, height } = this.rect;
             ctx.contentContext.strokeRect(pos.x, pos.y, width, height, '#1890ff', 0.5);
@@ -95,7 +105,8 @@ export class PictureRenderObject extends ResizeLeafRenderObject {
             this.drawResizeCircle(ctx, pos.x + width, pos.y + (Math.floor(height / 2)));
         }
     }
-    drawResizeCircle(ctx, x, y) {
+
+    private drawResizeCircle(ctx: RenderContenxtType, x: number, y: number): void {
         const ctxNative = ctx.contentContext.ctx;
         ctxNative.fillStyle = '#69c0ff';
         ctxNative.beginPath();
@@ -104,12 +115,14 @@ export class PictureRenderObject extends ResizeLeafRenderObject {
         ctxNative.fill();
     }
 }
-export class PictureFactory extends ElementFactory {
-    match(type) {
+
+
+export class PictureFactory extends ElementFactory<PictureProps> {
+    match(type: string): boolean {
         return type === 'img';
     }
-    createElement(data, renderCtx) {
-        const props = data.props;
+    createElement(data: any, renderCtx: RenderContenxtType): Element {
+        const props = data.props as PictureProps;
         const pic = new PictureElement();
         const picProps = pic.props;
         picProps.width = props.width;
@@ -121,4 +134,3 @@ export class PictureFactory extends ElementFactory {
         return pic;
     }
 }
-//# sourceMappingURL=image-impl.js.map

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

@@ -1,26 +1,29 @@
-import { ElementFactory, LeafElement } from "@/med_editor/framework/element-define";
-import { RadioBoxProps } from "@/med_editor/framework/element-props";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { LeafRenderObject } from "@/med_editor/framework/render-define";
-export class RadioBoxElement extends LeafElement {
+import { ElementFactory, LeafElement, SerializeProps } from "../../element-define";
+import { RadioBoxProps } from "../../element-props";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
+
+export class RadioBoxElement extends LeafElement<RadioBoxProps> {
     //props: RadioBoxProps;
     constructor() {
         super('rd');
         this.props = new RadioBoxProps();
         //this.addPropValueChangedSub(this.props);
-        this.cursorType = 'default';
-        this.addEvent('ElementClick', (evt) => { this.changeState(); });
+        this.cursorType = 'default'
+        this.addEvent('ElementClick', (evt) => { this.changeState() });
     }
-    createRenderObject() {
+    createRenderObject(): RadioBoxRenderObject {
         const render = new RadioBoxRenderObject(this);
         render.rect.width = this.props.size + 4;
         render.rect.height = this.props.size;
         return render;
     }
-    changeState() {
+
+    changeState(): void {
         const parent = this.parent;
         if (!parent) {
-            throw new Error('parent is null');
+            throw new Error('parent is null')
         }
         for (let i = 0; i < parent.length; i++) {
             const child = parent.getChild(i);
@@ -30,27 +33,28 @@ export class RadioBoxElement extends LeafElement {
         }
         this.props.isChecked = true;
     }
-    serialize() {
+    serialize(): SerializeProps {
         return {
             type: 'rd',
             props: {
                 ...this.props
             }
-        };
+        }
     }
-    clone() {
+    clone(): RadioBoxElement {
         const clone = new RadioBoxElement();
         this.props.clone(clone.props);
         return clone;
     }
 }
-export class RadioBoxFactory extends ElementFactory {
-    match(type) {
+
+export class RadioBoxFactory extends ElementFactory<RadioBoxProps> {
+    match(type: string): boolean {
         return type === 'rd';
     }
-    createElement(data, renderCtx) {
+    createElement(data: any, renderCtx: RenderContenxtType): RadioBoxElement {
         const rdElement = new RadioBoxElement();
-        const props = data.props;
+        const props = data.props as RadioBoxProps;
         const ckbProps = rdElement.props;
         ckbProps.size = props.size ?? 14;
         ckbProps.isChecked = props.isChecked;
@@ -58,15 +62,18 @@ export class RadioBoxFactory extends ElementFactory {
         return rdElement;
     }
 }
+
 export class RadioBoxRenderObject extends LeafRenderObject {
-    render(ctx, position) {
-        const element = this.element;
+
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
+        const element = this.element as RadioBoxElement;
         ctx.contentContext.drawRadioBox(position.x + 2, position.y, element.props.size, element.props.size, element.props.isChecked);
     }
-    clone(cloneData = true) {
+
+    clone(cloneData = true): RenderObject {
         const clone = new RadioBoxRenderObject(this.element);
         clone.rect = ElementUtil.cloneRect(this.rect);
         return clone;
     }
+
 }
-//# sourceMappingURL=radio-impl.js.map

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

@@ -1,9 +1,11 @@
-import { ElementFactory, LeafElement } from "@/med_editor/framework/element-define";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { LeafRenderObject } from "@/med_editor/framework/render-define";
+import { Element, ElementFactory, LeafElement, SerializeProps } from "../../element-define";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
 import { TextProps } from "../../element-props";
+
 export class BreakElement extends LeafElement {
-    textProps;
+    textProps: TextProps;
     constructor() {
         super('br');
         this.textProps = new TextProps();
@@ -11,44 +13,48 @@ export class BreakElement extends LeafElement {
         this.textProps.fontName = '宋体';
         this.textProps.color = '#595959';
     }
-    createRenderObject() {
+    createRenderObject(): LeafRenderObject {
         const symbol = new BreakRenderObject(this);
         symbol.rect.height = 14;
         symbol.rect.width = 7;
         return symbol;
     }
-    serialize() {
+    serialize(): SerializeProps {
         return {
             type: 'br',
             props: {}
-        };
+        }
     }
-    clone() {
+    clone(): Element {
         const clone = new BreakElement();
         //clone.renderCtx = this.renderCtx;
         return clone;
     }
+
 }
-export class BreakRenderObject extends LeafRenderObject {
-    render(ctx, position) {
+
+export class BreakRenderObject extends LeafRenderObject<BreakElement> {
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         if (ctx.drawMode === 'print') {
             return;
         }
         ctx.contentContext.drawText('↓', this.element.textProps, position.x, position.y, 20, this.rect.height);
     }
-    clone() {
+    clone(): RenderObject {
         const render = new BreakRenderObject(this.element);
         render.rect = ElementUtil.cloneRect(this.rect);
         return render;
     }
 }
-export class BreakFactory extends ElementFactory {
-    match(type) {
+
+export class BreakFactory extends ElementFactory<null> {
+    match(type: string): boolean {
         return type === 'br';
     }
-    createElement(data, renderCtx) {
+    createElement(data: any, renderCtx: RenderContenxtType): Element {
         const ele = new BreakElement();
         return ele;
     }
+
 }
-//# sourceMappingURL=br-symbol-impl.js.map
+

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

@@ -1,9 +1,10 @@
-import { LeafElement } from "@/med_editor/framework/element-define";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { LeafRenderObject } from "@/med_editor/framework/render-define";
+import { Element, LeafElement, SerializeProps } from "../../element-define";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { LeafRenderObject, RenderObject } from "../../render-define";
 import { TextProps } from "../../element-props";
 export class PSymbolElement extends LeafElement {
-    textProps;
+    textProps: TextProps;
     defaultHeight = 14;
     constructor() {
         super('psym');
@@ -17,38 +18,40 @@ export class PSymbolElement extends LeafElement {
                     evt.selectionState.resetRange(this, 0);
                 }
             }
-        });
+        })
         this.textProps = new TextProps();
         this.textProps.fontSize = this.defaultHeight;
         this.textProps.fontName = '宋体';
         this.textProps.color = '#8c8c8c';
     }
-    createRenderObject() {
+    createRenderObject(): LeafRenderObject {
         const symbol = new PSymbolRenderObject(this);
         symbol.rect.height = this.defaultHeight;
         symbol.rect.width = 7;
         return symbol;
     }
-    serialize() {
+    serialize(): SerializeProps | null {
         return null;
     }
-    clone() {
+    clone(): Element {
         const clone = new PSymbolElement();
         return clone;
     }
 }
-export class PSymbolRenderObject extends LeafRenderObject {
-    render(ctx, position) {
+
+export class PSymbolRenderObject extends LeafRenderObject<PSymbolElement> {
+    render(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         if (ctx.drawMode === 'print') {
             return;
         }
         ctx.contentContext.drawText('⤶', this.element.textProps, position.x, position.y, 20, this.rect.height);
     }
     //绘制段落符号
-    clone() {
+    clone(): RenderObject {
         const render = new PSymbolRenderObject(this.element);
         render.rect = ElementUtil.cloneRect(this.rect);
         return render;
     }
+
 }
-//# sourceMappingURL=p-symbol-impl.js.map
+

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

@@ -1,26 +1,32 @@
-import { BlockContainerElement, ElementFactory, PaddingProps } from "@/med_editor/framework/element-define";
-import { TableCellProps } from "@/med_editor/framework/element-props";
-import { ElementUtil } from "@/med_editor/framework/element-util";
-import { InlineMuiltBlockLineRenderObject } from "@/med_editor/framework/render-define";
-export class TableCellElement extends BlockContainerElement {
+import { BlockContainerElement, Element, ElementFactory, PaddingProps, readElementProps, SerializeProps, ViewOptions } from "../../element-define";
+import { TableCellProps } from "../../element-props";
+import { ElementUtil } from "../../element-util";
+import { RenderContenxtType } from "../../render-context";
+import { InlineMuiltBlockLineRenderObject, RenderObject } from "../../render-define";
+import { TableElement } from "./table-impl";
+
+export class TableCellElement extends BlockContainerElement<TableCellProps> {
     //props: TableCellProps;
     constructor() {
         super('tbc');
         this.props = new TableCellProps();
         //this.addPropValueChangedSub(this.props);
     }
-    beginMeasure() {
+
+    beginMeasure(): void {
         super.beginMeasure();
         this.disableClick = !this.isNotBeMergedCell();
     }
+
     /**
      * 不被合并单元格的单元格
-     * @returns
+     * @returns 
      */
-    isNotBeMergedCell() {
+    isNotBeMergedCell(): boolean {
         return this.props.hMerge !== 'continue' && this.props.vMerge !== 'continue';
     }
-    createRenderObject() {
+
+    createRenderObject(): RenderObject | null {
         if (!this.isNotBeMergedCell()) {
             return null;
         }
@@ -32,7 +38,7 @@ export class TableCellElement extends BlockContainerElement {
         cellRender.rect.x = cellOffset;
         return cellRender;
     }
-    serialize(options) {
+    serialize(options: ViewOptions): SerializeProps {
         return {
             type: 'tbc',
             props: {
@@ -40,7 +46,7 @@ export class TableCellElement extends BlockContainerElement {
             }
         };
     }
-    clone(data) {
+    clone(data: boolean): Element {
         const clone = new TableCellElement();
         this.props.clone(clone.props);
         if (data) {
@@ -50,72 +56,76 @@ export class TableCellElement extends BlockContainerElement {
         }
         return clone;
     }
-    getCellWidth() {
+    getCellWidth(): { cellWidth: number, cellOffset: number } {
         const row = this.parent;
         if (!row) {
             throw new Error('row is null');
         }
-        const table = row.parent;
+        const table = row.parent as TableElement;
         const cellIndex = row.getChildIndex(this);
         let cellWidth = table.getCellWidth(cellIndex);
         const cellOffset = table.getCellOffsetX(cellIndex);
         if (this.props.hMerge === 'restart') {
             for (let i = cellIndex + 1; i < table.getColsCount(); i++) {
-                const nextCell = row.getChild(i);
+                const nextCell = row.getChild(i) as TableCellElement;
                 if (nextCell.props.hMerge === 'continue') {
                     cellWidth += table.getCellWidth(i);
-                }
-                else {
+                } else {
                     break;
                 }
             }
         }
         return { cellWidth, cellOffset };
     }
-    static createCell() {
+
+    static createCell(): TableCellElement {
         const tc = new TableCellElement();
         return tc;
     }
+
 }
+
 export class TableCellRenderObject extends InlineMuiltBlockLineRenderObject {
-    prevGlobalAlpha = 1;
-    beginRender(ctx, position) {
+    private prevGlobalAlpha = 1;
+    beginRender(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         ctx.contentContext.clip(position.x, position.y, this.rect.width, this.rect.height);
-        const { hMerge, vMerge, backgroundColor, diagonal } = this.element.props;
+        const { hMerge, vMerge, backgroundColor, diagonal } = (<TableCellElement>this.element).props;
         if (hMerge === 'continue' || vMerge === 'continue') {
             this.prevGlobalAlpha = ctx.contentContext.getGlobalAlpha();
             ctx.contentContext.setGlobalAlpha(0);
             ctx.overlaysContext.setGlobalAlpha(0);
         }
         if (backgroundColor && this.rect.width && this.rect.height) {
-            ctx.contentContext.fillRect(position.x, position.y, this.rect.width, this.rect.height, backgroundColor);
+            ctx.contentContext.fillRect(position.x, position.y, this.rect.width, this.rect.height, backgroundColor)
         }
         if (diagonal && this.rect.width && this.rect.height) {
             let diagonalStartX = diagonal === 'main' ? position.x : position.x + this.rect.width;
             let diagonalStartY = position.y;
             let diagonalEndX = diagonal === 'main' ? position.x + this.rect.width : position.x;
             let diagonalEndY = position.y + this.rect.height;
-            ctx.contentContext.strokeLines([{ x: diagonalStartX, y: diagonalStartY }, { x: diagonalEndX, y: diagonalEndY }]);
+            ctx.contentContext.strokeLines([{ x: diagonalStartX, y: diagonalStartY }, { x: diagonalEndX, y: diagonalEndY }])
         }
     }
-    endRender(ctx, position) {
+
+    endRender(ctx: RenderContenxtType, position: { x: number; y: number; }): void {
         ctx.contentContext.ctx.restore();
         if (!this.element.parent) {
             throw new Error('parent is null');
         }
-        const tb = this.element.parent.parent;
+        const tb = this.element.parent.parent as TableElement;
         const tbProps = tb.props;
         if (tbProps.border === 'all') {
             //ctx.contentContext.strokeRect(position.x, position.y, this.rect.width, this.rect.height, '#000', 1);
             //ctx.contentContext.roundRect(position.x, position.y, this.rect.width, this.rect.height, 5, false, true);
         }
-        const { hMerge, vMerge } = this.element.props;
+        const { hMerge, vMerge } = (<TableCellElement>this.element).props;
         if (hMerge === 'continue' || vMerge === 'continue') {
             ctx.contentContext.setGlobalAlpha(1);
             ctx.overlaysContext.setGlobalAlpha(1);
         }
     }
-    clone() {
+
+    clone(): RenderObject {
         const cloneRender = new TableCellRenderObject(this.element);
         cloneRender.rect = ElementUtil.cloneRect(this.rect);
         cloneRender.padding = this.padding?.clone();
@@ -126,11 +136,12 @@ export class TableCellRenderObject extends InlineMuiltBlockLineRenderObject {
         return cloneRender;
     }
 }
-export class TableCellFactory extends ElementFactory {
-    match(type) {
+
+export class TableCellFactory extends ElementFactory<TableCellProps> {
+    match(type: string): boolean {
         return type === 'tbc';
     }
-    createElement(data, renderCtx) {
+    createElement(data: readElementProps<TableCellProps>, renderCtx: RenderContenxtType): Element {
         const tc = new TableCellElement();
         const props = data.props;
         tc.props.vMerge = props?.vMerge ?? null;
@@ -141,5 +152,5 @@ export class TableCellFactory extends ElementFactory {
         //tc.renderCtx = renderCtx;
         return tc;
     }
+
 }
-//# sourceMappingURL=table-cell-impl.js.map