@visactor/vrender-core 0.16.0-alpha.0

package/cjs/interface/animate.d.ts

@@ -0,0 +1,191 @@
+import type { AnimateMode, AnimateStatus, AnimateStepType } from '../common/enums';
+import type { Releaseable } from './common';
+import type { IGraphic } from './graphic';
+export declare class Easing {
+    static linear(t: number): number;
+    static none(): typeof Easing.linear;
+    static get(amount: number): (t: number) => number;
+    static getPowIn(pow: number): (t: number) => number;
+    static getPowOut(pow: number): (t: number) => number;
+    static getPowInOut(pow: number): (t: number) => number;
+    static quadIn: (t: number) => number;
+    static quadOut: (t: number) => number;
+    static quadInOut: (t: number) => number;
+    static cubicIn: (t: number) => number;
+    static cubicOut: (t: number) => number;
+    static cubicInOut: (t: number) => number;
+    static quartIn: (t: number) => number;
+    static quartOut: (t: number) => number;
+    static quartInOut: (t: number) => number;
+    static quintIn: (t: number) => number;
+    static quintOut: (t: number) => number;
+    static quintInOut: (t: number) => number;
+    static getBackIn(amount: number): (t: number) => number;
+    static getBackOut(amount: number): (t: number) => number;
+    static getBackInOut(amount: number): (t: number) => number;
+    static backIn: (t: number) => number;
+    static backOut: (t: number) => number;
+    static backInOut: (t: number) => number;
+    static circIn(t: number): number;
+    static circOut(t: number): number;
+    static circInOut(t: number): number;
+    static bounceOut(t: number): number;
+    static bounceIn(t: number): number;
+    static bounceInOut(t: number): number;
+    static getElasticIn(amplitude: number, period: number): (t: number) => number;
+    static getElasticOut(amplitude: number, period: number): (t: number) => number;
+    static getElasticInOut(amplitude: number, period: number): (t: number) => number;
+    static elasticIn: (t: number) => number;
+    static elasticOut: (t: number) => number;
+    static elasticInOut: (t: number) => number;
+}
+export interface Timeline {
+    AnimateList: IAnimate[];
+}
+export type EasingTypeStr = 'linear' | 'quadIn' | 'quadOut' | 'quadInOut' | 'quadInOut' | 'cubicIn' | 'cubicOut' | 'cubicInOut' | 'quartIn' | 'quartOut' | 'quartInOut' | 'quintIn' | 'quintOut' | 'quintInOut' | 'backIn' | 'backOut' | 'backInOut' | 'circIn' | 'circOut' | 'circInOut' | 'bounceOut' | 'bounceIn' | 'bounceInOut' | 'elasticIn' | 'elasticOut' | 'elasticInOut' | 'sineIn' | 'sineOut' | 'sineInOut' | 'expoIn' | 'expoOut' | 'expoInOut' | '';
+export type EasingTypeFunc = (t: number) => number;
+export type EasingType = EasingTypeStr | EasingTypeFunc;
+export type IAnimateStepType = keyof typeof AnimateStepType;
+export interface IStep {
+    type: IAnimateStepType;
+    prev?: IStep;
+    duration: number;
+    position: number;
+    next?: IStep;
+    props?: any;
+    parsedProps?: any;
+    propKeys?: string[];
+    easing?: EasingTypeFunc;
+    customAnimate?: ICustomAnimate;
+    append: (step: IStep) => void;
+    getLastProps: () => any;
+}
+export interface IStepConfig {
+    tempProps?: boolean;
+    noPreventAttrs?: boolean;
+}
+export interface IAnimateTarget {
+    onAnimateBind?: (animte: IAnimate | ISubAnimate) => void;
+    onAddStep?: (step: IStep) => void;
+    onStep: (subAnimate: ISubAnimate, animate: IAnimate, step: IStep, ratio: number, end: boolean) => void;
+    stepInterpolate: (subAnimate: ISubAnimate, animate: IAnimate, nextAttributes: Record<string, any>, step: IStep, ratio: number, end: boolean, nextProps: Record<string, any>, lastProps?: Record<string, any>, nextParsedProps?: any, propKeys?: string[]) => void;
+    getComputedAttribute: (name: string) => any;
+    getDefaultAttribute: (name: string) => any;
+    onStop: (props?: Record<string, any>) => void;
+    animates: Map<string | number, IAnimate>;
+    [key: string]: any;
+}
+export interface ICustomAnimate {
+    duration: number;
+    easing: EasingType;
+    step?: IStep;
+    mode?: AnimateMode;
+    bind: (target: IAnimateTarget, subAni: ISubAnimate) => void;
+    onBind: () => void;
+    onFirstRun: () => void;
+    onStart: () => void;
+    onEnd: () => void;
+    onUpdate: (end: boolean, ratio: number, out: Record<string, any>) => void;
+    update: (end: boolean, ratio: number, out: Record<string, any>) => void;
+    getEndProps: () => Record<string, any> | void;
+    getFromProps: () => Record<string, any> | void;
+    getMergedEndProps: () => Record<string, any> | void;
+}
+export interface IAnimate {
+    readonly id: string | number;
+    status: AnimateStatus;
+    interpolateFunc: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;
+    _onStart?: (() => void)[];
+    _onFrame?: ((step: IStep, ratio: number) => void)[];
+    _onEnd?: (() => void)[];
+    _onRemove?: (() => void)[];
+    getStartProps: () => Record<string, any>;
+    getEndProps: () => Record<string, any>;
+    setTimeline: (timeline: ITimeline) => void;
+    bind: (target: IAnimateTarget) => this;
+    to: (props: Record<string, any>, duration: number, easing: EasingType, params?: IStepConfig) => this;
+    from: (props: Record<string, any>, duration: number, easing: EasingType, params?: IStepConfig) => this;
+    pause: () => void;
+    resume: () => void;
+    onStart: (cb: () => void) => void;
+    onEnd: (cb: () => void) => void;
+    onFrame: (cb: (step: IStep, ratio: number) => void) => void;
+    preventAttr: (key: string) => void;
+    preventAttrs: (key: string[]) => void;
+    validAttr: (key: string) => boolean;
+    runCb: (cb: (a: IAnimate, step: IStep) => void) => IAnimate;
+    customInterpolate: (key: string, ratio: number, from: any, to: any, target: IAnimateTarget, ret: Record<string, any>) => boolean;
+    play: (customAnimate: ICustomAnimate) => this;
+    stop: (type?: 'start' | 'end' | Record<string, any>) => void;
+    release: () => void;
+    getDuration: () => number;
+    getStartTime: () => number;
+    wait: (delay: number) => this;
+    afterAll: (list: IAnimate[]) => this;
+    after: (animate: IAnimate) => this;
+    parallel: (animate: IAnimate) => this;
+    reversed: (r: boolean) => IAnimate;
+    loop: (n: number) => IAnimate;
+    bounce: (b: boolean) => IAnimate;
+    nextAnimate?: IAnimate;
+    prevAnimate?: IAnimate;
+    advance: (delta: number) => void;
+    startAt: (t: number) => IAnimate;
+}
+export interface ISubAnimate {
+    getLastStep: () => IStep;
+    animate: IAnimate;
+    getLastPropByName: (name: string, step: IStep) => any;
+}
+export interface BaseAnimateConfig {
+    id?: number | string;
+    interpolate?: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;
+    onStart?: () => void;
+    onFrame?: (step: IStep, ratio: number) => void;
+    onEnd?: () => void;
+    onRemove?: () => void;
+}
+export interface MorphingAnimateConfig extends Omit<BaseAnimateConfig, 'interpolate'> {
+    duration?: number;
+    easing?: EasingType;
+    delay?: number;
+}
+export interface MultiMorphingAnimateConfig extends MorphingAnimateConfig {
+    splitPath?: 'clone' | ((graphic: IGraphic, count: number, needAppend?: boolean) => IGraphic[]);
+    individualDelay?: (index: number, count: number, fromGraphic: IGraphic, toGraphic: IGraphic) => number;
+}
+export interface ITimeline {
+    id: number;
+    animateCount: number;
+    addAnimate: (animate: IAnimate) => void;
+    removeAnimate: (animate: IAnimate, release?: boolean) => void;
+    tick: (delta: number) => void;
+    clear: () => void;
+    pause: () => void;
+    resume: () => void;
+}
+export interface ITickHandler extends Releaseable {
+    avaliable: () => boolean;
+    tick: (interval: number, cb: (handler: ITickHandler) => void) => void;
+    tickTo?: (t: number, cb: (handler: ITickHandler, params?: {
+        once: boolean;
+    }) => void) => void;
+    getTime: () => number;
+}
+export interface ITickerHandlerStatic {
+    Avaliable: () => boolean;
+    new (): ITickHandler;
+}
+export interface ITicker {
+    setFPS?: (fps: number) => void;
+    setInterval?: (interval: number) => void;
+    getFPS?: () => number;
+    getInterval?: () => number;
+    tick: (interval: number) => void;
+    tickAt?: (time: number) => void;
+    pause: () => boolean;
+    resume: () => boolean;
+    start: (force?: boolean) => boolean;
+    stop: () => void;
+    addTimeline: (timeline: ITimeline) => void;
+}

package/cjs/interface/animate.js

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

package/cjs/interface/animate.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/animate.ts"],"names":[],"mappings":"","file":"animate.js","sourcesContent":["import type { AnimateMode, AnimateStatus, AnimateStepType } from '../common/enums';\nimport type { Releaseable } from './common';\nimport type { IGraphic } from './graphic';\n\n// export type EasingType = (...args: any) => any;\n\nexport declare class Easing {\n  static linear(t: number): number;\n  static none(): typeof Easing.linear;\n  /**\n   * 获取缓动函数，amount指示这个缓动函数的插值方式\n   * @param amount\n   * @returns\n   */\n  static get(amount: number): (t: number) => number;\n  static getPowIn(pow: number): (t: number) => number;\n  static getPowOut(pow: number): (t: number) => number;\n  static getPowInOut(pow: number): (t: number) => number;\n  static quadIn: (t: number) => number;\n  static quadOut: (t: number) => number;\n  static quadInOut: (t: number) => number;\n  static cubicIn: (t: number) => number;\n  static cubicOut: (t: number) => number;\n  static cubicInOut: (t: number) => number;\n  static quartIn: (t: number) => number;\n  static quartOut: (t: number) => number;\n  static quartInOut: (t: number) => number;\n  static quintIn: (t: number) => number;\n  static quintOut: (t: number) => number;\n  static quintInOut: (t: number) => number;\n  static getBackIn(amount: number): (t: number) => number;\n  static getBackOut(amount: number): (t: number) => number;\n  static getBackInOut(amount: number): (t: number) => number;\n  static backIn: (t: number) => number;\n  static backOut: (t: number) => number;\n  static backInOut: (t: number) => number;\n  static circIn(t: number): number;\n  static circOut(t: number): number;\n  static circInOut(t: number): number;\n  static bounceOut(t: number): number;\n  static bounceIn(t: number): number;\n  static bounceInOut(t: number): number;\n  static getElasticIn(amplitude: number, period: number): (t: number) => number;\n  static getElasticOut(amplitude: number, period: number): (t: number) => number;\n  static getElasticInOut(amplitude: number, period: number): (t: number) => number;\n  static elasticIn: (t: number) => number;\n  static elasticOut: (t: number) => number;\n  static elasticInOut: (t: number) => number;\n}\n\n// timeline管理一堆的animate，多个timeline互不影响\n// timeline主要作用是基于layer层面的整体管理\n// 每个layer默认带有一个timeline\nexport interface Timeline {\n  AnimateList: IAnimate[];\n}\n\ntype IStopType = 'end' | 'start' | 'current';\n\n// TODO: 提供options配置可序列化\ninterface AnimateSpecItem {\n  type: 'to' | 'delay' | 'stop' | 'any';\n  params: any[];\n}\n\nexport type EasingTypeStr =\n  | 'linear'\n  | 'quadIn'\n  | 'quadOut'\n  | 'quadInOut'\n  | 'quadInOut'\n  | 'cubicIn'\n  | 'cubicOut'\n  | 'cubicInOut'\n  | 'quartIn'\n  | 'quartOut'\n  | 'quartInOut'\n  | 'quintIn'\n  | 'quintOut'\n  | 'quintInOut'\n  | 'backIn'\n  | 'backOut'\n  | 'backInOut'\n  | 'circIn'\n  | 'circOut'\n  | 'circInOut'\n  | 'bounceOut'\n  | 'bounceIn'\n  | 'bounceInOut'\n  | 'elasticIn'\n  | 'elasticOut'\n  | 'elasticInOut'\n  | 'sineIn'\n  | 'sineOut'\n  | 'sineInOut'\n  | 'expoIn'\n  | 'expoOut'\n  | 'expoInOut'\n  | '';\nexport type EasingTypeFunc = (t: number) => number;\n\nexport type EasingType = EasingTypeStr | EasingTypeFunc;\n\nexport type IAnimateStepType = keyof typeof AnimateStepType;\n\nexport interface IStep {\n  type: IAnimateStepType;\n  prev?: IStep;\n  // 持续时间\n  duration: number;\n  // 在animate中的位置\n  position: number;\n  next?: IStep;\n  props?: any;\n  parsedProps?: any;\n  propKeys?: string[];\n  easing?: EasingTypeFunc;\n  customAnimate?: ICustomAnimate;\n\n  append: (step: IStep) => void;\n  getLastProps: () => any;\n}\n\nexport interface IStepConfig {\n  tempProps?: boolean; // props为临时props，可以直接使用不用拷贝\n  noPreventAttrs?: boolean;\n}\n\nexport interface IAnimateTarget {\n  onAnimateBind?: (animte: IAnimate | ISubAnimate) => void;\n  // 添加动画step的时候调用\n  onAddStep?: (step: IStep) => void;\n  // step时调用\n  onStep: (subAnimate: ISubAnimate, animate: IAnimate, step: IStep, ratio: number, end: boolean) => void;\n  // 插值函数\n  stepInterpolate: (\n    subAnimate: ISubAnimate,\n    animate: IAnimate,\n    nextAttributes: Record<string, any>,\n    step: IStep,\n    ratio: number,\n    end: boolean,\n    nextProps: Record<string, any>,\n    lastProps?: Record<string, any>,\n    nextParsedProps?: any,\n    propKeys?: string[]\n  ) => void;\n  // 获取属性\n  getComputedAttribute: (name: string) => any;\n  // 获取默认属性\n  getDefaultAttribute: (name: string) => any;\n  onStop: (props?: Record<string, any>) => void;\n  animates: Map<string | number, IAnimate>;\n  [key: string]: any;\n}\n\nexport interface ICustomAnimate {\n  duration: number;\n  easing: EasingType;\n  step?: IStep;\n  mode?: AnimateMode;\n\n  bind: (target: IAnimateTarget, subAni: ISubAnimate) => void;\n  // 在第一次调用的时候触发\n  onBind: () => void;\n  // 第一次执行的时候调用\n  onFirstRun: () => void;\n  // 开始执行的时候调用（如果有循环，那每个周期都会调用）\n  onStart: () => void;\n  // 结束执行的时候调用（如果有循环，那每个周期都会调用）\n  onEnd: () => void;\n  onUpdate: (end: boolean, ratio: number, out: Record<string, any>) => void;\n  update: (end: boolean, ratio: number, out: Record<string, any>) => void;\n  getEndProps: () => Record<string, any> | void;\n  getFromProps: () => Record<string, any> | void;\n  getMergedEndProps: () => Record<string, any> | void;\n}\n\n// 每一个animate绑定一个graphic，用于描述这个graphic的动画内容\n// 在timeline层面，animate相当于是一段timeslice\nexport interface IAnimate {\n  readonly id: string | number;\n  status: AnimateStatus;\n\n  interpolateFunc: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;\n\n  _onStart?: (() => void)[];\n  _onFrame?: ((step: IStep, ratio: number) => void)[];\n  _onEnd?: (() => void)[];\n  _onRemove?: (() => void)[];\n\n  getStartProps: () => Record<string, any>;\n  getEndProps: () => Record<string, any>;\n\n  setTimeline: (timeline: ITimeline) => void;\n\n  bind: (target: IAnimateTarget) => this;\n  to: (props: Record<string, any>, duration: number, easing: EasingType, params?: IStepConfig) => this;\n  from: (props: Record<string, any>, duration: number, easing: EasingType, params?: IStepConfig) => this;\n  pause: () => void;\n  resume: () => void;\n  onStart: (cb: () => void) => void;\n  onEnd: (cb: () => void) => void;\n  onFrame: (cb: (step: IStep, ratio: number) => void) => void;\n  // 屏蔽属性\n  preventAttr: (key: string) => void;\n  // 屏蔽属性\n  preventAttrs: (key: string[]) => void;\n  // 属性是否合法\n  validAttr: (key: string) => boolean;\n\n  runCb: (cb: (a: IAnimate, step: IStep) => void) => IAnimate;\n\n  // 自定义插值，返回false表示没有匹配上\n  customInterpolate: (\n    key: string,\n    ratio: number,\n    from: any,\n    to: any,\n    target: IAnimateTarget,\n    ret: Record<string, any>\n  ) => boolean;\n  //\n  play: (customAnimate: ICustomAnimate) => this;\n\n  // 获取该属性的上一个值\n  // getLastPropByName: (name: string, step: IStep) => any;\n  // delay: (duration: number) => IAnimate;\n  stop: (type?: 'start' | 'end' | Record<string, any>) => void;\n  /** 打上END标志，下一帧被删除 */\n  release: () => void;\n  // 获取持续的时长\n  getDuration: () => number;\n  // 获取动画开始时间（注意并不是子动画的startAt）\n  getStartTime: () => number;\n  // done: (cb: (_: any) => any) => IAnimate;\n  // pause: () => IAnimate;\n  // spec: (spec: AnimateSpecItem[]) => IAnimate;\n  // start: () => void; // 有start方法，避免动画提前开始（VGrammar需要时间处理数据）\n  wait: (delay: number) => this;\n\n  // // 编排\n  afterAll: (list: IAnimate[]) => this;\n  after: (animate: IAnimate) => this;\n  parallel: (animate: IAnimate) => this;\n\n  // // timislice (getter)\n  // startTime: number;\n  // endTime: number;\n  // startTimes: number[];\n  // endTimes: number[];\n\n  // // 高级参数，frame到frameEnd之间可以进行reverse，loop，bounce效果\n  // frame: () => IAnimate;\n  // frameEnd: () => IAnimate;\n  reversed: (r: boolean) => IAnimate;\n  loop: (n: number) => IAnimate;\n  bounce: (b: boolean) => IAnimate;\n\n  nextAnimate?: IAnimate;\n  prevAnimate?: IAnimate;\n\n  advance: (delta: number) => void;\n\n  startAt: (t: number) => IAnimate;\n\n  // // 语法糖\n  // create: (duration: number) => IAnimate;\n  // fadeIn: (duration: number) => IAnimate;\n}\n\nexport interface ISubAnimate {\n  getLastStep: () => IStep;\n  animate: IAnimate;\n  // 获取该属性的上一个值\n  getLastPropByName: (name: string, step: IStep) => any;\n}\n\n// rect.animate().abc().to({}, 1000).delay(1000).frame().to().delay().to().frameEnd().loop().bounce()\n\nexport interface BaseAnimateConfig {\n  id?: number | string;\n  interpolate?: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;\n  onStart?: () => void;\n  onFrame?: (step: IStep, ratio: number) => void;\n  onEnd?: () => void;\n  onRemove?: () => void;\n}\n\n// VGrammar和 vrender命名不一致，好尴尬\nexport interface MorphingAnimateConfig extends Omit<BaseAnimateConfig, 'interpolate'> {\n  duration?: number;\n  easing?: EasingType; // 统一到easing\n  delay?: number;\n}\n\nexport interface MultiMorphingAnimateConfig extends MorphingAnimateConfig {\n  splitPath?: 'clone' | ((graphic: IGraphic, count: number, needAppend?: boolean) => IGraphic[]);\n  individualDelay?: (index: number, count: number, fromGraphic: IGraphic, toGraphic: IGraphic) => number;\n}\n\nexport interface ITimeline {\n  id: number;\n  animateCount: number;\n  addAnimate: (animate: IAnimate) => void;\n  removeAnimate: (animate: IAnimate, release?: boolean) => void;\n  tick: (delta: number) => void;\n  clear: () => void;\n  pause: () => void;\n  resume: () => void;\n}\n\nexport interface ITickHandler extends Releaseable {\n  avaliable: () => boolean;\n  /**\n   * 开始执行tick\n   * @param interval 延时 ms\n   * @param cb 执行的回调\n   */\n  tick: (interval: number, cb: (handler: ITickHandler) => void) => void; // 开始\n  tickTo?: (t: number, cb: (handler: ITickHandler, params?: { once: boolean }) => void) => void;\n  getTime: () => number; // 获取时间\n}\n\nexport interface ITickerHandlerStatic {\n  Avaliable: () => boolean;\n  new (): ITickHandler;\n}\n\nexport interface ITicker {\n  setFPS?: (fps: number) => void;\n  setInterval?: (interval: number) => void;\n  getFPS?: () => number;\n  getInterval?: () => number;\n  tick: (interval: number) => void;\n  tickAt?: (time: number) => void;\n  pause: () => boolean;\n  resume: () => boolean;\n  /**\n   * 开启tick，force为true强制开启，否则如果timeline为空则不开启\n   */\n  start: (force?: boolean) => boolean;\n  stop: () => void;\n  addTimeline: (timeline: ITimeline) => void;\n}\n"]}

package/cjs/interface/camera.d.ts

@@ -0,0 +1,24 @@
+import type { IPointLike } from '@visactor/vutils';
+import type { mat4, vec3 } from './matrix';
+export type ViewParameters = {
+    pos: vec3;
+    center: vec3;
+    up: vec3;
+};
+export type OrthoParameters = {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+    fieldRatio: number;
+    viewParams: ViewParameters;
+    fieldDepth?: number;
+};
+export interface ICamera {
+    params: OrthoParameters;
+    getViewMatrix: () => mat4;
+    getProjectionMatrix: () => mat4;
+    vp: (x: number, y: number, z: number) => IPointLike;
+    view: (x: number, y: number, z: number) => [number, number, number];
+    getProjectionScale: (z: number) => number;
+}

package/cjs/interface/camera.js

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

package/cjs/interface/camera.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/camera.ts"],"names":[],"mappings":"","file":"camera.js","sourcesContent":["import type { IPointLike } from '@visactor/vutils';\nimport type { mat4, vec3 } from './matrix';\n\nexport type ViewParameters = {\n  pos: vec3;\n  center: vec3;\n  up: vec3;\n};\n\nexport type OrthoParameters = {\n  left: number;\n  right: number;\n  top: number;\n  bottom: number;\n  fieldRatio: number;\n  viewParams: ViewParameters;\n  fieldDepth?: number;\n};\n\nexport interface ICamera {\n  params: OrthoParameters;\n  getViewMatrix: () => mat4;\n  getProjectionMatrix: () => mat4;\n\n  vp: (x: number, y: number, z: number) => IPointLike;\n  view: (x: number, y: number, z: number) => [number, number, number];\n\n  getProjectionScale: (z: number) => number;\n}\n"]}

package/cjs/interface/canvas.d.ts

@@ -0,0 +1,61 @@
+import type { Releaseable } from './common';
+import type { IContextLike, IContext2d } from './context';
+export type CanvasConfigType = {
+    width?: number;
+    height?: number;
+    dpr?: number;
+    x?: number;
+    y?: number;
+    container?: HTMLElement | string;
+    visiable?: boolean;
+    nativeCanvas: HTMLCanvasElement | any;
+    canvasControled?: boolean;
+    id?: string;
+};
+export interface ICanvas extends Releaseable {
+    width: number;
+    height: number;
+    id: number | string;
+    x: number;
+    y: number;
+    visiable: boolean;
+    nativeCanvas: HTMLCanvasElement | any;
+    displayWidth: number;
+    displayHeight: number;
+    dpr: number;
+    getContext: (contextId?: '2d', contextAttributes?: CanvasRenderingContext2DSettings) => IContext2d | null;
+    getNativeCanvas: () => HTMLCanvasElement | any;
+    convertToBlob: (options?: {
+        type?: string | undefined;
+        quality?: number | undefined;
+    }) => Promise<Blob>;
+    transferToImageBitmap: () => ImageBitmap;
+    resetStyle: (params: Partial<CanvasConfigType>) => void;
+    applyPosition: () => void;
+    hide: () => void;
+    show: () => void;
+    resize: (width: number, height: number) => void;
+    toDataURL: (() => string) & ((mimeType: 'image/png') => string) & ((mimeType: 'image/jpeg', quality: number) => string);
+    readPixels: (x: number, y: number, w: number, h: number) => ImageData | Promise<ImageData>;
+    release: () => void;
+}
+export interface ICanvasLike {
+    width: number;
+    height: number;
+    readonly type?: 'image' | 'pdf' | 'svg';
+    readonly stride?: number;
+    readonly PNG_NO_FILTERS?: number;
+    readonly PNG_ALL_FILTERS?: number;
+    readonly PNG_FILTER_NONE?: number;
+    readonly PNG_FILTER_SUB?: number;
+    readonly PNG_FILTER_UP?: number;
+    readonly PNG_FILTER_AVG?: number;
+    readonly PNG_FILTER_PAETH?: number;
+    getContext: (contextId: string) => IContextLike;
+}
+export interface ICanvasFactory extends Function {
+    (...params: any): ICanvas;
+}
+export interface IContext2dFactory extends Function {
+    (...params: any): IContext2d;
+}

package/cjs/interface/canvas.js

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

package/cjs/interface/canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/canvas.ts"],"names":[],"mappings":"","file":"canvas.js","sourcesContent":["/**\n * 提供ICanvas和ICanvasLike封装\n */\nimport type { Releaseable } from './common';\nimport type { IContextLike, IContext2d } from './context';\n\nexport type CanvasConfigType = {\n  width?: number;\n  height?: number;\n  dpr?: number;\n  x?: number;\n  y?: number;\n  container?: HTMLElement | string;\n  visiable?: boolean;\n  nativeCanvas: HTMLCanvasElement | any;\n  canvasControled?: boolean;\n  id?: string;\n};\n\nexport interface ICanvas extends Releaseable {\n  width: number;\n  height: number;\n  id: number | string;\n  x: number;\n  y: number;\n  visiable: boolean;\n  nativeCanvas: HTMLCanvasElement | any;\n  displayWidth: number;\n  displayHeight: number;\n  dpr: number;\n\n  getContext: (contextId?: '2d', contextAttributes?: CanvasRenderingContext2DSettings) => IContext2d | null;\n\n  getNativeCanvas: () => HTMLCanvasElement | any;\n\n  // getContext(\n  //     contextId: 'bitmaprenderer',\n  //     contextAttributes?: WebGLContextAttributes,\n  // ): ImageBitmapRenderingContext | null;\n\n  // getContext(contextId: 'webgl', contextAttributes?: WebGLContextAttributes): WebGLRenderingContext | null;\n\n  // getContext(contextId: 'webgl2', contextAttributes?: WebGLContextAttributes): WebGL2RenderingContext | null;\n\n  convertToBlob: (options?: { type?: string | undefined; quality?: number | undefined }) => Promise<Blob>;\n\n  transferToImageBitmap: () => ImageBitmap;\n\n  resetStyle: (params: Partial<CanvasConfigType>) => void;\n  applyPosition: () => void;\n\n  hide: () => void;\n  show: () => void;\n\n  resize: (width: number, height: number) => void;\n\n  toDataURL: (() => string) &\n    ((mimeType: 'image/png') => string) &\n    ((mimeType: 'image/jpeg', quality: number) => string);\n\n  readPixels: (x: number, y: number, w: number, h: number) => ImageData | Promise<ImageData>;\n\n  release: () => void;\n}\n\nexport interface ICanvasLike {\n  width: number;\n  height: number;\n\n  /** _Non standard._ The type of the canvas. */\n  readonly type?: 'image' | 'pdf' | 'svg';\n\n  /** _Non standard._ Getter. The stride used by the canvas. */\n  readonly stride?: number;\n\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_NO_FILTERS?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_ALL_FILTERS?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_FILTER_NONE?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_FILTER_SUB?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_FILTER_UP?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_FILTER_AVG?: number;\n  /** Constant used in PNG encoding methods. */\n  readonly PNG_FILTER_PAETH?: number;\n\n  getContext: (contextId: string) => IContextLike;\n}\n\nexport interface ICanvasFactory extends Function {\n  (...params: any): ICanvas;\n}\n\nexport interface IContext2dFactory extends Function {\n  (...params: any): IContext2d;\n}\n"]}

package/cjs/interface/color.d.ts

@@ -0,0 +1,37 @@
+interface IGradientStop {
+    offset: number;
+    color: string;
+}
+export type IGradientColor = ILinearGradient | IRadialGradient | IConicalGradient;
+export interface ILinearGradient {
+    gradient: 'linear';
+    x0?: number;
+    y0?: number;
+    x1?: number;
+    y1?: number;
+    stops: IGradientStop[];
+}
+export interface IRadialGradient {
+    gradient: 'radial';
+    x0?: number;
+    y0?: number;
+    x1?: number;
+    y1?: number;
+    r0?: number;
+    r1?: number;
+    stops: IGradientStop[];
+}
+export interface IConicalGradient {
+    gradient: 'conical';
+    startAngle?: number;
+    endAngle?: number;
+    x?: number;
+    y?: number;
+    stops: IGradientStop[];
+}
+export interface IColorStop {
+    offset: number;
+    color: string;
+}
+export type IColor = string | ILinearGradient | IRadialGradient | IConicalGradient;
+export {};

package/cjs/interface/color.js

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

package/cjs/interface/color.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/color.ts"],"names":[],"mappings":"","file":"color.js","sourcesContent":["interface IGradientStop {\n  offset: number;\n  color: string;\n}\n\nexport type IGradientColor = ILinearGradient | IRadialGradient | IConicalGradient;\n\nexport interface ILinearGradient {\n  gradient: 'linear';\n  x0?: number;\n  y0?: number;\n  x1?: number;\n  y1?: number;\n  stops: IGradientStop[];\n}\n\nexport interface IRadialGradient {\n  gradient: 'radial';\n  x0?: number;\n  y0?: number;\n  x1?: number;\n  y1?: number;\n  r0?: number;\n  r1?: number;\n  stops: IGradientStop[];\n}\n\nexport interface IConicalGradient {\n  gradient: 'conical';\n  startAngle?: number;\n  endAngle?: number;\n  x?: number;\n  y?: number;\n  stops: IGradientStop[];\n}\n\nexport interface IColorStop {\n  offset: number;\n  color: string;\n}\n\nexport type IColor = string | ILinearGradient | IRadialGradient | IConicalGradient;\n"]}

package/cjs/interface/common.d.ts

@@ -0,0 +1,27 @@
+export type ICurveType = 'basis' | 'basisClosed' | 'basisOpen' | 'bundle' | 'cardinal' | 'cardinalClosed' | 'cardinalOpen' | 'stepBefore' | 'stepAfter' | 'catmullRom' | 'catmullRomClosed' | 'catmullRomOpen' | 'linear' | 'linearClosed' | 'monotoneX' | 'monotoneY' | 'natural' | 'radial' | 'step';
+export type MaybePromise<T> = T | PromiseLike<T>;
+export interface Releaseable {
+    release: (...params: any) => void;
+}
+export interface IEventElement {
+    addEventListener: (<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+    on: (<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+    once: (<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+    removeEventListener: (<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+    off: (<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+    removeAllListeners: (<K extends keyof DocumentEventMap>(type: K) => void) & ((type: string) => void);
+    dispatchEvent: (event: any) => boolean;
+    emit: (event: any, ...args: any) => boolean;
+}
+export interface IDomRectLike {
+    bottom: number;
+    left: number;
+    right: number;
+    top: number;
+    height: number;
+    width: number;
+    x: number;
+    y: number;
+}
+export type IDirection = 1 | 2;
+export type AsArray<T> = T extends any[] ? T : [T];

package/cjs/interface/common.js

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

package/cjs/interface/common.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/common.ts"],"names":[],"mappings":"","file":"common.js","sourcesContent":["export type ICurveType =\n  | 'basis'\n  | 'basisClosed'\n  | 'basisOpen'\n  | 'bundle'\n  | 'cardinal'\n  | 'cardinalClosed'\n  | 'cardinalOpen'\n  | 'stepBefore'\n  | 'stepAfter'\n  | 'catmullRom'\n  | 'catmullRomClosed'\n  | 'catmullRomOpen'\n  | 'linear'\n  | 'linearClosed'\n  | 'monotoneX'\n  | 'monotoneY'\n  | 'natural'\n  | 'radial'\n  | 'step';\n\nexport type MaybePromise<T> = T | PromiseLike<T>;\n\n// 所有的接口都应当继承这个，避免内存没有释放\nexport interface Releaseable {\n  release: (...params: any) => void;\n}\n\nexport interface IEventElement {\n  // event接口\n  addEventListener: (<K extends keyof DocumentEventMap>(\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => any,\n    options?: boolean | AddEventListenerOptions\n  ) => void) &\n    ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);\n  on: (<K extends keyof DocumentEventMap>(\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => any,\n    options?: boolean | AddEventListenerOptions\n  ) => void) &\n    ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);\n  once: (<K extends keyof DocumentEventMap>(\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => any,\n    options?: boolean | AddEventListenerOptions\n  ) => void) &\n    ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);\n  removeEventListener: (<K extends keyof DocumentEventMap>(\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => any,\n    options?: boolean | AddEventListenerOptions\n  ) => void) &\n    ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);\n  off: (<K extends keyof DocumentEventMap>(\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => any,\n    options?: boolean | AddEventListenerOptions\n  ) => void) &\n    ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);\n  removeAllListeners: (<K extends keyof DocumentEventMap>(type: K) => void) & ((type: string) => void);\n  dispatchEvent: (event: any) => boolean;\n  emit: (event: any, ...args: any) => boolean;\n}\n\nexport interface IDomRectLike {\n  bottom: number;\n  left: number;\n  right: number;\n  top: number;\n  height: number;\n  width: number;\n  x: number;\n  y: number;\n}\n\nexport type IDirection = 1 | 2;\n\nexport type AsArray<T> = T extends any[] ? T : [T];\n"]}

package/cjs/interface/context.d.ts

@@ -0,0 +1,196 @@
+import type { Matrix, IMatrix, IBoundsLike, IPointLike } from '@visactor/vutils';
+import type { ICamera } from './camera';
+import type { ICanvas } from './canvas';
+import type { Releaseable } from './common';
+import type { mat4, vec3 } from './matrix';
+import type { IFillType, IStrokeType, ITransform } from './graphic';
+export interface IConicalGradientData {
+    addColorStop: (pos: number, color: string) => void;
+    readonly stops: [number, string][];
+    GetPattern: (minW: number, minH: number, deltaAngle?: number) => CanvasPattern | null;
+}
+export interface ICommonStyleParams {
+    fill?: IFillType;
+    fillOpacity?: number;
+    shadowBlur?: number;
+    shadowColor?: string;
+    shadowOffsetX?: number;
+    shadowOffsetY?: number;
+    opacity?: number;
+    blur?: number;
+}
+export interface IStrokeStyleParams {
+    stroke?: IStrokeType | IStrokeType[];
+    strokeOpacity?: number;
+    lineDash?: number[];
+    lineDashOffset?: number;
+    lineWidth?: number;
+    lineCap?: CanvasLineCap;
+    lineJoin?: CanvasLineJoin;
+    miterLimit?: number;
+    opacity?: number;
+}
+export interface ITextStyleParams {
+    font?: string;
+    fontSize: number;
+    fontFamily?: string;
+    fontWeight?: string | number;
+    textAlign?: CanvasTextAlign;
+    textBaseline?: CanvasTextBaseline;
+    scaleIn3d?: boolean;
+}
+export interface ISetCommonStyleParams {
+    attribute: Partial<ICommonStyleParams & ITransform>;
+    AABBBounds: IBoundsLike;
+}
+export interface ISetStrokeStyleParams {
+    attribute: Partial<IStrokeStyleParams & ITransform>;
+    AABBBounds: IBoundsLike;
+}
+export interface IContext2d extends Releaseable {
+    stack: IMatrix[];
+    inuse?: boolean;
+    camera?: ICamera;
+    modelMatrix?: mat4;
+    drawPromise?: Promise<any>;
+    fillStyle: string | CanvasGradient | CanvasPattern;
+    disableFill?: boolean;
+    disableStroke?: boolean;
+    disableBeginPath?: boolean;
+    font: string;
+    globalAlpha: number;
+    lineCap: string;
+    lineDashOffset: number;
+    lineJoin: string;
+    lineWidth: number;
+    miterLimit: number;
+    shadowBlur: number;
+    shadowColor: string;
+    shadowOffsetX: number;
+    shadowOffsetY: number;
+    strokeStyle: string | CanvasGradient | CanvasPattern;
+    dpr: number;
+    textAlign: string;
+    textBaseline: string;
+    nativeContext: CanvasRenderingContext2D | any;
+    canvas: ICanvas;
+    [key: string]: any;
+    getCanvas: () => ICanvas;
+    getContext: () => any;
+    setTransformForCurrent: (force?: boolean) => void;
+    currentMatrix: IMatrix;
+    clear: () => void;
+    restore: () => void;
+    highPerformanceRestore: () => void;
+    rotate: (angle: number, setTransform?: boolean) => void;
+    save: () => void;
+    highPerformanceSave: () => void;
+    project?: (x: number, y: number, z?: number) => IPointLike;
+    view?: (x: number, y: number, z?: number) => vec3;
+    scale: (x: number, y: number, setTransform?: boolean) => void;
+    scalePoint: (sx: number, sy: number, px: number, py: number, setTransform?: boolean) => void;
+    transform: (m11: number, m12: number, m21: number, m22: number, dx: number, dy: number, setTransform?: boolean) => void;
+    transformFromMatrix: (matrix: Matrix, setTransform?: boolean) => void;
+    setTransform: (m11: number, m12: number, m21: number, m22: number, dx: number, dy: number, setTransform?: boolean, dpr?: number) => void;
+    setTransformFromMatrix: (matrix: Matrix, setTransform?: boolean, dpr?: number) => void;
+    resetTransform: (setTransform?: boolean, dpr?: number) => void;
+    translate: (x: number, y: number, setTransform?: boolean) => void;
+    rotateDegrees: (deg: number, setTransform?: boolean) => void;
+    rotateAbout: (rad: number, x: number, y: number, setTransform?: boolean) => void;
+    rotateDegreesAbout: (deg: number, x: number, y: number, setTransform?: boolean) => void;
+    beginPath: () => void;
+    clip: ((fillRule?: CanvasFillRule) => void) & ((path: Path2D, fillRule?: CanvasFillRule) => void);
+    arc: (x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean, z?: number) => void;
+    arcTo: (x1: number, y1: number, x2: number, y2: number, radius: number) => void;
+    bezierCurveTo: (cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number) => void;
+    closePath: () => void;
+    ellipse: (x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean) => void;
+    lineTo: (x: number, y: number, z?: number) => void;
+    moveTo: (x: number, y: number, z?: number) => void;
+    quadraticCurveTo: (cpx: number, cpy: number, x: number, y: number, z?: number) => void;
+    rect: (x: number, y: number, w: number, h: number, z?: number) => void;
+    createImageData: (imageDataOrSw: number | ImageData, sh?: number) => ImageData;
+    createLinearGradient: (x0: number, y0: number, x1: number, y1: number) => CanvasGradient;
+    createPattern: (image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ICanvas | any, repetition: string) => CanvasPattern | null;
+    createRadialGradient: (x0: number, y0: number, r0: number, x1: number, y1: number, r1: number) => CanvasGradient;
+    createConicGradient: (x: number, y: number, startAngle: number, endAngle: number) => IConicalGradientData | null;
+    fill: (path?: Path2D, fillRule?: CanvasFillRule) => void;
+    fillRect: (x: number, y: number, w: number, h: number) => void;
+    clearRect: (x: number, y: number, w: number, h: number) => void;
+    fillText: (text: string, x: number, y: number, z?: number) => void;
+    getImageData: (sx: number, sy: number, sw: number, sh: number) => ImageData;
+    getLineDash: () => number[];
+    isPointInPath: (x: number, y: number) => boolean;
+    isPointInStroke: (x: number, y: number) => boolean;
+    measureText: (text: string, method?: 'native' | 'simple' | 'quick') => {
+        width: number;
+    };
+    putImageData: (imagedata: ImageData, dx: number, dy: number) => void;
+    setLineDash: (segments: number[]) => void;
+    stroke: (path?: Path2D) => void;
+    strokeRect: (x: number, y: number, w: number, h: number) => void;
+    strokeText: (text: string, x: number, y: number, z?: number) => void;
+    drawImage: ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any, dstX: number, dstY: number) => void) & ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any, dstX: number, dstY: number, dstW: number, dstH: number) => void) & ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any, srcX: number, srcY: number, srcW: number, srcH: number, dstX: number, dstY: number, dstW: number, dstH: number) => void);
+    setCommonStyle: (params: ISetCommonStyleParams, attribute: ICommonStyleParams, offsetX: number, offsetY: number, defultParams?: ICommonStyleParams | Partial<ICommonStyleParams>[]) => void;
+    setShadowStyle?: (params: ISetCommonStyleParams, attribute: ICommonStyleParams, defultParams?: ICommonStyleParams | Partial<ICommonStyleParams>[]) => void;
+    setStrokeStyle: (params: ISetStrokeStyleParams, attribute: IStrokeStyleParams, offsetX: number, offsetY: number, defultParams?: Required<IStrokeStyleParams> | Partial<IStrokeStyleParams>[]) => void;
+    setTextStyle: (params: Partial<ITextStyleParams>, defaultParams?: ITextStyleParams, z?: number) => void;
+    setTextStyleWithoutAlignBaseline: (params: Partial<ITextStyleParams>, defaultParams?: ITextStyleParams, z?: number) => void;
+    draw: (...params: any) => void;
+    clearMatrix: (setTransform?: boolean, dpr?: number) => void;
+    onlyTranslate: (dpr?: number) => boolean;
+}
+export interface IContextLike {
+    fillStyle: string | CanvasGradient | CanvasPattern;
+    font: string;
+    globalAlpha: number;
+    lineCap: string;
+    lineDashOffset: number;
+    lineJoin: string;
+    lineWidth: number;
+    miterLimit: number;
+    shadowBlur: number;
+    shadowColor: string;
+    shadowOffsetX: number;
+    shadowOffsetY: number;
+    strokeStyle: string | CanvasGradient | CanvasPattern;
+    dpr: number;
+    textAlign: string;
+    textBaseline: string;
+    nativeContext: CanvasRenderingContext2D | any;
+    [key: string]: any;
+    clear: () => void;
+    restore: () => void;
+    save: () => void;
+    translate: (x: number, y: number) => void;
+    beginPath: () => void;
+    clip: ((fillRule?: CanvasFillRule) => void) & ((path: Path2D, fillRule?: CanvasFillRule) => void);
+    arc: (x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean) => void;
+    arcTo: ((x1: number, y1: number, x2: number, y2: number, radius: number) => void) & ((x1: number, y1: number, x2: number, y2: number, radiusX: number, radiusY: number, rotation: number) => void);
+    bezierCurveTo: (cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number) => void;
+    closePath: () => void;
+    ellipse: (x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean) => void;
+    lineTo: (x: number, y: number) => void;
+    moveTo: (x: number, y: number) => void;
+    quadraticCurveTo: (cpx: number, cpy: number, x: number, y: number) => void;
+    rect: (x: number, y: number, w: number, h: number) => void;
+    fill: (path?: Path2D, fillRule?: CanvasFillRule) => void;
+    fillRect: (x: number, y: number, w: number, h: number) => void;
+    clearRect: (x: number, y: number, w: number, h: number) => void;
+    fillText: (text: string, x: number, y: number, maxWidth?: number) => void;
+    getImageData: (sx: number, sy: number, sw: number, sh: number) => ImageData;
+    getLineDash: () => number[];
+    isPointInPath: (x: number, y: number) => boolean;
+    isPointInStroke: (x: number, y: number) => boolean;
+    measureText: (text: string, method?: 'native' | 'simple' | 'quick') => {
+        width: number;
+    };
+    putImageData: (imagedata: ImageData, dx: number, dy: number, dirtyX?: number, dirtyY?: number, dirtyWidth?: number, dirtyHeight?: number) => void;
+    setLineDash: (segments: number[]) => void;
+    stroke: (path?: Path2D) => void;
+    strokeRect: (x: number, y: number, w: number, h: number) => void;
+    strokeText: (text: string, x: number, y: number, maxWidth?: number) => void;
+    drawImage: ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any, dstX: number, dstY: number) => void) & ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any, dstX: number, dstY: number, dstW: number, dstH: number) => void) & ((image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any, srcX: number, srcY: number, srcW: number, srcH: number, dstX: number, dstY: number, dstW: number, dstH: number) => void);
+    clearMatrix: () => void;
+    onlyTranslate: () => boolean;
+}

package/cjs/interface/context.js

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