diff --git a/packages/x6-plugin-selection/src/index.ts b/packages/x6-plugin-selection/src/index.ts index 8554fe2e256..3e7dba6fc2b 100644 --- a/packages/x6-plugin-selection/src/index.ts +++ b/packages/x6-plugin-selection/src/index.ts @@ -320,11 +320,7 @@ export class Selection } protected onBlankMouseDown({ e }: EventArgs['blank:mousedown']) { - const eventTypes = this.options.eventTypes - if ( - !(eventTypes && eventTypes.includes('leftMouseDown') && e.button === 0) && - !(eventTypes && eventTypes.includes('mouseWheelDown') && e.button === 1) - ) { + if (!this.allowBlankMouseDown(e)) { return } @@ -339,6 +335,14 @@ export class Selection } } + protected allowBlankMouseDown(e: Dom.MouseDownEvent) { + const eventTypes = this.options.eventTypes + return ( + (eventTypes?.includes('leftMouseDown') && e.button === 0) || + (eventTypes?.includes('mouseWheelDown') && e.button === 1) + ) + } + protected onBlankClick() { this.clean() } diff --git a/packages/x6/src/graph/panning.ts b/packages/x6/src/graph/panning.ts index 03b8fc99eff..26e67fb9945 100644 --- a/packages/x6/src/graph/panning.ts +++ b/packages/x6/src/graph/panning.ts @@ -101,13 +101,10 @@ export class PanningManager extends Base { } protected onMouseDown({ e }: { e: Dom.MouseDownEvent }) { - const eventTypes = this.widgetOptions.eventTypes - if ( - !(eventTypes && eventTypes.includes('leftMouseDown') && e.button === 0) && - !(eventTypes && eventTypes.includes('mouseWheelDown') && e.button === 1) - ) { + if (!this.allowBlankMouseDown(e)) { return } + const selection = this.graph.getPlugin('selection') const allowRubberband = selection && selection.allowRubberband(e, true) if ( @@ -120,17 +117,17 @@ export class PanningManager extends Base { protected onRightMouseDown(e: Dom.MouseDownEvent) { const eventTypes = this.widgetOptions.eventTypes - if (!(eventTypes && eventTypes.includes('rightMouseDown'))) { + if (!(eventTypes?.includes('rightMouseDown') && e.button === 2)) { return } - if (e.button === 2 && this.allowPanning(e, true)) { + if (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'))) { + if (!eventTypes?.includes('mouseWheel')) { return } if (!e.ctrlKey) { @@ -138,6 +135,14 @@ export class PanningManager extends Base { } } + protected allowBlankMouseDown(e: Dom.MouseDownEvent) { + const eventTypes = this.widgetOptions.eventTypes + return ( + (eventTypes?.includes('leftMouseDown') && e.button === 0) || + (eventTypes?.includes('mouseWheelDown') && e.button === 1) + ) + } + protected allowMouseWheel(e: WheelEvent) { return this.pannable && !e.ctrlKey }