fix conflicts

BouyguesTelecom · Nov 25, 2024 · 8943490 · 8943490
2 parents 5e9e664 + 8415d60
commit 8943490
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/packages/react/components/range/Range.tsx b/packages/react/components/range/Range.tsx
@@ -68,6 +68,7 @@ const Range = React.forwardRef(
             className={hashClass(clsx('range-cursor range-cursor-min'))}
             onMouseUp={handleMouseUpMin}
             onChange={handleChangeCursorMin}
+            onTouchEnd={handleMouseUpMin}
             value={cursorMin}
             type='range'
             min={min}
@@ -81,6 +82,7 @@ const Range = React.forwardRef(
             className={hashClass(clsx('range-cursor range-cursor-max'))}
             onMouseUp={handleMouseUpMax}
             onChange={handleChangeCursorMax}
+            onTouchEnd={handleMouseUpMax}
             value={cursorMax}
             type='range'
             min={min}

diff --git a/packages/react/components/range/hook/useRange.tsx b/packages/react/components/range/hook/useRange.tsx
@@ -27,21 +27,20 @@ export const useRange = ({
   try {
     const [cursorMin, setCursorMin] = React.useState<number>(valueCursorMin ?? 0)
     const [cursorMax, setCursorMax] = React.useState<number>(valueCursorMax ?? max)
-
     const refTrack = React.useRef(null)
 
     const handleChangeCursorMin = React.useCallback(
       (e: React.ChangeEvent<HTMLInputElement>) => {
         if (Number(e.target.value) < cursorMax - gap) setCursorMin(Number(e.target.value))
       },
-      [cursorMax, cursorMin],
+      [cursorMax, cursorMin, gap],
     )
 
     const handleChangeCursorMax = React.useCallback(
       (e: React.ChangeEvent<HTMLInputElement>) => {
         if (Number(e.target.value) > cursorMin + gap) setCursorMax(Number(e.target.value))
       },
-      [cursorMax, cursorMin],
+      [cursorMax, cursorMin, gap],
     )
 
     const handleMouseUpMin = React.useCallback(() => {
@@ -71,15 +70,15 @@ export const useRange = ({
           TrilogyColor.MAIN_FADE,
         )} ${(cursorMax / max) * 100}%, ${getColorStyle(TrilogyColor.NEUTRAL_FADE)} ${(cursorMax / max) * 100}%) `
       }
-    }, [cursorMin, cursorMax])
+    }, [cursorMin, cursorMax, refTrack, max])
 
     React.useEffect(() => {
       setCursorMin(valueCursorMin || 0)
     }, [valueCursorMin])
 
     React.useEffect(() => {
       setCursorMax(valueCursorMax || max)
-    }, [valueCursorMax])
+    }, [valueCursorMax, max])
 
     return {
       refTrack,