@visactor/vrender 0.9.0-alpha.0

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 { 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  | '';\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  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"]}

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,55 @@
+import { 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;
+}

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 { 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"]}

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,25 @@
+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;
+}

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"]}

package/cjs/interface/context.d.ts

@@ -0,0 +1,195 @@
+import { Matrix, IMatrix, IBoundsLike, IPointLike } from '@visactor/vutils';
+import { ICamera } from './camera';
+import { ICanvas } from './canvas';
+import { IColor } from './color';
+import { Releaseable } from './common';
+import { mat4, vec3 } from './matrix';
+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 {
+    fillColor?: string | IColor;
+    fillOpacity?: number;
+    shadowBlur?: number;
+    shadowColor?: string;
+    shadowOffsetX?: number;
+    shadowOffsetY?: number;
+    opacity?: number;
+    blur?: number;
+}
+export interface IStrokeStyleParams {
+    strokeColor?: string | IColor;
+    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;
+}
+export interface ISetCommonStyleParams {
+    attribute: Partial<ICommonStyleParams>;
+    AABBBounds: IBoundsLike;
+}
+export interface ISetStrokeStyleParams {
+    attribute: Partial<IStrokeStyleParams>;
+    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

package/cjs/interface/context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/context.ts"],"names":[],"mappings":"","file":"context.js","sourcesContent":["import { Matrix, IMatrix, IBoundsLike, IPointLike } from '@visactor/vutils';\nimport { ICamera } from './camera';\nimport { ICanvas } from './canvas';\nimport { IColor } from './color';\nimport { Releaseable } from './common';\nimport { mat4, vec3 } from './matrix';\n\nexport interface IConicalGradientData {\n  addColorStop: (pos: number, color: string) => void;\n  readonly stops: [number, string][];\n  GetPattern: (minW: number, minH: number, deltaAngle?: number) => CanvasPattern | null;\n}\n\n// 用于commonStyle函数的参数\nexport interface ICommonStyleParams {\n  fillColor?: string | IColor;\n  fillOpacity?: number;\n  shadowBlur?: number;\n  shadowColor?: string;\n  shadowOffsetX?: number;\n  shadowOffsetY?: number;\n  opacity?: number;\n  blur?: number;\n}\n\nexport interface IStrokeStyleParams {\n  strokeColor?: string | IColor;\n  strokeOpacity?: number;\n  lineDash?: number[];\n  lineDashOffset?: number;\n  lineWidth?: number;\n  lineCap?: CanvasLineCap;\n  lineJoin?: CanvasLineJoin;\n  miterLimit?: number;\n  opacity?: number;\n}\nexport interface ITextStyleParams {\n  font?: string;\n  fontSize: number;\n  fontFamily?: string;\n  fontWeight?: string | number;\n  textAlign?: CanvasTextAlign;\n  textBaseline?: CanvasTextBaseline;\n}\n\nexport interface ISetCommonStyleParams {\n  attribute: Partial<ICommonStyleParams>;\n  AABBBounds: IBoundsLike;\n}\n\nexport interface ISetStrokeStyleParams {\n  attribute: Partial<IStrokeStyleParams>;\n  AABBBounds: IBoundsLike;\n}\nexport interface IContext2d extends Releaseable {\n  stack: IMatrix[];\n  inuse?: boolean;\n  camera?: ICamera;\n  modelMatrix?: mat4;\n  drawPromise?: Promise<any>;\n  // 属性代理\n  fillStyle: string | CanvasGradient | CanvasPattern;\n  disableFill?: boolean;\n  disableStroke?: boolean;\n  disableBeginPath?: boolean;\n  /**\n   * @deprecated font方法不建议使用，请使用setTextStyle\n   */\n  font: string;\n  globalAlpha: number;\n  lineCap: string;\n  lineDashOffset: number;\n  lineJoin: string;\n  lineWidth: number;\n  miterLimit: number;\n  shadowBlur: number;\n  shadowColor: string;\n  shadowOffsetX: number;\n  shadowOffsetY: number;\n  strokeStyle: string | CanvasGradient | CanvasPattern;\n  dpr: number;\n  /**\n   * @deprecated textAlign方法不建议使用，请使用setTextStyle\n   */\n  textAlign: string;\n  /**\n   * @deprecated textBaseline方法不建议使用，请使用setTextStyle\n   */\n  textBaseline: string;\n  nativeContext: CanvasRenderingContext2D | any;\n  canvas: ICanvas;\n  [key: string]: any; //类型没有索引签名\n\n  getCanvas: () => ICanvas;\n\n  getContext: () => any;\n\n  /**\n   * 设置当前ctx 的transform信息\n   */\n  setTransformForCurrent: (force?: boolean) => void;\n  /**\n   * 获取当前矩阵信息\n   */\n  currentMatrix: IMatrix;\n\n  /**\n   * 清空画布\n   */\n  clear: () => void;\n\n  restore: () => void;\n  highPerformanceRestore: () => void;\n\n  /**\n   *\n   * @param angle 弧度数\n   */\n  rotate: (angle: number, setTransform?: boolean) => void;\n\n  save: () => void;\n  highPerformanceSave: () => void;\n\n  project?: (x: number, y: number, z?: number) => IPointLike;\n  view?: (x: number, y: number, z?: number) => vec3;\n\n  scale: (x: number, y: number, setTransform?: boolean) => void;\n\n  scalePoint: (sx: number, sy: number, px: number, py: number, setTransform?: boolean) => void;\n  transform: (\n    m11: number,\n    m12: number,\n    m21: number,\n    m22: number,\n    dx: number,\n    dy: number,\n    setTransform?: boolean\n  ) => void;\n  transformFromMatrix: (matrix: Matrix, setTransform?: boolean) => void;\n  setTransform: (\n    m11: number,\n    m12: number,\n    m21: number,\n    m22: number,\n    dx: number,\n    dy: number,\n    setTransform?: boolean,\n    dpr?: number\n  ) => void;\n  setTransformFromMatrix: (matrix: Matrix, setTransform?: boolean, dpr?: number) => void;\n\n  resetTransform: (setTransform?: boolean, dpr?: number) => void;\n\n  translate: (x: number, y: number, setTransform?: boolean) => void;\n  /**\n   * 旋转角度，自动转换为弧度\n   * @param deg 角度数\n   */\n  rotateDegrees: (deg: number, setTransform?: boolean) => void;\n\n  /**\n   * 绕点旋转\n   * @param rad 弧度\n   * @param x 旋转中心点x\n   * @param y 旋转中心点y\n   */\n  rotateAbout: (rad: number, x: number, y: number, setTransform?: boolean) => void;\n\n  /**\n   * 绕点旋转\n   * @param deg 旋转角度\n   * @param x 旋转中心点x\n   * @param y 旋转中心点y\n   */\n  rotateDegreesAbout: (deg: number, x: number, y: number, setTransform?: boolean) => void;\n\n  beginPath: () => void;\n\n  clip: ((fillRule?: CanvasFillRule) => void) & ((path: Path2D, fillRule?: CanvasFillRule) => void);\n\n  arc: (\n    x: number,\n    y: number,\n    radius: number,\n    startAngle: number,\n    endAngle: number,\n    anticlockwise?: boolean,\n    z?: number\n  ) => void;\n\n  arcTo: (x1: number, y1: number, x2: number, y2: number, radius: number) => void;\n\n  bezierCurveTo: (cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number) => void;\n\n  closePath: () => void;\n\n  ellipse: (\n    x: number,\n    y: number,\n    radiusX: number,\n    radiusY: number,\n    rotation: number,\n    startAngle: number,\n    endAngle: number,\n    anticlockwise?: boolean\n  ) => void;\n\n  lineTo: (x: number, y: number, z?: number) => void;\n\n  moveTo: (x: number, y: number, z?: number) => void;\n\n  quadraticCurveTo: (cpx: number, cpy: number, x: number, y: number, z?: number) => void;\n\n  rect: (x: number, y: number, w: number, h: number, z?: number) => void;\n\n  createImageData: (imageDataOrSw: number | ImageData, sh?: number) => ImageData;\n\n  createLinearGradient: (x0: number, y0: number, x1: number, y1: number) => CanvasGradient;\n\n  createPattern: (\n    image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ICanvas | any,\n    repetition: string\n  ) => CanvasPattern | null;\n\n  createRadialGradient: (x0: number, y0: number, r0: number, x1: number, y1: number, r1: number) => CanvasGradient;\n\n  createConicGradient: (x: number, y: number, startAngle: number, endAngle: number) => IConicalGradientData | null;\n\n  // createConicGradient: (x: number, y: number, startAngle: number, endAngle: number) => IConicalGradient | null;\n\n  // fill(fillRule?: CanvasFillRule): void;\n  fill: (path?: Path2D, fillRule?: CanvasFillRule) => void;\n\n  fillRect: (x: number, y: number, w: number, h: number) => void;\n\n  clearRect: (x: number, y: number, w: number, h: number) => void;\n\n  fillText: (text: string, x: number, y: number, z?: number) => void;\n\n  getImageData: (sx: number, sy: number, sw: number, sh: number) => ImageData;\n\n  getLineDash: () => number[];\n\n  isPointInPath: (x: number, y: number) => boolean;\n  isPointInStroke: (x: number, y: number) => boolean;\n\n  measureText: (text: string, method?: 'native' | 'simple' | 'quick') => { width: number };\n\n  putImageData: (imagedata: ImageData, dx: number, dy: number) => void;\n\n  setLineDash: (segments: number[]) => void;\n\n  stroke: (path?: Path2D) => void;\n\n  strokeRect: (x: number, y: number, w: number, h: number) => void;\n\n  strokeText: (text: string, x: number, y: number, z?: number) => void;\n\n  drawImage: ((\n    image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any,\n    dstX: number,\n    dstY: number\n  ) => void) &\n    ((\n      image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any,\n      dstX: number,\n      dstY: number,\n      dstW: number,\n      dstH: number\n    ) => void) &\n    ((\n      image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | ICanvas | any,\n      srcX: number,\n      srcY: number,\n      srcW: number,\n      srcH: number,\n      dstX: number,\n      dstY: number,\n      dstW: number,\n      dstH: number\n    ) => void);\n\n  setCommonStyle: (\n    params: ISetCommonStyleParams,\n    attribute: ICommonStyleParams,\n    // 用于渐变色\n    offsetX: number,\n    offsetY: number,\n    defultParams?: ICommonStyleParams | Partial<ICommonStyleParams>[]\n  ) => void;\n\n  setShadowStyle?: (\n    params: ISetCommonStyleParams,\n    attribute: ICommonStyleParams,\n    defultParams?: ICommonStyleParams | Partial<ICommonStyleParams>[]\n  ) => void;\n\n  setStrokeStyle: (\n    params: ISetStrokeStyleParams,\n    attribute: IStrokeStyleParams,\n    // 用于渐变色\n    offsetX: number,\n    offsetY: number,\n    defultParams?: Required<IStrokeStyleParams> | Partial<IStrokeStyleParams>[]\n  ) => void;\n\n  setTextStyle: (params: Partial<ITextStyleParams>, defaultParams?: ITextStyleParams, z?: number) => void;\n  setTextStyleWithoutAlignBaseline: (\n    params: Partial<ITextStyleParams>,\n    defaultParams?: ITextStyleParams,\n    z?: number\n  ) => void;\n\n  draw: (...params: any) => void;\n\n  clearMatrix: (setTransform?: boolean, dpr?: number) => void;\n  onlyTranslate: (dpr?: number) => boolean;\n}\n\nexport interface IContextLike {\n  // 属性代理\n  fillStyle: string | CanvasGradient | CanvasPattern;\n  /**\n   * @deprecated font方法不建议使用，请使用setTextStyle\n   */\n  font: string;\n  globalAlpha: number;\n  lineCap: string;\n  lineDashOffset: number;\n  lineJoin: string;\n  lineWidth: number;\n  miterLimit: number;\n  shadowBlur: number;\n  shadowColor: string;\n  shadowOffsetX: number;\n  shadowOffsetY: number;\n  strokeStyle: string | CanvasGradient | CanvasPattern;\n  dpr: number;\n  /**\n   * @deprecated textAlign方法不建议使用，请使用setTextStyle\n   */\n  textAlign: string;\n  /**\n   * @deprecated textBaseline方法不建议使用，请使用setTextStyle\n   */\n  textBaseline: string;\n  nativeContext: CanvasRenderingContext2D | any;\n  [key: string]: any; //类型没有索引签名\n\n  /**\n   * 清空画布\n   */\n  clear: () => void;\n\n  restore: () => void;\n\n  save: () => void;\n\n  // transform(m11: number, m12: number, m21: number, m22: number, dx: number, dy: number): void;\n\n  translate: (x: number, y: number) => void;\n\n  beginPath: () => void;\n\n  clip: ((fillRule?: CanvasFillRule) => void) & ((path: Path2D, fillRule?: CanvasFillRule) => void);\n\n  arc: (x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean) => void;\n\n  arcTo: ((x1: number, y1: number, x2: number, y2: number, radius: number) => void) &\n    ((x1: number, y1: number, x2: number, y2: number, radiusX: number, radiusY: number, rotation: number) => void);\n\n  bezierCurveTo: (cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number) => void;\n\n  closePath: () => void;\n\n  ellipse: (\n    x: number,\n    y: number,\n    radiusX: number,\n    radiusY: number,\n    rotation: number,\n    startAngle: number,\n    endAngle: number,\n    anticlockwise?: boolean\n  ) => void;\n\n  lineTo: (x: number, y: number) => void;\n\n  moveTo: (x: number, y: number) => void;\n\n  quadraticCurveTo: (cpx: number, cpy: number, x: number, y: number) => void;\n\n  rect: (x: number, y: number, w: number, h: number) => void;\n\n  fill: (path?: Path2D, fillRule?: CanvasFillRule) => void;\n\n  fillRect: (x: number, y: number, w: number, h: number) => void;\n\n  clearRect: (x: number, y: number, w: number, h: number) => void;\n\n  fillText: (text: string, x: number, y: number, maxWidth?: number) => void;\n\n  getImageData: (sx: number, sy: number, sw: number, sh: number) => ImageData;\n\n  getLineDash: () => number[];\n\n  isPointInPath: (x: number, y: number) => boolean;\n  isPointInStroke: (x: number, y: number) => boolean;\n\n  measureText: (text: string, method?: 'native' | 'simple' | 'quick') => { width: number };\n\n  putImageData: (\n    imagedata: ImageData,\n    dx: number,\n    dy: number,\n    dirtyX?: number,\n    dirtyY?: number,\n    dirtyWidth?: number,\n    dirtyHeight?: number\n  ) => void;\n\n  setLineDash: (segments: number[]) => void;\n\n  stroke: (path?: Path2D) => void;\n\n  strokeRect: (x: number, y: number, w: number, h: number) => void;\n\n  strokeText: (text: string, x: number, y: number, maxWidth?: number) => void;\n\n  drawImage: ((\n    image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any,\n    dstX: number,\n    dstY: number\n  ) => void) &\n    ((\n      image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any,\n      dstX: number,\n      dstY: number,\n      dstW: number,\n      dstH: number\n    ) => void) &\n    ((\n      image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap | any,\n      srcX: number,\n      srcY: number,\n      srcW: number,\n      srcH: number,\n      dstX: number,\n      dstY: number,\n      dstW: number,\n      dstH: number\n    ) => void);\n\n  clearMatrix: () => void;\n  onlyTranslate: () => boolean;\n}\n"]}

package/cjs/interface/contribution.d.ts

@@ -0,0 +1,4 @@
+import { Releaseable } from './common';
+export interface IContribution<T> extends Releaseable {
+    configure: (service: T, ...data: any) => void;
+}

package/cjs/interface/contribution.js

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

package/cjs/interface/contribution.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/contribution.ts"],"names":[],"mappings":"","file":"contribution.js","sourcesContent":["import { Releaseable } from './common';\n\nexport interface IContribution<T> extends Releaseable {\n  configure: (service: T, ...data: any) => void;\n}\n"]}

package/cjs/interface/creator.d.ts

@@ -0,0 +1,4 @@
+import { ILayer } from './layer';
+import { IStage } from './stage';
+export declare function createLayer(canvasId?: string): ILayer;
+export declare function createStage(w: number, h: number): IStage;

package/cjs/interface/creator.js

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

package/cjs/interface/creator.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interface/creator.ts"],"names":[],"mappings":"","file":"creator.js","sourcesContent":["import { ILayer } from './layer';\nimport { IStage } from './stage';\n\nexport declare function createLayer(canvasId?: string): ILayer;\nexport declare function createStage(w: number, h: number): IStage;\n"]}

package/cjs/interface/global.d.ts

@@ -0,0 +1,124 @@
+import { Dict, IPoint } from '@visactor/vutils';
+import type { SyncHook } from '../tapable';
+import { ICanvasLike } from './canvas';
+import { IEventElement } from './common';
+import { IContribution } from './contribution';
+export interface ILoader {
+    loadImage: (url: string) => HTMLImageElement | ImageData;
+    loadJson: (url: string) => JSON;
+}
+export type EnvType = 'browser' | 'feishu' | 'tt' | 'taro' | 'node' | 'native' | 'lynx';
+export declare const EnvContribution: unique symbol;
+export interface ICreateCanvasParams {
+    id?: string;
+    width?: number;
+    height?: number;
+    dpr?: number;
+}
+export interface ILoader {
+    loadImage: (url: string) => HTMLImageElement | ImageData;
+    loadJson: (url: string) => JSON;
+}
+export interface IEnvContribution extends IContribution<IGlobal>, Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {
+    type: EnvType;
+    supportEvent: boolean;
+    configure: (global: IGlobal, ...p: any) => void;
+    createCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;
+    createOffscreenCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;
+    releaseCanvas: (canvas: ICanvasLike | string | any) => void;
+    getDevicePixelRatio: () => number;
+    getRequestAnimationFrame: () => (callback: FrameRequestCallback) => number;
+    getCancelAnimationFrame: () => (h: number) => void;
+    getElementById?: (str: string) => HTMLElement | null;
+    getRootElement?: () => HTMLElement | null;
+    getDocument?: () => Document | null;
+    supportsTouchEvents: boolean;
+    supportsPointerEvents: boolean;
+    supportsMouseEvents: boolean;
+    applyStyles?: boolean;
+    mapToCanvasPoint?: (event: any) => IPoint | null;
+    loadImage: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: HTMLImageElement | ImageData | null;
+    }>;
+    loadSvg: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: HTMLImageElement | ImageData | null;
+    }>;
+    loadJson: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: Record<string, unknown> | null;
+    }>;
+    loadArrayBuffer: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: ArrayBuffer | null;
+    }>;
+    loadBlob: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: Blob | null;
+    }>;
+}
+export type IMiniAppEnvParams = {
+    domref?: Dict<any>;
+    force?: boolean;
+    canvasIdLists?: (string | number)[];
+    freeCanvasIdx?: string | number;
+    taro?: any;
+    pixelRatio?: number;
+    [key: string]: any;
+};
+export interface IEnvParamsMap {
+    readonly taro: IMiniAppEnvParams;
+    readonly feishu: IMiniAppEnvParams;
+    readonly tt: IMiniAppEnvParams;
+    readonly browser: any;
+    readonly node: any;
+    readonly native: any;
+    readonly lynx: any;
+}
+export declare const Global: unique symbol;
+export interface IGlobal extends Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {
+    env: EnvType;
+    devicePixelRatio: number;
+    hooks: {
+        onSetEnv: SyncHook<[EnvType | undefined, EnvType, IGlobal]>;
+    };
+    envParams?: any;
+    supportEvent: boolean;
+    setEnv: (env: EnvType, params?: IEnvParamsMap[EnvType]) => void;
+    setActiveEnvContribution: (contribution: IEnvContribution) => void;
+    createCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;
+    createOffscreenCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;
+    releaseCanvas: (canvas: HTMLCanvasElement | string | any) => void;
+    getElementById: (str: string) => HTMLElement | null;
+    getRootElement: () => HTMLElement | null;
+    getDocument: () => Document | null;
+    supportsTouchEvents: boolean;
+    supportsPointerEvents: boolean;
+    supportsMouseEvents: boolean;
+    applyStyles?: boolean;
+    measureTextMethod: 'native' | 'simple' | 'quick';
+    getRequestAnimationFrame: () => null | ((callback: FrameRequestCallback) => number);
+    getCancelAnimationFrame: () => null | ((h: number) => void);
+    mapToCanvasPoint: (nativeEvent: any) => IPoint | null;
+    loadImage: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: HTMLImageElement | ImageData | null;
+    }>;
+    loadSvg: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: HTMLImageElement | ImageData | null;
+    }>;
+    loadJson: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: Record<string, unknown> | null;
+    }>;
+    loadArrayBuffer: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: ArrayBuffer | null;
+    }>;
+    loadBlob: (url: string) => Promise<{
+        loadState: 'success' | 'fail';
+        data: Blob | null;
+    }>;
+}

package/cjs/interface/global.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.Global = exports.EnvContribution = void 0, exports.EnvContribution = Symbol.for("EnvContribution"), 
+exports.Global = Symbol.for("Global");
+//# sourceMappingURL=global.js.map