diff --git a/packages/site/docs/apis/shape/NodeShapeStyles.en.md b/packages/site/docs/apis/shape/NodeShapeStyles.en.md
new file mode 100644
index 0000000000..ceacb6548f
--- /dev/null
+++ b/packages/site/docs/apis/shape/NodeShapeStyles.en.md
@@ -0,0 +1,175 @@
+---
+title: NodeShapeStyles
+---
+
+## keyShape
+
+**Type**: `ShapeStyle`
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: key shape style
+
+## iconShape
+
+**Type**: 
+
+```ts
+Partial<
+  TextStyleProps &
+    ImageStyleProps &
+    ShapeStyle & {
+      offsetX?: number;
+      offsetY?: number;
+      lod?: number;
+    }
+>;
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: icon style
+
+## haloShape
+
+**Type**: `ShapeStyle`
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: halo style
+
+## labelShape
+
+**Type**: 
+
+```ts
+ShapeStyle & {
+    position?: 'top' | 'bottom' | 'left' | 'right' | 'center';
+    offsetX?: number;
+    offsetY?: number;
+    offsetZ?: number;
+    maxWidth?: string | number;
+    angle?: number;
+}
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: label style
+
+## labelBackgroundShape
+
+**Type**: 
+
+```ts
+ShapeStyle & {
+    padding?: number | number[];
+}
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: label background style
+
+## badgeShapes
+
+**Type**: 
+
+```ts
+ShapeStyle & {
+    color?: string;
+    palette?: string[];
+    textColor?: string;
+    [key: number]: ShapeStyle & {
+      position?: IBadgePosition;
+      color?: string;
+      textColor?: string;
+    };
+}
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: badge style
+
+## anchorShapes
+
+**Type**: 
+
+```ts
+ShapeStyle & {
+    color?: string;
+    textColor?: string;
+    size?: number;
+    offsetX?: number;
+    offsetY?: number;
+    offsetZ?: number;
+    [key: number]: ShapeStyle & {
+      position?: BadgePosition;
+      color?: string;
+      textColor?: string;
+      size?: number;
+      offsetX?: number;
+      offsetY?: number;
+      offsetZ?: number;
+    };
+}
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: anchor style
+
+## group
+
+**Type**: `ShapeStyle`
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: group style
+
+## otherShapes
+
+**Type**: 
+
+```ts
+{ [shapeId: string]: ShapeStyle };
+```
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: other shapes style
+
+## animates
+
+**Type**: `IAnimates`
+
+**Default**: `{}`
+
+**Required**: false
+
+**Description**: animates
+
+---
+
+<embed src="../../common/ShapeStyle.en.md"></embed>
+
+<embed src="../../common/Animates.en.md"></embed>
diff --git a/packages/site/docs/apis/shape/NodeShapeStyles.zh.md b/packages/site/docs/apis/shape/NodeShapeStyles.zh.md
new file mode 100644
index 0000000000..7a88a58a05
--- /dev/null
+++ b/packages/site/docs/apis/shape/NodeShapeStyles.zh.md
@@ -0,0 +1,175 @@
+---
+title: NodeShapeStyles
+---
+
+## keyShape
+
+**类型**：`ShapeStyle`
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：关键图形样式
+
+## iconShape
+
+**类型**：
+
+```ts
+Partial<
+  TextStyleProps &
+    ImageStyleProps &
+    ShapeStyle & {
+      offsetX?: number;
+      offsetY?: number;
+      lod?: number;
+    }
+>;
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：图标样式
+
+## haloShape
+
+**类型**：`ShapeStyle`
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：光环样式
+
+## labelShape
+
+**类型**：
+
+```ts
+ShapeStyle & {
+    position?: 'top' | 'bottom' | 'left' | 'right' | 'center';
+    offsetX?: number;
+    offsetY?: number;
+    offsetZ?: number;
+    maxWidth?: string | number;
+    angle?: number;
+}
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：标签样式
+
+## labelBackgroundShape
+
+**类型**：
+
+```ts
+ShapeStyle & {
+    padding?: number | number[];
+}
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：标签背景样式
+
+## badgeShapes
+
+**类型**：
+
+```ts
+ShapeStyle & {
+    color?: string;
+    palette?: string[];
+    textColor?: string;
+    [key: number]: ShapeStyle & {
+      position?: IBadgePosition;
+      color?: string;
+      textColor?: string;
+    };
+}
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：徽标样式
+
+## anchorShapes
+
+**类型**：
+
+```ts
+ShapeStyle & {
+    color?: string;
+    textColor?: string;
+    size?: number;
+    offsetX?: number;
+    offsetY?: number;
+    offsetZ?: number;
+    [key: number]: ShapeStyle & {
+      position?: BadgePosition;
+      color?: string;
+      textColor?: string;
+      size?: number;
+      offsetX?: number;
+      offsetY?: number;
+      offsetZ?: number;
+    };
+}
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：连接桩样式
+
+## group
+
+**类型**：`ShapeStyle`
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：分组样式
+
+## otherShapes
+
+**类型**：
+
+```ts
+{ [shapeId: string]: ShapeStyle };
+```
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：其他图形样式
+
+## animates
+
+**类型**：`IAnimates`
+
+**默认值**：`{}`
+
+**是否必须**：false
+
+**说明**：动画配置
+
+---
+
+<embed src="../../common/ShapeStyle.zh.md"></embed>
+
+<embed src="../../common/Animates.zh.md"></embed>
diff --git a/packages/site/docs/apis/shape/WIP-NodeShapeStyles.en.md b/packages/site/docs/apis/shape/WIP-NodeShapeStyles.en.md
deleted file mode 100644
index 87be3eee3a..0000000000
--- a/packages/site/docs/apis/shape/WIP-NodeShapeStyles.en.md
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: NodeShapeStyles
----
-
-[Overview - v5.0.0-beta.21](../../README.en.md) / [Modules](../../modules.en.md) / [item](../../modules/item.en.md) / NodeShapeStyles
-
-[item](../../modules/item.en.md).NodeShapeStyles
-
-## Hierarchy
-
-- `ItemShapeStyles`
-
-  ↳ **`NodeShapeStyles`**
-
-## Properties
-
-### anchorShapes
-
-• `Optional` **anchorShapes**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `[key: number]`: [`ShapeStyle`](../../modules/item.en.md#shapestyle) & { `color?`: `string` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `position?`: [`BadgePosition`](../../enums/item/BadgePosition.en.md) ; `size?`: `number` ; `textColor?`: `string` }; `color?`: `string` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `size?`: `number` ; `textColor?`: `string` }
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:156](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L156)
-
----
-
-### animates
-
-• `Optional` **animates**: `IAnimates`
-
-#### Inherited from
-
-ItemShapeStyles.animates
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:169](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L169)
-
----
-
-### badgeShapes
-
-• `Optional` **badgeShapes**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `[key: number]`: [`ShapeStyle`](../../modules/item.en.md#shapestyle) & { `color?`: `string` ; `position?`: [`IBadgePosition`](../../modules/item.en.md#ibadgeposition) ; `textColor?`: `string` }; `color?`: `string` ; `palette?`: `string`[] ; `textColor?`: `string` }
-
-Style of the badges to show on the node.
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:136](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L136)
-
----
-
-### group
-
-• `Optional` **group**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.group
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:165](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L165)
-
----
-
-### haloShape
-
-• `Optional` **haloShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.haloShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:164](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L164)
-
----
-
-### iconShape
-
-• `Optional` **iconShape**: `Partial`<[`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `lod?`: `number` ; `offsetX?`: `number` ; `offsetY?`: `number` }\>
-
-#### Inherited from
-
-ItemShapeStyles.iconShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:155](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L155)
-
----
-
-### keyShape
-
-• `Optional` **keyShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.keyShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:154](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L154)
-
----
-
-### labelBackgroundShape
-
-• `Optional` **labelBackgroundShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `padding?`: `number` \| `number`[] }
-
-The background style of the label
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:130](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L130)
-
----
-
-### labelShape
-
-• `Optional` **labelShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.en.md) & [`RectStyleProps`](RectStyleProps.en.md) & [`EllipseStyleProps`](EllipseStyleProps.en.md) & [`PolygonStyleProps`](PolygonStyleProps.en.md) & [`LineStyleProps`](LineStyleProps.en.md) & [`PolylineStyleProps`](PolylineStyleProps.en.md) & [`TextStyleProps`](TextStyleProps.en.md) & [`ImageStyleProps`](ImageStyleProps.en.md) & [`PathStyleProps`](PathStyleProps.en.md) & [`SphereGeometryProps`](SphereGeometryProps.en.md) & [`CubeGeometryProps`](CubeGeometryProps.en.md) & [`PlaneGeometryProps`](PlaneGeometryProps.en.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `angle?`: `number` ; `maxWidth?`: `string` \| `number` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `position?`: `"center"` \| `"left"` \| `"right"` \| `"top"` \| `"bottom"` }
-
-Style of the text to show on the node.
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:100](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L100)
-
----
-
-### otherShapes
-
-• `Optional` **otherShapes**: `Object`
-
-#### Index signature
-
-▪ [shapeId: `string`]: [`ShapeStyle`](../../modules/item.en.md#shapestyle)
-
-#### Inherited from
-
-ItemShapeStyles.otherShapes
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:166](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L166)
diff --git a/packages/site/docs/apis/shape/WIP-NodeShapeStyles.zh.md b/packages/site/docs/apis/shape/WIP-NodeShapeStyles.zh.md
deleted file mode 100644
index 1a2ddcff47..0000000000
--- a/packages/site/docs/apis/shape/WIP-NodeShapeStyles.zh.md
+++ /dev/null
@@ -1,149 +0,0 @@
----
-title: NodeShapeStyles
----
-
-> 📋 中文文档还在翻译中... 欢迎 PR
-
-[Overview - v5.0.0-beta.21](../../README.zh.md) / [Modules](../../modules.zh.md) / [item](../../modules/item.zh.md) / NodeShapeStyles
-
-[item](../../modules/item.zh.md).NodeShapeStyles
-
-## Hierarchy
-
-- `ItemShapeStyles`
-
-  ↳ **`NodeShapeStyles`**
-
-## Properties
-
-### anchorShapes
-
-• `Optional` **anchorShapes**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `[key: number]`: [`ShapeStyle`](../../modules/item.zh.md#shapestyle) & { `color?`: `string` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `position?`: [`BadgePosition`](../../enums/item/BadgePosition.zh.md) ; `size?`: `number` ; `textColor?`: `string` }; `color?`: `string` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `size?`: `number` ; `textColor?`: `string` }
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:156](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L156)
-
----
-
-### animates
-
-• `Optional` **animates**: `IAnimates`
-
-#### Inherited from
-
-ItemShapeStyles.animates
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:169](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L169)
-
----
-
-### badgeShapes
-
-• `Optional` **badgeShapes**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `[key: number]`: [`ShapeStyle`](../../modules/item.zh.md#shapestyle) & { `color?`: `string` ; `position?`: [`IBadgePosition`](../../modules/item.zh.md#ibadgeposition) ; `textColor?`: `string` }; `color?`: `string` ; `palette?`: `string`[] ; `textColor?`: `string` }
-
-Style of the badges to show on the node.
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:136](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L136)
-
----
-
-### group
-
-• `Optional` **group**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.group
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:165](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L165)
-
----
-
-### haloShape
-
-• `Optional` **haloShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.haloShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:164](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L164)
-
----
-
-### iconShape
-
-• `Optional` **iconShape**: `Partial`<[`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `lod?`: `number` ; `offsetX?`: `number` ; `offsetY?`: `number` }\>
-
-#### Inherited from
-
-ItemShapeStyles.iconShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:155](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L155)
-
----
-
-### keyShape
-
-• `Optional` **keyShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\>
-
-#### Inherited from
-
-ItemShapeStyles.keyShape
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:154](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L154)
-
----
-
-### labelBackgroundShape
-
-• `Optional` **labelBackgroundShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `padding?`: `number` \| `number`[] }
-
-The background style of the label
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:130](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L130)
-
----
-
-### labelShape
-
-• `Optional` **labelShape**: `Partial`<[`CircleStyleProps`](CircleStyleProps.zh.md) & [`RectStyleProps`](RectStyleProps.zh.md) & [`EllipseStyleProps`](EllipseStyleProps.zh.md) & [`PolygonStyleProps`](PolygonStyleProps.zh.md) & [`LineStyleProps`](LineStyleProps.zh.md) & [`PolylineStyleProps`](PolylineStyleProps.zh.md) & [`TextStyleProps`](TextStyleProps.zh.md) & [`ImageStyleProps`](ImageStyleProps.zh.md) & [`PathStyleProps`](PathStyleProps.zh.md) & [`SphereGeometryProps`](SphereGeometryProps.zh.md) & [`CubeGeometryProps`](CubeGeometryProps.zh.md) & [`PlaneGeometryProps`](PlaneGeometryProps.zh.md) & { `interactive?`: `boolean` } & { `animates?`: `IAnimates` ; `lod?`: `number` ; `visible?`: `boolean` }\> & { `angle?`: `number` ; `maxWidth?`: `string` \| `number` ; `offsetX?`: `number` ; `offsetY?`: `number` ; `offsetZ?`: `number` ; `position?`: `"center"` \| `"left"` \| `"right"` \| `"top"` \| `"bottom"` }
-
-Style of the text to show on the node.
-
-#### Defined in
-
-[packages/g6/src/types/node.ts:100](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/node.ts#L100)
-
----
-
-### otherShapes
-
-• `Optional` **otherShapes**: `Object`
-
-#### Index signature
-
-▪ [shapeId: `string`]: [`ShapeStyle`](../../modules/item.zh.md#shapestyle)
-
-#### Inherited from
-
-ItemShapeStyles.otherShapes
-
-#### Defined in
-
-[packages/g6/src/types/item.ts:166](https://github.com/antvis/G6/blob/61e525e59b/packages/g6/src/types/item.ts#L166)
diff --git a/packages/site/docs/common/Animates.en.md b/packages/site/docs/common/Animates.en.md
new file mode 100644
index 0000000000..6f9943520b
--- /dev/null
+++ b/packages/site/docs/common/Animates.en.md
@@ -0,0 +1,19 @@
+```ts
+interface IAnimates {
+  buildIn?: IAnimate[];
+  buildOut?: IAnimate[];
+  show?: IAnimate[];
+  hide?: IAnimate[];
+  update?: (IAnimate | IStateAnimate)[];
+}
+
+interface IAnimate {
+  fields?: string[];
+  shapeId?: string;
+  order?: number;
+  duration?: number;
+  iterations?: number;
+  easing?: string;
+  delay?: number;
+}
+```
diff --git a/packages/site/docs/common/Animates.zh.md b/packages/site/docs/common/Animates.zh.md
new file mode 100644
index 0000000000..6f9943520b
--- /dev/null
+++ b/packages/site/docs/common/Animates.zh.md
@@ -0,0 +1,19 @@
+```ts
+interface IAnimates {
+  buildIn?: IAnimate[];
+  buildOut?: IAnimate[];
+  show?: IAnimate[];
+  hide?: IAnimate[];
+  update?: (IAnimate | IStateAnimate)[];
+}
+
+interface IAnimate {
+  fields?: string[];
+  shapeId?: string;
+  order?: number;
+  duration?: number;
+  iterations?: number;
+  easing?: string;
+  delay?: number;
+}
+```
diff --git a/packages/site/docs/common/GShapeStyle.en.md b/packages/site/docs/common/GShapeStyle.en.md
new file mode 100644
index 0000000000..dc5ee6ba71
--- /dev/null
+++ b/packages/site/docs/common/GShapeStyle.en.md
@@ -0,0 +1,31 @@
+```ts
+type GShapeStyle =
+  | CircleStyleProps
+  | RectStyleProps
+  | EllipseStyleProps
+  | PolygonStyleProps
+  | LineStyleProps
+  | PolylineStyleProps
+  | TextStyleProps
+  | ImageStyleProps
+  | PathStyleProps
+  | SphereGeometryProps
+  | CubeGeometryProps
+  | PlaneGeometryProps
+  | {
+      interactive?: boolean,
+    };
+```
+
+- [CircleStyleProps]('../apis/shape/CircleStyleProps.en.md')
+- [RectStyleProps]('../apis/shape/RectStyleProps.en.md')
+- [EllipseStyleProps]('../apis/shape/EllipseStyleProps.en.md')
+- [PolygonStyleProps]('../apis/shape/PolygonStyleProps.en.md')
+- [LineStyleProps]('../apis/shape/LineStyleProps.en.md')
+- [PolylineStyleProps]('../apis/shape/PolylineStyleProps.en.md')
+- [TextStyleProps]('../apis/shape/TextStyleProps.en.md')
+- [ImageStyleProps]('../apis/shape/ImageStyleProps.en.md')
+- [PathStyleProps]('../apis/shape/PathStyleProps.en.md')
+- [SphereGeometryProps]('../apis/shape/SphereGeometryProps.en.md')
+- [CubeGeometryProps]('../apis/shape/CubeGeometryProps.en.md')
+- [PlaneGeometryProps]('../apis/shape/PlaneGeometryProps.en.md')
\ No newline at end of file
diff --git a/packages/site/docs/common/GShapeStyle.zh.md b/packages/site/docs/common/GShapeStyle.zh.md
new file mode 100644
index 0000000000..523a3bf061
--- /dev/null
+++ b/packages/site/docs/common/GShapeStyle.zh.md
@@ -0,0 +1,28 @@
+```ts
+type GShape =
+  | CircleStyleProps
+  | RectStyleProps
+  | EllipseStyleProps
+  | PolygonStyleProps
+  | LineStyleProps
+  | PolylineStyleProps
+  | TextStyleProps
+  | ImageStyleProps
+  | PathStyleProps
+  | SphereGeometryProps
+  | CubeGeometryProps
+  | PlaneGeometryProps;
+```
+
+- [CircleStyleProps](../apis/shape/CircleStyleProps.zh.md)
+- [RectStyleProps](../apis/shape/RectStyleProps.zh.md)
+- [EllipseStyleProps](../apis/shape/EllipseStyleProps.zh.md)
+- [PolygonStyleProps](../apis/shape/PolygonStyleProps.zh.md)
+- [LineStyleProps](../apis/shape/LineStyleProps.zh.md)
+- [PolylineStyleProps](../apis/shape/PolylineStyleProps.zh.md)
+- [TextStyleProps](../apis/shape/TextStyleProps.zh.md)
+- [ImageStyleProps](../apis/shape/ImageStyleProps.zh.md)
+- [PathStyleProps](../apis/shape/PathStyleProps.zh.md)
+- [SphereGeometryProps](../apis/shape/SphereGeometryProps.zh.md)
+- [CubeGeometryProps](../apis/shape/CubeGeometryProps.zh.md)
+- [PlaneGeometryProps](../apis/shape/PlaneGeometryProps.zh.md)
diff --git a/packages/site/docs/common/ShapeStyle.en.md b/packages/site/docs/common/ShapeStyle.en.md
new file mode 100644
index 0000000000..a912feb297
--- /dev/null
+++ b/packages/site/docs/common/ShapeStyle.en.md
@@ -0,0 +1,11 @@
+```ts
+type ShapeStyle = Partial<
+  GShapeStyle & {
+    animates?: IAnimates;
+    lod?: number | 'auto';
+    visible?: boolean;
+  } & {
+    clipCfg?: ClipCfg;
+  }
+>;
+```
\ No newline at end of file
diff --git a/packages/site/docs/common/ShapeStyle.zh.md b/packages/site/docs/common/ShapeStyle.zh.md
new file mode 100644
index 0000000000..424378d45c
--- /dev/null
+++ b/packages/site/docs/common/ShapeStyle.zh.md
@@ -0,0 +1,13 @@
+```ts
+type ShapeStyle = Partial<
+  GShapeStyle & {
+    animates?: IAnimates;
+    lod?: number | 'auto';
+    visible?: boolean;
+  } & {
+    clipCfg?: ClipCfg;
+  }
+>;
+```
+
+<embed src="./GShapeStyle.zh.md"></embed>