From 169365f6b74fc7eacd9bc33753619175141012e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Mon, 22 Jul 2024 20:18:09 +0800
Subject: [PATCH 1/2] fix: should not draggable if controlled

---
 docs/examples/multiple.tsx | 2 +-
 src/hooks/useDrag.ts       | 5 ++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/docs/examples/multiple.tsx b/docs/examples/multiple.tsx
index 5f5e96301..73fd94ada 100644
--- a/docs/examples/multiple.tsx
+++ b/docs/examples/multiple.tsx
@@ -31,7 +31,7 @@ export default () => {
           value={value}
           onChange={(nextValue) => {
             // console.log('>>>', nextValue);
-            setValue(nextValue as any);
+            // setValue(nextValue as any);
           }}
           activeHandleRender={(node) => <NodeWrapper>{node}</NodeWrapper>}
           styles={{
diff --git a/src/hooks/useDrag.ts b/src/hooks/useDrag.ts
index 7413ff0df..515e74cad 100644
--- a/src/hooks/useDrag.ts
+++ b/src/hooks/useDrag.ts
@@ -207,7 +207,10 @@ function useDrag(
     });
 
     const maxDiffCount = editable ? 1 : 0;
-    const diffCount: number = Object.values(counts).reduce((prev, next) => prev + next, 0);
+    const diffCount: number = Object.values(counts).reduce(
+      (prev, next) => prev + Math.abs(next),
+      0,
+    );
 
     return diffCount <= maxDiffCount ? cacheValues : rawValues;
   }, [rawValues, cacheValues, editable]);

From 6b67c078377dc7c1b3cf27f3f6277d0ba06cb2aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Mon, 22 Jul 2024 20:23:14 +0800
Subject: [PATCH 2/2] test: update test case

---
 tests/Range.test.tsx | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/tests/Range.test.tsx b/tests/Range.test.tsx
index 6f7d5a220..616a3465f 100644
--- a/tests/Range.test.tsx
+++ b/tests/Range.test.tsx
@@ -199,6 +199,18 @@ describe('Range', () => {
     expect(container.getElementsByClassName('rc-slider-handle')).toHaveLength(2);
   });
 
+  it('not moved if controlled', () => {
+    const onChange = jest.fn();
+    const { container } = render(<Slider range value={[2, 4, 6]} onChange={onChange} />);
+    doMouseMove(container, 0, 9999999);
+
+    expect(onChange).toHaveBeenCalled();
+
+    expect(container.querySelector('.rc-slider-handle-dragging')).toHaveStyle({
+      left: '2%',
+    });
+  });
+
   // Not trigger onChange anymore
   // it('should only update bounds that are out of range', () => {
   //   const props = { min: 0, max: 10000, value: [0.01, 10000], onChange: jest.fn() };