@visactor/vrender 0.11.1 → 0.12.0

package/cjs/interface/event.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/interface/event.ts"],"names":[],"mappings":"","file":"event.js","sourcesContent":["import type { INode } from './node-tree';\nimport type { Dict, IBounds, IPointLike } from '@visactor/vutils';\nimport type { Cursor, IGraphicAttribute } from './graphic';\nimport type { IDomRectLike, IEventElement } from './common';\nimport type { ICanvas } from './canvas';\nimport type { IGlobal } from './global';\n\nexport interface IEventManager {\n  rootTarget: IEventTarget;\n  dispatch: any;\n  cursor: Cursor | string;\n  addEventMapping: (type: string, fn: (e: IFederatedEvent, target: IEventTarget) => void) => void;\n  dispatchEvent: (e: IFederatedEvent, type?: string) => void;\n  mapEvent: (e: IFederatedEvent) => void;\n  propagate: (e: IFederatedEvent, type?: string) => void;\n  propagationPath: (target: IEventTarget) => IEventTarget[];\n  copyWheelData: (from: IFederatedWheelEvent, to: IFederatedWheelEvent) => void;\n  copyPointerData: (from: IFederatedEvent, to: IFederatedEvent) => void;\n  copyMouseData: (from: IFederatedEvent, to: IFederatedEvent) => void;\n  copyData: (from: IFederatedEvent, to: IFederatedEvent) => void;\n}\n\nexport interface IFederatedEvent<N = Event> {\n  bubbles: boolean;\n  cancelBubble: boolean;\n  cancelable: boolean;\n  composed: boolean;\n  currentTarget: IEventTarget | null;\n  defaultPrevented: boolean;\n  eventPhase: number;\n  isTrusted: boolean;\n  returnValue: boolean;\n  srcElement: IEventTarget;\n  target: IEventTarget | null;\n  timeStamp: number;\n  type: string;\n  nativeEvent: N;\n  originalEvent: IFederatedEvent<N> | null;\n  propagationStopped: boolean;\n  propagationImmediatelyStopped: boolean;\n  path: IEventTarget[];\n  manager?: IEventManager;\n  detail: any;\n  view: any;\n  layer: IPointLike;\n  get layerX(): number;\n  get layerY(): number;\n  page: IPointLike;\n  get pageX(): number;\n  get pageY(): number;\n  canvas: IPointLike;\n  get x(): number;\n  get y(): number;\n  get canvasX(): number;\n  get canvasY(): number;\n  viewport: IPointLike;\n  get viewX(): number;\n  get viewY(): number;\n  composedPath: () => IEventTarget[];\n  preventDefault: () => void;\n  stopImmediatePropagation: () => void;\n  stopPropagation: () => void;\n  initEvent: () => void;\n  initUIEvent: () => void;\n  clone: () => void;\n  which: number;\n}\n\nexport interface IFederatedMouseEvent extends IFederatedEvent {\n  altKey: boolean;\n  button: number;\n  buttons: number;\n  ctrlKey: boolean;\n  metaKey: boolean;\n  relatedTarget: EventTarget | null;\n  shiftKey: boolean;\n  client: IPointLike;\n  get clientX(): number;\n  get clientY(): number;\n  detail: number;\n  movement: IPointLike;\n  get movementX(): number;\n  get movementY(): number;\n  offset: IPointLike;\n  get offsetX(): number;\n  get offsetY(): number;\n  global: IPointLike;\n  get globalX(): number;\n  get globalY(): number;\n  screen: IPointLike;\n  get screenX(): number;\n  get screenY(): number;\n  getModifierState: (key: string) => boolean;\n  initMouseEvent: (\n    _typeArg: string,\n    _canBubbleArg: boolean,\n    _cancelableArg: boolean,\n    _viewArg: Window,\n    _detailArg: number,\n    _screenXArg: number,\n    _screenYArg: number,\n    _clientXArg: number,\n    _clientYArg: number,\n    _ctrlKeyArg: boolean,\n    _altKeyArg: boolean,\n    _shiftKeyArg: boolean,\n    _metaKeyArg: boolean,\n    _buttonArg: number,\n    _relatedTargetArg: EventTarget\n  ) => void;\n}\n\nexport interface IFederatedWheelEvent extends IFederatedMouseEvent {\n  deltaMode: number;\n  deltaX: number;\n  deltaY: number;\n  deltaZ: number;\n  clone: () => IFederatedWheelEvent;\n}\n\nexport interface IFederatedPointerEvent extends IFederatedMouseEvent {\n  pointerId: number;\n  width: number;\n  height: number;\n  isPrimary: boolean;\n  pointerType: string;\n  pressure: number;\n  tangentialPressure: number;\n  tiltX: number;\n  tiltY: number;\n  twist: number;\n  detail: number;\n  getCoalescedEvents: () => PointerEvent[];\n  getPredictedEvents: () => PointerEvent[];\n  clone: () => IFederatedPointerEvent;\n}\n\n/**\n * 代码参考自 https://github.com/pixijs/pixijs\n * The MIT License\n\n  Copyright (c) 2013-2023 Mathew Groves, Chad Engler\n\n  Permission is hereby granted, free of charge, to any person obtaining a copy\n  of this software and associated documentation files (the \"Software\"), to deal\n  in the Software without restriction, including without limitation the rights\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n  copies of the Software, and to permit persons to whom the Software is\n  furnished to do so, subject to the following conditions:\n\n  The above copyright notice and this permission notice shall be included in\n  all copies or substantial portions of the Software.\n\n  THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n  THE SOFTWARE.\n */\n\nexport interface IEventTarget extends INode {\n  /** Whether this event target should fire UI events. */\n  pickable: boolean;\n  /** The parent of this event target. */\n  parent: IEventTarget | null;\n  /** Whether this event target should be visible. */\n  visible: boolean;\n\n  /** The children of this event target. */\n  children?: IEventTarget[];\n\n  /** Whether this event target has any children that need UI events. This can be used optimize event propagation. */\n  childrenPickable?: boolean;\n\n  attribute?: Partial<IGraphicAttribute>;\n\n  emit: (eventName: any, data: Dict<any>) => boolean;\n\n  getCursor: () => string;\n  setCursor: (c?: string) => void;\n}\n\nexport interface IRender {\n  visualCanvas: {\n    getCanvas: () => HTMLElement;\n  };\n  pickEvent: (position: [number, number], children: IEventTarget[], geoPick?: boolean) => IEventTarget | null;\n  [key: string]: any;\n}\n\n// 事件系统扩展接口\nexport interface IEventExtension {\n  /**\n   * bind events\n   */\n  initEvents: () => void;\n  /**\n   * unbind events\n   */\n  removeEvents: () => void;\n  /**\n   * release\n   */\n  release: () => void;\n}\n\nexport type GestureDirection = 'none' | 'left' | 'right' | 'down' | 'up';\n\nexport interface GestureEvent extends IFederatedPointerEvent {\n  points: IPointLike[];\n  direction: GestureDirection;\n  deltaX: number;\n  deltaY: number;\n  scale: number;\n  center: IPointLike;\n  velocity: number;\n}\n\nexport interface GestureConfig {\n  press?: {\n    /**\n     * @default 251\n     * Minimal press time in ms.\n     * @see http://hammerjs.github.io/recognizer-press/\n     */\n    time?: number;\n    /**\n     * @default 10\n     * Minimal movement that is allowed while pressing.\n     * @see http://hammerjs.github.io/recognizer-press/\n     */\n    threshold?: number;\n  };\n  swipe?: {\n    /**\n     * Minimal distance required before recognizing.\n     * @default 10\n     * @see https://hammerjs.github.io/recognizer-swipe/\n     */\n    threshold?: number;\n    /**\n     * Minimal velocity required before recognizing, unit is in px per ms.\n     * @default 0.3\n     * @see http://hammerjs.github.io/recognizer-swipe/\n     */\n    velocity?: number;\n  };\n}\n\nexport interface DefaultGestureConfig {\n  press: {\n    time: number;\n    threshold: number;\n  };\n  swipe: {\n    threshold: number;\n    velocity: number;\n  };\n}\n\nexport interface EmitEventObject {\n  type: string;\n  ev: GestureEvent;\n}\n\nexport type LooseFunction = (...args: any[]) => any;\n\nexport type IElementLike = Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> & {\n  style: CSSStyleDeclaration | Record<string, any>;\n  getNativeHandler?: () => ICanvas;\n  getBoundingClientRect: () => IDomRectLike;\n};\n\nexport type RenderConfig = {\n  /**\n   * 事件绑定的 canvas 元素\n   */\n  targetElement: IElementLike;\n  /**\n   * 环境分辨率\n   */\n  resolution: number;\n  /**\n   * 场景树根节点\n   */\n  rootNode: IEventTarget;\n  global: IGlobal;\n  /** 是否自动阻止事件 */\n  autoPreventDefault?: boolean;\n  /** 绘图视口 */\n  viewport: {\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n    viewBox?: IBounds;\n  };\n};\n\nexport type NativeEvent = MouseEvent | PointerEvent | TouchEvent;\n"]}

package/cjs/interface/global.d.ts

@@ -1,14 +1,13 @@
-import { Dict, IPointLike } from '@visactor/vutils';
-import type { SyncHook } from '../tapable';
-import { ICanvasLike } from './canvas';
-import { IEventElement } from './common';
-import { IContribution } from './contribution';
+import type { Dict, IPointLike } from '@visactor/vutils';
+import type { ICanvasLike } from './canvas';
+import type { IEventElement } from './common';
+import type { IContribution } from './contribution';
+import type { ISyncHook } from './sync-hook';
 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;
@@ -76,12 +75,11 @@ export interface IEnvParamsMap {
     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]>;
+        onSetEnv: ISyncHook<[EnvType | undefined, EnvType, IGlobal]>;
     };
     envParams?: any;
     supportEvent: boolean;

package/cjs/interface/global.js

@@ -2,6 +2,5 @@
 
 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

package/cjs/interface/global.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/global.ts"],"names":[],"mappings":";;;AAca,QAAA,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;AA4HhD,QAAA,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC","file":"global.js","sourcesContent":["import { Dict, IPoint, IPointLike } from '@visactor/vutils';\nimport type { SyncHook } from '../tapable';\nimport { ICanvasLike } from './canvas';\nimport { IEventElement } from './common';\nimport { IContribution } from './contribution';\n\nexport interface ILoader {\n  loadImage: (url: string) => HTMLImageElement | ImageData;\n  loadJson: (url: string) => JSON;\n}\n\n// 环境定义\nexport type EnvType = 'browser' | 'feishu' | 'tt' | 'taro' | 'node' | 'native' | 'lynx';\n\nexport const EnvContribution = Symbol.for('EnvContribution');\n\n// 创建canvas需要的参数\nexport interface ICreateCanvasParams {\n  id?: string;\n  // 像素宽\n  width?: number;\n  // 像素高\n  height?: number;\n  dpr?: number;\n}\n\nexport interface ILoader {\n  loadImage: (url: string) => HTMLImageElement | ImageData;\n  loadJson: (url: string) => JSON;\n}\n\nexport interface IEnvContribution\n  extends IContribution<IGlobal>,\n    Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {\n  // 当前代码所运行的环境\n  type: EnvType;\n\n  // 是否支持事件\n  // node环境不需要事件\n  supportEvent: boolean;\n\n  // 开始配置环境，相当于init\n  configure: (global: IGlobal, ...p: any) => void;\n\n  // 创建销毁\n  createCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;\n  createOffscreenCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;\n  releaseCanvas: (canvas: ICanvasLike | string | any) => void;\n\n  // 设备信息\n  getDevicePixelRatio: () => number;\n\n  // 通用接口\n  getRequestAnimationFrame: () => (callback: FrameRequestCallback) => number;\n  getCancelAnimationFrame: () => (h: number) => void;\n\n  // DOM接口\n  getElementById?: (str: string) => HTMLElement | null;\n  getRootElement?: () => HTMLElement | null;\n  /**\n   * get document instance\n   */\n  getDocument?: () => Document | null;\n  /**\n   * whether supports TouchEvent.\n   */\n  supportsTouchEvents: boolean;\n  /**\n   * whether supports PointerEvent.\n   */\n  supportsPointerEvents: boolean;\n  /**\n   * whether supports MouseEvent.\n   */\n  supportsMouseEvents: boolean;\n  /**\n   * Whether to allow setting the cursor style\n   */\n  applyStyles?: boolean;\n\n  /**\n   * 将窗口坐标转换为画布坐标，小程序/小组件环境需要兼容\n   */\n  mapToCanvasPoint?: (event: any, domElement?: any) => IPointLike | null;\n\n  loadImage: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadSvg: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadJson: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Record<string, unknown> | null;\n  }>;\n  loadArrayBuffer: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: ArrayBuffer | null;\n  }>;\n  loadBlob: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Blob | null;\n  }>;\n}\n\nexport type IMiniAppEnvParams = {\n  /** dom 容器对象 */\n  domref?: Dict<any>;\n  /**\n   * 强行设置env，如果env重复设置也设置\n   */\n  force?: boolean;\n  /**\n   * 可用的canvas列表\n   */\n  canvasIdLists?: (string | number)[];\n  /**\n   * 表示可以自由使用的canvas索引\n   */\n  freeCanvasIdx?: string | number;\n  /** taro 环境使用 */\n  taro?: any;\n  pixelRatio?: number;\n  [key: string]: any;\n};\n\nexport interface IEnvParamsMap {\n  readonly taro: IMiniAppEnvParams;\n  readonly feishu: IMiniAppEnvParams;\n  readonly tt: IMiniAppEnvParams;\n  readonly browser: any;\n  readonly node: any;\n  readonly native: any;\n  readonly lynx: any;\n}\n\nexport const Global = Symbol.for('Global');\nexport interface IGlobal extends Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {\n  // 当前代码所运行的环境\n  env: EnvType;\n\n  // 设备的dpr\n  devicePixelRatio: number;\n\n  // 当设置env的时候被调用\n  hooks: {\n    onSetEnv: SyncHook<[EnvType | undefined, EnvType, IGlobal]>;\n  };\n\n  // 设置env的时候传入的参数\n  // node环境需要传入整个node-canvas包\n  // 小程序环境需要传入小程序要用到的参数\n  envParams?: any;\n\n  // 是否支持事件\n  // node环境不需要事件\n  supportEvent: boolean;\n\n  setEnv: (env: EnvType, params?: IEnvParamsMap[EnvType]) => void;\n  setActiveEnvContribution: (contribution: IEnvContribution) => void;\n  createCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;\n  createOffscreenCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;\n  releaseCanvas: (canvas: HTMLCanvasElement | string | any) => void;\n\n  /* 浏览器环境 - dom tree */\n  getElementById: (str: string) => HTMLElement | null;\n  getRootElement: () => HTMLElement | null;\n  /**\n   * get document instance\n   */\n  getDocument: () => Document | null;\n  /**\n   * whether supports TouchEvent.\n   */\n  supportsTouchEvents: boolean;\n  /**\n   * whether supports PointerEvent.\n   */\n  supportsPointerEvents: boolean;\n  /**\n   * whether supports MouseEvent.\n   */\n  supportsMouseEvents: boolean;\n  /**\n   * Whether to allow setting the cursor style\n   */\n  applyStyles?: boolean;\n  /**\n   * 测量文字的方法\n   */\n  measureTextMethod: 'native' | 'simple' | 'quick';\n\n  getRequestAnimationFrame: () => null | ((callback: FrameRequestCallback) => number);\n  getCancelAnimationFrame: () => null | ((h: number) => void);\n\n  /**\n   * 将窗口坐标转换为画布坐标，小程序/小组件环境需要兼容\n   */\n  mapToCanvasPoint: (nativeEvent: any, domElement?: any) => IPointLike | null;\n\n  loadImage: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadSvg: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadJson: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Record<string, unknown> | null;\n  }>;\n  loadArrayBuffer: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: ArrayBuffer | null;\n  }>;\n  loadBlob: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Blob | null;\n  }>;\n}\n"]}
+{"version":3,"sources":["../../src/interface/global.ts"],"names":[],"mappings":"","file":"global.js","sourcesContent":["import type { Dict, IPointLike } from '@visactor/vutils';\nimport type { ICanvasLike } from './canvas';\nimport type { IEventElement } from './common';\nimport type { IContribution } from './contribution';\nimport type { ISyncHook } from './sync-hook';\n\nexport interface ILoader {\n  loadImage: (url: string) => HTMLImageElement | ImageData;\n  loadJson: (url: string) => JSON;\n}\n\n// 环境定义\nexport type EnvType = 'browser' | 'feishu' | 'tt' | 'taro' | 'node' | 'native' | 'lynx';\n\n// 创建canvas需要的参数\nexport interface ICreateCanvasParams {\n  id?: string;\n  // 像素宽\n  width?: number;\n  // 像素高\n  height?: number;\n  dpr?: number;\n}\n\nexport interface ILoader {\n  loadImage: (url: string) => HTMLImageElement | ImageData;\n  loadJson: (url: string) => JSON;\n}\n\nexport interface IEnvContribution\n  extends IContribution<IGlobal>,\n    Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {\n  // 当前代码所运行的环境\n  type: EnvType;\n\n  // 是否支持事件\n  // node环境不需要事件\n  supportEvent: boolean;\n\n  // 开始配置环境，相当于init\n  configure: (global: IGlobal, ...p: any) => void;\n\n  // 创建销毁\n  createCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;\n  createOffscreenCanvas: (params: ICreateCanvasParams) => ICanvasLike | any;\n  releaseCanvas: (canvas: ICanvasLike | string | any) => void;\n\n  // 设备信息\n  getDevicePixelRatio: () => number;\n\n  // 通用接口\n  getRequestAnimationFrame: () => (callback: FrameRequestCallback) => number;\n  getCancelAnimationFrame: () => (h: number) => void;\n\n  // DOM接口\n  getElementById?: (str: string) => HTMLElement | null;\n  getRootElement?: () => HTMLElement | null;\n  /**\n   * get document instance\n   */\n  getDocument?: () => Document | null;\n  /**\n   * whether supports TouchEvent.\n   */\n  supportsTouchEvents: boolean;\n  /**\n   * whether supports PointerEvent.\n   */\n  supportsPointerEvents: boolean;\n  /**\n   * whether supports MouseEvent.\n   */\n  supportsMouseEvents: boolean;\n  /**\n   * Whether to allow setting the cursor style\n   */\n  applyStyles?: boolean;\n\n  /**\n   * 将窗口坐标转换为画布坐标，小程序/小组件环境需要兼容\n   */\n  mapToCanvasPoint?: (event: any, domElement?: any) => IPointLike | null;\n\n  loadImage: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadSvg: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadJson: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Record<string, unknown> | null;\n  }>;\n  loadArrayBuffer: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: ArrayBuffer | null;\n  }>;\n  loadBlob: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Blob | null;\n  }>;\n}\n\nexport type IMiniAppEnvParams = {\n  /** dom 容器对象 */\n  domref?: Dict<any>;\n  /**\n   * 强行设置env，如果env重复设置也设置\n   */\n  force?: boolean;\n  /**\n   * 可用的canvas列表\n   */\n  canvasIdLists?: (string | number)[];\n  /**\n   * 表示可以自由使用的canvas索引\n   */\n  freeCanvasIdx?: string | number;\n  /** taro 环境使用 */\n  taro?: any;\n  pixelRatio?: number;\n  [key: string]: any;\n};\n\nexport interface IEnvParamsMap {\n  readonly taro: IMiniAppEnvParams;\n  readonly feishu: IMiniAppEnvParams;\n  readonly tt: IMiniAppEnvParams;\n  readonly browser: any;\n  readonly node: any;\n  readonly native: any;\n  readonly lynx: any;\n}\nexport interface IGlobal extends Omit<IEventElement, 'on' | 'off' | 'once' | 'emit' | 'removeAllListeners'> {\n  // 当前代码所运行的环境\n  env: EnvType;\n\n  // 设备的dpr\n  devicePixelRatio: number;\n\n  // 当设置env的时候被调用\n  hooks: {\n    onSetEnv: ISyncHook<[EnvType | undefined, EnvType, IGlobal]>;\n  };\n\n  // 设置env的时候传入的参数\n  // node环境需要传入整个node-canvas包\n  // 小程序环境需要传入小程序要用到的参数\n  envParams?: any;\n\n  // 是否支持事件\n  // node环境不需要事件\n  supportEvent: boolean;\n\n  setEnv: (env: EnvType, params?: IEnvParamsMap[EnvType]) => void;\n  setActiveEnvContribution: (contribution: IEnvContribution) => void;\n  createCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;\n  createOffscreenCanvas: (params: ICreateCanvasParams) => HTMLCanvasElement | any;\n  releaseCanvas: (canvas: HTMLCanvasElement | string | any) => void;\n\n  /* 浏览器环境 - dom tree */\n  getElementById: (str: string) => HTMLElement | null;\n  getRootElement: () => HTMLElement | null;\n  /**\n   * get document instance\n   */\n  getDocument: () => Document | null;\n  /**\n   * whether supports TouchEvent.\n   */\n  supportsTouchEvents: boolean;\n  /**\n   * whether supports PointerEvent.\n   */\n  supportsPointerEvents: boolean;\n  /**\n   * whether supports MouseEvent.\n   */\n  supportsMouseEvents: boolean;\n  /**\n   * Whether to allow setting the cursor style\n   */\n  applyStyles?: boolean;\n  /**\n   * 测量文字的方法\n   */\n  measureTextMethod: 'native' | 'simple' | 'quick';\n\n  getRequestAnimationFrame: () => null | ((callback: FrameRequestCallback) => number);\n  getCancelAnimationFrame: () => null | ((h: number) => void);\n\n  /**\n   * 将窗口坐标转换为画布坐标，小程序/小组件环境需要兼容\n   */\n  mapToCanvasPoint: (nativeEvent: any, domElement?: any) => IPointLike | null;\n\n  loadImage: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadSvg: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: HTMLImageElement | ImageData | null;\n  }>;\n  loadJson: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Record<string, unknown> | null;\n  }>;\n  loadArrayBuffer: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: ArrayBuffer | null;\n  }>;\n  loadBlob: (url: string) => Promise<{\n    loadState: 'success' | 'fail';\n    data: Blob | null;\n  }>;\n}\n"]}

package/cjs/interface/graphic/arc.d.ts

@@ -1,5 +1,5 @@
-import type { ICustomPath2D } from '../../interface';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
+import type { ICustomPath2D } from '../path';
 export type IArcAttribute = {
     innerRadius: number;
     outerRadius: number;

package/cjs/interface/graphic/arc.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/arc.ts"],"names":[],"mappings":"","file":"arc.js","sourcesContent":["import type { ICustomPath2D } from '../../interface';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\n/**\n * 扇区属性\n */\nexport type IArcAttribute = {\n  /** 内半径 */\n  innerRadius: number;\n  /** 外半径 */\n  outerRadius: number;\n  /**\n   * 起始角度；\n   * 以弧度的形式指定，0 表示 12 点钟方向并且顺时针方向为正。\n   * 如果 |endAngle - startAngle| ≥ τ 则会绘制一个完整的扇形或圆环\n   */\n  startAngle: number;\n  /**\n   * 终止角度；\n   * 以弧度的形式指定，0 表示 12 点钟方向并且顺时针方向为正。\n   * 如果 |endAngle - startAngle| ≥ τ 则会绘制一个完整的扇形或圆环\n   */\n  endAngle: number;\n  /**\n   * 用于指定扇形区块的内外圆角半径，支持设置固定数值 或者 相对于扇形区块的半径差(| outerRadius - innerRadius |)的百分比值\n   * 支持分别配置从外到内顺时针方向四个角的圆角半径，百分比值为相对于内外扇形的半径差。\n   * 其中\n   *\n   * cornerRadius: 10：表示内圆角半径和外圆角半径都是 10px。\n   * cornerRadius: '20%'：表示内圆角半径和外圆角半径都是扇形区块半径的 20%。\n   * cornerRadius: [10, 20]：表示为环形图时，外圆角半径是 10px、内圆角半径是 20px。\n   * cornerRadius: ['20%', '50%']：表示为环形图时，外圆角半径是内外圆半径差的 20%、内圆角半径是内外圆半径差的 50%。\n   * cornerRadius: [5, 10, 15, 20]：表示外圆角半径分别为 5px 和 10px，内圆角半径分别为 15px 和 20px。\n   *\n   * 也支持如下形式的配置：\n   * cornerRadius: [5, '10%', '20%', 10]\n   * TODO: 暂不支持\n   */\n  cornerRadius: number | string;\n  /**\n   * 间隙角度；间隔角度会转换为一个在两个相邻的弧之间的确定的线性距离，定义为 padRadius * | padAngle |\n   * 这个距离在弧的开始和结束处都是相等的；\n   * 间隔角度通常只应用于环形扇区（即当内半径大于 0）\n   */\n  padAngle: number;\n  padRadius: number;\n\n  /**\n   * 对应了线段的 lineCap 属性，lineCap 表示的是线段末端如何绘制\n   * cap: true 表示在弧线的起始位置都增加一个角度，角度是 | outerRadius - innerRadius | / outerRadius\n   */\n  cap: boolean | [boolean, boolean];\n  /**\n   * 当cap = true 并且 使用了渐变填充的时候，自动实现conical渐变，也就是环形的渐变\n   */\n  forceShowCap: boolean;\n};\n/**\n * 内部缓存，用于存储一些内部变量\n */\nexport type IArcCache = {\n  /** 解析后的圆角配置 */\n  cornerRadius?: [number, number, number, number];\n  startAngle?: number;\n  endAngle?: number;\n};\n\nexport type IArcGraphicAttribute = Partial<IGraphicAttribute> & Partial<IArcAttribute>;\n\nexport interface IArc extends IGraphic<IArcGraphicAttribute> {\n  cache?: ICustomPath2D;\n\n  getParsedCornerRadius: () => number;\n  getParsedAngle: () => { startAngle: number; endAngle: number };\n  getParsePadAngle: (\n    startAngle: number,\n    endAngle: number\n  ) => {\n    outerStartAngle: number;\n    outerEndAngle: number;\n    innerStartAngle: number;\n    innerEndAngle: number;\n\n    outerDeltaAngle: number;\n    innerDeltaAngle: number;\n  };\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/arc.ts"],"names":[],"mappings":"","file":"arc.js","sourcesContent":["import type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { ICustomPath2D } from '../path';\n\n/**\n * 扇区属性\n */\nexport type IArcAttribute = {\n  /** 内半径 */\n  innerRadius: number;\n  /** 外半径 */\n  outerRadius: number;\n  /**\n   * 起始角度；\n   * 以弧度的形式指定，0 表示 12 点钟方向并且顺时针方向为正。\n   * 如果 |endAngle - startAngle| ≥ τ 则会绘制一个完整的扇形或圆环\n   */\n  startAngle: number;\n  /**\n   * 终止角度；\n   * 以弧度的形式指定，0 表示 12 点钟方向并且顺时针方向为正。\n   * 如果 |endAngle - startAngle| ≥ τ 则会绘制一个完整的扇形或圆环\n   */\n  endAngle: number;\n  /**\n   * 用于指定扇形区块的内外圆角半径，支持设置固定数值 或者 相对于扇形区块的半径差(| outerRadius - innerRadius |)的百分比值\n   * 支持分别配置从外到内顺时针方向四个角的圆角半径，百分比值为相对于内外扇形的半径差。\n   * 其中\n   *\n   * cornerRadius: 10：表示内圆角半径和外圆角半径都是 10px。\n   * cornerRadius: '20%'：表示内圆角半径和外圆角半径都是扇形区块半径的 20%。\n   * cornerRadius: [10, 20]：表示为环形图时，外圆角半径是 10px、内圆角半径是 20px。\n   * cornerRadius: ['20%', '50%']：表示为环形图时，外圆角半径是内外圆半径差的 20%、内圆角半径是内外圆半径差的 50%。\n   * cornerRadius: [5, 10, 15, 20]：表示外圆角半径分别为 5px 和 10px，内圆角半径分别为 15px 和 20px。\n   *\n   * 也支持如下形式的配置：\n   * cornerRadius: [5, '10%', '20%', 10]\n   * TODO: 暂不支持\n   */\n  cornerRadius: number | string;\n  /**\n   * 间隙角度；间隔角度会转换为一个在两个相邻的弧之间的确定的线性距离，定义为 padRadius * | padAngle |\n   * 这个距离在弧的开始和结束处都是相等的；\n   * 间隔角度通常只应用于环形扇区（即当内半径大于 0）\n   */\n  padAngle: number;\n  padRadius: number;\n\n  /**\n   * 对应了线段的 lineCap 属性，lineCap 表示的是线段末端如何绘制\n   * cap: true 表示在弧线的起始位置都增加一个角度，角度是 | outerRadius - innerRadius | / outerRadius\n   */\n  cap: boolean | [boolean, boolean];\n  /**\n   * 当cap = true 并且 使用了渐变填充的时候，自动实现conical渐变，也就是环形的渐变\n   */\n  forceShowCap: boolean;\n};\n/**\n * 内部缓存，用于存储一些内部变量\n */\nexport type IArcCache = {\n  /** 解析后的圆角配置 */\n  cornerRadius?: [number, number, number, number];\n  startAngle?: number;\n  endAngle?: number;\n};\n\nexport type IArcGraphicAttribute = Partial<IGraphicAttribute> & Partial<IArcAttribute>;\n\nexport interface IArc extends IGraphic<IArcGraphicAttribute> {\n  cache?: ICustomPath2D;\n\n  getParsedCornerRadius: () => number;\n  getParsedAngle: () => { startAngle: number; endAngle: number };\n  getParsePadAngle: (\n    startAngle: number,\n    endAngle: number\n  ) => {\n    outerStartAngle: number;\n    outerEndAngle: number;\n    innerStartAngle: number;\n    innerEndAngle: number;\n\n    outerDeltaAngle: number;\n    innerDeltaAngle: number;\n  };\n}\n"]}

package/cjs/interface/graphic/arc3d.d.ts

@@ -1,5 +1,6 @@
-import type { IArcGraphicAttribute, ICustomPath2D } from '../../interface';
 import type { IGraphic } from '../graphic';
+import type { ICustomPath2D } from '../path';
+import type { IArcGraphicAttribute } from './arc';
 export type IArc3dGraphicAttribute = Partial<IArcGraphicAttribute> & {
     height?: number;
 };

package/cjs/interface/graphic/arc3d.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/arc3d.ts"],"names":[],"mappings":"","file":"arc3d.js","sourcesContent":["import type { IArcGraphicAttribute, ICustomPath2D } from '../../interface';\nimport type { IGraphic } from '../graphic';\n\nexport type IArc3dGraphicAttribute = Partial<IArcGraphicAttribute> & {\n  height?: number; // 长度\n};\n\nexport interface IArc3d extends IGraphic<IArc3dGraphicAttribute> {\n  cache?: ICustomPath2D;\n\n  getParsedCornerRadius: () => number;\n  getParsedAngle: () => { startAngle: number; endAngle: number };\n  getParsePadAngle: (\n    startAngle: number,\n    endAngle: number\n  ) => {\n    outerStartAngle: number;\n    outerEndAngle: number;\n    innerStartAngle: number;\n    innerEndAngle: number;\n\n    outerDeltaAngle: number;\n    innerDeltaAngle: number;\n  };\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/arc3d.ts"],"names":[],"mappings":"","file":"arc3d.js","sourcesContent":["import type { IGraphic } from '../graphic';\nimport type { ICustomPath2D } from '../path';\nimport type { IArcGraphicAttribute } from './arc';\n\nexport type IArc3dGraphicAttribute = Partial<IArcGraphicAttribute> & {\n  height?: number; // 长度\n};\n\nexport interface IArc3d extends IGraphic<IArc3dGraphicAttribute> {\n  cache?: ICustomPath2D;\n\n  getParsedCornerRadius: () => number;\n  getParsedAngle: () => { startAngle: number; endAngle: number };\n  getParsePadAngle: (\n    startAngle: number,\n    endAngle: number\n  ) => {\n    outerStartAngle: number;\n    outerEndAngle: number;\n    innerStartAngle: number;\n    innerEndAngle: number;\n\n    outerDeltaAngle: number;\n    innerDeltaAngle: number;\n  };\n}\n"]}

package/cjs/interface/graphic/creator.d.ts

@@ -1,19 +1,19 @@
-import { IGraphicAttribute } from '../graphic';
-import { IArcAttribute, IArcGraphicAttribute } from './arc';
-import { IAreaAttribute, IAreaGraphicAttribute } from './area';
-import { ICircleAttribute, ICircleGraphicAttribute } from './circle';
-import { IEllipseAttribute } from './ellipse';
-import { IGroupAttribute, IGroupGraphicAttribute } from './group';
-import { IImageAttribute, IImageGraphicAttribute } from './image';
-import { IIsogonAttribute } from './isogon';
-import { ILineAttribute, ILineGraphicAttribute } from './line';
-import { IPathAttribute, IPathGraphicAttribute } from './path';
-import { IPolygonAttribute } from './polygon';
-import { IRectAttribute, IRectGraphicAttribute } from './rect';
-import { IRichTextAttribute, IRichTextGraphicAttribute } from './richText';
-import { ISvgAttribute } from './svg';
-import { ISymbolAttribute, ISymbolGraphicAttribute } from './symbol';
-import { ITextAttribute, ITextGraphicAttribute, IWrapTextGraphicAttribute } from './text';
+import type { IGraphicAttribute } from '../graphic';
+import type { IArcAttribute, IArcGraphicAttribute } from './arc';
+import type { IAreaAttribute, IAreaGraphicAttribute } from './area';
+import type { ICircleAttribute, ICircleGraphicAttribute } from './circle';
+import type { IEllipseAttribute } from './ellipse';
+import type { IGroupAttribute, IGroupGraphicAttribute } from './group';
+import type { IImageAttribute, IImageGraphicAttribute } from './image';
+import type { IIsogonAttribute } from './isogon';
+import type { ILineAttribute, ILineGraphicAttribute } from './line';
+import type { IPathAttribute, IPathGraphicAttribute } from './path';
+import type { IPolygonAttribute } from './polygon';
+import type { IRectAttribute, IRectGraphicAttribute } from './rect';
+import type { IRichTextAttribute, IRichTextGraphicAttribute } from './richText';
+import type { ISvgAttribute } from './svg';
+import type { ISymbolAttribute, ISymbolGraphicAttribute } from './symbol';
+import type { ITextAttribute, ITextGraphicAttribute, IWrapTextGraphicAttribute } from './text';
 export type IMarkAttribute = IGraphicAttribute | IArcAttribute | IAreaAttribute | ICircleAttribute | IEllipseAttribute | IGroupAttribute | IImageAttribute | IIsogonAttribute | ILineAttribute | IPathAttribute | IPolygonAttribute | IRectAttribute | IRichTextAttribute | ISvgAttribute | ISymbolAttribute | ITextAttribute;
 export type IThemeAttribute = IArcGraphicAttribute | IAreaGraphicAttribute | ICircleGraphicAttribute | IImageGraphicAttribute | ILineGraphicAttribute | IPathGraphicAttribute | IRectGraphicAttribute | ISymbolGraphicAttribute | ITextGraphicAttribute | IRichTextGraphicAttribute | IWrapTextGraphicAttribute;
 export interface GraphicAttributeMap {

package/cjs/interface/graphic/creator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/creator.ts"],"names":[],"mappings":"","file":"creator.js","sourcesContent":["import { IGraphicAttribute } from '../graphic';\nimport { IArcAttribute, IArcGraphicAttribute } from './arc';\nimport { IAreaAttribute, IAreaGraphicAttribute } from './area';\nimport { ICircleAttribute, ICircleGraphicAttribute } from './circle';\nimport { IEllipseAttribute } from './ellipse';\nimport { IGroupAttribute, IGroupGraphicAttribute } from './group';\nimport { IImageAttribute, IImageGraphicAttribute } from './image';\nimport { IIsogonAttribute } from './isogon';\nimport { ILineAttribute, ILineGraphicAttribute } from './line';\nimport { IPathAttribute, IPathGraphicAttribute } from './path';\nimport { IPolygonAttribute } from './polygon';\nimport { IRectAttribute, IRectGraphicAttribute } from './rect';\nimport { IRichTextAttribute, IRichTextGraphicAttribute } from './richText';\nimport { ISvgAttribute } from './svg';\nimport { ISymbolAttribute, ISymbolGraphicAttribute } from './symbol';\nimport { ITextAttribute, ITextGraphicAttribute, IWrapTextGraphicAttribute } from './text';\n\nexport type IMarkAttribute =\n  | IGraphicAttribute\n  | IArcAttribute\n  | IAreaAttribute\n  | ICircleAttribute\n  | IEllipseAttribute\n  | IGroupAttribute\n  | IImageAttribute\n  | IIsogonAttribute\n  | ILineAttribute\n  | IPathAttribute\n  | IPolygonAttribute\n  | IRectAttribute\n  | IRichTextAttribute\n  | ISvgAttribute\n  | ISymbolAttribute\n  | ITextAttribute;\n\nexport type IThemeAttribute =\n  | IArcGraphicAttribute\n  | IAreaGraphicAttribute\n  | ICircleGraphicAttribute\n  // | IEllipseGraphicAttribute\n  // | IGroupGraphicAttribute\n  | IImageGraphicAttribute\n  // | IIsogonGraphicAttribute\n  | ILineGraphicAttribute\n  | IPathGraphicAttribute\n  // | IPolygonGraphicAttribute\n  | IRectGraphicAttribute\n  // | IRichTextGraphicAttribute\n  // | ISvgGraphicAttribute\n  | ISymbolGraphicAttribute\n  | ITextGraphicAttribute\n  | IRichTextGraphicAttribute\n  | IWrapTextGraphicAttribute;\n\n/**\n * facet object map\n */\nexport interface GraphicAttributeMap {\n  readonly arc: IArcGraphicAttribute;\n  readonly area: IAreaGraphicAttribute;\n  readonly circle: ICircleGraphicAttribute;\n  readonly image: IImageGraphicAttribute;\n  readonly line: ILineGraphicAttribute;\n  readonly path: IPathGraphicAttribute;\n  readonly group: IGroupGraphicAttribute;\n  readonly rect: IRectGraphicAttribute;\n  readonly symbol: ISymbolGraphicAttribute;\n  readonly text: ITextGraphicAttribute;\n  readonly richtext: IRichTextGraphicAttribute;\n  readonly wrapText: IWrapTextGraphicAttribute;\n}\n\n// export declare function createArc(params: Partial<IArcAttribute & IGraphicAttribute>): IArc;\n// export declare function createArea(params: Partial<IAreaAttribute & IGraphicAttribute>): IArea;\n// export declare function createCircle(params: Partial<ICircleAttribute & IGraphicAttribute>): ICircle;\n// // export declare function createDynamicPath(params: Params<Partial<IDynamicPathShape>, Partial<IGraphicAttribute>>): IDynamicPath;\n// export declare function createEllipse(params: Partial<IEllipseAttribute & IGraphicAttribute>): IEllipse;\n// export declare function createGlyph(): IGlyph;\n// export declare function createGroup(params: Partial<IGroupAttribute & IGraphicAttribute>): IGroup;\n// export declare function createImage(params: Partial<IImageAttribute & IGraphicAttribute>): IImage;\n// export declare function createIsogon(params: Partial<IIsogonAttribute & IGraphicAttribute>): IIsogon;\n// export declare function createIine(params: Partial<ILineAttribute & IGraphicAttribute>): ILine;\n// export declare function createPath(params: Partial<IPathAttribute & IGraphicAttribute>): IPath;\n// export declare function createPolygon(params: Partial<IPolygonAttribute & IGraphicAttribute>): IPolygon;\n// // export declare function createPolyline(params: Partial<IArcAttribute & IGraphicAttribute>): IPolyline;\n// export declare function createRect(params: Partial<IRectAttribute & IGraphicAttribute>): IRect;\n// export declare function createRichText(params: Partial<IRichTextAttribute & IGraphicAttribute>): IRichText;\n// export declare function createSvg(params: Partial<ISvgAttribute & IGraphicAttribute>): ISvg;\n// export declare function createSymbol(params: Partial<ISymbolAttribute & IGraphicAttribute>): ISymbol;\n// export declare function createText(params: Partial<ITextAttribute & IGraphicAttribute>): IText;\n"]}
+{"version":3,"sources":["../../src/interface/graphic/creator.ts"],"names":[],"mappings":"","file":"creator.js","sourcesContent":["import type { IGraphicAttribute } from '../graphic';\nimport type { IArcAttribute, IArcGraphicAttribute } from './arc';\nimport type { IAreaAttribute, IAreaGraphicAttribute } from './area';\nimport type { ICircleAttribute, ICircleGraphicAttribute } from './circle';\nimport type { IEllipseAttribute } from './ellipse';\nimport type { IGroupAttribute, IGroupGraphicAttribute } from './group';\nimport type { IImageAttribute, IImageGraphicAttribute } from './image';\nimport type { IIsogonAttribute } from './isogon';\nimport type { ILineAttribute, ILineGraphicAttribute } from './line';\nimport type { IPathAttribute, IPathGraphicAttribute } from './path';\nimport type { IPolygonAttribute } from './polygon';\nimport type { IRectAttribute, IRectGraphicAttribute } from './rect';\nimport type { IRichTextAttribute, IRichTextGraphicAttribute } from './richText';\nimport type { ISvgAttribute } from './svg';\nimport type { ISymbolAttribute, ISymbolGraphicAttribute } from './symbol';\nimport type { ITextAttribute, ITextGraphicAttribute, IWrapTextGraphicAttribute } from './text';\n\nexport type IMarkAttribute =\n  | IGraphicAttribute\n  | IArcAttribute\n  | IAreaAttribute\n  | ICircleAttribute\n  | IEllipseAttribute\n  | IGroupAttribute\n  | IImageAttribute\n  | IIsogonAttribute\n  | ILineAttribute\n  | IPathAttribute\n  | IPolygonAttribute\n  | IRectAttribute\n  | IRichTextAttribute\n  | ISvgAttribute\n  | ISymbolAttribute\n  | ITextAttribute;\n\nexport type IThemeAttribute =\n  | IArcGraphicAttribute\n  | IAreaGraphicAttribute\n  | ICircleGraphicAttribute\n  // | IEllipseGraphicAttribute\n  // | IGroupGraphicAttribute\n  | IImageGraphicAttribute\n  // | IIsogonGraphicAttribute\n  | ILineGraphicAttribute\n  | IPathGraphicAttribute\n  // | IPolygonGraphicAttribute\n  | IRectGraphicAttribute\n  // | IRichTextGraphicAttribute\n  // | ISvgGraphicAttribute\n  | ISymbolGraphicAttribute\n  | ITextGraphicAttribute\n  | IRichTextGraphicAttribute\n  | IWrapTextGraphicAttribute;\n\n/**\n * facet object map\n */\nexport interface GraphicAttributeMap {\n  readonly arc: IArcGraphicAttribute;\n  readonly area: IAreaGraphicAttribute;\n  readonly circle: ICircleGraphicAttribute;\n  readonly image: IImageGraphicAttribute;\n  readonly line: ILineGraphicAttribute;\n  readonly path: IPathGraphicAttribute;\n  readonly group: IGroupGraphicAttribute;\n  readonly rect: IRectGraphicAttribute;\n  readonly symbol: ISymbolGraphicAttribute;\n  readonly text: ITextGraphicAttribute;\n  readonly richtext: IRichTextGraphicAttribute;\n  readonly wrapText: IWrapTextGraphicAttribute;\n}\n\n// export declare function createArc(params: Partial<IArcAttribute & IGraphicAttribute>): IArc;\n// export declare function createArea(params: Partial<IAreaAttribute & IGraphicAttribute>): IArea;\n// export declare function createCircle(params: Partial<ICircleAttribute & IGraphicAttribute>): ICircle;\n// // export declare function createDynamicPath(params: Params<Partial<IDynamicPathShape>, Partial<IGraphicAttribute>>): IDynamicPath;\n// export declare function createEllipse(params: Partial<IEllipseAttribute & IGraphicAttribute>): IEllipse;\n// export declare function createGlyph(): IGlyph;\n// export declare function createGroup(params: Partial<IGroupAttribute & IGraphicAttribute>): IGroup;\n// export declare function createImage(params: Partial<IImageAttribute & IGraphicAttribute>): IImage;\n// export declare function createIsogon(params: Partial<IIsogonAttribute & IGraphicAttribute>): IIsogon;\n// export declare function createIine(params: Partial<ILineAttribute & IGraphicAttribute>): ILine;\n// export declare function createPath(params: Partial<IPathAttribute & IGraphicAttribute>): IPath;\n// export declare function createPolygon(params: Partial<IPolygonAttribute & IGraphicAttribute>): IPolygon;\n// // export declare function createPolyline(params: Partial<IArcAttribute & IGraphicAttribute>): IPolyline;\n// export declare function createRect(params: Partial<IRectAttribute & IGraphicAttribute>): IRect;\n// export declare function createRichText(params: Partial<IRichTextAttribute & IGraphicAttribute>): IRichText;\n// export declare function createSvg(params: Partial<ISvgAttribute & IGraphicAttribute>): ISvg;\n// export declare function createSymbol(params: Partial<ISymbolAttribute & IGraphicAttribute>): ISymbol;\n// export declare function createText(params: Partial<ITextAttribute & IGraphicAttribute>): IText;\n"]}

package/cjs/interface/graphic/group.d.ts

@@ -1,6 +1,7 @@
 import type { ITheme, IThemeSpec } from './theme';
-import type { GraphicAttributeMap, INode } from '../../interface';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
+import type { INode } from '../node-tree';
+import type { GraphicAttributeMap } from './creator';
 export type IGroupAttribute = {
     path: IGraphic[];
     width: number;

package/cjs/interface/graphic/group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/group.ts"],"names":[],"mappings":"","file":"group.js","sourcesContent":["import type { ITheme, IThemeSpec } from './theme';\nimport type { GraphicAttributeMap, INode } from '../../interface';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type IGroupAttribute = {\n  path: IGraphic[];\n  width: number;\n  height: number;\n  cornerRadius: number | number[];\n  clip: boolean;\n  visibleAll: boolean;\n};\n\nexport type IGroupGraphicAttribute = Partial<IGraphicAttribute> & Partial<IGroupAttribute>;\n\nexport interface IGroup extends IGraphic<IGroupGraphicAttribute> {\n  childrenPickable?: boolean; // 子元素是否可以被pick\n\n  theme?: ITheme;\n\n  createTheme: () => void;\n  hideAll: () => void;\n  showAll: () => void;\n\n  setTheme: (t: IThemeSpec) => void;\n\n  incrementalAppendChild: (node: INode, highPerformance?: boolean) => INode | null;\n  incrementalClearChild: () => void;\n\n  createOrUpdateChild: <T extends keyof GraphicAttributeMap>(\n    graphicName: string,\n    attributes: GraphicAttributeMap[T],\n    graphicType: T\n  ) => INode;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/group.ts"],"names":[],"mappings":"","file":"group.js","sourcesContent":["import type { ITheme, IThemeSpec } from './theme';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { INode } from '../node-tree';\nimport type { GraphicAttributeMap } from './creator';\n\nexport type IGroupAttribute = {\n  path: IGraphic[];\n  width: number;\n  height: number;\n  cornerRadius: number | number[];\n  clip: boolean;\n  visibleAll: boolean;\n};\n\nexport type IGroupGraphicAttribute = Partial<IGraphicAttribute> & Partial<IGroupAttribute>;\n\nexport interface IGroup extends IGraphic<IGroupGraphicAttribute> {\n  childrenPickable?: boolean; // 子元素是否可以被pick\n\n  theme?: ITheme;\n\n  createTheme: () => void;\n  hideAll: () => void;\n  showAll: () => void;\n\n  setTheme: (t: IThemeSpec) => void;\n\n  incrementalAppendChild: (node: INode, highPerformance?: boolean) => INode | null;\n  incrementalClearChild: () => void;\n\n  createOrUpdateChild: <T extends keyof GraphicAttributeMap>(\n    graphicName: string,\n    attributes: GraphicAttributeMap[T],\n    graphicType: T\n  ) => INode;\n}\n"]}

package/cjs/interface/graphic/image.d.ts

@@ -1,5 +1,5 @@
 import type { IGraphicAttribute, IGraphic } from '../graphic';
-export type IRepeatType = 'no-repeat' | 'repeat' | 'stretch';
+export type IRepeatType = 'no-repeat' | 'repeat';
 export type IImageAttribute = {
     width: number;
     height: number;

package/cjs/interface/graphic/image.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/image.ts"],"names":[],"mappings":"","file":"image.js","sourcesContent":["import type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type IRepeatType = 'no-repeat' | 'repeat' | 'stretch';\n\nexport type IImageAttribute = {\n  width: number;\n  height: number;\n  repeatX: IRepeatType;\n  repeatY: IRepeatType;\n  image: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IImageGraphicAttribute = Partial<IGraphicAttribute> & Partial<IImageAttribute>;\n\nexport interface IImage extends IGraphic<IImageGraphicAttribute> {\n  successCallback?: () => void;\n  failCallback?: () => void;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/image.ts"],"names":[],"mappings":"","file":"image.js","sourcesContent":["import type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type IRepeatType = 'no-repeat' | 'repeat';\n\nexport type IImageAttribute = {\n  width: number;\n  height: number;\n  repeatX: IRepeatType;\n  repeatY: IRepeatType;\n  image: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IImageGraphicAttribute = Partial<IGraphicAttribute> & Partial<IImageAttribute>;\n\nexport interface IImage extends IGraphic<IImageGraphicAttribute> {\n  successCallback?: () => void;\n  failCallback?: () => void;\n}\n"]}

package/cjs/interface/graphic/index.d.ts

@@ -1,2 +1,26 @@
 export * from './creator';
 export * from './theme';
+export * from './arc';
+export * from './arc3d';
+export * from './area';
+export * from './bounds';
+export * from './circle';
+export * from './ellipse';
+export * from './face3d';
+export * from './glyph';
+export * from './group';
+export * from './image';
+export * from './isogon';
+export * from './line';
+export * from './path';
+export * from './polygon';
+export * from './polyline';
+export * from './pyramid3d';
+export * from './rect';
+export * from './rect3d';
+export * from './richText';
+export * from './shadow-root';
+export * from './svg';
+export * from './symbol';
+export * from './text';
+export * from './util';

package/cjs/interface/graphic/index.js

@@ -17,5 +17,17 @@ var __createBinding = this && this.__createBinding || (Object.create ? function(
 
 Object.defineProperty(exports, "__esModule", {
     value: !0
-}), __exportStar(require("./creator"), exports), __exportStar(require("./theme"), exports);
+}), __exportStar(require("./creator"), exports), __exportStar(require("./theme"), exports), 
+__exportStar(require("./arc"), exports), __exportStar(require("./arc3d"), exports), 
+__exportStar(require("./area"), exports), __exportStar(require("./bounds"), exports), 
+__exportStar(require("./circle"), exports), __exportStar(require("./ellipse"), exports), 
+__exportStar(require("./face3d"), exports), __exportStar(require("./glyph"), exports), 
+__exportStar(require("./group"), exports), __exportStar(require("./image"), exports), 
+__exportStar(require("./isogon"), exports), __exportStar(require("./line"), exports), 
+__exportStar(require("./path"), exports), __exportStar(require("./polygon"), exports), 
+__exportStar(require("./polyline"), exports), __exportStar(require("./pyramid3d"), exports), 
+__exportStar(require("./rect"), exports), __exportStar(require("./rect3d"), exports), 
+__exportStar(require("./richText"), exports), __exportStar(require("./shadow-root"), exports), 
+__exportStar(require("./svg"), exports), __exportStar(require("./symbol"), exports), 
+__exportStar(require("./text"), exports), __exportStar(require("./util"), exports);
 //# sourceMappingURL=index.js.map

package/cjs/interface/graphic/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,0CAAwB","file":"index.js","sourcesContent":["export * from './creator';\nexport * from './theme';\n"]}
+{"version":3,"sources":["../../src/interface/graphic/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,0CAAwB;AACxB,wCAAsB;AACtB,0CAAwB;AACxB,yCAAuB;AACvB,2CAAyB;AACzB,2CAAyB;AACzB,4CAA0B;AAC1B,2CAAyB;AACzB,0CAAwB;AACxB,0CAAwB;AACxB,0CAAwB;AACxB,2CAAyB;AACzB,yCAAuB;AACvB,yCAAuB;AACvB,4CAA0B;AAC1B,6CAA2B;AAC3B,8CAA4B;AAC5B,yCAAuB;AACvB,2CAAyB;AACzB,6CAA2B;AAC3B,gDAA8B;AAC9B,wCAAsB;AACtB,2CAAyB;AACzB,yCAAuB;AACvB,yCAAuB","file":"index.js","sourcesContent":["export * from './creator';\nexport * from './theme';\nexport * from './arc';\nexport * from './arc3d';\nexport * from './area';\nexport * from './bounds';\nexport * from './circle';\nexport * from './ellipse';\nexport * from './face3d';\nexport * from './glyph';\nexport * from './group';\nexport * from './image';\nexport * from './isogon';\nexport * from './line';\nexport * from './path';\nexport * from './polygon';\nexport * from './polyline';\nexport * from './pyramid3d';\nexport * from './rect';\nexport * from './rect3d';\nexport * from './richText';\nexport * from './shadow-root';\nexport * from './svg';\nexport * from './symbol';\nexport * from './text';\nexport * from './util';\n"]}

package/cjs/interface/graphic/line.d.ts

@@ -1,7 +1,7 @@
 import type { IPointLike } from '@visactor/vutils';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
 import type { ICurveType } from '../common';
-import { ISegPath2D } from '../curve';
+import type { ISegPath2D } from '../curve';
 export type IClipRangeByDimensionType = 'x' | 'y' | 'auto' | 'default';
 export type ILineAttribute = {
     segments: ISegment[];

package/cjs/interface/graphic/line.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/line.ts"],"names":[],"mappings":"","file":"line.js","sourcesContent":["import type { IPointLike } from '@visactor/vutils';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { ICurveType } from '../common';\nimport { ISegPath2D } from '../curve';\n\n// 依据x纬度做clipRange\n// 依据y纬度做clipRange\n// 依据线段自动匹配纬度做clipRange\n// 依据线长纬度做clipRange\nexport type IClipRangeByDimensionType = 'x' | 'y' | 'auto' | 'default';\n\nexport type ILineAttribute = {\n  segments: ISegment[]; // 分段设置point和样式\n  points: IPointLike[]; // segments points 二选一\n  curveType: ICurveType;\n  clipRange: number;\n  clipRangeByDimension: IClipRangeByDimensionType;\n};\n\nexport type ILineGraphicAttribute = Partial<IGraphicAttribute> & Partial<ILineAttribute>;\n\nexport interface ILine extends IGraphic<ILineGraphicAttribute> {\n  cache?: ISegPath2D | ISegPath2D[];\n}\n\ntype ISegmentStyle = Pick<\n  IGraphicAttribute,\n  'stroke' | 'strokeOpacity' | 'lineDash' | 'lineDashOffset' | 'lineCap' | 'lineJoin' | 'lineWidth' | 'miterLimit'\n>;\n\nexport interface ISegment extends Partial<ISegmentStyle> {\n  points: IPointLike[];\n  simplify?: boolean;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/line.ts"],"names":[],"mappings":"","file":"line.js","sourcesContent":["import type { IPointLike } from '@visactor/vutils';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { ICurveType } from '../common';\nimport type { ISegPath2D } from '../curve';\n\n// 依据x纬度做clipRange\n// 依据y纬度做clipRange\n// 依据线段自动匹配纬度做clipRange\n// 依据线长纬度做clipRange\nexport type IClipRangeByDimensionType = 'x' | 'y' | 'auto' | 'default';\n\nexport type ILineAttribute = {\n  segments: ISegment[]; // 分段设置point和样式\n  points: IPointLike[]; // segments points 二选一\n  curveType: ICurveType;\n  clipRange: number;\n  clipRangeByDimension: IClipRangeByDimensionType;\n};\n\nexport type ILineGraphicAttribute = Partial<IGraphicAttribute> & Partial<ILineAttribute>;\n\nexport interface ILine extends IGraphic<ILineGraphicAttribute> {\n  cache?: ISegPath2D | ISegPath2D[];\n}\n\ntype ISegmentStyle = Pick<\n  IGraphicAttribute,\n  'stroke' | 'strokeOpacity' | 'lineDash' | 'lineDashOffset' | 'lineCap' | 'lineJoin' | 'lineWidth' | 'miterLimit'\n>;\n\nexport interface ISegment extends Partial<ISegmentStyle> {\n  points: IPointLike[];\n  simplify?: boolean;\n}\n"]}

package/cjs/interface/graphic/rect.d.ts

@@ -1,5 +1,5 @@
-import type { ICustomPath2D } from '../../interface';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
+import type { ICustomPath2D } from '../path';
 export type IRectAttribute = {
     width: number;
     height: number;

package/cjs/interface/graphic/rect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/rect.ts"],"names":[],"mappings":"","file":"rect.js","sourcesContent":["import type { ICustomPath2D } from '../../interface';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type IRectAttribute = {\n  width: number;\n  height: number;\n  cornerRadius: number | number[];\n};\n\nexport type IRectGraphicAttribute = Partial<IGraphicAttribute> & Partial<IRectAttribute>;\n\nexport interface IRect extends IGraphic<IRectGraphicAttribute> {\n  cache?: ICustomPath2D;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/rect.ts"],"names":[],"mappings":"","file":"rect.js","sourcesContent":["import type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { ICustomPath2D } from '../path';\n\nexport type IRectAttribute = {\n  width: number;\n  height: number;\n  cornerRadius: number | number[];\n};\n\nexport type IRectGraphicAttribute = Partial<IGraphicAttribute> & Partial<IRectAttribute>;\n\nexport interface IRect extends IGraphic<IRectGraphicAttribute> {\n  cache?: ICustomPath2D;\n}\n"]}

package/cjs/interface/graphic/rect3d.d.ts

@@ -1,5 +1,6 @@
-import type { ICustomPath2D, IRectGraphicAttribute } from '../../interface';
 import type { IGraphic } from '../graphic';
+import type { ICustomPath2D } from '../path';
+import type { IRectGraphicAttribute } from './rect';
 export type IRect3dGraphicAttribute = Partial<IRectGraphicAttribute> & {
     length?: number;
 };

package/cjs/interface/graphic/rect3d.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/rect3d.ts"],"names":[],"mappings":"","file":"rect3d.js","sourcesContent":["import type { ICustomPath2D, IRectGraphicAttribute } from '../../interface';\nimport type { IGraphic } from '../graphic';\n\nexport type IRect3dGraphicAttribute = Partial<IRectGraphicAttribute> & {\n  length?: number; // 长度\n};\n\nexport interface IRect3d extends IGraphic {\n  attribute: IRect3dGraphicAttribute;\n\n  cache?: ICustomPath2D;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/rect3d.ts"],"names":[],"mappings":"","file":"rect3d.js","sourcesContent":["import type { IGraphic } from '../graphic';\nimport type { ICustomPath2D } from '../path';\nimport type { IRectGraphicAttribute } from './rect';\n\nexport type IRect3dGraphicAttribute = Partial<IRectGraphicAttribute> & {\n  length?: number; // 长度\n};\n\nexport interface IRect3d extends IGraphic {\n  attribute: IRect3dGraphicAttribute;\n\n  cache?: ICustomPath2D;\n}\n"]}

package/cjs/interface/graphic/richText.d.ts

@@ -1,5 +1,5 @@
-import type Frame from '../../graphic/richtext/frame';
 import type { IColor } from '../color';
+import type { IContext2d } from '../context';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
 import type { IImage, IImageGraphicAttribute } from './image';
 export type IRichTextAttribute = {
@@ -77,8 +77,96 @@ export type IRichTextIconGraphicAttribute = IImageGraphicAttribute & {
     direction?: RichTextLayoutDirectionType;
     margin?: number | number[];
 };
+export interface IRichTextParagraph {
+    text: string;
+    ascent: number;
+    descent: number;
+    width: number;
+    height: number;
+    lineHeight: number;
+    fontSize: number;
+    length: number;
+    newLine: boolean;
+    character: IRichTextParagraphCharacter;
+    left: number;
+    top: number;
+    direction?: 'horizontal' | 'vertical';
+    widthOrigin?: number;
+    heightOrigin?: number;
+    textBaseline?: CanvasTextBaseline;
+    ellipsis: 'normal' | 'add' | 'replace' | 'hide';
+    ellipsisWidth: number;
+    ellipsisOtherParagraphWidth: number;
+    verticalEllipsis?: boolean;
+    updateWidth: () => void;
+    draw: (ctx: IContext2d, baseline: number, deltaLeft: number, isLineFirst: boolean, textAlign: string) => void;
+    getWidthWithEllips: (direction: string) => number;
+}
+export interface IRichTextLine {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    baseline: number;
+    ascent: number;
+    descent: number;
+    paragraphs: (IRichTextParagraph | IRichTextIcon)[];
+    actualWidth: number;
+    blankWidth: number;
+    textAlign: string;
+    direction: 'horizontal' | 'vertical';
+    directionKey: {
+        width: string;
+        height: string;
+        left: string;
+        x: string;
+        y: string;
+    };
+    draw: (ctx: IContext2d, lastLine: boolean, x: number, y: number, drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void) => void;
+    getWidthWithEllips: () => number;
+}
+export interface IRichTextFrame {
+    left: number;
+    top: number;
+    bottom: number;
+    right: number;
+    width: number;
+    height: number;
+    actualHeight: number;
+    ellipsis: boolean | string;
+    wordBreak: 'break-word' | 'break-all';
+    verticalDirection: 'top' | 'middle' | 'bottom';
+    lines: IRichTextLine[];
+    globalAlign: 'left' | 'center' | 'right';
+    globalBaseline: 'top' | 'middle' | 'bottom';
+    layoutDirection: 'horizontal' | 'vertical';
+    directionKey: {
+        width: string;
+        height: string;
+        left: string;
+        top: string;
+        bottom: string;
+    };
+    isWidthMax: boolean;
+    isHeightMax: boolean;
+    singleLine: boolean;
+    icons: Map<string, IRichTextIcon>;
+    draw: (ctx: IContext2d, drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void) => boolean;
+    getActualSize: () => {
+        width: number;
+        height: number;
+    };
+    getRawActualSize: () => {
+        width: number;
+        height: number;
+    };
+    getActualSizeWidthEllipsis: () => {
+        width: number;
+        height: number;
+    };
+}
 export interface IRichText extends IGraphic<IRichTextGraphicAttribute> {
-    getFrameCache: () => Frame;
+    getFrameCache: () => IRichTextFrame;
 }
 export interface IRichTextIcon extends IImage {
     attribute: IRichTextIconGraphicAttribute;

package/cjs/interface/graphic/richText.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/richText.ts"],"names":[],"mappings":"","file":"richText.js","sourcesContent":["import type Frame from '../../graphic/richtext/frame';\nimport type { IColor } from '../color';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { IImage, IImageGraphicAttribute } from './image';\n\nexport type IRichTextAttribute = {\n  width: number;\n  height: number;\n  ellipsis: boolean | string;\n  wordBreak: RichTextWordBreak;\n  verticalDirection: RichTextVerticalDirection;\n  maxHeight: number;\n  maxWidth: number;\n  textAlign: RichTextGlobalAlignType;\n  textBaseline: RichTextGlobalBaselineType;\n  layoutDirection: RichTextLayoutDirectionType;\n  textConfig: IRichTextCharacter[];\n  singleLine: boolean;\n};\n\nexport type IRichTextGraphicAttribute = Partial<IGraphicAttribute> & Partial<IRichTextAttribute>;\n\nexport type RichTextWordBreak = 'break-word' | 'break-all';\nexport type RichTextVerticalDirection = 'top' | 'middle' | 'bottom';\nexport type RichTextGlobalAlignType = 'left' | 'right' | 'center';\nexport type RichTextGlobalBaselineType = 'top' | 'middle' | 'bottom';\nexport type RichTextLayoutDirectionType = 'horizontal' | 'vertical';\nexport type RichTextFontStyle = 'normal' | 'italic' | 'oblique';\nexport type RichTextTextDecoration = 'none' | 'underline' | 'line-through';\n// export type RichTextTextAlign = 'left' | 'right' | 'center';\nexport type RichTextScript = 'normal' | 'sub' | 'super';\n\nexport type IRichTextBasicCharacter = {\n  lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextParagraphCharacter = IRichTextBasicCharacter & {\n  text: string;\n  fontSize?: number;\n  fontFamily?: string;\n  fill?: IColor | boolean;\n  stroke?: IColor | boolean;\n  fontWeight?: string;\n  // lineHeight?: number;\n  fontStyle?: RichTextFontStyle; // normal, italic, oblique\n  textDecoration?: RichTextTextDecoration; // none, underline, line-through\n  // textAlign?: RichTextTextAlign; // left, right, center\n  script?: RichTextScript; // normal, sub, super\n  underline?: boolean;\n  lineThrough?: boolean;\n  // direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextImageCharacter = IRichTextBasicCharacter & {\n  // 图片基础属性\n  image: string | HTMLImageElement | HTMLCanvasElement;\n  width: number;\n  height: number;\n\n  // hover相关属性\n  // backgroundShow?: boolean; // 是否显示background\n  backgroundShowMode?: 'always' | 'hover';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  // background size 同时控制了该icon的响应范围\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // 唯一标识符\n  id?: string;\n\n  // lineHeight?: number;\n  // textAlign?: RichTextTextAlign; // left, right, center\n  // direction?: RichTextLayoutDirectionType;\n  margin?: number | number[];\n\n  funcType?: string;\n  hoverImage?: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IRichTextCharacter = IRichTextParagraphCharacter | IRichTextImageCharacter;\n\nexport type IRichTextIconGraphicAttribute = IImageGraphicAttribute & {\n  id?: string;\n  backgroundShowMode?: 'always' | 'hover' | 'never';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n\n  margin?: number | number[];\n\n  // backgroundShow?: boolean;\n};\n\nexport interface IRichText extends IGraphic<IRichTextGraphicAttribute> {\n  getFrameCache: () => Frame;\n}\n\nexport interface IRichTextIcon extends IImage {\n  attribute: IRichTextIconGraphicAttribute;\n  richtextId?: string;\n  globalX?: number;\n  globalY?: number;\n\n  _x: number;\n  _y: number;\n  _hovered: boolean;\n  _marginArray: [number, number, number, number];\n\n  setHoverState: (hovered: boolean) => void;\n}\n"]}
+{"version":3,"sources":["../../src/interface/graphic/richText.ts"],"names":[],"mappings":"","file":"richText.js","sourcesContent":["import type { IColor } from '../color';\nimport type { IContext2d } from '../context';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { IImage, IImageGraphicAttribute } from './image';\n\nexport type IRichTextAttribute = {\n  width: number;\n  height: number;\n  ellipsis: boolean | string;\n  wordBreak: RichTextWordBreak;\n  verticalDirection: RichTextVerticalDirection;\n  maxHeight: number;\n  maxWidth: number;\n  textAlign: RichTextGlobalAlignType;\n  textBaseline: RichTextGlobalBaselineType;\n  layoutDirection: RichTextLayoutDirectionType;\n  textConfig: IRichTextCharacter[];\n  singleLine: boolean;\n};\n\nexport type IRichTextGraphicAttribute = Partial<IGraphicAttribute> & Partial<IRichTextAttribute>;\n\nexport type RichTextWordBreak = 'break-word' | 'break-all';\nexport type RichTextVerticalDirection = 'top' | 'middle' | 'bottom';\nexport type RichTextGlobalAlignType = 'left' | 'right' | 'center';\nexport type RichTextGlobalBaselineType = 'top' | 'middle' | 'bottom';\nexport type RichTextLayoutDirectionType = 'horizontal' | 'vertical';\nexport type RichTextFontStyle = 'normal' | 'italic' | 'oblique';\nexport type RichTextTextDecoration = 'none' | 'underline' | 'line-through';\n// export type RichTextTextAlign = 'left' | 'right' | 'center';\nexport type RichTextScript = 'normal' | 'sub' | 'super';\n\nexport type IRichTextBasicCharacter = {\n  lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextParagraphCharacter = IRichTextBasicCharacter & {\n  text: string;\n  fontSize?: number;\n  fontFamily?: string;\n  fill?: IColor | boolean;\n  stroke?: IColor | boolean;\n  fontWeight?: string;\n  // lineHeight?: number;\n  fontStyle?: RichTextFontStyle; // normal, italic, oblique\n  textDecoration?: RichTextTextDecoration; // none, underline, line-through\n  // textAlign?: RichTextTextAlign; // left, right, center\n  script?: RichTextScript; // normal, sub, super\n  underline?: boolean;\n  lineThrough?: boolean;\n  // direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextImageCharacter = IRichTextBasicCharacter & {\n  // 图片基础属性\n  image: string | HTMLImageElement | HTMLCanvasElement;\n  width: number;\n  height: number;\n\n  // hover相关属性\n  // backgroundShow?: boolean; // 是否显示background\n  backgroundShowMode?: 'always' | 'hover';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  // background size 同时控制了该icon的响应范围\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // 唯一标识符\n  id?: string;\n\n  // lineHeight?: number;\n  // textAlign?: RichTextTextAlign; // left, right, center\n  // direction?: RichTextLayoutDirectionType;\n  margin?: number | number[];\n\n  funcType?: string;\n  hoverImage?: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IRichTextCharacter = IRichTextParagraphCharacter | IRichTextImageCharacter;\n\nexport type IRichTextIconGraphicAttribute = IImageGraphicAttribute & {\n  id?: string;\n  backgroundShowMode?: 'always' | 'hover' | 'never';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n\n  margin?: number | number[];\n\n  // backgroundShow?: boolean;\n};\n\nexport interface IRichTextParagraph {\n  text: string;\n  ascent: number;\n  descent: number;\n  width: number;\n  height: number;\n  lineHeight: number;\n  fontSize: number;\n  length: number;\n  newLine: boolean;\n  character: IRichTextParagraphCharacter;\n  left: number;\n  top: number;\n  direction?: 'horizontal' | 'vertical';\n  widthOrigin?: number;\n  heightOrigin?: number;\n  textBaseline?: CanvasTextBaseline;\n  ellipsis: 'normal' | 'add' | 'replace' | 'hide';\n  ellipsisWidth: number;\n  ellipsisOtherParagraphWidth: number;\n  verticalEllipsis?: boolean;\n  updateWidth: () => void;\n  draw: (ctx: IContext2d, baseline: number, deltaLeft: number, isLineFirst: boolean, textAlign: string) => void;\n  getWidthWithEllips: (direction: string) => number;\n}\n\nexport interface IRichTextLine {\n  left: number;\n  top: number;\n  width: number;\n  height: number;\n  baseline: number;\n  ascent: number;\n  descent: number;\n  paragraphs: (IRichTextParagraph | IRichTextIcon)[];\n  actualWidth: number;\n  blankWidth: number;\n  textAlign: string;\n  direction: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    x: string;\n    y: string;\n  };\n  draw: (\n    ctx: IContext2d,\n    lastLine: boolean,\n    x: number,\n    y: number,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => void;\n  getWidthWithEllips: () => number;\n}\n\nexport interface IRichTextFrame {\n  left: number;\n  top: number;\n  bottom: number;\n  right: number;\n  width: number;\n  height: number;\n  actualHeight: number;\n  ellipsis: boolean | string;\n  wordBreak: 'break-word' | 'break-all';\n  verticalDirection: 'top' | 'middle' | 'bottom';\n  lines: IRichTextLine[];\n  globalAlign: 'left' | 'center' | 'right';\n  globalBaseline: 'top' | 'middle' | 'bottom';\n  layoutDirection: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    top: string;\n    bottom: string;\n  };\n  isWidthMax: boolean;\n  isHeightMax: boolean;\n  singleLine: boolean;\n  icons: Map<string, IRichTextIcon>;\n  draw: (\n    ctx: IContext2d,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => boolean;\n  getActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getRawActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getActualSizeWidthEllipsis: () => {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface IRichText extends IGraphic<IRichTextGraphicAttribute> {\n  getFrameCache: () => IRichTextFrame;\n}\n\nexport interface IRichTextIcon extends IImage {\n  attribute: IRichTextIconGraphicAttribute;\n  richtextId?: string;\n  globalX?: number;\n  globalY?: number;\n\n  _x: number;\n  _y: number;\n  _hovered: boolean;\n  _marginArray: [number, number, number, number];\n\n  setHoverState: (hovered: boolean) => void;\n}\n"]}

package/cjs/interface/graphic/symbol.d.ts

@@ -1,5 +1,6 @@
-import type { ISymbolClass } from '../../graphic';
+import type { IBounds } from '@visactor/vutils';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
+import type { ICustomPath2D, IPath2D } from '../path';
 export type ISymbolAttribute = {
     symbolType: SymbolType;
     size: number | [number, number];
@@ -9,3 +10,11 @@ export interface ISymbol extends IGraphic<ISymbolGraphicAttribute> {
     getParsedPath: () => ISymbolClass;
 }
 export type SymbolType = 'circle' | 'cross' | 'diamond' | 'square' | 'arrow' | 'arrow2Left' | 'arrow2Right' | 'wedge' | 'thinTriangle' | 'triangle' | 'triangleUp' | 'triangleDown' | 'triangleRight' | 'triangleLeft' | 'stroke' | 'star' | 'wye' | 'rect' | string;
+export interface ISymbolClass {
+    type: SymbolType | string;
+    path?: ICustomPath2D;
+    pathStr: string;
+    draw: (ctx: IPath2D, size: number | [number, number], x: number, y: number, z?: number) => boolean;
+    drawOffset: (ctx: IPath2D, size: number | [number, number], x: number, y: number, offset: number, z?: number) => boolean;
+    bounds: (size: number | [number, number], bounds: IBounds) => void;
+}

package/cjs/interface/graphic/symbol.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/symbol.ts"],"names":[],"mappings":"","file":"symbol.js","sourcesContent":["import type { ISymbolClass } from '../../graphic';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type ISymbolAttribute = {\n  symbolType: SymbolType;\n  size: number | [number, number];\n};\n\nexport type ISymbolGraphicAttribute = Partial<IGraphicAttribute> & Partial<ISymbolAttribute>;\n\nexport interface ISymbol extends IGraphic<ISymbolGraphicAttribute> {\n  getParsedPath: () => ISymbolClass;\n}\n\nexport type SymbolType =\n  | 'circle'\n  | 'cross'\n  | 'diamond'\n  | 'square'\n  | 'arrow'\n  | 'arrow2Left'\n  | 'arrow2Right'\n  | 'wedge'\n  | 'thinTriangle'\n  | 'triangle'\n  | 'triangleUp'\n  | 'triangleDown'\n  | 'triangleRight'\n  | 'triangleLeft'\n  | 'stroke'\n  | 'star'\n  | 'wye'\n  | 'rect'\n  | string;\n"]}
+{"version":3,"sources":["../../src/interface/graphic/symbol.ts"],"names":[],"mappings":"","file":"symbol.js","sourcesContent":["import type { IBounds } from '@visactor/vutils';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { ICustomPath2D, IPath2D } from '../path';\n\nexport type ISymbolAttribute = {\n  symbolType: SymbolType;\n  size: number | [number, number];\n};\n\nexport type ISymbolGraphicAttribute = Partial<IGraphicAttribute> & Partial<ISymbolAttribute>;\n\nexport interface ISymbol extends IGraphic<ISymbolGraphicAttribute> {\n  getParsedPath: () => ISymbolClass;\n}\n\nexport type SymbolType =\n  | 'circle'\n  | 'cross'\n  | 'diamond'\n  | 'square'\n  | 'arrow'\n  | 'arrow2Left'\n  | 'arrow2Right'\n  | 'wedge'\n  | 'thinTriangle'\n  | 'triangle'\n  | 'triangleUp'\n  | 'triangleDown'\n  | 'triangleRight'\n  | 'triangleLeft'\n  | 'stroke'\n  | 'star'\n  | 'wye'\n  | 'rect'\n  | string;\n\nexport interface ISymbolClass {\n  type: SymbolType | string;\n  path?: ICustomPath2D;\n  pathStr: string;\n\n  // 返回true表示内部已经调用closePath，返回false表示没有调用closePath，外部需要调用closePath\n  draw: (ctx: IPath2D, size: number | [number, number], x: number, y: number, z?: number) => boolean;\n  drawOffset: (\n    ctx: IPath2D,\n    size: number | [number, number],\n    x: number,\n    y: number,\n    offset: number,\n    z?: number\n  ) => boolean;\n\n  bounds: (size: number | [number, number], bounds: IBounds) => void;\n}\n"]}

package/cjs/interface/graphic/text.d.ts

@@ -1,6 +1,30 @@
 import type { IAABBBounds } from '@visactor/vutils';
-import type { LayoutType } from '../../core/contributions/textMeasure/layout';
 import type { IGraphicAttribute, IGraphic } from '../graphic';
+export interface TextLayoutBBox {
+    width: number;
+    height: number;
+    xOffset: number;
+    yOffset: number;
+}
+export interface LayoutItemType {
+    str: string;
+    leftOffset?: number;
+    topOffset?: number;
+    width: number;
+}
+export interface SimplifyLayoutType {
+    lines: LayoutItemType[];
+}
+export interface LayoutType {
+    bbox: TextLayoutBBox;
+    lines: LayoutItemType[];
+    fontFamily: string;
+    fontSize: number;
+    fontWeight?: string | number;
+    lineHeight: number;
+    textAlign: TextAlignType;
+    textBaseline: TextBaselineType;
+}
 export type ITextAttribute = {
     text: string | number | string[] | number[];
     maxLineWidth: number;

package/cjs/interface/graphic/text.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/interface/graphic/text.ts"],"names":[],"mappings":"","file":"text.js","sourcesContent":["import type { IAABBBounds } from '@visactor/vutils';\nimport type { LayoutType } from '../../core/contributions/textMeasure/layout';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport type ITextAttribute = {\n  text: string | number | string[] | number[];\n  maxLineWidth: number;\n  textAlign: TextAlignType;\n  textBaseline: TextBaselineType;\n  fontSize: number;\n  fontFamily: string;\n  fontWeight: string | number;\n  ellipsis: boolean | string;\n  fontVariant: string;\n  fontStyle: string;\n  lineHeight: number;\n  underline: number;\n  lineThrough: number;\n  // textDecoration: number;\n  // textDecorationWidth: number;\n  // padding?: number | number[];\n};\nexport type ITextCache = {\n  // 单行文本的时候缓存用\n  clipedText?: string;\n  clipedWidth?: number;\n  // 多行文本的布局缓存\n  layoutData?: LayoutType;\n};\n\nexport type ITextGraphicAttribute = Partial<IGraphicAttribute> & Partial<ITextAttribute>;\n\nexport type IWrapTextGraphicAttribute = ITextGraphicAttribute & {\n  heightLimit?: number;\n  lineClamp?: number;\n};\n\nexport interface IText extends IGraphic<ITextGraphicAttribute> {\n  // 判断是否被ellipisised\n  clipedText?: string;\n  clipedWidth?: number;\n  cliped?: boolean;\n  multilineLayout?: LayoutType;\n  font?: string;\n  cache?: ITextCache;\n\n  updateMultilineAABBBounds: (text: (number | string)[]) => IAABBBounds;\n  updateSingallineAABBBounds: (text: number | string) => IAABBBounds;\n}\n\nexport type TextAlignType = 'left' | 'right' | 'center' | 'start' | 'end';\nexport type TextBaselineType = 'top' | 'middle' | 'bottom' | 'alphabetic';\n"]}
+{"version":3,"sources":["../../src/interface/graphic/text.ts"],"names":[],"mappings":"","file":"text.js","sourcesContent":["import type { IAABBBounds } from '@visactor/vutils';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\n\nexport interface TextLayoutBBox {\n  width: number; // 包围盒的宽度\n  height: number; // 包围盒的高度\n  xOffset: number;\n  yOffset: number;\n}\n\nexport interface LayoutItemType {\n  str: string; // 这行的字符串\n  leftOffset?: number; // 该行距离左侧的偏移\n  topOffset?: number; // 该行距离右侧的偏移\n  width: number;\n}\n\nexport interface SimplifyLayoutType {\n  lines: LayoutItemType[];\n}\n\nexport interface LayoutType {\n  bbox: TextLayoutBBox;\n  lines: LayoutItemType[];\n  fontFamily: string;\n  fontSize: number;\n  fontWeight?: string | number;\n  lineHeight: number;\n  textAlign: TextAlignType;\n  textBaseline: TextBaselineType;\n}\n\nexport type ITextAttribute = {\n  text: string | number | string[] | number[];\n  maxLineWidth: number;\n  textAlign: TextAlignType;\n  textBaseline: TextBaselineType;\n  fontSize: number;\n  fontFamily: string;\n  fontWeight: string | number;\n  ellipsis: boolean | string;\n  fontVariant: string;\n  fontStyle: string;\n  lineHeight: number;\n  underline: number;\n  lineThrough: number;\n  // textDecoration: number;\n  // textDecorationWidth: number;\n  // padding?: number | number[];\n};\nexport type ITextCache = {\n  // 单行文本的时候缓存用\n  clipedText?: string;\n  clipedWidth?: number;\n  // 多行文本的布局缓存\n  layoutData?: LayoutType;\n};\n\nexport type ITextGraphicAttribute = Partial<IGraphicAttribute> & Partial<ITextAttribute>;\n\nexport type IWrapTextGraphicAttribute = ITextGraphicAttribute & {\n  heightLimit?: number;\n  lineClamp?: number;\n};\n\nexport interface IText extends IGraphic<ITextGraphicAttribute> {\n  // 判断是否被ellipisised\n  clipedText?: string;\n  clipedWidth?: number;\n  cliped?: boolean;\n  multilineLayout?: LayoutType;\n  font?: string;\n  cache?: ITextCache;\n\n  updateMultilineAABBBounds: (text: (number | string)[]) => IAABBBounds;\n  updateSingallineAABBBounds: (text: number | string) => IAABBBounds;\n}\n\nexport type TextAlignType = 'left' | 'right' | 'center' | 'start' | 'end';\nexport type TextBaselineType = 'top' | 'middle' | 'bottom' | 'alphabetic';\n"]}