From 6decb75c8597ef705194cd79fc202fc09436ce3b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=82=ACalix?= <qq287649920@gmail.com>
Date: Wed, 24 Jan 2024 14:17:50 +0800
Subject: [PATCH] feat: selection's pointerEvents support function type (#4067)

* feat: selection's pointerEvents support function type

* fix: extracting function getPointerEventsValue

---------

Co-authored-by: yuyang <yuyang@antiy.cn>
---
 packages/x6-plugin-selection/src/selection.ts | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/x6-plugin-selection/src/selection.ts b/packages/x6-plugin-selection/src/selection.ts
index 243b604e422..349e846509a 100644
--- a/packages/x6-plugin-selection/src/selection.ts
+++ b/packages/x6-plugin-selection/src/selection.ts
@@ -126,7 +126,7 @@ export class SelectionImpl extends View<SelectionImpl.EventArgs> {
     const { ui, selection, translateBy, snapped } = options
 
     const allowTranslating =
-      (showNodeSelectionBox !== true || pointerEvents === 'none') &&
+      (showNodeSelectionBox !== true || (pointerEvents && this.getPointerEventsValue(pointerEvents) === 'none')) &&
       !this.translating &&
       !selection
 
@@ -807,6 +807,12 @@ export class SelectionImpl extends View<SelectionImpl.EventArgs> {
     )
   }
 
+  protected getPointerEventsValue(pointerEvents: 'none' | 'auto' | ((cells: Cell[]) => 'none' | 'auto')) {
+    return typeof pointerEvents === 'string'
+      ? pointerEvents
+      : pointerEvents(this.cells)
+  }
+
   protected createSelectionBox(cell: Cell) {
     this.addCellSelectedClassName(cell)
 
@@ -819,6 +825,7 @@ export class SelectionImpl extends View<SelectionImpl.EventArgs> {
 
         const className = this.boxClassName
         const box = document.createElement('div')
+        const pointerEvents = this.options.pointerEvents
         Dom.addClass(box, className)
         Dom.addClass(box, `${className}-${cell.isNode() ? 'node' : 'edge'}`)
         Dom.attr(box, 'data-cell-id', cell.id)
@@ -828,7 +835,9 @@ export class SelectionImpl extends View<SelectionImpl.EventArgs> {
           top: bbox.y,
           width: bbox.width,
           height: bbox.height,
-          pointerEvents: this.options.pointerEvents || 'auto',
+          pointerEvents: pointerEvents
+            ? this.getPointerEventsValue(pointerEvents)
+            : 'auto',
         })
         Dom.appendTo(box, this.container)
         this.showSelected()
@@ -978,7 +987,7 @@ export namespace SelectionImpl {
     rubberEdge?: boolean
 
     // Whether to respond event on the selectionBox
-    pointerEvents?: 'none' | 'auto'
+    pointerEvents?: 'none' | 'auto' | ((cells: Cell[]) => 'none' | 'auto')
 
     // with which mouse button the selection can be started
     eventTypes?: SelectionEventType[]