Merge branch 'develop' into feat/upgrade-vrender-1-1-3

# Conflicts:
#	common/config/rush/pnpm-lock.yaml
#	docs/package.json
#	packages/openinula-vchart/package.json
#	packages/react-vchart/package.json
#	packages/vchart-extension/package.json
#	packages/vchart-extension/src/charts/3d/arc-3d.ts
#	packages/vchart/package.json
#	tools/story-player/package.json

Author: xuefei1313

.github/workflows/release.yml

@@ -342,6 +342,13 @@ jobs:
         with:
           path: packages/vchart
 
+      - name: BytePack CDN smoke test (release)
+        if: startsWith(github.ref_name, 'release/')
+        env:
+          BYTEPACK_SMOKE_ATTEMPTS: 12
+          BYTEPACK_SMOKE_DELAY_MS: 30000
+        run: node --experimental-network-imports common/scripts/bytepack-smoke-test.mjs ${{ steps.package_version_release.outputs.current_version }}
+
       - name: Commit & Push changes (release)
         if: startsWith(github.ref_name, 'release/')
         run: |
@@ -407,6 +414,13 @@ jobs:
         with:
           path: packages/vchart
 
+      - name: BytePack CDN smoke test (hotfix)
+        if: startsWith(github.ref_name, 'hotfix/')
+        env:
+          BYTEPACK_SMOKE_ATTEMPTS: 12
+          BYTEPACK_SMOKE_DELAY_MS: 30000
+        run: node --experimental-network-imports common/scripts/bytepack-smoke-test.mjs ${{ steps.package_version_hotfix.outputs.current_version }}
+
       - name: Commit & Push changes (hotfix)
         if: startsWith(github.ref_name, 'hotfix/')
         run: |
@@ -444,6 +458,13 @@ jobs:
         with:
           path: packages/vchart
 
+      - name: BytePack CDN smoke test (pre-release)
+        if: startsWith(github.ref_name, 'pre-release/')
+        env:
+          BYTEPACK_SMOKE_ATTEMPTS: 12
+          BYTEPACK_SMOKE_DELAY_MS: 30000
+        run: node --experimental-network-imports common/scripts/bytepack-smoke-test.mjs ${{ steps.package_version_prerelease.outputs.current_version }}
+
       - name: Commit & Push changes (pre-release)
         if: startsWith(github.ref_name, 'pre-release/')
         run: |

common/scripts/bytepack-smoke-test.mjs

@@ -0,0 +1,87 @@
+import { createRequire } from 'node:module';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const version = process.argv[2];
+
+if (!version) {
+  console.error('Usage: node --experimental-network-imports common/scripts/bytepack-smoke-test.mjs <version>');
+  process.exit(1);
+}
+
+const attempts = Number(process.env.BYTEPACK_SMOKE_ATTEMPTS || 10);
+const delayMs = Number(process.env.BYTEPACK_SMOKE_DELAY_MS || 30000);
+const repoRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..', '..');
+const requireFromVChart = createRequire(path.join(repoRoot, 'packages/vchart/package.json'));
+const Canvas = requireFromVChart('canvas');
+
+const wait = ms => new Promise(resolve => setTimeout(resolve, ms));
+
+async function runSmoke() {
+  const vchartModule = await import(`https://bytepack.bytedance.net/@visactor/vchart@${version}`);
+  const extensionModule = await import(
+    `https://bytepack.bytedance.net/@visactor/vchart-extension@${version}/esm/charts/pie-3d/chart.js`
+  );
+
+  extensionModule.registerPie3dChart();
+
+  const VChart = vchartModule.default ?? vchartModule.VChart;
+  if (!VChart) {
+    throw new Error('Unable to resolve VChart constructor from BytePack module.');
+  }
+
+  const chart = new VChart(
+    {
+      type: 'pie3d',
+      width: 240,
+      height: 240,
+      data: [
+        {
+          id: 'data',
+          values: [
+            { category: 'A', value: 12 },
+            { category: 'B', value: 18 }
+          ]
+        }
+      ],
+      categoryField: 'category',
+      valueField: 'value',
+      outerRadius: 0.72
+    },
+    {
+      mode: 'node',
+      modeParams: Canvas,
+      animation: false,
+      options3d: {
+        enable: true
+      }
+    }
+  );
+
+  chart.renderSync();
+  chart.release();
+}
+
+let lastError;
+for (let attempt = 1; attempt <= attempts; attempt++) {
+  try {
+    console.log(`BytePack smoke test for @visactor/vchart@${version}, attempt ${attempt}/${attempts}`);
+    await runSmoke();
+    console.log(`BytePack smoke test passed for @visactor/vchart@${version}`);
+    process.exit(0);
+  } catch (err) {
+    lastError = err;
+    console.error(`BytePack smoke test failed on attempt ${attempt}/${attempts}:`);
+    console.error(err && err.stack ? err.stack : err);
+
+    if (attempt < attempts) {
+      await wait(delayMs);
+    }
+  }
+}
+
+console.error(`BytePack smoke test failed after ${attempts} attempts.`);
+if (lastError) {
+  console.error(lastError && lastError.stack ? lastError.stack : lastError);
+}
+process.exit(1);

packages/vchart/__tests__/unit/animation/manual-ticker.test.ts

@@ -6,6 +6,7 @@ import VChart, {
   type ILineChartSpec,
   type IMark,
   type IMarkGraphic,
+  type IPieChartSpec,
   type ISeries,
   type IWordCloudChartSpec
 } from '../../../src';
@@ -218,6 +219,52 @@ const getGraphicDatum = (graphic: AnimatedGraphic) => {
 
 const getStateDatum = (datum: any) => (Array.isArray(datum) ? datum[0] : datum);
 
+const createCustomGroupSpec = (x: number): IBarChartSpec =>
+  ({
+    type: 'bar',
+    data: [
+      {
+        id: 'data',
+        values: [{ x: 'A', y: 1 }]
+      }
+    ],
+    xField: 'x',
+    yField: 'y',
+    animation: true,
+    customMark: [
+      {
+        type: 'group',
+        name: 'customGroup',
+        animation: true,
+        animationUpdate: false,
+        style: {
+          x,
+          y: 20,
+          width: 40,
+          height: 30
+        }
+      }
+    ]
+  } as unknown as IBarChartSpec);
+
+const getCustomGroupGraphic = (chart: VChart) => {
+  const mark = (chart.getChart() as any).getAllMarks().find((m: IMark) => m.name === 'customGroup');
+
+  expect(mark).toBeDefined();
+  if (!mark) {
+    throw new Error('Expected custom group mark to exist');
+  }
+
+  const group = mark.getGraphics?.()[0] as AnimatedGraphic;
+
+  expect(group).toBeDefined();
+  if (!group) {
+    throw new Error('Expected custom group graphic to exist');
+  }
+
+  return group;
+};
+
 const getBarGraphicByDatum = (chart: VChart, predicate: (datum: any) => boolean) => {
   const bar = getBarGraphics(chart).find(graphic => predicate(getGraphicDatum(graphic)));
 
@@ -308,6 +355,25 @@ const getBarClipPathRects = (chart: VChart) =>
 
 const getBarClipPathGraphics = (chart: VChart) => (getBarMarkProduct(chart).attribute.path ?? []) as AnimatedGraphic[];
 
+const getPieGraphics = (chart: VChart) => {
+  const model = chart.getChart() as IChart;
+  const pieSeries = model.getAllSeries().find((series: ISeries) => series.type === 'pie');
+
+  expect(pieSeries).toBeDefined();
+  if (!pieSeries) {
+    throw new Error('Expected pie series to exist');
+  }
+
+  const pieMark = pieSeries.getMarks().find((mark: IMark) => mark.name === 'pie');
+
+  expect(pieMark).toBeDefined();
+  if (!pieMark) {
+    throw new Error('Expected pie mark to exist');
+  }
+
+  return pieMark.getGraphics() as AnimatedGraphic[];
+};
+
 const clickLegendItem = (chart: VChart, index: number) => {
   const legendModel = chart.getComponents().find((component: any) => component.type === 'discreteLegend') as any;
   const legendComponent = legendModel?._legendComponent;
@@ -469,6 +535,57 @@ const createSeriesChangeDocBarSpec = (mode: 'grouped' | 'single') => {
   } as unknown as IBarChartSpec;
 };
 
+const createPieLegendFilterSpec = (): IPieChartSpec =>
+  ({
+    type: 'pie',
+    width: 500,
+    height: 500,
+    padding: 0,
+    data: [
+      {
+        id: 'id0',
+        values: [
+          { group: '0', value: 455, labelValue: '455', dataIndex: 0, seriesIndex: 0, name: '满意' },
+          { group: '0', value: 655, labelValue: '655', dataIndex: 1, seriesIndex: 0, name: '一般' },
+          { group: '0', value: 160, labelValue: '160', dataIndex: 2, seriesIndex: 0, name: '差评' }
+        ]
+      }
+    ],
+    categoryField: 'dataIndex',
+    valueField: 'value',
+    startAngle: -90,
+    endAngle: -90,
+    animation: true,
+    animationAppear: {
+      duration: APPEAR_DURATION,
+      easing: 'linear'
+    },
+    animationUpdate: false,
+    animationEnter: false,
+    animationExit: false,
+    animationDisappear: false,
+    legends: {
+      orient: 'bottom',
+      position: 'middle',
+      visible: true,
+      allowAllCanceled: false,
+      item: {
+        visible: true
+      }
+    },
+    pie: {
+      state: {
+        hover: {
+          outerRadius: 1.06
+        }
+      },
+      style: {
+        cursor: 'pointer',
+        lineWidth: 2
+      }
+    }
+  } as unknown as IPieChartSpec);
+
 const createLineGrowthSpec = (values: Array<{ time: string; value: number }>) =>
   ({
     type: 'line',
@@ -1282,6 +1399,89 @@ const hasRenderableBarGeometry = (graphic: AnimatedGraphic) => {
 };
 
 describe('manual ticker animation regressions', () => {
+  it('keeps custom group final attributes after a prevented update animation', () => {
+    const { container, dom } = createChartContainer();
+    const ticker = createManualTicker();
+    const chart = new VChart(createCustomGroupSpec(20), {
+      dom,
+      ticker,
+      animation: true
+    });
+
+    chart.renderSync();
+
+    try {
+      ticker.tickAt(APPEAR_DURATION + 50);
+
+      chart.updateSpecSync(createCustomGroupSpec(80));
+
+      const group = getCustomGroupGraphic(chart);
+
+      expectClose(group.attribute.x, 80);
+      expectClose(group.baseAttributes?.x, 80);
+      expectClose(getGraphicFinalAttribute(group).x, 80);
+    } finally {
+      chart.release();
+      ticker.release();
+      removeDom(container);
+    }
+  });
+
+  it('keeps pie arc angles stable after legend filtering and hover state changes', () => {
+    const { container, dom } = createChartContainer();
+    const ticker = createManualTicker();
+    const chart = new VChart(createPieLegendFilterSpec(), {
+      dom,
+      ticker,
+      animation: true
+    });
+
+    chart.renderSync();
+
+    try {
+      ticker.tickAt(APPEAR_DURATION + 50);
+
+      chart.setLegendSelectedDataByIndex(0, [0, 1]);
+      chart.renderSync();
+
+      const updateStart = ticker.getTime();
+      ticker.tickAt(updateStart + UPDATE_DURATION + 50);
+
+      const secondPie = getPieGraphics(chart).find(graphic => graphic.context.data[0]?.dataIndex === 1);
+      const expectedStartAngle = -Math.PI / 2 + (Math.PI * 2 * 455) / (455 + 655);
+      const expectedEndAngle = -Math.PI / 2 + Math.PI * 2;
+
+      expect(secondPie).toBeDefined();
+      if (!secondPie) {
+        throw new Error('Expected second pie graphic to exist');
+      }
+
+      expectClose(secondPie.attribute.startAngle, expectedStartAngle);
+      expectClose(secondPie.attribute.endAngle, expectedEndAngle);
+      expectClose(secondPie.baseAttributes?.startAngle, expectedStartAngle);
+      expectClose(secondPie.baseAttributes?.endAngle, expectedEndAngle);
+      expectClose(getGraphicFinalAttribute(secondPie).startAngle, expectedStartAngle);
+      expectClose(getGraphicFinalAttribute(secondPie).endAngle, expectedEndAngle);
+
+      secondPie.useStates(['hover']);
+      expectClose(secondPie.attribute.startAngle, expectedStartAngle);
+      expectClose(secondPie.attribute.endAngle, expectedEndAngle);
+
+      ticker.tickAt(ticker.getTime() + UPDATE_DURATION + 50);
+
+      expectClose(secondPie.attribute.startAngle, expectedStartAngle);
+      expectClose(secondPie.attribute.endAngle, expectedEndAngle);
+      expectClose(secondPie.baseAttributes?.startAngle, expectedStartAngle);
+      expectClose(secondPie.baseAttributes?.endAngle, expectedEndAngle);
+      expectClose(getGraphicFinalAttribute(secondPie).startAngle, expectedStartAngle);
+      expectClose(getGraphicFinalAttribute(secondPie).endAngle, expectedEndAngle);
+    } finally {
+      chart.release();
+      ticker.release();
+      removeDom(container);
+    }
+  });
+
   it('runs word cloud scaleIn appear from zero scale', () => {
     const { container, dom } = createChartContainer();
     const ticker = createManualTicker();