From 064f4daa88588255e2328dc64294e2e11644aea1 Mon Sep 17 00:00:00 2001
From: Stamen Stoychev <SStoychev@infragistics.com>
Date: Tue, 1 Apr 2025 10:19:37 +0300
Subject: [PATCH] fix(timepicker): allowing better scroll on touchpads #6292

---
 .../lib/time-picker/time-picker.directives.ts | 31 +++++++++++++++----
 1 file changed, 25 insertions(+), 6 deletions(-)

diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts
index dc416613062..eda74acff65 100644
--- a/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts
+++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts
@@ -34,6 +34,14 @@ export class IgxItemListDirective implements OnInit, OnDestroy {
 
     public isActive: boolean;
 
+    private readonly SCROLL_THRESHOLD = 15;
+    private readonly PAN_THRESHOLD = 10;
+
+    /**
+     * accumulates wheel scrolls and triggers a change action above SCROLL_THRESHOLD
+     */
+    private scrollAccumulator = 0;
+
     constructor(
         @Inject(IGX_TIME_PICKER_COMPONENT) public timePicker: IgxTimePickerBase,
         private elementRef: ElementRef,
@@ -170,9 +178,10 @@ export class IgxItemListDirective implements OnInit, OnDestroy {
         event.preventDefault();
         event.stopPropagation();
 
-        const delta = event.deltaY;
-        if (delta !== 0) {
-            this.nextItem(delta);
+        this.scrollAccumulator += event.deltaY;
+        if (Math.abs(this.scrollAccumulator) > this.SCROLL_THRESHOLD) {
+            this.nextItem(this.scrollAccumulator);
+            this.scrollAccumulator = 0;
         }
     }
 
@@ -180,14 +189,24 @@ export class IgxItemListDirective implements OnInit, OnDestroy {
      * @hidden @internal
      */
     public ngOnInit() {
-        const hammerOptions: HammerOptions = { recognizers: [[HammerGesturesManager.Hammer?.Pan, { direction: HammerGesturesManager.Hammer?.DIRECTION_VERTICAL, threshold: 10 }]] };
+        const hammerOptions: HammerOptions = {
+            recognizers: [
+                [
+                    HammerGesturesManager.Hammer?.Pan,
+                    {
+                        direction: HammerGesturesManager.Hammer?.DIRECTION_VERTICAL,
+                        threshold: this.PAN_THRESHOLD
+                    }
+                ]
+            ]
+        };
         this.touchManager.addEventListener(this.elementRef.nativeElement, 'pan', this.onPanMove, hammerOptions);
     }
 
     /**
      * @hidden @internal
      */
-     public ngOnDestroy() {
+    public ngOnDestroy() {
         this.touchManager.destroy();
     }
 
@@ -355,7 +374,7 @@ export class IgxTimeItemDirective {
     private getHourPart(date: Date): string {
         const inputDateParts = DateTimeUtil.parseDateTimeFormat(this.timePicker.appliedFormat);
         const hourPart = inputDateParts.find(element => element.type === 'hours');
-        const ampmPart = inputDateParts.find(element =>element.format.indexOf('a') !== -1 || element.format === 'tt');
+        const ampmPart = inputDateParts.find(element => element.format.indexOf('a') !== -1 || element.format === 'tt');
         const hour = DateTimeUtil.getPartValue(date, hourPart, hourPart.format.length);
         if (ampmPart) {
             const ampm = DateTimeUtil.getPartValue(date, ampmPart, ampmPart.format.length);