add margin to hold duration

zeriontech · Jul 8, 2024 · 02a25a0 · 02a25a0
1 parent 782e699
commit 02a25a0
Showing 1 changed file with 2 additions and 1 deletion.
diff --git a/src/ui/ui-kit/Button/HoldableButton.tsx b/src/ui/ui-kit/Button/HoldableButton.tsx
@@ -47,6 +47,7 @@ const ACTIVE_BACKGROUND_COLOR: Record<Kind, string> = {
 const SHORT_PRESS_DURATION = 200;
 const HINT_SHOW_DURATION = 1500;
 const HINT_SHOW_MIN_BREAK = 2000;
+const HOLD_DURATION_MARGIN = 100;
 
 const ButtonElement = <As extends ElementType = 'button'>(
   {
@@ -104,7 +105,7 @@ const ButtonElement = <As extends ElementType = 'button'>(
     holdTimerRef.current = setTimeout(() => {
       realButtonRef.current?.click();
       setInnerState('idle');
-    }, holdDuration);
+    }, holdDuration + HOLD_DURATION_MARGIN);
   }, [holdDuration]);
 
   const handleMouseUp = useCallback(() => {