From f75d09f656e9d30f302a21662ffe2c9ad15e52a3 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Thu, 22 Aug 2024 17:22:06 +0800
Subject: [PATCH] fix(Split): mask not removed after drag (#4122)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* refactor: 更新遮罩逻辑

* chore: bump version 8.8.4-beta05
---
 src/BootstrapBlazor/BootstrapBlazor.csproj          |  2 +-
 src/BootstrapBlazor/Components/Split/Split.razor.js | 13 +++++--------
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
index 9a96b1cfdd4..fbf39772fda 100644
--- a/src/BootstrapBlazor/BootstrapBlazor.csproj
+++ b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>8.8.4-beta04</Version>
+    <Version>8.8.4-beta05</Version>
   </PropertyGroup>
 
   <ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">
diff --git a/src/BootstrapBlazor/Components/Split/Split.razor.js b/src/BootstrapBlazor/Components/Split/Split.razor.js
index d90532a248f..392aed0bfa7 100644
--- a/src/BootstrapBlazor/Components/Split/Split.razor.js
+++ b/src/BootstrapBlazor/Components/Split/Split.razor.js
@@ -24,9 +24,6 @@ export function init(id) {
     const splitRight = splitWrapper.children[2];
 
     split.splitBar = splitBar;
-    EventHandler.on(splitBar, 'mousedown', e => showMask(splitLeft, splitRight));
-    EventHandler.on(splitBar, 'mouseup', e => removeMask(splitLeft, splitRight));
-
     Drag.drag(splitBar,
         e => {
             splitWidth = el.offsetWidth
@@ -39,7 +36,8 @@ export function init(id) {
                 originX = e.clientX || e.touches[0].clientX
                 curVal = splitLeft.offsetWidth * 100 / splitWidth
             }
-            el.classList.add('dragging')
+            el.classList.add('dragging');
+            showMask(splitLeft, splitRight);
         },
         e => {
             if (isVertical) {
@@ -58,7 +56,8 @@ export function init(id) {
             splitRight.style.flexBasis = `${100 - newVal}%`
         },
         () => {
-            el.classList.remove('dragging')
+            el.classList.remove('dragging');
+            removeMask(splitLeft, splitRight);
         })
 }
 
@@ -89,9 +88,7 @@ export function dispose(id) {
     Data.remove(id)
 
     if (split) {
-        const { el, splitBar } = split;
-        EventHandler.on(splitBar, 'mousedown');
-        EventHandler.on(splitBar, 'mouseup');
+        const { el } = split;
         Drag.dispose(el)
     }
 }