refactor: rename G6Spec to GraphOptions (#5673)

packages/g6-extension-react/__tests__/demos/react-node.tsx

@@ -1,5 +1,5 @@
 import { DatabaseFilled } from '@ant-design/icons';
-import type { Graph as G6Graph, G6Spec, NodeData } from '@antv/g6';
+import type { Graph as G6Graph, GraphOptions, NodeData } from '@antv/g6';
 import { ExtensionCategory, register } from '@antv/g6';
 import { Badge, Button, Flex, Form, Input, Layout, Select, Table, Tag, Typography } from 'antd';
 import { useRef, useState } from 'react';
@@ -60,7 +60,7 @@ export const ReactNodeDemo = () => {
     );
   };
 
-  const [options, setOptions] = useState<G6Spec>({
+  const [options, setOptions] = useState<GraphOptions>({
     data: {
       nodes: [
         {

packages/g6-extension-react/src/graph/graph.tsx

@@ -1,9 +1,9 @@
-import type { G6Spec } from '@antv/g6';
+import type { GraphOptions } from '@antv/g6';
 import { Graph as G6Graph } from '@antv/g6';
 import { useEffect, useRef } from 'react';
 
 export interface GraphProps {
-  options: G6Spec;
+  options: GraphOptions;
   onRender?: (graph: G6Graph) => void;
   onDestroy?: () => void;
 }

packages/g6/__tests__/demos/animation-element-position.ts

@@ -1,8 +1,8 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph } from '@/src';
 
 export const animationElementPosition: TestCase = async (context) => {
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data: {
       nodes: [

packages/g6/__tests__/demos/animation-element-state-switch.ts

@@ -1,8 +1,8 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph } from '@/src';
 
 export const animationElementStateSwitch: TestCase = async (context) => {
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data: {
       nodes: [

packages/g6/__tests__/demos/animation-element-style-position.ts

@@ -1,7 +1,7 @@
-import { Graph, type G6Spec } from '@/src';
+import { Graph, type GraphOptions } from '@/src';
 
 export const animationElementStylePosition: TestCase = async (context) => {
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data: {
       nodes: [

packages/g6/__tests__/demos/layout-forceatlas2-wasm.ts

@@ -1,4 +1,4 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph, register } from '@/src';
 import data from '@@/dataset/soccer.json';
 
@@ -9,7 +9,7 @@ export const layoutForceatlas2WASM: TestCase = async (context) => {
   const supported = await supportsThreads();
   const threads = await initThreads(supported);
 
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data,
     theme: 'light',

packages/g6/__tests__/demos/layout-fruchterman-gpu.ts

@@ -1,11 +1,11 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph, register } from '@/src';
 import data from '@@/dataset/soccer.json';
 
 export const layoutFruchtermanGPU: TestCase = async (context) => {
   register('layout', 'fruchterman-gpu', (await import('@antv/layout-gpu')).FruchtermanLayout);
 
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data,
     theme: 'light',

packages/g6/__tests__/demos/layout-fruchterman-wasm.ts

@@ -1,4 +1,4 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph, register } from '@/src';
 import data from '@@/dataset/soccer.json';
 
@@ -10,7 +10,7 @@ export const layoutFruchtermanWASM: TestCase = async (context) => {
   const supported = await supportsThreads();
   const threads = await initThreads(supported);
 
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     data,
     theme: 'light',

packages/g6/__tests__/demos/layout-indented.ts

@@ -1,9 +1,9 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph, treeToGraphData } from '@/src';
 import tree from '@@/dataset/file-system.json';
 
 export const layoutIndented: TestCase = async (context) => {
-  const options: G6Spec = {
+  const options: GraphOptions = {
     ...context,
     y: -200,
     zoom: 0.5,

packages/g6/__tests__/unit/spec/index.spec.ts

@@ -1,9 +1,9 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Renderer } from '@antv/g-canvas';
 
 describe('spec', () => {
   it('spec', () => {
-    const options: G6Spec = {
+    const options: GraphOptions = {
       width: 800,
       height: 600,
       renderer: () => new Renderer(),

packages/g6/__tests__/utils/create.ts

@@ -1,4 +1,4 @@
-import type { G6Spec } from '@/src';
+import type { GraphOptions } from '@/src';
 import { Graph } from '@/src';
 import { Circle } from '@/src/elements';
 import { Canvas } from '@/src/runtime/canvas';
@@ -83,7 +83,7 @@ export async function createDemoGraph(demo: TestCase, context?: Partial<TestCont
   return demo({ animation: false, container, theme: 'light', ...context });
 }
 
-export function createGraph(options: G6Spec) {
+export function createGraph(options: GraphOptions) {
   const container = createGraphCanvas(document.getElementById('container'));
   return new Graph({
     container,

packages/g6/src/exports.ts

@@ -68,8 +68,8 @@ export type {
   ComboOptions,
   EdgeData,
   EdgeOptions,
-  G6Spec,
   GraphData,
+  GraphOptions,
   LayoutOptions,
   NodeData,
   NodeOptions,

packages/g6/src/runtime/graph.ts

@@ -10,8 +10,8 @@ import type {
   ComboOptions,
   EdgeData,
   EdgeOptions,
-  G6Spec,
   GraphData,
+  GraphOptions,
   LayoutOptions,
   NodeData,
   NodeOptions,
@@ -61,9 +61,9 @@ import { RuntimeContext } from './types';
 import { ViewportController } from './viewport';
 
 export class Graph extends EventEmitter {
-  private options: G6Spec;
+  private options: GraphOptions;
 
-  static defaultOptions: G6Spec = {
+  static defaultOptions: GraphOptions = {
     autoResize: false,
     theme: 'light',
     rotation: 0,
@@ -78,7 +78,7 @@ export class Graph extends EventEmitter {
     model: new DataController(),
   };
 
-  constructor(options: G6Spec) {
+  constructor(options: GraphOptions) {
     super();
     this.options = Object.assign({}, Graph.defaultOptions, options);
     this.setOptions(this.options);
@@ -94,7 +94,7 @@ export class Graph extends EventEmitter {
    * <en/> Get options
    * @returns <zh/> 配置项 | <en/> options
    */
-  public getOptions(): G6Spec {
+  public getOptions(): GraphOptions {
     return this.options;
   }
 
@@ -108,7 +108,7 @@ export class Graph extends EventEmitter {
    *
    * <en/> To update devicePixelRatio and container properties, please destroy and recreate the instance
    */
-  public setOptions(options: G6Spec): void {
+  public setOptions(options: GraphOptions): void {
     const {
       animation,
       background,
@@ -147,12 +147,12 @@ export class Graph extends EventEmitter {
     if (isNumber(padding) || isArray(padding)) this.options.padding = padding;
   }
 
-  public setBackground(background: G6Spec['background']): void {
+  public setBackground(background: GraphOptions['background']): void {
     this.options.background = background;
     this.context.canvas?.setBackground(background);
   }
 
-  public getBackground(): G6Spec['background'] {
+  public getBackground(): GraphOptions['background'] {
     return this.options.background;
   }
 
@@ -166,11 +166,11 @@ export class Graph extends EventEmitter {
     this.options.height = height;
   }
 
-  public setZoomRange(zoomRange: G6Spec['zoomRange']): void {
+  public setZoomRange(zoomRange: GraphOptions['zoomRange']): void {
     this.options.zoomRange = zoomRange;
   }
 
-  public getZoomRange(): G6Spec['zoomRange'] {
+  public getZoomRange(): GraphOptions['zoomRange'] {
     return this.options.zoomRange;
   }
 

packages/g6/src/runtime/types.ts

@@ -1,4 +1,4 @@
-import type { G6Spec } from '../spec';
+import type { GraphOptions } from '../spec';
 import type { BatchController } from './batch';
 import type { BehaviorController } from './behavior';
 import type { Canvas } from './canvas';
@@ -28,7 +28,7 @@ export interface RuntimeContext {
    *
    * <en/> G6 options
    */
-  options: G6Spec;
+  options: GraphOptions;
   /**
    * <zh/> 数据模型
    *

packages/g6/src/spec/graph.ts

@@ -12,12 +12,12 @@ import type { TransformOptions } from './transform';
 import type { ViewportOptions } from './viewport';
 
 /**
- * <zh/> Spec 定义
+ * <zh/> Graph 配置项
  *
- * <en/> Specification definition
+ * <en/> Graph options
  */
 
-export interface G6Spec extends CanvasOptions, ViewportOptions {
+export interface GraphOptions extends CanvasOptions, ViewportOptions {
   /**
    * <zh/> 启用关闭、全局动画
    *

packages/g6/src/spec/index.ts

@@ -4,9 +4,9 @@ export type { ComboData, EdgeData, GraphData, NodeData } from './data';
 export type { ComboOptions } from './element/combo';
 export type { EdgeOptions } from './element/edge';
 export type { NodeOptions } from './element/node';
+export type { GraphOptions } from './graph';
 export type { LayoutOptions } from './layout';
 export type { PluginOptions } from './plugin';
-export type { G6Spec } from './spec';
 export type { ThemeOptions } from './theme';
 export type { TransformOptions } from './transform';
 export type { ViewportOptions } from './viewport';

packages/g6/src/utils/animation.ts

@@ -1,7 +1,7 @@
 import type { DisplayObject, IAnimation } from '@antv/g';
 import { isEqual, isNil, isObject } from '@antv/util';
 import { DEFAULT_ANIMATION_OPTIONS } from '../constants';
-import type { G6Spec } from '../spec';
+import type { GraphOptions } from '../spec';
 import type { AnimatableTask, Keyframe } from '../types';
 import { isNode } from './element';
 import { getDescendantShapes } from './shape';
@@ -229,7 +229,7 @@ export function executeAnimatableTasks(tasks: AnimatableTask[], callbacks: Callb
  * @returns <zh/> 动画配置 | <en/> animation configuration
  */
 export function getAnimation(
-  options: G6Spec,
+  options: GraphOptions,
   localAnimation: boolean | EffectTiming | undefined,
 ): false | EffectTiming {
   const { animation } = options;