Release (#2108)

* refactor: sub-package governance (#2094)

* refactor: sub-package governance

* refactor: type error

* refactor: merge @antv/g-plugin-canvas-path-generator into @antv/g-canvas

* chore: remove legacy code

* chore: fix build error

* refactor: merge @antv/g-plugin-canvas-picker into @antv/g-canvas

* refactor: merge @antv/g-plugin-image-loader into @antv/g-lite

* refactor: merge @antv/g-plugin-html-renderer into @antv/g-lite

* refactor: merge @antv/g-plugin-dom-interaction into @antv/g-lite

* refactor: merge @antv/g-plugin-canvas-renderer into @antv/g-canvas

* refactor: merge @antv/g-plugin-svg-picker into @antv/g-svg

* refactor: merge @antv/g-plugin-svg-renderer into @antv/g-svg

* refactor: merge @antv/g-plugin-mobile-interaction into @antv/g-lite

* refactor: remove package @antv/g-layout-blocklike

* refactor: remove package @antv/g-css-typed-om-api

* refactor: remove package @antv/g-css-layout-api

* refactor: merge @antv/g-plugin-canvaskit-renderer into @antv/g-canvaskit

* refactor: merge @antv/g-image-exporter into @antv/g

* refactor: merge @antv/g-mobile-canvas-element into @antv/g-mobile-canvas

* refactor: remove package @antv/g-gesture

* refactor: merge @antv/g-pattern into @antv/g

* refactor: merge @antv/g-components into @antv/g

* chore: update docs

* chore: add changeset

* chore(release): bump version (#2106)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

Author: wang1212

.eslintignore

@@ -1,33 +1,37 @@
-# 构建产物
+# build
 dist/
 build/
 lib/
 esm/
 coverage/
 types/
 
-# 依赖目录
+# dependencies
 node_modules/
 
-# 配置文件
+# configs
 .commitlintrc.cjs
 .eslintrc.cjs
 .lintstagedrc.mjs
 babel.config.mjs
 rollup.config.mjs
 vite.config.mjs
+vite.config.js
 jest.unit.config.js
 jest.visual.config.js
 
-# 大型包目录（可选择性排除）
+# large packages
 packages/g-devtool/
 packages/g-webgpu-compiler/
 packages/site/
 
-# 测试文件
+# tests
 __tests__/
 scripts/
 
-# 其他
+# docs
+site/
+
+# others
 *.min.js
-gui.min.js
+gui.min.js

README-zh_CN.md

@@ -31,19 +31,19 @@
   - [webgpu-graph](https://g-next.antv.vision/zh/docs/api/gpgpu/webgpu-graph) 使用 GPU 加速的图分析算法库
 - 可扩展的插件机制以及丰富的插件集：
   - 渲染相关
-    - [g-plugin-canvas-renderer](https://g-next.antv.vision/zh/docs/plugins/canvas-renderer) 基于 Canvas2D 渲染 2D 图形
-    - [g-plugin-svg-renderer](https://g-next.antv.vision/zh/docs/plugins/svg-renderer) 基于 SVG 渲染 2D 图形
-    - [g-plugin-device-renderer](https://g-next.antv.vision/zh/docs/plugins/device-renderer) 基于 GPUDevice 渲染 2D 图形
-    - [g-plugin-html-renderer](https://g-next.antv.vision/zh/docs/plugins/html-renderer) 渲染 DOM 元素
+    - [canvas-renderer](https://g-next.antv.vision/zh/docs/plugins/canvas-renderer) 基于 Canvas2D 渲染 2D 图形
+    - [svg-renderer](https://g-next.antv.vision/zh/docs/plugins/svg-renderer) 基于 SVG 渲染 2D 图形
+    - [device-renderer](https://g-next.antv.vision/zh/docs/plugins/device-renderer) 基于 GPUDevice 渲染 2D 图形
+    - [html-renderer](https://g-next.antv.vision/zh/docs/plugins/html-renderer) 渲染 DOM 元素
     - [g-plugin-3d](https://g-next.antv.vision/zh/docs/plugins/3d) 基于 g-plugin-device-renderer 扩展 3D 能力
     - [g-plugin-rough-canvas-renderer](https://g-next.antv.vision/zh/docs/plugins/rough-canvas-renderer) 使用 [rough.js](https://roughjs.com/) 和 Canvs2D 进行手绘风格渲染
     - [g-plugin-rough-svg-renderer](https://g-next.antv.vision/zh/docs/plugins/rough-svg-renderer) 使用 [rough.js](https://roughjs.com/) 和 SVG 进行手绘风格渲染
-    - [g-plugin-canvaskit-renderer](https://g-next.antv.vision/zh/docs/plugins/canvaskit-renderer) 基于 [Skia](https://skia.org/docs/user/modules/quickstart) 渲染 2D 图形
+    - [canvaskit-renderer](https://g-next.antv.vision/zh/docs/plugins/canvaskit-renderer) 基于 [Skia](https://skia.org/docs/user/modules/quickstart) 渲染 2D 图形
   - 拾取
-    - [g-plugin-canvas-picker](https://g-next.antv.vision/zh/docs/plugins/canvas-picker) 基于 Canvas2D
-    - [g-plugin-svg-picker](https://g-next.antv.vision/zh/docs/plugins/svg-picker) 基于 SVG
+    - [canvas-picker](https://g-next.antv.vision/zh/docs/plugins/canvas-picker) 基于 Canvas2D
+    - [svg-picker](https://g-next.antv.vision/zh/docs/plugins/svg-picker) 基于 SVG
   - 交互
-    - [g-plugin-dom-interaction](https://g-next.antv.vision/zh/docs/plugins/dom-interaction) 基于 DOM API 绑定事件
+    - [dom-interaction](https://g-next.antv.vision/zh/docs/plugins/dom-interaction) 基于 DOM API 绑定事件
     - [g-plugin-control](https://g-next.antv.vision/zh/docs/plugins/control) 为 3D 场景提供相机交互
     - [g-plugin-dragndrop](https://g-next.antv.vision/en/docs/plugins/dragndrop) 基于 PointerEvents 提供 Drag 'n' Drop
   - 物理引擎

README.md

@@ -34,19 +34,19 @@ As the underlying rendering engine of AntV, G is dedicated to provide consistent
 Extensible plug-in mechanism and rich set of plug-ins：
 
 - Rendering Related
-  - [g-plugin-canvas-renderer](https://g-next.antv.vision/en/docs/plugins/canvas-renderer) Rendering 2D graphics based on Canvas2D.
-  - [g-plugin-svg-renderer](https://g-next.antv.vision/en/docs/plugins/svg-renderer) Rendering 2D graphics based on SVG.
+  - [canvas-renderer](https://g-next.antv.vision/en/docs/plugins/canvas-renderer) Rendering 2D graphics based on Canvas2D.
+  - [svg-renderer](https://g-next.antv.vision/en/docs/plugins/svg-renderer) Rendering 2D graphics based on SVG.
   - [g-plugin-device-renderer](https://g-next.antv.vision/en/docs/plugins/device-renderer) Rendering 2D graphics based on GPUDevice.
-  - [g-plugin-html-renderer](https://g-next.antv.vision/en/docs/plugins/html-renderer) Rendering DOM with HTML.
+  - [html-renderer](https://g-next.antv.vision/en/docs/plugins/html-renderer) Rendering DOM with HTML.
   - [g-plugin-3d](https://g-next.antv.vision/en/docs/plugins/3d) Extended 3D capabilities.
   - [g-plugin-rough-canvas-renderer](https://g-next.antv.vision/en/docs/plugins/rough-canvas-renderer) Perform hand-drawn style rendering with [rough.js](https://roughjs.com/) and Canvs2D.
   - [g-plugin-rough-svg-renderer](https://g-next.antv.vision/en/docs/plugins/rough-svg-renderer) Perform hand-drawn style rendering with [rough.js](https://roughjs.com/) and SVG.
-  - [g-plugin-canvaskit-renderer](https://g-next.antv.vision/en/docs/plugins/canvaskit-renderer) Rendering 2D graphics based on [Skia](https://skia.org/docs/user/modules/quickstart).
+  - [canvaskit-renderer](https://g-next.antv.vision/en/docs/plugins/canvaskit-renderer) Rendering 2D graphics based on [Skia](https://skia.org/docs/user/modules/quickstart).
 - Picking
-  - [g-plugin-canvas-picker](https://g-next.antv.vision/en/docs/plugins/canvas-picker) Do picking with Canvas2D and mathematical calculations.
-  - [g-plugin-svg-picker](https://g-next.antv.vision/en/docs/plugins/svg-picker) Do picking with SVG and DOM API.
+  - [canvas-picker](https://g-next.antv.vision/en/docs/plugins/canvas-picker) Do picking with Canvas2D and mathematical calculations.
+  - [svg-picker](https://g-next.antv.vision/en/docs/plugins/svg-picker) Do picking with SVG and DOM API.
 - Interaction
-  - [g-plugin-dom-interaction](https://g-next.antv.vision/en/docs/plugins/dom-interaction) Binds event listeners with DOM API.
+  - [dom-interaction](https://g-next.antv.vision/en/docs/plugins/dom-interaction) Binds event listeners with DOM API.
   - [g-plugin-control](https://g-next.antv.vision/en/docs/plugins/control) Provides camera interaction for 3D scenes.
   - [g-plugin-dragndrop](https://g-next.antv.vision/en/docs/plugins/dragndrop) Provides Drag 'n' Drop based on PointerEvents.
 - Physics Engine

__tests__/demos/2d/clippath.ts

@@ -1,5 +1,4 @@
-import { Circle, Rect, Path, Group } from '@antv/g';
-import { Sector } from '@antv/g-components';
+import { Circle, Rect, Path, Group, Sector } from '@antv/g';
 
 export async function clipPath(context) {
   const { canvas } = context;

__tests__/demos/2d/custom-element.ts

@@ -1,5 +1,4 @@
-import { Path, Polyline, Line } from '@antv/g';
-import { Arrow } from '@antv/g-components';
+import { Path, Polyline, Line, Arrow } from '@antv/g';
 
 export async function customElement(context) {
   const { canvas } = context;

__tests__/demos/2d/pattern2.ts

@@ -1,5 +1,4 @@
-import { Circle, Rect } from '@antv/g';
-import { dots, lines } from '@antv/g-pattern';
+import { Circle, Rect, dots, lines } from '@antv/g';
 import * as d3 from 'd3';
 
 export async function pattern2(context) {

__tests__/demos/plugin/exporter.ts

@@ -1,6 +1,5 @@
 import * as d3 from 'd3';
-import { HTML, Rectangle } from '@antv/g';
-import { ImageExporter } from '@antv/g-image-exporter';
+import { HTML, Rectangle, ImageExporter } from '@antv/g';
 
 export async function exporter(context) {
   const { canvas, gui } = context;
@@ -13,7 +12,9 @@ export async function exporter(context) {
 
   const drawBars = async () => {
     // 1. Access data
-    const dataset = await d3.json('https://gw.alipayobjects.com/os/bmw-prod/8e7cfeb6-28e5-4e78-8d16-c08468360f5f.json');
+    const dataset = await d3.json(
+      'https://gw.alipayobjects.com/os/bmw-prod/8e7cfeb6-28e5-4e78-8d16-c08468360f5f.json',
+    );
     const metricAccessor = (d) => d.humidity;
     const yAccessor = (d) => d.length;
 
@@ -31,8 +32,10 @@ export async function exporter(context) {
       boundedWidth: 0,
       boundedHeight: 0,
     };
-    dimensions.boundedWidth = dimensions.width - dimensions.margin.left - dimensions.margin.right;
-    dimensions.boundedHeight = dimensions.height - dimensions.margin.top - dimensions.margin.bottom;
+    dimensions.boundedWidth =
+      dimensions.width - dimensions.margin.left - dimensions.margin.right;
+    dimensions.boundedHeight =
+      dimensions.height - dimensions.margin.top - dimensions.margin.bottom;
 
     // 3. Draw canvas
     const wrapper = d3.select(
@@ -41,7 +44,10 @@ export async function exporter(context) {
 
     const bounds = wrapper
       .append('g')
-      .style('transform', `translate(${dimensions.margin.left}px, ${dimensions.margin.top}px)`);
+      .style(
+        'transform',
+        `translate(${dimensions.margin.left}px, ${dimensions.margin.top}px)`,
+      );
 
     // 4. Create scales
 
@@ -51,7 +57,11 @@ export async function exporter(context) {
       .range([0, dimensions.boundedWidth])
       .nice();
 
-    const binsGenerator = d3.bin().domain(xScale.domain()).value(metricAccessor).thresholds(12);
+    const binsGenerator = d3
+      .bin()
+      .domain(xScale.domain())
+      .value(metricAccessor)
+      .thresholds(12);
 
     const bins = binsGenerator(dataset);
 
@@ -63,14 +73,20 @@ export async function exporter(context) {
 
     // 5. Draw data
     const binsGroup = bounds.append('g');
-    const binGroups = binsGroup.selectAll('g').data(bins).join('g').attr('class', 'bin');
+    const binGroups = binsGroup
+      .selectAll('g')
+      .data(bins)
+      .join('g')
+      .attr('class', 'bin');
 
     const barPadding = 1;
     const barRects = binGroups
       .append('rect')
       .attr('x', (d) => xScale(d.x0) + barPadding / 2)
       .attr('y', (d) => yScale(yAccessor(d)))
-      .attr('width', (d) => d3.max([0, xScale(d.x1) - xScale(d.x0) - barPadding]))
+      .attr('width', (d) =>
+        d3.max([0, xScale(d.x1) - xScale(d.x0) - barPadding]),
+      )
       .attr('height', (d) => dimensions.boundedHeight - yScale(yAccessor(d)))
       .attr('fill', 'cornflowerblue')
       .on('mouseenter', function (e) {
@@ -174,7 +190,12 @@ export async function exporter(context) {
         ignoreElements: (element) => {
           return [gui.domElement].indexOf(element) > -1;
         },
-        clippingRegion: new Rectangle(clippingRegionX, clippingRegionY, clippingRegionWidth, clippingRegionHeight),
+        clippingRegion: new Rectangle(
+          clippingRegionX,
+          clippingRegionY,
+          clippingRegionWidth,
+          clippingRegionHeight,
+        ),
         beforeDrawImage: (context) => {
           if (enableBackgroundColor) {
             context.fillStyle = backgroundColor;
@@ -207,7 +228,12 @@ export async function exporter(context) {
         ignoreElements: (element) => {
           return [gui.domElement].indexOf(element) > -1;
         },
-        clippingRegion: new Rectangle(clippingRegionX, clippingRegionY, clippingRegionWidth, clippingRegionHeight),
+        clippingRegion: new Rectangle(
+          clippingRegionX,
+          clippingRegionY,
+          clippingRegionWidth,
+          clippingRegionHeight,
+        ),
         beforeDrawImage: (context) => {
           if (enableBackgroundColor) {
             context.fillStyle = backgroundColor;
@@ -255,7 +281,12 @@ export async function exporter(context) {
   exporterFolder.add(exporterConfig, 'enableBackgroundColor');
   exporterFolder.addColor(exporterConfig, 'backgroundColor');
   exporterFolder.add(exporterConfig, 'enableWatermark');
-  exporterFolder.add(exporterConfig, 'type', ['image/png', 'image/jpeg', 'image/webp', 'image/bmp']);
+  exporterFolder.add(exporterConfig, 'type', [
+    'image/png',
+    'image/jpeg',
+    'image/webp',
+    'image/bmp',
+  ]);
   exporterFolder.add(exporterConfig, 'encoderOptions', 0, 1);
   exporterFolder.add(exporterConfig, 'toDataURL');
   exporterFolder.add(exporterConfig, 'downloadImage');

__tests__/demos/plugin/html-renderer.ts

@@ -1,11 +1,10 @@
-import { HTML } from '@antv/g';
-import { Plugin as HTMLRenderingPlugin } from '@antv/g-plugin-html-renderer';
+import { HTML, HTMLRenderer } from '@antv/g';
 import { ExampleLayoutManager } from '../_helper/example-layout-manager';
 
 export async function htmlRenderer(context) {
   const { canvas, renderer } = context;
 
-  renderer.registerPlugin(new HTMLRenderingPlugin());
+  renderer.registerPlugin(new HTMLRenderer.Plugin());
 
   await canvas.ready;
 

__tests__/main.ts

@@ -1,6 +1,5 @@
 import Stats from 'stats.js';
 import * as lil from 'lil-gui';
-import '@antv/g-camera-api';
 import { Canvas, CanvasEvent, runtime } from '@antv/g';
 import { Renderer as CanvasRenderer } from '@antv/g-canvas';
 import { Renderer as CanvaskitRenderer } from '@antv/g-canvaskit';