feat: export options types

antvis · Oct 18, 2023 · 9488c04 · 9488c04
1 parent a505b19
commit 9488c04
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 52 deletions.
diff --git a/packages/x6/src/graph/graph.ts b/packages/x6/src/graph/graph.ts
@@ -1309,6 +1309,7 @@ export namespace Graph {
   export import TransformManager = Transform
   export import HighlightManager = Highlight
   export import BackgroundManager = Background
+  export import PanningManager = Panning
 }
 
 export namespace Graph {

diff --git a/packages/x6/src/graph/index.ts b/packages/x6/src/graph/index.ts
@@ -3,3 +3,4 @@ export * from './view'
 export * from './events'
 export * from './transform'
 export * from './background'
+export * from './options'
diff --git a/packages/x6/src/graph/panning.ts b/packages/x6/src/graph/panning.ts
@@ -16,62 +16,31 @@ export class PanningManager extends Base {
   }
 
   protected init() {
+    this.onRightMouseDown = this.onRightMouseDown.bind(this)
     this.startListening()
     this.updateClassName()
   }
 
   protected startListening() {
-    const eventTypes = this.widgetOptions.eventTypes
-    if (!eventTypes) {
-      return
-    }
-    if (eventTypes.includes('leftMouseDown')) {
-      this.graph.on('blank:mousedown', this.preparePanning, this)
-      this.graph.on('node:unhandled:mousedown', this.preparePanning, this)
-      this.graph.on('edge:unhandled:mousedown', this.preparePanning, this)
-    }
-    if (eventTypes.includes('rightMouseDown')) {
-      this.onRightMouseDown = this.onRightMouseDown.bind(this)
-      Dom.Event.on(this.graph.container, 'mousedown', this.onRightMouseDown)
-    }
-    if (eventTypes.includes('mouseWheel')) {
-      this.mousewheelHandle = new Dom.MouseWheelHandle(
-        this.graph.container,
-        this.onMouseWheel.bind(this),
-        this.allowMouseWheel.bind(this),
-      )
-      this.mousewheelHandle.enable()
-    }
+    this.graph.on('blank:mousedown', this.onMouseDown, this)
+    this.graph.on('node:unhandled:mousedown', this.onMouseDown, this)
+    this.graph.on('edge:unhandled:mousedown', this.onMouseDown, this)
+    Dom.Event.on(this.graph.container, 'mousedown', this.onRightMouseDown)
+    this.mousewheelHandle = new Dom.MouseWheelHandle(
+      this.graph.container,
+      this.onMouseWheel.bind(this),
+      this.allowMouseWheel.bind(this),
+    )
+    this.mousewheelHandle.enable()
   }
 
   protected stopListening() {
-    const eventTypes = this.widgetOptions.eventTypes
-    if (!eventTypes) {
-      return
-    }
-    if (eventTypes.includes('leftMouseDown')) {
-      this.graph.off('blank:mousedown', this.preparePanning, this)
-      this.graph.off('node:unhandled:mousedown', this.preparePanning, this)
-      this.graph.off('edge:unhandled:mousedown', this.preparePanning, this)
-    }
-    if (eventTypes.includes('rightMouseDown')) {
-      Dom.Event.off(this.graph.container, 'mousedown', this.onRightMouseDown)
-    }
-    if (eventTypes.includes('mouseWheel')) {
-      if (this.mousewheelHandle) {
-        this.mousewheelHandle.disable()
-      }
-    }
-  }
-
-  protected preparePanning({ e }: { e: Dom.MouseDownEvent }) {
-    const selection = this.graph.getPlugin<any>('selection')
-    const allowRubberband = selection && selection.allowRubberband(e, true)
-    if (
-      this.allowPanning(e, true) ||
-      (this.allowPanning(e) && !allowRubberband)
-    ) {
-      this.startPanning(e)
+    this.graph.off('blank:mousedown', this.onMouseDown, this)
+    this.graph.off('node:unhandled:mousedown', this.onMouseDown, this)
+    this.graph.off('edge:unhandled:mousedown', this.onMouseDown, this)
+    Dom.Event.off(this.graph.container, 'mousedown', this.onRightMouseDown)
+    if (this.mousewheelHandle) {
+      this.mousewheelHandle.disable()
     }
   }
 
@@ -131,22 +100,45 @@ export class PanningManager extends Base {
     }
   }
 
-  protected onRightMouseDown(e: Dom.MouseDownEvent) {
-    if (e.button === 2 && this.allowPanning(e, true)) {
+  protected onMouseDown({ e }: { e: Dom.MouseDownEvent }) {
+    const eventTypes = this.widgetOptions.eventTypes
+    if (!(eventTypes && eventTypes.includes('leftMouseDown'))) {
+      return
+    }
+    const selection = this.graph.getPlugin<any>('selection')
+    const allowRubberband = selection && selection.allowRubberband(e, true)
+    if (
+      this.allowPanning(e, true) ||
+      (this.allowPanning(e) && !allowRubberband)
+    ) {
       this.startPanning(e)
     }
   }
 
-  protected allowMouseWheel(e: WheelEvent) {
-    return this.pannable && !e.ctrlKey
+  protected onRightMouseDown(e: Dom.MouseDownEvent) {
+    const eventTypes = this.widgetOptions.eventTypes
+    if (!(eventTypes && eventTypes.includes('rightMouseDown'))) {
+      return
+    }
+    if (e.button === 2 && this.allowPanning(e, true)) {
+      this.startPanning(e)
+    }
   }
 
   protected onMouseWheel(e: WheelEvent, deltaX: number, deltaY: number) {
+    const eventTypes = this.widgetOptions.eventTypes
+    if (!(eventTypes && eventTypes.includes('mouseWheel'))) {
+      return
+    }
     if (!e.ctrlKey) {
       this.graph.translateBy(-deltaX, -deltaY)
     }
   }
 
+  protected allowMouseWheel(e: WheelEvent) {
+    return this.pannable && !e.ctrlKey
+  }
+
   autoPanning(x: number, y: number) {
     const buffer = 10
     const graphArea = this.graph.getGraphArea()

diff --git a/packages/x6/src/view/node.ts b/packages/x6/src/view/node.ts
@@ -751,6 +751,7 @@ export class NodeView<
       } else {
         const view = candidate.findView(graph) as NodeView
         if (
+          validateEmbeding &&
           FunctionExt.call(validateEmbeding, graph, {
             child: this.cell,
             parent: view.cell,