ngx-kit 9.2.4 → 9.3.1

package/core/README.md

@@ -65,29 +65,8 @@ const browser = inject(BrowserService);
 browser.prefersDarkMode; // boolean — read once at service construction time
 ```
 
-## Utilities
 
-### `startDragSession(callbacks)`
 
-Replaces the problematic `@HostListener('document:mousemove', ...)` pattern, which keeps a listener attached to `document` for the entire lifetime of the component — even when nothing is being dragged (a real performance issue on pages with many simultaneous instances). This function only adds a listener for the duration of an actual drag and removes it itself; `touchmove` is handled with `{passive: false}`, so dragging on mobile doesn't also scroll the page.
-
-```ts
-import { startDragSession } from 'ngx-kit/core';
-
-let stop: (() => void) | undefined;
-
-function onPointerDown(ev: MouseEvent | TouchEvent) {
-  stop?.();
-  stop = startDragSession({
-    onMove: (ev) => {
-      /* update position */
-    },
-    onEnd: () => {
-      stop = undefined;
-    },
-  });
-}
-```
 
 > If your component is `OnPush` and uses `startDragSession` (instead of `@HostListener`), make sure to call `ChangeDetectorRef.markForCheck()` inside `onMove`/`onEnd` yourself — unlike `@HostListener`, which automatically marks the view dirty, a manual `addEventListener` does not.
 

package/fesm2022/ngx-kit-core.mjs

@@ -1,31 +1,32 @@
 import * as i1 from '@angular/common';
-import { CommonModule, isPlatformBrowser, DOCUMENT } from '@angular/common';
+import { CommonModule, isPlatformBrowser, DOCUMENT as DOCUMENT$1 } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, forwardRef, HostListener, ViewChild, Output, Input, ChangeDetectionStrategy, Component, inject, ChangeDetectorRef, InjectionToken, PLATFORM_ID, Inject, Injectable, DestroyRef, signal, computed, ApplicationRef, EnvironmentInjector, Injector, createComponent } from '@angular/core';
+import { EventEmitter, inject, DOCUMENT, forwardRef, HostListener, ViewChild, Output, Input, ChangeDetectionStrategy, Component, ChangeDetectorRef, InjectionToken, PLATFORM_ID, Inject, Injectable, DestroyRef, signal, computed, ApplicationRef, EnvironmentInjector, Injector, createComponent } from '@angular/core';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormControl, Validators } from '@angular/forms';
 
 function getOffsetPosition(evt, parent) {
-    let position = {
+    const position = {
         x: 0,
         y: 0,
     };
-    if (evt instanceof MouseEvent) {
+    if ('touches' in evt) {
+        if (evt.touches.length > 0) {
+            position.x = evt.touches[0].pageX;
+            position.y = evt.touches[0].pageY;
+        }
+    }
+    else {
         position.x = evt.pageX;
         position.y = evt.pageY;
     }
-    else if (evt.touches && evt.touches.length > 0) {
-        position.x = evt.touches[0].pageX;
-        position.y = evt.touches[0].pageY;
-    }
-    // Adjust for the parent's offset
-    let parentRect = parent.getBoundingClientRect();
+    const parentRect = parent.getBoundingClientRect();
     position.x -= parentRect.left + window.scrollX;
     position.y -= parentRect.top + window.scrollY;
     return position;
 }
 
 /** با فراخوانی این تابع (مثلاً داخل dragStart) یک نشست‌ درگ شروع می‌شه. */
-function startDragSession({ onMove, onEnd }) {
+function startDragSession({ doc, onMove, onEnd }) {
     const handleMove = (ev) => {
         if (ev.type === 'touchmove') {
             // جلوگیری از اسکرول شدن صفحه هم‌زمان با درگ کردن روی موبایل/تاچ
@@ -38,17 +39,17 @@ function startDragSession({ onMove, onEnd }) {
         onEnd?.(ev);
     };
     const stop = () => {
-        document.removeEventListener('mousemove', handleMove);
-        document.removeEventListener('touchmove', handleMove);
-        document.removeEventListener('mouseup', handleEnd);
-        document.removeEventListener('touchend', handleEnd);
-        document.removeEventListener('touchcancel', handleEnd);
+        doc.removeEventListener('mousemove', handleMove);
+        doc.removeEventListener('touchmove', handleMove);
+        doc.removeEventListener('mouseup', handleEnd);
+        doc.removeEventListener('touchend', handleEnd);
+        doc.removeEventListener('touchcancel', handleEnd);
     };
-    document.addEventListener('mousemove', handleMove);
-    document.addEventListener('touchmove', handleMove, { passive: false });
-    document.addEventListener('mouseup', handleEnd);
-    document.addEventListener('touchend', handleEnd);
-    document.addEventListener('touchcancel', handleEnd);
+    doc.addEventListener('mousemove', handleMove);
+    doc.addEventListener('touchmove', handleMove, { passive: false });
+    doc.addEventListener('mouseup', handleEnd);
+    doc.addEventListener('touchend', handleEnd);
+    doc.addEventListener('touchcancel', handleEnd);
     // تابع stop برگردونده می‌شه تا هم بشه دستی صداش زد (مثلاً در ngOnDestroy،
     // اگه کامپوننت درست وسط یه درگ نابود بشه) و هم به‌صورت خودکار روی
     // mouseup/touchend صدا زده می‌شه.
@@ -107,6 +108,7 @@ class RangeSliderComponent {
     sliderRect;
     thumbRect;
     stopDrag;
+    doc = inject(DOCUMENT);
     constructor(changeDetectorRef) {
         this.changeDetectorRef = changeDetectorRef;
     }
@@ -180,6 +182,7 @@ class RangeSliderComponent {
         this.selectedIndexChange.emit(this.selectedIndex);
         this.stopDrag?.();
         this.stopDrag = startDragSession({
+            doc: this.doc,
             onMove: (moveEv) => this.updateThumbPosition(moveEv),
             onEnd: () => {
                 this.isDragging = false;
@@ -333,6 +336,7 @@ class SaturationComponent {
     saturationRect;
     thumbRect;
     stopDrag;
+    doc = inject(DOCUMENT);
     constructor() { }
     ngOnDestroy() {
         // اگه کامپوننت درست وسط یه درگ نابود بشه (مثلاً پیکر بسته بشه)، باید
@@ -390,6 +394,7 @@ class SaturationComponent {
         this.updatePosition(ev);
         this.stopDrag?.();
         this.stopDrag = startDragSession({
+            doc: this.doc,
             onMove: (moveEv) => this.updatePosition(moveEv),
             onEnd: () => {
                 this.isDragging = false;
@@ -515,6 +520,7 @@ class SliderComponent {
     thumbRect;
     stopDrag;
     cd = inject(ChangeDetectorRef);
+    doc = inject(DOCUMENT);
     constructor() { }
     ngOnInit() {
         this.myControl.setValidators([Validators.min(this.min), Validators.max(this.max)]);
@@ -572,6 +578,7 @@ class SliderComponent {
         this.updatePosition(ev);
         this.stopDrag?.();
         this.stopDrag = startDragSession({
+            doc: this.doc,
             onMove: (moveEv) => this.updatePosition(moveEv),
             onEnd: () => {
                 this.isDragging = false;
@@ -1146,7 +1153,7 @@ function resolveDirection(doc) {
  * این سرویس انجام می‌دهد).
  */
 class DirectionService {
-    doc = inject(DOCUMENT);
+    doc = inject(DOCUMENT$1);
     destroyRef = inject(DestroyRef);
     _direction = signal(resolveDirection(this.doc), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_direction" }] : /* istanbul ignore next */ []));
@@ -1209,7 +1216,7 @@ const DIALOG_OVERLAY_CLASSNAME = 'ngx-ui-overlay';
 const OVERLAY_HOST_CLASSNAME = 'ngx-ui-overlay-host';
 const BASE_Z_INDEX = 1000;
 class OverlayService {
-    document = inject(DOCUMENT);
+    document = inject(DOCUMENT$1);
     directionService = inject(DirectionService);
     platformId = inject(PLATFORM_ID);
     applicationRef = inject(ApplicationRef);