Merge pull request #4188 from VisActor/fix/fix-type-error-of-react-vchart

Fix/fix type error of react vchart

Author: xuefei1313

common/changes/@visactor/vchart/fix-fix-type-error-of-react-vchart_2025-09-09-08-55.json

@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "fix: fix the issue of className miss in react-vchart\n\n",
+      "type": "none",
+      "packageName": "@visactor/vchart"
+    }
+  ],
+  "packageName": "@visactor/vchart",
+  "email": "lixuef1313@163.com"
+}

packages/react-vchart/src/charts/BaseChart.tsx

@@ -43,7 +43,8 @@ export interface BaseChartProps
     DimensionEventProps,
     HierarchyEventProps,
     ChartLifeCycleEventProps,
-    IReactTooltipProps {
+    IReactTooltipProps,
+    ContainerProps {
   vchartConstructor?: IVChartConstructor;
   /**  @deprecated 请使用 vchartConstructor  */
   vchartConstrouctor?: IVChartConstructor;

packages/react-vchart/src/containers/withContainer.tsx

@@ -1,11 +1,12 @@
+import type { StringOrNumber } from '@visactor/vchart';
 import React, { useRef, useState, useLayoutEffect } from 'react';
 
 export interface ContainerProps {
   style?: React.CSSProperties;
   className?: string;
   width?: number | string;
   height?: number | string;
-  id?: string;
+  id?: StringOrNumber;
 }
 
 export default function withContainer<P extends ContainerProps>(
@@ -25,7 +26,7 @@ export default function withContainer<P extends ContainerProps>(
     return (
       <div
         ref={container}
-        id={id}
+        id={id?.toString()}
         className={className}
         style={{
           position: 'relative',