docs: emit event of behaviors and their callback parameters

docs/api/Event.en.md

@@ -110,13 +110,21 @@ Before and after being called some functions, G6 exports the timing events.
 | afteritemrefresh | Activated after `refreshItem` being called. |
 | beforeitemstatesclear | Activated before `clearItemStates` being called. |
 | afteritemstatesclear | Activated after `clearItemStates` being called. |
+| beforemodechange | Activated before `setMode` / `addBehaviors` / `removeBehaviors` being called. |
+| aftermodechange | Activated after `setMode` / `addBehaviors` / `removeBehaviors` being called. |
 | beforelayout | Activated before graph layout. `render` will layout the graph, so `render` will activate this event as well. |
 | afterlayout | Activated after graph layout being done. `render` will layout the graph, so `render` will activate this event as well.  |
+| afteractivaterelations | Activated while activating a node by `'activate-relations'` Behavior which is assigned to the the instance of Graph. |
+| nodeselectchange | Activated while the selected items are changed by `'brush-select'` or `'click-select'` Behavior which is assigned to the instance of Graph. |
+| itemcollapsed | Activated while a node is clicked to collapse or expand by `'collapse-expand'` Behavior which is assigned to the instance of TreeGraph. |
+| tooltipchange | Activated after the show/hide state is changed by `'tooltip'` or `'edge-tooltip'` Behavior which is assigned to the instance of Graph. |
+| wheelzoom | Activated after the canvas being zoomed by `'zoom-canvas'` Behavior which is assigned to the instance of Graph. |
 
+### Callback Parameters
 
 The callback paramters are different from custom events.
 
-### beforeadditem
+#### beforeadditem
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -124,7 +132,7 @@ The callback paramters are different from custom events.
 | model | Object | The data model of the item to be added. |
 
 
-### afteradditem
+#### afteradditem
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -132,14 +140,14 @@ The callback paramters are different from custom events.
 | model | Object | The data model of the added item. |
 
 
-### beforeremoveitem / afterremoveitem
+#### beforeremoveitem / afterremoveitem
 
 | Name | Type | Description |
 | --- | --- | --- |
 | item | Item | The removed item. |
 
 
-### beforeupdateitem / afterupdateitem
+#### beforeupdateitem / afterupdateitem
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -147,7 +155,7 @@ The callback paramters are different from custom events.
 | model | Object | The data model of the item to be updated. |
 
 
-### beforeitemvisibilitychange / afteritemvisibilitychange
+#### beforeitemvisibilitychange / afteritemvisibilitychange
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -155,7 +163,7 @@ The callback paramters are different from custom events.
 | visible | Boolean | Whether the item is visible. `true` for visible, `false` for invisible. |
 
 
-### beforeitemstatechange / afteritemstatechange
+#### beforeitemstatechange / afteritemstatechange
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -164,7 +172,7 @@ The callback paramters are different from custom events.
 | enabled | Boolean | Wheter the state is enabled. `true` for enabled, `false` for unabled. |
 
 
-### beforeitemstatesclear / afteritemstatesclear
+#### beforeitemstatesclear / afteritemstatesclear
 
 | Name | Type | Description |
 | --- | --- | --- |
@@ -172,8 +180,61 @@ The callback paramters are different from custom events.
 | states | Array / String | The states to be cleared. |
 
 
-### beforeitemrefresh / afteritemrefresh
+#### beforemodechange / aftermodechange
+
+| Name | Type | Description |
+| --- | --- | --- |
+| mode | String | The name of current mode. |
+
+
+#### beforeitemrefresh / afteritemrefresh
 
 | Name | Type | Description |
 | --- | --- | --- |
 | item | Item | The manipulated item. |
+
+
+#### beforelayout / afterlayout
+
+No parameters.
+
+
+#### afteractivaterelations
+
+| Name | Type | Description |
+| --- | --- | --- |
+| item | Item | The manipulated item. |
+| action | String | The name of the manipulation. |
+
+
+#### nodeselectchange
+
+| Name | Type | Description |
+| --- | --- | --- |
+| target | Item | The manipulated item. |
+| selectedItems | Object | All selected items, formed as `{ nodes: [...], edges: [...]}`. |
+
+
+#### itemcollapsed
+
+| Name | Type | Description |
+| --- | --- | --- |
+| item | Item | The manipulated item. |
+| collapsed | Boolean | The collapsed state of the manipulated item after this operation. |
+
+
+#### tooltipchange
+
+| Name | Type | Description |
+| --- | --- | --- |
+| item | Item | The manipulated item. |
+| action | String | The `'show'` or `'hide'` state of this tooltip. |
+
+
+#### wheelzoom
+
+| Name | Type | Description |
+| --- | --- | --- |
+| deltaX | Number | The x-axis direction of the wheel scroll, value is `1`, `0`, or `-1`, where `0` means no scrolling on this direction. |
+| deltaY | Number | The y-axis direction of the wheel scroll, value is `1`, `0`, or `-1`, where `0` means no scrolling on this direction. |
+| ... Other parameters of wheel event. |  |  |

docs/api/Event.zh.md

@@ -110,13 +110,22 @@ order: 6
 | afteritemrefresh | 调用 `refreshItem` 方法之后触发 |
 | beforeitemstatesclear | 调用 `clearItemStates` 方法之前触发 |
 | afteritemstatesclear | 调用 `clearItemStates` 方法之后触发 |
+| beforemodechange | 调用 `setMode` / `addBehaviors` / `removeBehaviors` 方法之前触发 |
+| aftermodechange | 调用 `setMode` / `addBehaviors` / `removeBehaviors` 方法之后触发 |
 | beforelayout | 布局前触发。调用 `render` 时会进行布局，因此 `render` 时会触发。或用户主动调用图的 `layout` 时触发。 |
 | afterlayout | 布局完成后触发。调用 `render` 时会进行布局，因此 `render` 时布局完成后会触发。或用户主动调用图的 `layout` 时布局完成后触发。 |
+| afteractivaterelations | 使用了 `'activate-relations'` Behavior 并触发了该行为后，该事件被触发 |
+| nodeselectchange | 使用了 `'brush-select'` 或 `'click-select'` Behavior 且选中元素发生变化时，该事件被触发 |
+| itemcollapsed | 在 TreeGraph 上使用了 `'collapse-expand'` Behavior 并触发了该行为后，该事件被触发 |
+| tooltipchange | 使用了 `'tooltip'` 或 `'edge-tooltip'` Behavior 且 tooltip 的显示/隐藏被改变后，该事件被触发 |
+| wheelzoom | 使用了 `'zoom-canvas'` Behavior 并用滚轮对图进行缩放后，该事件被触发 |
 
 
-不同自定义事件的回调参数不同，下面针对各个自定义事件的回调参数进行说明。
+### 回调参数
 
-### beforeadditem
+不同时机监听事件的回调参数不同，下面针对各个自定义事件的回调参数进行说明。
+
+#### beforeadditem
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -124,7 +133,7 @@ order: 6
 | model | Object | item 数据模型 |
 
 
-### afteradditem
+#### afteradditem
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -132,14 +141,14 @@ order: 6
 | model | Object | item 数据模型 |
 
 
-### beforeremoveitem / afterremoveitem
+#### beforeremoveitem / afterremoveitem
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
 | item | Item | 要删除的 item 实例 |
 
 
-### beforeupdateitem / afterupdateitem
+#### beforeupdateitem / afterupdateitem
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -147,7 +156,7 @@ order: 6
 | model | Object | item 数据模型 |
 
 
-### beforeitemvisibilitychange / afteritemvisibilitychange
+#### beforeitemvisibilitychange / afteritemvisibilitychange
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -155,7 +164,7 @@ order: 6
 | visible | Boolean | 是否可见，`true` 为可见，`false` 为不可见 |
 
 
-### beforeitemstatechange / afteritemstatechange
+#### beforeitemstatechange / afteritemstatechange
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -164,7 +173,7 @@ order: 6
 | enalbed | Boolean | 状态是否可用，`true` 可用，`false` 不可用 |
 
 
-### beforeitemstatesclear / afteritemstatesclear
+#### beforeitemstatesclear / afteritemstatesclear
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
@@ -172,8 +181,61 @@ order: 6
 | states | Array / String | 需要批量清除的状态 |
 
 
-### beforeitemrefresh / afteritemrefresh
+#### beforemodechange / aftermodechange
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| mode | String | 当前的模式名称 |
+
+
+#### beforeitemrefresh / afteritemrefresh
 
 | 名称 | 类型 | 描述 |
 | --- | --- | --- |
 | item | Item | 当前操作的 item 实例 |
+
+
+#### beforelayout / afterlayout
+
+无参数
+
+
+#### afteractivaterelations
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| item | Item | 当前操作的 item 实例 |
+| action | String | 当前操作名 |
+
+
+#### nodeselectchange
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| target | Item | 当前操作的 item 实例 |
+| selectedItems | Object | 当前被选中的所有 item 实例，形如 `{ nodes: [...], edges: [...]}` |
+
+
+#### itemcollapsed
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| item | Item | 当前操作的 item 实例 |
+| collapsed | Boolean | 当前操作后，操作对象的 collapsed 状态 |
+
+
+#### tooltipchange
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| item | Item | 当前操作的 item 实例 |
+| action | String | tooltip 当前是显示 `'show'` 还是隐藏 `'hide'` |
+
+
+#### wheelzoom
+
+| 名称 | 类型 | 描述 |
+| --- | --- | --- |
+| deltaX | Number | 滚动的 x 方向，取值 `1`，`0`，`-1`，`0` 代表没有该方向的滚动 |
+| deltaY | Number | 滚动的 y 方向，取值 `1`，`0`，`-1`，`0` 代表没有该方向的滚动 |
+| ... 其他滚轮事件的回调参数 |  |  |

docs/manual/middle/elements/nodes/modelRect.en.md

@@ -67,7 +67,7 @@ The [Node Common Properties](/en/docs/manual/middle/elements/nodes/defaultNode/#
 | **logoIcon** | **The left logo icon** | **Object** | **Special property for modelRect** |
 | **stateIcon** | **The right state icon** | **Object** | **Special property for modelRect** |
 | **description** | **The description text below the label** | **String** | **Special property for modelRect** |
-| ~~**descriptionCfg**~~<br/>*It will be supported after V3.3* | ~~**The configuration for description text**~~ | ~~**Object**~~ | ~~**Special property for modelRect**~~ |
+| **descriptionCfg**<br/>*It is supported after V3.3* | **The configuration for description text** | **Object** | **Special property for modelRect** |
 
 
 ```javascript
@@ -152,7 +152,7 @@ const graph = new G6.Graph({
 ```
 
 
-### ~~descriptionCfg~~
+### descriptionCfg
 ⚠️**Attension:** *It will be supported after V3.3.*
 
 `descriptionCfg` is an object to configure the label of the node. The [Node Common Label Configurations](/en/docs/manual/middle/elements/nodes/defaultNode/#label-and-labelcfg) are available. Besides, descriptionCfg has special attribute:

docs/manual/middle/elements/nodes/modelRect.zh.md

@@ -66,7 +66,7 @@ modelRect 节点支持 [节点通用配置](/zh/docs/manual/middle/elements/node
 | **logoIcon** | **左侧的 logo 图标** | **Object** | **modelRect 节点特有** |
 | **stateIcon** | **右侧的状态图标** | **Object** | **modelRect 节点特有** |
 | **description** | **节点主要文本下方的描述文本** | **String** | **modelRect 节点特有** |
-| ~~**descriptionCfg**~~<br/>*将在 V3.3 版本后支持* | ~~**描述文本的配置项**~~ | ~~**Object**~~ | ~~**modelRect 节点特有**~~ |
+| **descriptionCfg**<br/>*在 V3.3 版本后支持* | **描述文本的配置项** | **Object** | **modelRect 节点特有** |
 
 
 ```javascript
@@ -151,7 +151,7 @@ const graph = new G6.Graph({
 ```
 
 
-### ~~描述文本配置 descriptionCfg~~
+### 描述文本配置 descriptionCfg
 ⚠️**注意：** *将在 V3.3 版本后支持。*
 
 Object 类型。通过 `descriptionCfg` 配置标签文本。支持 [节点通用标签配置](/zh/docs/manual/middle/elements/nodes/defaultNode/#标签文本-label-及其配置-labelcfg)。此外，还有一个特殊属性：

examples/case/decisionBubbles/index.zh.md

@@ -3,4 +3,4 @@ title: 图表决策
 order: 1
 ---
 
-这是一个带交互的图表决策图，辅助用户“按使用目的”寻找合适的可视化方式。该 dmeo 结合了自定义节点、自定义边、力导向布局、数据切换、交互等功能，已应用在 AntV 官网。
+这是一个带交互的图表决策图，辅助用户“按使用目的”寻找合适的可视化方式。该 demo 结合了自定义节点、自定义边、力导向布局、数据切换、交互等功能，已应用在 AntV 官网。

package.json

@@ -50,7 +50,7 @@
     "site:develop": "GATSBY=true gatsby develop --open",
     "start": "npm run site:develop",
     "test": "jest",
-    "test-live": "DEBUG_MODE=1 jest --watch  ./tests/unit/plugins/minimap-spec.ts",
+    "test-live": "DEBUG_MODE=1 jest --watch  ./tests/unit/behavior/zoom-spec.ts",
     "lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx",
     "watch": "father build -w"
   },

src/interface/graph.ts

@@ -11,6 +11,8 @@ export interface IModeOption {
   updateEdge?: boolean;
   trigger?: string;
   enableDelegate?: boolean;
+  maxZoom?: number;
+  minZoom?: number;
   shouldUpdate?: (e: IG6GraphEvent) => boolean;
   shouldBegin?: (e: IG6GraphEvent) => boolean;
 }