refactor: extract useDisabled hook to unify disabled handling

- Extract disabled logic into useDisabled hook
- Add type annotations for TypeScript inference
- Extract gap variable in useOffset to avoid duplication

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: 刘欢

src/Slider.tsx

@@ -12,6 +12,7 @@ import Steps from './Steps';
 import Tracks from './Tracks';
 import type { SliderContextProps } from './context';
 import SliderContext from './context';
+import useDisabled from './hooks/useDisabled';
 import useDrag from './hooks/useDrag';
 import useOffset from './hooks/useOffset';
 import useRange from './hooks/useRange';
@@ -189,27 +190,8 @@ const Slider = React.forwardRef<SliderRef, SliderProps<number | number[]>>((prop
   const [mergedValue, setValue] = useControlledState(defaultValue, value);
 
   // ============================ Disabled ============================
-  const disabled = React.useMemo(() => {
-    if (typeof rawDisabled === 'boolean') {
-      return rawDisabled;
-    }
-    if (Array.isArray(rawDisabled)) {
-      const values = Array.isArray(mergedValue) ? mergedValue : [mergedValue];
-      return values.every((_, index) => rawDisabled[index]);
-    }
-    return false;
-  }, [rawDisabled, mergedValue]);
 
-  const isHandleDisabled = React.useCallback(
-    (index: number) => {
-      if (typeof rawDisabled === 'boolean') {
-        return rawDisabled;
-      }
-      // Return individual disabled state if defined, otherwise fallback to global disabled
-      return rawDisabled[index] ?? disabled;
-    },
-    [rawDisabled, disabled],
-  );
+  const [disabled, isHandleDisabled, hasDisabledHandle] = useDisabled(rawDisabled, mergedValue);
 
   const direction = React.useMemo<Direction>(() => {
     if (vertical) {
@@ -221,14 +203,6 @@ const Slider = React.forwardRef<SliderRef, SliderProps<number | number[]>>((prop
   // ============================ Range =============================
   const [rangeEnabled, rangeEditable, rangeDraggableTrack, minCount, maxCount] = useRange(range);
 
-  // Check if any handle is disabled - if so, disable all editable operations
-  const hasDisabledHandle = React.useMemo(() => {
-    if (typeof rawDisabled === 'boolean') {
-      return rawDisabled;
-    }
-    return rawDisabled.some((d) => d);
-  }, [rawDisabled]);
-
   // Disable editable when any handle is disabled
   const effectiveRangeEditable = rangeEditable && !hasDisabledHandle;
 

src/hooks/useDisabled.ts

@@ -0,0 +1,46 @@
+import * as React from 'react';
+
+const useDisabled = (
+  rawDisabled: boolean | boolean[],
+  mergedValue?: number | number[],
+): [boolean, (index: number) => boolean, boolean] => {
+
+  const disabledIsArray = Array.isArray(rawDisabled);
+  const disabledIsBoolean = typeof rawDisabled === 'boolean';
+  const values = React.useMemo(
+    () => (Array.isArray(mergedValue) ? mergedValue : [mergedValue]),
+    [mergedValue],
+  );
+
+  const disabled = React.useMemo(() => {
+    if (disabledIsBoolean) {
+      return rawDisabled;
+    }
+    return disabledIsArray ? values.every((_, index) => rawDisabled[index]) : false;
+  }, [rawDisabled, mergedValue]);
+
+  const isHandleDisabled = React.useCallback(
+    (index: number): boolean => {
+      if (disabledIsBoolean) {
+        return rawDisabled;
+      }
+      return rawDisabled[index] ?? disabled;
+    },
+    [rawDisabled, disabled],
+  );
+
+  const hasDisabledHandle = React.useMemo(() => {
+    if (disabledIsBoolean) {
+      return rawDisabled;
+    }
+    return rawDisabled.some((d) => d);
+  }, [rawDisabled]);
+
+  return [
+    disabled,
+    isHandleDisabled,
+    hasDisabledHandle,
+  ];
+};
+
+export default useDisabled;

src/hooks/useOffset.ts

@@ -190,9 +190,10 @@ export default function useOffset(
     return (pushable === null && dist === 0) || (typeof pushable === 'number' && dist < pushable);
   };
 
+  const gap = typeof pushable === 'number' ? pushable : 0;
+
   // Get the minimum boundary for a handle considering disabled handles as fixed anchors
   const getHandleMinBound = (values: number[], handleIndex: number): number => {
-    const gap = typeof pushable === 'number' ? pushable : 0;
     // Collect min and all left-side disabled handle positions as candidates
     const candidates = [min];
     for (let i = handleIndex - 1; i >= 0; i -= 1) {
@@ -206,7 +207,6 @@ export default function useOffset(
 
   // Get the maximum boundary for a handle considering disabled handles as fixed anchors
   const getHandleMaxBound = (values: number[], handleIndex: number): number => {
-    const gap = typeof pushable === 'number' ? pushable : 0;
     // Collect max and all right-side disabled handle positions as candidates
     const candidates = [max];
     for (let i = handleIndex + 1; i < values.length; i += 1) {