@visactor/vrender 0.9.0-alpha.0

package/cjs/core/contributions/layerHandler/canvas2d-contribution.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/layerHandler/canvas2d-contribution.ts"],"names":[],"mappings":"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","file":"canvas2d-contribution.js","sourcesContent":["import { wrapCanvas } from '../../../canvas';\nimport { inject, injectable } from 'inversify';\nimport { ILayerHandlerContribution, IWindow, ILayerHandlerInitParams, ILayerHandlerDrawParams } from '../..';\nimport { Global, IGlobal, ICanvas, IContext2d, IDrawToParams, IGroup, ILayer } from '../../../interface';\nimport { IBounds } from '@visactor/vutils';\nimport { IDrawContext } from '../../../render';\n\n@injectable()\nexport class CanvasLayerHandlerContribution implements ILayerHandlerContribution {\n  layer: ILayer;\n  canvas: ICanvas;\n  context: IContext2d;\n  offscreen: boolean;\n\n  constructor(@inject(Global) public readonly global: IGlobal) {\n    this.offscreen = false;\n  }\n\n  init(layer: ILayer, window: IWindow, params: ILayerHandlerInitParams): void {\n    this.layer = layer;\n    // 默认图层，那么直接拿window上的上下文和canvas即可\n    if (params.main) {\n      this.context = window.getContext();\n      this.canvas = this.context.getCanvas();\n    } else {\n      let nativeCanvas: HTMLElement;\n      if (params.canvasId) {\n        nativeCanvas = this.global.getElementById(params.canvasId);\n      } else {\n        nativeCanvas = this.global.createCanvas({\n          width: window.width,\n          height: window.height\n        });\n      }\n      const windowContext = window.getContext();\n      const windowCanvas = windowContext.getCanvas().nativeCanvas;\n      const canvas = wrapCanvas({\n        nativeCanvas,\n        width: window.width,\n        height: window.height,\n        dpr: window.dpr,\n        canvasControled: true,\n        container: window.getContainer(),\n        x: windowCanvas.offsetLeft,\n        y: windowCanvas.offsetTop\n      });\n      canvas.applyPosition();\n      this.canvas = canvas;\n      this.context = canvas.getContext();\n    }\n  }\n\n  resize(w: number, h: number) {\n    this.canvas.resize(w, h);\n    return;\n  }\n  resizeView(w: number, h: number) {\n    return;\n  }\n\n  render(group: IGroup[], params: ILayerHandlerDrawParams, userParams?: Partial<IDrawContext>): void {\n    params.renderService.render(group, {\n      context: this.context,\n      clear: params.background ?? '#ffffff',\n      ...params,\n      ...userParams\n    });\n  }\n\n  merge(layerHandlers: ILayerHandlerContribution[]) {\n    layerHandlers.forEach(l => {\n      const ctx = l.getContext();\n      const canvas = ctx.canvas.nativeCanvas;\n      this.context.drawImage(canvas, 0, 0);\n    });\n  }\n\n  prepare(dirtyBounds: IBounds, params: ILayerHandlerDrawParams) {\n    return;\n  }\n\n  drawTo(target: IWindow, group: IGroup[], params: IDrawToParams & ILayerHandlerDrawParams) {\n    const context = target.getContext();\n    params.renderService.render(group, {\n      context,\n      ...params,\n      clear: params.clear ? params.background ?? '#fff' : undefined\n    });\n    return;\n  }\n\n  getContext(): IContext2d {\n    return this.context;\n  }\n\n  release() {\n    this.canvas.release();\n  }\n}\n"]}

package/cjs/core/contributions/layerHandler/modules.d.ts

@@ -0,0 +1,3 @@
+import { ContainerModule } from 'inversify';
+declare const _default: ContainerModule;
+export default _default;

package/cjs/core/contributions/layerHandler/modules.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+});
+
+const inversify_1 = require("inversify"), __1 = require("../.."), canvas2d_contribution_1 = require("./canvas2d-contribution"), offscreen2d_contribution_1 = require("./offscreen2d-contribution");
+
+exports.default = new inversify_1.ContainerModule((bind => {
+    bind(canvas2d_contribution_1.CanvasLayerHandlerContribution).toSelf(), bind(offscreen2d_contribution_1.OffscreenLayerHandlerContribution).toSelf(), 
+    bind(__1.LayerHandlerContribution).toService(canvas2d_contribution_1.CanvasLayerHandlerContribution);
+}));
+//# sourceMappingURL=modules.js.map

package/cjs/core/contributions/layerHandler/modules.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/layerHandler/modules.ts"],"names":[],"mappings":";;AAAA,yCAA4C;AAC5C,6BAAiD;AACjD,mEAAyE;AACzE,yEAA+E;AAE/E,kBAAe,IAAI,2BAAe,CAAC,IAAI,CAAC,EAAE;IACxC,IAAI,CAAC,sDAA8B,CAAC,CAAC,MAAM,EAAE,CAAC;IAC9C,IAAI,CAAC,4DAAiC,CAAC,CAAC,MAAM,EAAE,CAAC;IACjD,IAAI,CAAC,4BAAwB,CAAC,CAAC,SAAS,CAAC,sDAA8B,CAAC,CAAC;AAQ3E,CAAC,CAAC,CAAC","file":"modules.js","sourcesContent":["import { ContainerModule } from 'inversify';\nimport { LayerHandlerContribution } from '../..';\nimport { CanvasLayerHandlerContribution } from './canvas2d-contribution';\nimport { OffscreenLayerHandlerContribution } from './offscreen2d-contribution';\n\nexport default new ContainerModule(bind => {\n  bind(CanvasLayerHandlerContribution).toSelf();\n  bind(OffscreenLayerHandlerContribution).toSelf();\n  bind(LayerHandlerContribution).toService(CanvasLayerHandlerContribution);\n  // try {\n  //   if (typeof OffscreenCanvas === 'function') {\n  //     bind(LayerHandlerContribution).toService(OffscreenLayerHandlerContribution);\n  //   }\n  // } catch (err) {\n  //   bind(LayerHandlerContribution).toService(CanvasLayerHandlerContribution);\n  // }\n});\n"]}

package/cjs/core/contributions/layerHandler/offscreen2d-contribution.d.ts

@@ -0,0 +1,20 @@
+import { ILayerHandlerContribution, IWindow, ILayerHandlerInitParams, ILayerHandlerDrawParams } from '../..';
+import { IGlobal, ICanvas, IContext2d, IDrawToParams, IGroup, ILayer } from '../../../interface';
+import { IBoundsLike } from '@visactor/vutils';
+export declare class OffscreenLayerHandlerContribution implements ILayerHandlerContribution {
+    readonly global: IGlobal;
+    layer: ILayer;
+    canvas: ICanvas;
+    context: IContext2d;
+    offscreen: boolean;
+    constructor(global: IGlobal);
+    init(layer: ILayer, window: IWindow, params: ILayerHandlerInitParams): void;
+    resize(w: number, h: number): void;
+    resizeView(w: number, h: number): void;
+    render(group: IGroup[], params: ILayerHandlerDrawParams): void;
+    prepare(dirtyBounds: IBoundsLike, params: ILayerHandlerDrawParams): void;
+    release(): void;
+    getContext(): IContext2d;
+    drawTo(target: IWindow, group: IGroup[], params: IDrawToParams & ILayerHandlerDrawParams): void;
+    merge(layerHandlers: ILayerHandlerContribution[]): void;
+}

package/cjs/core/contributions/layerHandler/offscreen2d-contribution.js

@@ -0,0 +1,75 @@
+"use strict";
+
+var __decorate = this && this.__decorate || function(decorators, target, key, desc) {
+    var d, c = arguments.length, r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+    if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}, __metadata = this && this.__metadata || function(k, v) {
+    if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
+}, __param = this && this.__param || function(paramIndex, decorator) {
+    return function(target, key) {
+        decorator(target, key, paramIndex);
+    };
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.OffscreenLayerHandlerContribution = void 0;
+
+const canvas_1 = require("../../../canvas"), inversify_1 = require("inversify"), interface_1 = require("../../../interface");
+
+let OffscreenLayerHandlerContribution = class {
+    constructor(global) {
+        this.global = global, this.offscreen = !0;
+    }
+    init(layer, window, params) {
+        this.layer = layer;
+        const nativeCanvas = this.global.createOffscreenCanvas({
+            width: params.width,
+            height: params.height,
+            dpr: window.dpr
+        }), canvas = (0, canvas_1.wrapCanvas)({
+            nativeCanvas: nativeCanvas,
+            width: params.width,
+            height: params.height,
+            dpr: window.dpr,
+            canvasControled: !0
+        });
+        this.canvas = canvas, this.context = canvas.getContext();
+    }
+    resize(w, h) {
+        this.canvas.resize(w, h);
+    }
+    resizeView(w, h) {
+        this.canvas.resize(w, h);
+    }
+    render(group, params) {
+        var _a;
+        params.renderService.render(group, Object.assign(Object.assign({
+            context: this.context
+        }, params), {
+            x: 0,
+            y: 0,
+            clear: null !== (_a = params.background) && void 0 !== _a ? _a : "#ffffff"
+        }));
+    }
+    prepare(dirtyBounds, params) {}
+    release() {
+        this.canvas.release();
+    }
+    getContext() {
+        return this.context;
+    }
+    drawTo(target, group, params) {
+        const context = target.getContext(), targetDpr = target.dpr, {x: x = 0, y: y = 0, width: width = this.layer.viewWidth, height: height = this.layer.viewHeight} = params;
+        context.nativeContext.save(), context.nativeContext.setTransform(targetDpr, 0, 0, targetDpr, 0, 0), 
+        params.clear && context.clearRect(x, y, width, height), context.drawImage(this.canvas.nativeCanvas, 0, 0, this.canvas.width, this.canvas.height, x, y, width, height), 
+        context.nativeContext.restore();
+    }
+    merge(layerHandlers) {}
+};
+
+OffscreenLayerHandlerContribution = __decorate([ (0, inversify_1.injectable)(), __param(0, (0, 
+inversify_1.inject)(interface_1.Global)), __metadata("design:paramtypes", [ Object ]) ], OffscreenLayerHandlerContribution), 
+exports.OffscreenLayerHandlerContribution = OffscreenLayerHandlerContribution;
+//# sourceMappingURL=offscreen2d-contribution.js.map

package/cjs/core/contributions/layerHandler/offscreen2d-contribution.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/layerHandler/offscreen2d-contribution.ts"],"names":[],"mappings":"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","file":"offscreen2d-contribution.js","sourcesContent":["import { wrapCanvas } from '../../../canvas';\nimport { inject, injectable } from 'inversify';\nimport { ILayerHandlerContribution, IWindow, ILayerHandlerInitParams, ILayerHandlerDrawParams } from '../..';\nimport { Global, IGlobal, ICanvas, IContext2d, IDrawToParams, IGroup, ILayer } from '../../../interface';\nimport { IBoundsLike } from '@visactor/vutils';\n\n@injectable()\nexport class OffscreenLayerHandlerContribution implements ILayerHandlerContribution {\n  layer: ILayer;\n  canvas: ICanvas;\n  context: IContext2d;\n  offscreen: boolean;\n\n  constructor(@inject(Global) public readonly global: IGlobal) {\n    this.offscreen = true;\n  }\n\n  init(layer: ILayer, window: IWindow, params: ILayerHandlerInitParams): void {\n    this.layer = layer;\n    const nativeCanvas = this.global.createOffscreenCanvas({\n      width: params.width,\n      height: params.height,\n      dpr: window.dpr\n    });\n    const canvas = wrapCanvas({\n      nativeCanvas,\n      width: params.width,\n      height: params.height,\n      dpr: window.dpr,\n      canvasControled: true\n    });\n\n    this.canvas = canvas;\n    this.context = canvas.getContext();\n  }\n\n  resize(w: number, h: number) {\n    this.canvas.resize(w, h);\n    return;\n  }\n  resizeView(w: number, h: number) {\n    this.canvas.resize(w, h);\n    return;\n  }\n\n  render(group: IGroup[], params: ILayerHandlerDrawParams): void {\n    params.renderService.render(group, {\n      context: this.context,\n      ...params,\n      x: 0,\n      y: 0,\n      clear: params.background ?? '#ffffff'\n    });\n  }\n\n  prepare(dirtyBounds: IBoundsLike, params: ILayerHandlerDrawParams) {\n    return;\n  }\n\n  release() {\n    this.canvas.release();\n  }\n\n  getContext(): IContext2d {\n    return this.context;\n  }\n\n  drawTo(target: IWindow, group: IGroup[], params: IDrawToParams & ILayerHandlerDrawParams) {\n    const context = target.getContext();\n    const targetDpr = target.dpr;\n\n    const { x = 0, y = 0, width = this.layer.viewWidth, height = this.layer.viewHeight } = params;\n    // 这个context可能是外部的，不要使用内置的状态，直接用原生的context\n    context.nativeContext.save();\n    context.nativeContext.setTransform(targetDpr, 0, 0, targetDpr, 0, 0);\n    if (params.clear) {\n      context.clearRect(x, y, width, height);\n    }\n    context.drawImage(this.canvas.nativeCanvas, 0, 0, this.canvas.width, this.canvas.height, x, y, width, height);\n    context.nativeContext.restore();\n  }\n\n  merge(layerHandlers: ILayerHandlerContribution[]) {\n    return;\n  }\n}\n"]}

package/cjs/core/contributions/modules.d.ts

@@ -0,0 +1,2 @@
+import { Container } from 'inversify';
+export default function load(container: Container): void;

package/cjs/core/contributions/modules.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var __importDefault = this && this.__importDefault || function(mod) {
+    return mod && mod.__esModule ? mod : {
+        default: mod
+    };
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+});
+
+const modules_1 = __importDefault(require("./env/modules")), modules_2 = __importDefault(require("./window/modules")), modules_3 = __importDefault(require("./textMeasure/modules")), modules_4 = __importDefault(require("./layerHandler/modules"));
+
+function load(container) {
+    container.load(modules_1.default), container.load(modules_2.default), container.load(modules_3.default), 
+    container.load(modules_4.default);
+}
+
+exports.default = load;
+//# sourceMappingURL=modules.js.map

package/cjs/core/contributions/modules.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/modules.ts"],"names":[],"mappings":";;;;;AACA,4DAAuC;AACvC,+DAA6C;AAC7C,oEAAuD;AACvD,qEAAyD;AAEzD,SAAwB,IAAI,CAAC,SAAoB;IAC/C,SAAS,CAAC,IAAI,CAAC,iBAAU,CAAC,CAAC;IAC3B,SAAS,CAAC,IAAI,CAAC,iBAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,IAAI,CAAC,iBAAkB,CAAC,CAAC;IACnC,SAAS,CAAC,IAAI,CAAC,iBAAmB,CAAC,CAAC;AACtC,CAAC;AALD,uBAKC","file":"modules.js","sourcesContent":["import { Container } from 'inversify';\nimport envModules from './env/modules';\nimport windowModules from './window/modules';\nimport textMeasureModules from './textMeasure/modules';\nimport layerHandlerModules from './layerHandler/modules';\n\nexport default function load(container: Container) {\n  container.load(envModules);\n  container.load(windowModules);\n  container.load(textMeasureModules);\n  container.load(layerHandlerModules);\n}\n"]}

package/cjs/core/contributions/textMeasure/AtextMeasure.d.ts

@@ -0,0 +1,27 @@
+import { IGraphicUtil } from '../..';
+import { ICanvas, IContext2d, EnvType } from '../../../interface';
+import { TextOptionsType, ITextMeasure } from './ITextMeasure';
+export declare class ATextMeasure implements ITextMeasure {
+    protected canvas?: ICanvas;
+    protected context?: IContext2d | null;
+    configure(service: IGraphicUtil, env: EnvType): void;
+    measureTextWidth(text: string, options: TextOptionsType): number;
+    estimate(text: string, { fontSize }: TextOptionsType): {
+        width: number;
+        height: number;
+    };
+    measureTextPixelHeight(text: string, options: TextOptionsType): number;
+    measureTextBoundHieght(text: string, options: TextOptionsType): number;
+    measureText(text: string, options: TextOptionsType): TextMetrics | {
+        width: number;
+    };
+    clipText(text: string, options: TextOptionsType, width: number): {
+        str: string;
+        width: number;
+    };
+    private _clipText;
+    clipTextWithSuffix(text: string, options: TextOptionsType, width: number, suffix: string): {
+        str: string;
+        width: number;
+    };
+}

package/cjs/core/contributions/textMeasure/AtextMeasure.js

@@ -0,0 +1,116 @@
+"use strict";
+
+var __decorate = this && this.__decorate || function(decorators, target, key, desc) {
+    var d, c = arguments.length, r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+    if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.ATextMeasure = void 0;
+
+const inversify_1 = require("inversify"), graphic_1 = require("../../../graphic");
+
+let ATextMeasure = class {
+    configure(service, env) {
+        this.canvas = service.canvas, this.context = service.context, service.bindTextMeasure(this);
+    }
+    measureTextWidth(text, options) {
+        if (!this.context) return this.estimate(text, options).width;
+        this.context.setTextStyleWithoutAlignBaseline(options);
+        return this.context.measureText(text).width;
+    }
+    estimate(text, {fontSize: fontSize = graphic_1.DefaultTextAttribute.fontSize}) {
+        let eCharLen = 0, cCharLen = 0;
+        for (let i = 0; i < text.length; i++) text.charCodeAt(i) < 128 ? eCharLen++ : cCharLen++;
+        return {
+            width: ~~(.8 * eCharLen * fontSize + cCharLen * fontSize),
+            height: fontSize
+        };
+    }
+    measureTextPixelHeight(text, options) {
+        var _a;
+        if (!this.context) return null !== (_a = options.fontSize) && void 0 !== _a ? _a : graphic_1.DefaultTextStyle.fontSize;
+        this.context.setTextStyleWithoutAlignBaseline(options);
+        const textMeasure = this.context.measureText(text);
+        return Math.abs(textMeasure.actualBoundingBoxAscent - textMeasure.actualBoundingBoxDescent);
+    }
+    measureTextBoundHieght(text, options) {
+        var _a;
+        if (!this.context) return null !== (_a = options.fontSize) && void 0 !== _a ? _a : graphic_1.DefaultTextStyle.fontSize;
+        this.context.setTextStyleWithoutAlignBaseline(options);
+        const textMeasure = this.context.measureText(text);
+        return Math.abs(textMeasure.fontBoundingBoxAscent - textMeasure.fontBoundingBoxDescent);
+    }
+    measureText(text, options) {
+        return this.context ? (this.context.setTextStyleWithoutAlignBaseline(options), this.context.measureText(text)) : this.estimate(text, options);
+    }
+    clipText(text, options, width) {
+        if (0 === text.length) return {
+            str: "",
+            width: 0
+        };
+        let length = this.measureTextWidth(text, options);
+        return length <= width ? {
+            str: text,
+            width: length
+        } : (length = this.measureTextWidth(text[0], options), length > width ? {
+            str: "",
+            width: 0
+        } : this._clipText(text, options, width, 0, text.length - 1));
+    }
+    _clipText(text, options, width, leftIdx, rightIdx) {
+        const middleIdx = Math.floor((leftIdx + rightIdx) / 2), subText = text.substring(0, middleIdx + 1), strWidth = this.measureTextWidth(subText, options);
+        let length;
+        if (strWidth > width) {
+            if (subText.length <= 1) return {
+                str: "",
+                width: 0
+            };
+            const str = text.substring(0, middleIdx);
+            return length = this.measureTextWidth(str, options), length <= width ? {
+                str: str,
+                width: length
+            } : this._clipText(text, options, width, leftIdx, middleIdx);
+        }
+        if (strWidth < width) {
+            if (middleIdx >= text.length - 1) return {
+                str: text,
+                width: this.measureTextWidth(text, options)
+            };
+            const str = text.substring(0, middleIdx + 2);
+            return length = this.measureTextWidth(str, options), length >= width ? {
+                str: subText,
+                width: strWidth
+            } : this._clipText(text, options, width, middleIdx, rightIdx);
+        }
+        return {
+            str: subText,
+            width: strWidth
+        };
+    }
+    clipTextWithSuffix(text, options, width, suffix) {
+        if ("" === suffix) return this.clipText(text, options, width);
+        if (0 === text.length) return {
+            str: "",
+            width: 0
+        };
+        const length = this.measureTextWidth(text, options);
+        if (length <= width) return {
+            str: text,
+            width: length
+        };
+        const suffixWidth = this.measureTextWidth(suffix, options);
+        if (suffixWidth > width) return {
+            str: "",
+            width: 0
+        };
+        width -= suffixWidth;
+        const data = this._clipText(text, options, width, 0, text.length - 1);
+        return data.str += suffix, data.width += suffixWidth, data;
+    }
+};
+
+ATextMeasure = __decorate([ (0, inversify_1.injectable)() ], ATextMeasure), exports.ATextMeasure = ATextMeasure;
+//# sourceMappingURL=AtextMeasure.js.map

package/cjs/core/contributions/textMeasure/AtextMeasure.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/textMeasure/AtextMeasure.ts"],"names":[],"mappings":"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","file":"AtextMeasure.js","sourcesContent":["import { injectable } from 'inversify';\nimport { IGraphicUtil } from '../..';\nimport { ICanvas, IContext2d, EnvType } from '../../../interface';\nimport { TextOptionsType, ITextMeasure } from './ITextMeasure';\nimport { DefaultTextAttribute, DefaultTextStyle } from '../../../graphic';\n\n@injectable()\nexport class ATextMeasure implements ITextMeasure {\n  protected canvas?: ICanvas;\n  protected context?: IContext2d | null;\n\n  configure(service: IGraphicUtil, env: EnvType): void {\n    this.canvas = service.canvas;\n    this.context = service.context;\n    service.bindTextMeasure(this);\n  }\n\n  /**\n   * 获取text宽度，measureText.width\n   * @param text\n   * @param options\n   */\n  measureTextWidth(text: string, options: TextOptionsType): number {\n    if (!this.context) {\n      return this.estimate(text, options).width;\n    }\n    this.context.setTextStyleWithoutAlignBaseline(options);\n    const textMeasure = this.context.measureText(text);\n    return textMeasure.width;\n  }\n\n  // 估算文字长度\n  estimate(\n    text: string,\n    { fontSize = DefaultTextAttribute.fontSize }: TextOptionsType\n  ): { width: number; height: number } {\n    // 假设只有英文和中文字符\n    let eCharLen = 0; // 英文字符\n    let cCharLen = 0; // 中文字符\n    // 判断ascii码，如果是\n    for (let i = 0; i < text.length; i++) {\n      text.charCodeAt(i) < 128 ? eCharLen++ : cCharLen++;\n    }\n    return {\n      width: ~~(0.8 * eCharLen * fontSize + cCharLen * fontSize),\n      height: fontSize\n    };\n  }\n\n  /**\n   * 获取text像素高度，基于actualBoundingBoxAscent和actualBoundingBoxDescent\n   * @param text\n   * @param options\n   */\n  measureTextPixelHeight(text: string, options: TextOptionsType): number {\n    if (!this.context) {\n      return options.fontSize ?? DefaultTextStyle.fontSize;\n    }\n    this.context.setTextStyleWithoutAlignBaseline(options);\n    const textMeasure = this.context.measureText(text);\n    return Math.abs((textMeasure as any).actualBoundingBoxAscent - (textMeasure as any).actualBoundingBoxDescent);\n  }\n\n  /**\n   * 获取text包围盒的高度，基于fontBoundingBoxAscent和fontBoundingBoxDescent\n   * @param text\n   * @param options\n   */\n  measureTextBoundHieght(text: string, options: TextOptionsType): number {\n    if (!this.context) {\n      return options.fontSize ?? DefaultTextStyle.fontSize;\n    }\n    this.context.setTextStyleWithoutAlignBaseline(options);\n    const textMeasure = this.context.measureText(text);\n    return Math.abs((textMeasure as any).fontBoundingBoxAscent - (textMeasure as any).fontBoundingBoxDescent);\n  }\n\n  /**\n   * 获取text测量对象\n   * @param text\n   * @param options\n   */\n  measureText(text: string, options: TextOptionsType): TextMetrics | { width: number } {\n    if (!this.context) {\n      return this.estimate(text, options);\n    }\n    this.context.setTextStyleWithoutAlignBaseline(options);\n    return this.context.measureText(text);\n  }\n\n  /**\n   * 将文本裁剪到width宽\n   * @param text\n   * @param options\n   * @param width\n   */\n  clipText(\n    text: string,\n    options: TextOptionsType,\n    width: number\n  ): {\n    str: string;\n    width: number;\n  } {\n    if (text.length === 0) {\n      return { str: '', width: 0 };\n    }\n    let length = this.measureTextWidth(text, options);\n    if (length <= width) {\n      return { str: text, width: length };\n    }\n    length = this.measureTextWidth(text[0], options);\n    if (length > width) {\n      return { str: '', width: 0 };\n    }\n    return this._clipText(text, options, width, 0, text.length - 1);\n  }\n\n  // 二分法找到最佳宽\n  private _clipText(\n    text: string,\n    options: TextOptionsType,\n    width: number,\n    leftIdx: number,\n    rightIdx: number\n  ): { str: string; width: number } {\n    const middleIdx = Math.floor((leftIdx + rightIdx) / 2);\n    const subText = text.substring(0, middleIdx + 1);\n    const strWidth = this.measureTextWidth(subText, options);\n    let length: number;\n    if (strWidth > width) {\n      // 如果字符串的宽度大于限制宽度\n      if (subText.length <= 1) {\n        return { str: '', width: 0 };\n      } // 如果子字符串长度小于1，而且大于给定宽的话，返回空字符串\n      // 先判断是不是左侧的那个字符\n      const str = text.substring(0, middleIdx);\n      // 如果到左侧的字符小于或等于width，那么说明就是左侧的字符\n      length = this.measureTextWidth(str, options);\n      if (length <= width) {\n        return { str, width: length };\n      }\n      // 返回leftIdx到middleIdx\n      return this._clipText(text, options, width, leftIdx, middleIdx);\n    } else if (strWidth < width) {\n      // 如果字符串的宽度小于限制宽度\n      if (middleIdx >= text.length - 1) {\n        return { str: text, width: this.measureTextWidth(text, options) };\n      } // 如果已经到结尾了，返回text\n      // 先判断是不是右侧的那个字符\n      const str = text.substring(0, middleIdx + 2);\n      // 如果到右侧的字符大于或等于width，那么说明就是这个字符串\n      length = this.measureTextWidth(str, options);\n      if (length >= width) {\n        return { str: subText, width: strWidth };\n      }\n      // 返回middleIdx到rightIdx\n      return this._clipText(text, options, width, middleIdx, rightIdx);\n    }\n    // 如果相同，那么就找到text\n    return { str: subText, width: strWidth };\n  }\n\n  clipTextWithSuffix(\n    text: string,\n    options: TextOptionsType,\n    width: number,\n    suffix: string\n  ): {\n    str: string;\n    width: number;\n  } {\n    if (suffix === '') {\n      return this.clipText(text, options, width);\n    }\n    if (text.length === 0) {\n      return { str: '', width: 0 };\n    }\n    const length = this.measureTextWidth(text, options);\n    if (length <= width) {\n      return { str: text, width: length };\n    }\n    const suffixWidth = this.measureTextWidth(suffix, options);\n    if (suffixWidth > width) {\n      return { str: '', width: 0 };\n    }\n    width -= suffixWidth;\n    const data = this._clipText(text, options, width, 0, text.length - 1);\n    data.str += suffix;\n    data.width += suffixWidth;\n    return data;\n  }\n}\n"]}

package/cjs/core/contributions/textMeasure/ITextMeasure.d.ts

@@ -0,0 +1,25 @@
+import { IContribution } from '../interface';
+import { IGraphicUtil } from '../..';
+export interface TextOptionsType {
+    fontSize?: number;
+    fontWeight?: string | number;
+    fontFamily?: string;
+    fontStyle?: string;
+    fontVariant?: string;
+}
+export interface ITextMeasure extends IContribution<IGraphicUtil> {
+    measureTextWidth: (text: string, options: TextOptionsType) => number;
+    measureTextPixelHeight: (text: string, options: TextOptionsType) => number;
+    measureTextBoundHieght: (text: string, options: TextOptionsType) => number;
+    clipText: (text: string, options: TextOptionsType, width: number) => {
+        str: string;
+        width: number;
+    };
+    clipTextWithSuffix: (text: string, options: TextOptionsType, width: number, suffix: string) => {
+        str: string;
+        width: number;
+    };
+    measureText: (text: string, options: TextOptionsType) => {
+        width: number;
+    };
+}

package/cjs/core/contributions/textMeasure/ITextMeasure.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+});
+//# sourceMappingURL=ITextMeasure.js.map

package/cjs/core/contributions/textMeasure/ITextMeasure.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/textMeasure/ITextMeasure.ts"],"names":[],"mappings":"","file":"ITextMeasure.js","sourcesContent":["import { IContribution } from '../interface';\nimport { IGraphicUtil } from '../..';\n\nexport interface TextOptionsType {\n  fontSize?: number;\n  fontWeight?: string | number;\n  fontFamily?: string;\n  fontStyle?: string;\n  fontVariant?: string;\n}\n\nexport interface ITextMeasure extends IContribution<IGraphicUtil> {\n  measureTextWidth: (text: string, options: TextOptionsType) => number;\n  measureTextPixelHeight: (text: string, options: TextOptionsType) => number;\n  measureTextBoundHieght: (text: string, options: TextOptionsType) => number;\n  clipText: (text: string, options: TextOptionsType, width: number) => { str: string; width: number };\n  clipTextWithSuffix: (\n    text: string,\n    options: TextOptionsType,\n    width: number,\n    suffix: string\n  ) => { str: string; width: number };\n  measureText: (text: string, options: TextOptionsType) => { width: number };\n}\n"]}

package/cjs/core/contributions/textMeasure/layout.d.ts

@@ -0,0 +1,39 @@
+import { ITextMeasure, TextOptionsType } from './ITextMeasure';
+export type TextAlignType = 'left' | 'right' | 'center' | 'start' | 'end';
+export type TextBaselineType = 'top' | 'middle' | 'bottom' | 'alphabetic';
+export interface LayoutItemType {
+    str: string;
+    leftOffset?: number;
+    topOffset?: number;
+    width: number;
+}
+export interface BBox {
+    width: number;
+    height: number;
+    xOffset: number;
+    yOffset: number;
+}
+export interface LayoutType {
+    bbox: BBox;
+    lines: LayoutItemType[];
+    fontFamily: string;
+    fontSize: number;
+    fontWeight?: string | number;
+    lineHeight: number;
+    textAlign: TextAlignType;
+    textBaseline: TextBaselineType;
+}
+export interface SimplifyLayoutType {
+    lines: LayoutItemType[];
+}
+export declare class CanvasTextLayout {
+    private fontFamily;
+    private textOptions;
+    private textMeasure;
+    constructor(fontFamily: string, options: TextOptionsType, textMeasure: ITextMeasure);
+    LayoutBBox(bbox: BBox, textAlign: TextAlignType, textBaseline: TextBaselineType): BBox;
+    GetLayout(str: string, width: number, height: number, textAlign: TextAlignType, textBaseline: TextBaselineType, lineHeight: number, suffix: string, miniApp: boolean): LayoutType;
+    GetLayoutByLines(lines: (string | number)[], textAlign: TextAlignType, textBaseline: TextBaselineType, lineHeight: number, suffix?: string, lineWidth?: number): LayoutType;
+    layoutWithBBox(bbox: BBox, lines: LayoutItemType[], textAlign: TextAlignType, textBaseline: TextBaselineType, lineHeight: number): LayoutType;
+    private lineOffset;
+}

package/cjs/core/contributions/textMeasure/layout.js

@@ -0,0 +1,90 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.CanvasTextLayout = void 0;
+
+class CanvasTextLayout {
+    constructor(fontFamily, options, textMeasure) {
+        this.fontFamily = fontFamily, this.textOptions = options, this.textMeasure = textMeasure;
+    }
+    LayoutBBox(bbox, textAlign, textBaseline) {
+        if ("left" === textAlign || "start" === textAlign) bbox.xOffset = 0; else if ("center" === textAlign) bbox.xOffset = bbox.width / -2; else {
+            if ("right" !== textAlign && "end" !== textAlign) throw new Error("非法的textAlign");
+            bbox.xOffset = -bbox.width;
+        }
+        return bbox.yOffset = "top" === textBaseline ? 0 : "middle" === textBaseline ? bbox.height / -2 : "alphabetic" === textBaseline ? -.79 * bbox.height : -bbox.height, 
+        bbox;
+    }
+    GetLayout(str, width, height, textAlign, textBaseline, lineHeight, suffix, miniApp) {
+        const linesLayout = [], bboxWH = [ width, height ], bboxOffset = [ 0, 0 ];
+        for (;str.length > 0; ) {
+            const {str: clipText} = this.textMeasure.clipTextWithSuffix(str, this.textOptions, width, suffix);
+            linesLayout.push({
+                str: clipText,
+                width: this.textMeasure.measureTextWidth(clipText, this.textOptions)
+            }), str = str.substring(clipText.length);
+        }
+        "left" === textAlign || "start" === textAlign || ("center" === textAlign ? bboxOffset[0] = bboxWH[0] / -2 : "right" !== textAlign && "end" !== textAlign || (bboxOffset[0] = -bboxWH[0])), 
+        "top" === textBaseline || ("middle" === textBaseline ? bboxOffset[1] = bboxWH[1] / -2 : "bottom" === textBaseline && (bboxOffset[1] = -bboxWH[1]));
+        const bbox = {
+            xOffset: bboxOffset[0],
+            yOffset: bboxOffset[1],
+            width: bboxWH[0],
+            height: bboxWH[1]
+        };
+        return this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
+    }
+    GetLayoutByLines(lines, textAlign, textBaseline, lineHeight, suffix = "", lineWidth) {
+        lines = lines.map((l => l.toString()));
+        const linesLayout = [], bboxWH = [ 0, 0 ];
+        if ("number" == typeof lineWidth && lineWidth !== 1 / 0) {
+            let width;
+            for (let i = 0, len = lines.length; i < len; i++) width = Math.min(this.textMeasure.measureTextWidth(lines[i], this.textOptions), lineWidth), 
+            linesLayout.push({
+                str: this.textMeasure.clipTextWithSuffix(lines[i], this.textOptions, width, suffix).str,
+                width: width
+            });
+            bboxWH[0] = lineWidth;
+        } else {
+            let width, text;
+            lineWidth = 0;
+            for (let i = 0, len = lines.length; i < len; i++) text = lines[i], width = this.textMeasure.measureTextWidth(text, this.textOptions), 
+            lineWidth = Math.max(lineWidth, width), linesLayout.push({
+                str: text,
+                width: width
+            });
+            bboxWH[0] = lineWidth;
+        }
+        bboxWH[1] = linesLayout.length * lineHeight;
+        const bbox = {
+            xOffset: 0,
+            yOffset: 0,
+            width: bboxWH[0],
+            height: bboxWH[1]
+        };
+        return this.LayoutBBox(bbox, textAlign, textBaseline), this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
+    }
+    layoutWithBBox(bbox, lines, textAlign, textBaseline, lineHeight) {
+        const origin = [ 0, 0 ], totalLineHeight = lines.length * lineHeight;
+        "top" === textBaseline || ("middle" === textBaseline ? origin[1] = (bbox.height - totalLineHeight) / 2 : "bottom" === textBaseline && (origin[1] = bbox.height - totalLineHeight));
+        for (let i = 0; i < lines.length; i++) this.lineOffset(bbox, lines[i], textAlign, textBaseline, lineHeight, origin);
+        return {
+            bbox: bbox,
+            lines: lines,
+            fontFamily: this.fontFamily,
+            fontSize: this.textOptions.fontSize,
+            fontWeight: this.textOptions.fontWeight,
+            lineHeight: lineHeight,
+            textAlign: textAlign,
+            textBaseline: textBaseline
+        };
+    }
+    lineOffset(bbox, line, textAlign, textBaseline, lineHeight, origin) {
+        return "left" === textAlign || "start" === textAlign ? line.leftOffset = 0 : "center" === textAlign ? line.leftOffset = (bbox.width - line.width) / 2 : "right" !== textAlign && "end" !== textAlign || (line.leftOffset = bbox.width - line.width), 
+        line.topOffset = .79 * lineHeight + origin[1], origin[1] += lineHeight, line;
+    }
+}
+
+exports.CanvasTextLayout = CanvasTextLayout;
+//# sourceMappingURL=layout.js.map

package/cjs/core/contributions/textMeasure/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/textMeasure/layout.ts"],"names":[],"mappings":"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","file":"layout.js","sourcesContent":["import { ITextMeasure, TextOptionsType } from './ITextMeasure';\n\ntype vec2 = [number, number];\n\nexport type TextAlignType = 'left' | 'right' | 'center' | 'start' | 'end';\nexport type TextBaselineType = 'top' | 'middle' | 'bottom' | 'alphabetic';\n\nexport interface LayoutItemType {\n  str: string; // 这行的字符串\n  leftOffset?: number; // 该行距离左侧的偏移\n  topOffset?: number; // 该行距离右侧的偏移\n  width: number;\n}\n\nexport interface BBox {\n  width: number; // 包围盒的宽度\n  height: number; // 包围盒的高度\n  xOffset: number;\n  yOffset: number;\n}\n\nexport interface LayoutType {\n  bbox: BBox;\n  lines: LayoutItemType[];\n  fontFamily: string;\n  fontSize: number;\n  fontWeight?: string | number;\n  lineHeight: number;\n  textAlign: TextAlignType;\n  textBaseline: TextBaselineType;\n}\nexport interface SimplifyLayoutType {\n  lines: LayoutItemType[];\n}\n\nexport class CanvasTextLayout {\n  private fontFamily: string;\n  private textOptions: TextOptionsType;\n  private textMeasure: ITextMeasure;\n\n  constructor(fontFamily: string, options: TextOptionsType, textMeasure: ITextMeasure) {\n    this.fontFamily = fontFamily;\n    this.textOptions = options;\n    this.textMeasure = textMeasure;\n  }\n\n  LayoutBBox(bbox: BBox, textAlign: TextAlignType, textBaseline: TextBaselineType): BBox {\n    if (textAlign === 'left' || textAlign === 'start') {\n      bbox.xOffset = 0;\n    } else if (textAlign === 'center') {\n      bbox.xOffset = bbox.width / -2;\n    } else if (textAlign === 'right' || textAlign === 'end') {\n      bbox.xOffset = -bbox.width;\n    } else {\n      throw new Error('非法的textAlign');\n    }\n\n    if (textBaseline === 'top') {\n      bbox.yOffset = 0;\n    } else if (textBaseline === 'middle') {\n      bbox.yOffset = bbox.height / -2;\n    } else if (textBaseline === 'alphabetic') {\n      bbox.yOffset = bbox.height * -0.79;\n    } else {\n      bbox.yOffset = -bbox.height;\n    }\n\n    return bbox;\n  }\n\n  GetLayout(\n    str: string,\n    width: number,\n    height: number,\n    textAlign: TextAlignType,\n    textBaseline: TextBaselineType,\n    lineHeight: number,\n    suffix: string,\n    miniApp: boolean\n  ): LayoutType {\n    // 拆分str\n    const linesLayout: LayoutItemType[] = [];\n    // bbox高度可能大于totalHeight\n    const bboxWH: vec2 = [width, height];\n    const bboxOffset: vec2 = [0, 0];\n\n    while (str.length > 0) {\n      const { str: clipText } = this.textMeasure.clipTextWithSuffix(str, this.textOptions, width, suffix);\n      linesLayout.push({\n        str: clipText,\n        width: this.textMeasure.measureTextWidth(clipText, this.textOptions)\n      });\n      str = str.substring(clipText.length);\n    }\n\n    if (textAlign === 'left' || textAlign === 'start') {\n      // origin[0] = 0;\n    } else if (textAlign === 'center') {\n      bboxOffset[0] = bboxWH[0] / -2;\n    } else if (textAlign === 'right' || textAlign === 'end') {\n      bboxOffset[0] = -bboxWH[0];\n    }\n\n    if (textBaseline === 'top') {\n      // origin[1] = 0;\n    } else if (textBaseline === 'middle') {\n      bboxOffset[1] = bboxWH[1] / -2;\n    } else if (textBaseline === 'bottom') {\n      bboxOffset[1] = -bboxWH[1];\n    }\n\n    const bbox: BBox = {\n      xOffset: bboxOffset[0],\n      yOffset: bboxOffset[1],\n      width: bboxWH[0],\n      height: bboxWH[1]\n    };\n\n    return this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);\n  }\n\n  /**\n   * 给定拆分好的每行字符串进行布局，如果传入lineWidth，那么后面的字符就拆分\n   * @param lines\n   * @param lineWidth\n   */\n  GetLayoutByLines(\n    lines: (string | number)[],\n    textAlign: TextAlignType,\n    textBaseline: TextBaselineType,\n    lineHeight: number,\n    suffix: string = '',\n    lineWidth?: number\n  ): LayoutType {\n    lines = lines.map(l => l.toString()) as string[];\n    const linesLayout: LayoutItemType[] = [];\n    // bbox高度可能大于totalHeight\n    const bboxWH: vec2 = [0, 0];\n    if (typeof lineWidth === 'number' && lineWidth !== Infinity) {\n      // 直接使用lineWidth，并拆分字符串\n      let width: number;\n      for (let i = 0, len = lines.length; i < len; i++) {\n        width = Math.min(this.textMeasure.measureTextWidth(lines[i] as string, this.textOptions), lineWidth);\n        linesLayout.push({\n          str: this.textMeasure.clipTextWithSuffix(lines[i] as string, this.textOptions, width, suffix).str,\n          width\n        });\n      }\n      bboxWH[0] = lineWidth;\n    } else {\n      // 使用所有行中最长的作为lineWidth\n      lineWidth = 0;\n      let width: number;\n      let text: string;\n      for (let i = 0, len = lines.length; i < len; i++) {\n        text = lines[i] as string;\n        width = this.textMeasure.measureTextWidth(text, this.textOptions);\n        lineWidth = Math.max(lineWidth, width);\n        linesLayout.push({ str: text, width });\n      }\n      bboxWH[0] = lineWidth;\n    }\n    bboxWH[1] = linesLayout.length * lineHeight;\n\n    const bbox: BBox = {\n      xOffset: 0,\n      yOffset: 0,\n      width: bboxWH[0],\n      height: bboxWH[1]\n    };\n\n    this.LayoutBBox(bbox, textAlign, textBaseline);\n\n    return this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);\n  }\n\n  layoutWithBBox(\n    bbox: BBox,\n    lines: LayoutItemType[],\n    textAlign: TextAlignType,\n    textBaseline: TextBaselineType,\n    lineHeight: number\n  ): LayoutType {\n    const origin: vec2 = [0, 0];\n    const totalLineHeight = lines.length * lineHeight; // 总高度\n    // origin在y方向需要初始化，然后递增即可\n    if (textBaseline === 'top') {\n      // origin[1] = 0;\n    } else if (textBaseline === 'middle') {\n      origin[1] = (bbox.height - totalLineHeight) / 2;\n    } else if (textBaseline === 'bottom') {\n      origin[1] = bbox.height - totalLineHeight;\n    }\n\n    for (let i = 0; i < lines.length; i++) {\n      this.lineOffset(bbox, lines[i], textAlign, textBaseline, lineHeight, origin);\n    }\n\n    return {\n      bbox,\n      lines,\n      fontFamily: this.fontFamily,\n      fontSize: this.textOptions.fontSize,\n      fontWeight: this.textOptions.fontWeight,\n      lineHeight,\n      textAlign,\n      textBaseline\n    };\n  }\n\n  /**\n   * 计算line在bbox中的位置，需要配合layoutWithBBox使用\n   * @param bbox\n   * @param line\n   * @param textAlign\n   * @param textBaseline\n   * @param lineHeight\n   * @param origin 这个line的左上角位置，会复用并修改\n   */\n  private lineOffset(\n    bbox: BBox,\n    line: LayoutItemType,\n    textAlign: TextAlignType,\n    textBaseline: TextBaselineType,\n    lineHeight: number,\n    origin: vec2\n  ): LayoutItemType {\n    if (textAlign === 'left' || textAlign === 'start') {\n      line.leftOffset = 0;\n    } else if (textAlign === 'center') {\n      line.leftOffset = (bbox.width - line.width) / 2;\n    } else if (textAlign === 'right' || textAlign === 'end') {\n      line.leftOffset = bbox.width - line.width;\n    }\n\n    line.topOffset = lineHeight * 0.79 + origin[1]; // 渲染默认使用alphabetic\n    origin[1] += lineHeight;\n\n    return line;\n  }\n}\n"]}

package/cjs/core/contributions/textMeasure/modules.d.ts

@@ -0,0 +1,3 @@
+import { ContainerModule } from 'inversify';
+declare const _default: ContainerModule;
+export default _default;

package/cjs/core/contributions/textMeasure/modules.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+});
+
+const inversify_1 = require("inversify"), common_1 = require("../../../common"), textMeasure_contribution_1 = require("./textMeasure-contribution");
+
+exports.default = new inversify_1.ContainerModule((bind => {
+    bind(textMeasure_contribution_1.DefaultTextMeasureContribution).toSelf().inSingletonScope(), 
+    bind(textMeasure_contribution_1.TextMeasureContribution).toService(textMeasure_contribution_1.DefaultTextMeasureContribution), 
+    (0, common_1.bindContributionProvider)(bind, textMeasure_contribution_1.TextMeasureContribution);
+}));
+//# sourceMappingURL=modules.js.map

package/cjs/core/contributions/textMeasure/modules.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/textMeasure/modules.ts"],"names":[],"mappings":";;AAAA,yCAA4C;AAC5C,4CAA2D;AAC3D,yEAAqG;AAErG,kBAAe,IAAI,2BAAe,CAAC,IAAI,CAAC,EAAE;IACxC,IAAI,CAAC,yDAA8B,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IACjE,IAAI,CAAC,kDAAuB,CAAC,CAAC,SAAS,CAAC,yDAA8B,CAAC,CAAC;IACxE,IAAA,iCAAwB,EAAC,IAAI,EAAE,kDAAuB,CAAC,CAAC;AAC1D,CAAC,CAAC,CAAC","file":"modules.js","sourcesContent":["import { ContainerModule } from 'inversify';\nimport { bindContributionProvider } from '../../../common';\nimport { DefaultTextMeasureContribution, TextMeasureContribution } from './textMeasure-contribution';\n\nexport default new ContainerModule(bind => {\n  bind(DefaultTextMeasureContribution).toSelf().inSingletonScope();\n  bind(TextMeasureContribution).toService(DefaultTextMeasureContribution);\n  bindContributionProvider(bind, TextMeasureContribution);\n});\n"]}

package/cjs/core/contributions/textMeasure/textMeasure-contribution.d.ts

@@ -0,0 +1,4 @@
+import { ATextMeasure } from './AtextMeasure';
+export declare const TextMeasureContribution: unique symbol;
+export declare class DefaultTextMeasureContribution extends ATextMeasure {
+}

package/cjs/core/contributions/textMeasure/textMeasure-contribution.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var __decorate = this && this.__decorate || function(decorators, target, key, desc) {
+    var d, c = arguments.length, r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+    if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.DefaultTextMeasureContribution = exports.TextMeasureContribution = void 0;
+
+const inversify_1 = require("inversify"), AtextMeasure_1 = require("./AtextMeasure");
+
+exports.TextMeasureContribution = Symbol.for("TextMeasureContribution");
+
+let DefaultTextMeasureContribution = class extends AtextMeasure_1.ATextMeasure {};
+
+DefaultTextMeasureContribution = __decorate([ (0, inversify_1.injectable)() ], DefaultTextMeasureContribution), 
+exports.DefaultTextMeasureContribution = DefaultTextMeasureContribution;
+//# sourceMappingURL=textMeasure-contribution.js.map

package/cjs/core/contributions/textMeasure/textMeasure-contribution.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/contributions/textMeasure/textMeasure-contribution.ts"],"names":[],"mappings":";;;;;;;;;AAAA,yCAAuC;AACvC,iDAA8C;AAEjC,QAAA,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAC,yBAAyB,CAAC,CAAC;AAGtE,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,2BAAY;CAAG,CAAA;AAAtD,8BAA8B;IAD1C,IAAA,sBAAU,GAAE;GACA,8BAA8B,CAAwB;AAAtD,wEAA8B","file":"textMeasure-contribution.js","sourcesContent":["import { injectable } from 'inversify';\nimport { ATextMeasure } from './AtextMeasure';\n\nexport const TextMeasureContribution = Symbol.for('TextMeasureContribution');\n\n@injectable()\nexport class DefaultTextMeasureContribution extends ATextMeasure {}\n"]}