ngx-kit 5.0.0 → 6.0.0

package/types/ngx-kit-image-editor.d.ts

@@ -0,0 +1,175 @@
+import * as _angular_core from '@angular/core';
+
+interface NgxCropRect {
+    /** همه به پیکسل‌های واقعیِ تصویر مبدأ (نه پیکسل صفحه) */
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+type NgxImageFilterPreset = 'none' | 'grayscale' | 'sepia' | 'invert' | 'cartoon';
+interface NgxImageEditorAdjustments {
+    /** همه ۱۰۰ یعنی بدون تغییر؛ بازه‌ی معقول ۰ تا ۲۰۰ */
+    brightness: number;
+    contrast: number;
+    saturation: number;
+    /** درجه، ۹۰-درجه‌ای یا آزاد */
+    rotation: number;
+    filter: NgxImageFilterPreset;
+}
+interface NgxImageEditorResult {
+    blob: Blob;
+    dataUrl: string;
+    width: number;
+    height: number;
+}
+
+interface NgxPointerDragDelta {
+    dx: number;
+    dy: number;
+}
+/**
+ * درگ عمومی روی پایه‌ی Pointer Events + setPointerCapture (دقیقاً همون
+ * تکنیکی که در ngx-kit/data-table برای ریسایز ستون استفاده شده) — نیازی به
+ * listener سطح document نداره چون بعد از setPointerCapture، رویدادهای
+ * pointermove/pointerup حتی بیرون از محدوده‌ی المنت هم به خودش می‌رسن.
+ *
+ * dx/dy تجمعی از لحظه‌ی pointerdown هستن (نه دلتای بین دو move متوالی)، چون
+ * معمولاً مصرف‌کننده می‌خواد «موقعیت شروع + دلتای کل» رو حساب کنه، نه جمع
+ * تدریجی گرد شونده‌ی دلتاهای ریز.
+ */
+declare class NgxPointerDragDirective {
+    dragStart: _angular_core.OutputEmitterRef<void>;
+    dragMove: _angular_core.OutputEmitterRef<NgxPointerDragDelta>;
+    dragEnd: _angular_core.OutputEmitterRef<void>;
+    private dragging;
+    private startX;
+    private startY;
+    onPointerDown(ev: PointerEvent): void;
+    onPointerMove(ev: PointerEvent): void;
+    onPointerUp(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxPointerDragDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgxPointerDragDirective, "[ngxPointerDrag]", never, {}, { "dragStart": "dragStart"; "dragMove": "dragMove"; "dragEnd": "dragEnd"; }, never, never, true, never>;
+}
+
+type Corner = 'nw' | 'ne' | 'sw' | 'se';
+/**
+ * ویرایشگر تصویر: کراپ + چرخش + روشنایی/کنتراست/اشباع + فیلترهای آماده
+ * (سیاه‌وسفید، سپیا، معکوس، کارتونی) + فشرده‌سازی خروجی. کاملاً روی Canvas
+ * خام پیاده شده، بدون هیچ وابستگی خارجی‌ای.
+ *
+ * نکته‌ی مهمِ معماری: تمام تعامل زنده (چرخوندن، جابه‌جا/ریسایز کراپ‌باکس،
+ * پیش‌نمایش فیلترها حتی کارتونی) روی یه کپیِ کوچیک‌شده از تصویر انجام می‌شه
+ * (createWorkingCopy)، نه روی تصویر اصلی که ممکنه چند مگاپیکسل باشه — وگرنه
+ * درگ‌کردن اسلایدرها/گوشه‌های کراپ رو کاربر حس تاخیر می‌کرد. فقط لحظه‌ی
+ * save()، رندر نهایی از روی تصویر اصلیِ کامل انجام می‌شه.
+ */
+declare class NgxImageEditorComponent {
+    source: _angular_core.InputSignal<string | Blob | File | null>;
+    /** قفل نسبتِ کراپ (مثلاً ۱ برای آواتار مربعی)؛ undefined یعنی آزاد */
+    aspectRatio: _angular_core.InputSignal<number | undefined>;
+    outputMaxWidth: _angular_core.InputSignal<number | undefined>;
+    outputMaxHeight: _angular_core.InputSignal<number | undefined>;
+    outputType: _angular_core.InputSignal<"image/jpeg" | "image/png" | "image/webp">;
+    /** حداکثر عرض نمایشِ ناحیه‌ی کراپ روی صفحه (پیکسل) */
+    displayMaxWidth: _angular_core.InputSignal<number>;
+    saved: _angular_core.OutputEmitterRef<NgxImageEditorResult>;
+    cancelled: _angular_core.OutputEmitterRef<void>;
+    protected readonly loading: _angular_core.WritableSignal<boolean>;
+    protected readonly saving: _angular_core.WritableSignal<boolean>;
+    protected readonly loadError: _angular_core.WritableSignal<string | null>;
+    private readonly originalImage;
+    private readonly workingCanvas;
+    protected readonly rotation: _angular_core.WritableSignal<number>;
+    protected readonly brightness: _angular_core.WritableSignal<number>;
+    protected readonly contrast: _angular_core.WritableSignal<number>;
+    protected readonly saturation: _angular_core.WritableSignal<number>;
+    protected readonly filterPreset: _angular_core.WritableSignal<NgxImageFilterPreset>;
+    protected readonly quality: _angular_core.WritableSignal<number>;
+    protected readonly crop: _angular_core.WritableSignal<NgxCropRect>;
+    protected readonly adjustments: _angular_core.Signal<NgxImageEditorAdjustments>;
+    /** تصویرِ (کوچیک‌شده‌یِ) چرخیده — پایه‌ی نمایش صحنه‌ی کراپ */
+    protected readonly rotatedWorkingCanvas: _angular_core.Signal<HTMLCanvasElement | null>;
+    protected readonly displayScale: _angular_core.Signal<number>;
+    protected readonly stageImageUrl: _angular_core.Signal<string | null>;
+    protected readonly stageSize: _angular_core.Signal<{
+        width: number;
+        height: number;
+    }>;
+    protected readonly cropOverlayStyle: _angular_core.Signal<{
+        left: string;
+        top: string;
+        width: string;
+        height: string;
+    }>;
+    /** پیش‌نمایش نهایی (کوچیک، حداکثر ۴۸۰ پیکسل) — شامل همه‌چیز، حتی افکت کارتونی */
+    protected readonly previewUrl: _angular_core.Signal<string | null>;
+    private moveSnapshot;
+    private resizeSnapshot;
+    constructor();
+    private resetAdjustments;
+    protected rotateBy(delta: number): void;
+    protected setFilter(preset: NgxImageFilterPreset): void;
+    protected onMoveDragStart(): void;
+    protected onMoveDragMove(delta: NgxPointerDragDelta): void;
+    protected onResizeDragStart(): void;
+    protected onResizeDragMove(corner: Corner, delta: NgxPointerDragDelta): void;
+    protected cancel(): void;
+    save(): Promise<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxImageEditorComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxImageEditorComponent, "ngx-image-editor", never, { "source": { "alias": "source"; "required": false; "isSignal": true; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; "outputMaxWidth": { "alias": "outputMaxWidth"; "required": false; "isSignal": true; }; "outputMaxHeight": { "alias": "outputMaxHeight"; "required": false; "isSignal": true; }; "outputType": { "alias": "outputType"; "required": false; "isSignal": true; }; "displayMaxWidth": { "alias": "displayMaxWidth"; "required": false; "isSignal": true; }; }, { "saved": "saved"; "cancelled": "cancelled"; }, never, never, true, never>;
+}
+
+/** یه File/Blob/data-URL/URL رو به یک HTMLImageElement بارگذاری‌شده تبدیل می‌کنه */
+declare function loadImage(source: File | Blob | string): Promise<HTMLImageElement>;
+/** canvas.toBlob به‌صورت Promise، به‌همراه fallback برای مرورگرهای قدیمی‌تر */
+declare function canvasToBlob(canvas: HTMLCanvasElement, type?: string, quality?: number): Promise<Blob>;
+/**
+ * یه کپیِ کوچیک‌شده از تصویر اصلی می‌سازه که کل UI ویرایشگر (چرخش، کراپ،
+ * پیش‌نمایش فیلترها/کارتونی) روی همین کار می‌کنه، نه روی تصویر اصلی که
+ * ممکنه چند مگاپیکسل باشه. این باعث می‌شه درگ‌کردنِ اسلایدرها یا لبه‌های
+ * کراپ روون بمونه؛ خروجی نهایی (save) همیشه از روی تصویر اصلیِ کامل رندر
+ * می‌شه، نه از روی این کپی.
+ */
+declare function createWorkingCopy(img: HTMLImageElement, maxSize?: number): HTMLCanvasElement;
+/** ابعاد جدید رو طوری حساب می‌کنه که از maxWidth/maxHeight بیشتر نشه، با حفظ نسبت تصویر */
+declare function fitWithin(width: number, height: number, maxWidth?: number, maxHeight?: number): {
+    width: number;
+    height: number;
+};
+
+/** تصویر مبدأ رو با زاویه‌ی داده‌شده روی یه canvas جدید (به اندازه‌ی bounding-box نتیجه) می‌چرخونه */
+declare function renderRotated(source: CanvasImageSource, width: number, height: number, degrees: number): HTMLCanvasElement;
+/**
+ * کراپ + فیلترها رو روی یه canvas خروجی می‌سازه. brightness/contrast/
+ * saturation/grayscale/sepia/invert همه با ctx.filter بومیِ Canvas 2D انجام
+ * می‌شن (شتاب‌دهی‌شده توسط مرورگر، بدون حلقه‌ی پیکسلی دستی)؛ فقط cartoon
+ * (که معادل بومی نداره) با پردازش پیکسلی جدا انجام می‌شه.
+ *
+ * maxWidth/maxHeight برای دو حالت استفاده می‌شه: پیش‌نمایش زنده (عدد کوچیک،
+ * برای واکنش‌گرا موندن حین کشیدن اسلایدرها) و خروجی نهایی (بدون محدودیت یا
+ * محدودیت دلخواه کاربر).
+ */
+declare function renderComposite(source: CanvasImageSource, sourceWidth: number, sourceHeight: number, crop: NgxCropRect, adjustments: NgxImageEditorAdjustments, maxWidth?: number, maxHeight?: number): HTMLCanvasElement;
+
+/**
+ * افکت «کارتونی»: چون ctx.filter استاندارد چیزی شبیه cartoon نداره (فقط
+ * brightness/contrast/saturate/grayscale/sepia/invert/blur/hue-rotate)، این
+ * یکی رو واقعاً با پردازش پیکسلی پیاده کردیم؛ دو مرحله:
+ *
+ *   ۱) Posterize: هر کانال رنگ به تعداد محدودی سطح گرد می‌شه (پهنه‌های رنگیِ
+ *      صاف و یکدست، حسِ کارتونی رنگ می‌ده).
+ *   ۲) لبه‌یابی Sobel روی نسخه‌ی خاکستریِ تصویر: هرجا شدت لبه از حد آستانه
+ *      بیشتر باشه، پیکسل تیره می‌شه (حسِ خط دور کارتونی).
+ *
+ * روی خودِ ImageData کار می‌کنه، پس هزینه‌ش با اندازه‌ی تصویر خطی‌ست؛ برای
+ * تصاویر خیلی بزرگ (>~3000px) بهتره قبلش resize بشه (که در کامپوننت اصلی
+ * با fitWithin قبل از اعمال فیلتر انجام می‌شه).
+ */
+declare function applyCartoonEffect(ctx: CanvasRenderingContext2D, width: number, height: number, options?: {
+    levels?: number;
+    edgeThreshold?: number;
+}): void;
+
+export { NgxImageEditorComponent, NgxPointerDragDirective, applyCartoonEffect, canvasToBlob, createWorkingCopy, fitWithin, loadImage, renderComposite, renderRotated };
+export type { NgxCropRect, NgxImageEditorAdjustments, NgxImageEditorResult, NgxImageFilterPreset, NgxPointerDragDelta };

package/types/ngx-kit-menu.d.ts

@@ -38,6 +38,7 @@ declare class NgxContextMenu implements OnDestroy {
     private overlayService;
     ngxContextMenu: i0.InputSignal<NgxMenuPanel>;
     private containerRef?;
+    private readonly boundOnClick;
     constructor(el: ElementRef<HTMLElement>, appRef: ApplicationRef, overlayService: OverlayService);
     ngOnDestroy(): void;
     onClick(ev: PointerEvent): void;

package/types/ngx-kit-message.d.ts

@@ -176,6 +176,8 @@ declare class MSG {
     static question(title: string, text?: string, options?: IMessageOptions): ngx_kit_message.MessageOutput<any>;
     static loading(title: string, text?: string, options?: IMessageOptions): ngx_kit_message.MessageOutput<any>;
 }
+declare class Modal extends MSG {
+}
 
 type MessageOutput<T = any> = {
     id: number;
@@ -217,6 +219,7 @@ declare class NgxMessageComponent implements OnInit, AfterViewInit {
     index: number;
     protected sanitizer: DomSanitizer;
     protected doc: Document;
+    private readonly messageService;
     private readonly _onClose;
     onClose: rxjs.Observable<{
         index: number;
@@ -224,6 +227,14 @@ declare class NgxMessageComponent implements OnInit, AfterViewInit {
     }>;
     ngOnInit(): void;
     ngAfterViewInit(): void;
+    /**
+     * وقتی چند تا پیام هم‌زمان باز باشن، هرکدوم listener خودشو روی document
+     * داشت — پس یه فشردن Escape/Enter، رویداد رو به *همه‌شون* هم‌زمان می‌فرستاد،
+     * نه فقط آخرین پیامی که باز شده (رفتار طبیعیِ یه استکِ مودال باید این باشه
+     * که فقط بالاترین لایه به کیبورد واکنش نشون بده). این چک همون چیزیه که
+     * OverlayService با getLastDialog() برای اورلی‌ها انجام می‌ده.
+     */
+    private isTopmost;
     onScapeKey(event: Event): void;
     onEnterKey(event: Event): void;
     onConfirm(): void;
@@ -241,8 +252,7 @@ declare class NgxMessageService {
     private injector;
     private envInjector;
     private _doc;
-    currentAdIndex: number;
-    alerts: ComponentRef<NgxMessageComponent>[];
+    alerts: Map<number, ComponentRef<NgxMessageComponent>>;
     insertedId: number;
     constructor(appRef: ApplicationRef, injector: Injector, envInjector: EnvironmentInjector, _doc: Document);
     show<T = any>(c?: IMessageOptions): MessageOutput<T>;
@@ -292,5 +302,5 @@ declare const NGX_MESSAGE_CONFIGS: InjectionToken<IMessageOptions>;
 declare const NGX_MESSAGE_API: InjectionToken<NgxMessageService>;
 declare const NGX_MESSAGE_DEFAULT_OPTIONS: MessageOptions;
 
-export { DismissReason, MSG, MessageOptions, NGX_MESSAGE_API, NGX_MESSAGE_CONFIGS, NGX_MESSAGE_DEFAULT_OPTIONS, NgxMessageService, provideMessage };
+export { DismissReason, MSG, MessageOptions, Modal, NGX_MESSAGE_API, NGX_MESSAGE_CONFIGS, NGX_MESSAGE_DEFAULT_OPTIONS, NgxMessageService, provideMessage };
 export type { IMessageOptions, MessageOutput, MessageResult };

package/types/ngx-kit-notify.d.ts

@@ -112,7 +112,6 @@ declare class NgxNotificationComponent implements OnInit, OnDestroy {
     onMouseLeave(): void;
     onTap(): void;
     escapeHtml(input?: string): string;
-    ngOnDestroyCleanup(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxNotificationComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxNotificationComponent, "ngx-notification", never, { "payload": { "alias": "payload"; "required": true; "isSignal": true; }; "containerClass": { "alias": "containerClass"; "required": false; }; }, { "onClose": "onClose"; "onFinish": "onFinish"; }, never, never, true, never>;
 }

package/types/ngx-kit-shared.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { OnInit, EventEmitter, ElementRef, ChangeDetectorRef, InjectionToken, ComponentRef, TemplateRef, Type, ViewContainerRef, ApplicationRef, OnDestroy, EmbeddedViewRef } from '@angular/core';
+import { OnInit, OnDestroy, EventEmitter, ElementRef, ChangeDetectorRef, InjectionToken, ComponentRef, TemplateRef, Type, ViewContainerRef, ApplicationRef, EmbeddedViewRef } from '@angular/core';
 import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors, FormControl } from '@angular/forms';
 
 interface IValue {
@@ -13,7 +13,7 @@ declare class ValueModel {
     thumb?: HTMLElement;
     color?: string;
 }
-declare class RangeSliderComponent implements OnInit, ControlValueAccessor, Validator {
+declare class RangeSliderComponent implements OnInit, OnDestroy, ControlValueAccessor, Validator {
     private changeDetectorRef;
     /**
      * The step value for the slider
@@ -57,8 +57,10 @@ declare class RangeSliderComponent implements OnInit, ControlValueAccessor, Vali
     protected _validatorOnChange: () => void;
     private sliderRect?;
     private thumbRect?;
+    private stopDrag?;
     constructor(changeDetectorRef: ChangeDetectorRef);
     ngOnInit(): void;
+    ngOnDestroy(): void;
     private generateId;
     writeValue(items?: IValue[]): void;
     validate(control: AbstractControl): ValidationErrors | null;
@@ -67,14 +69,12 @@ declare class RangeSliderComponent implements OnInit, ControlValueAccessor, Vali
     registerOnTouched(fn: any): void;
     setDisabledState?(disabled: boolean): void;
     private updateRects;
-    onDrag(ev: MouseEvent | TouchEvent): void;
     onResize(): void;
     dragStart(ev: MouseEvent | TouchEvent, index: number): void;
     addnewRangeOnSliderClick(event: MouseEvent | TouchEvent): void;
     private updateThumbPosition;
     updateAllThumbPositions(): void;
     setValueByPosition(thumb: ValueModel, thumbRec: DOMRect, sliderRec: DOMRect): void;
-    onDragEnd(ev: MouseEvent | TouchEvent): void;
     valueChanged(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<RangeSliderComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<RangeSliderComponent, "range-slider", never, { "step": { "alias": "step"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "background": { "alias": "background"; "required": false; }; "isBgTransparent": { "alias": "isBgTransparent"; "required": false; }; "addNewRangeOnClick": { "alias": "addNewRangeOnClick"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; }, { "change": "change"; "selectedIndexChange": "selectedIndexChange"; }, never, ["*"], true, never>;
@@ -85,7 +85,7 @@ interface IPosition {
     y: number;
 }
 
-declare class SaturationComponent implements ControlValueAccessor {
+declare class SaturationComponent implements ControlValueAccessor, OnDestroy {
     width?: number;
     height?: number;
     color: string;
@@ -108,7 +108,9 @@ declare class SaturationComponent implements ControlValueAccessor {
     protected _validatorOnChange: () => void;
     private saturationRect?;
     private thumbRect?;
+    private stopDrag?;
     constructor();
+    ngOnDestroy(): void;
     private updateRects;
     writeValue(val?: IPosition | null): void;
     validate(control: AbstractControl): ValidationErrors | null;
@@ -118,16 +120,14 @@ declare class SaturationComponent implements ControlValueAccessor {
     setDisabledState?(disabled: boolean): void;
     dragStart(ev: MouseEvent | TouchEvent): void;
     onResize(): void;
-    onDrag(ev: MouseEvent | TouchEvent): void;
     private updatePosition;
-    onDragEnd(ev: MouseEvent | TouchEvent): void;
     setValueByPosition(thumbRec: DOMRect, saturationRec: DOMRect): void;
     valueChanged(value: IPosition): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SaturationComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SaturationComponent, "saturation", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "color": { "alias": "color"; "required": false; }; "step": { "alias": "step"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; }, { "change": "change"; }, never, never, true, never>;
 }
 
-declare class SliderComponent implements OnInit, ControlValueAccessor, Validator {
+declare class SliderComponent implements OnInit, OnDestroy, ControlValueAccessor, Validator {
     step: number;
     min: number;
     max: number;
@@ -145,8 +145,11 @@ declare class SliderComponent implements OnInit, ControlValueAccessor, Validator
     protected _validatorOnChange: () => void;
     private sliderRect?;
     private thumbRect?;
+    private stopDrag?;
+    private readonly cd;
     constructor();
     ngOnInit(): void;
+    ngOnDestroy(): void;
     private updateRects;
     writeValue(val?: number | string | null): void;
     validate(control: AbstractControl): ValidationErrors | null;
@@ -155,11 +158,9 @@ declare class SliderComponent implements OnInit, ControlValueAccessor, Validator
     registerOnTouched(fn: any): void;
     setDisabledState?(disabled: boolean): void;
     dragStart(ev: MouseEvent | TouchEvent): void;
-    onDrag(ev: MouseEvent | TouchEvent): void;
     onResize(): void;
     private updatePosition;
     setValueByPosition(thumbRec: DOMRect, sliderRec: DOMRect): void;
-    onDragEnd(ev: MouseEvent | TouchEvent): void;
     valueChanged(value: number): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SliderComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SliderComponent, "slider", never, { "step": { "alias": "step"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "background": { "alias": "background"; "required": false; }; "isBgTransparent": { "alias": "isBgTransparent"; "required": false; }; }, { "change": "change"; }, never, ["*"], true, never>;
@@ -172,6 +173,37 @@ declare function getOffsetPosition(evt: MouseEvent | TouchEvent, parent: HTMLEle
     y: number;
 };
 
+/**
+ * تمام کامپوننت‌های قابل‌درگ کتابخانه (saturation، slider، range-slider،
+ * box-shadow) قبلاً یک الگوی تکراری داشتن:
+ *
+ *   @HostListener('document:mousemove', ['$event'])
+ *   @HostListener('document:touchmove', ['$event'])
+ *   onDrag(ev) { if (!this.isDragging) return; ... }
+ *
+ * مشکل: این listenerها برای کل عمر کامپوننت روی `document` باقی می‌مونن —
+ * حتی وقتی اصلاً دراگی در حال انجام نیست. یعنی روی صفحه‌ای با چند تا
+ * color-picker/slider، هر حرکت موس/انگشت روی کل صفحه (نه فقط روی خودِ
+ * اسلایدر) باعث اجرای N تابع (به تعداد اینستنس‌ها) می‌شه که هرکدوم هم چرخه‌ی
+ * زون انگیولار رو تریگر می‌کنن — یک مشکل واقعی پرفورمنس، مخصوصاً در صفحاتی
+ * با چند نمونه هم‌زمان یا حرکت زیاد موس.
+ *
+ * این تابع جایگزین اون الگو می‌شه: listenerها فقط در طول یک دراگِ واقعی
+ * (بین mousedown/touchstart تا mouseup/touchend) روی document اضافه می‌شن و
+ * بلافاصله بعدش پاک می‌شن.
+ *
+ * یه فایده‌ی جانبیِ مهم دیگه هم داره: روی touchmove مقدار `{ passive: false }`
+ * ست می‌شه و preventDefault صدا زده می‌شه، پس در حین درگ کردنِ thumb روی
+ * موبایل، صفحه اسکرول نمی‌خوره (باگی که با @HostListener قبلی وجود داشت،
+ * چون هیچ‌جا preventDefault روی touchmove صدا زده نمی‌شد).
+ */
+interface DragSessionCallbacks {
+    onMove: (ev: MouseEvent | TouchEvent) => void;
+    onEnd?: (ev: MouseEvent | TouchEvent) => void;
+}
+/** با فراخوانی این تابع (مثلاً داخل dragStart) یک نشست‌ درگ شروع می‌شه. */
+declare function startDragSession({ onMove, onEnd }: DragSessionCallbacks): () => void;
+
 declare const WINDOW: InjectionToken<Window | null>;
 
 declare function randomStrnig(extraLength?: number, useNumeric?: boolean): string;
@@ -254,7 +286,6 @@ declare const FOCUSABLE_SELECTOR = "button, [href], input, select, textarea, [ta
 declare const DIALOG_OVERLAY_CLASSNAME = "ngx-ui-overlay";
 declare class OverlayService implements OnDestroy {
     private readonly overlayStacks;
-    private zIndexCounter;
     private listenersAttached;
     private resizeRafPending;
     private readonly doc;
@@ -300,5 +331,5 @@ interface OverlayInstance {
     cleanup: () => void;
 }
 
-export { BrowserService, DIALOG_OVERLAY_CLASSNAME, DirectionService, FOCUSABLE_SELECTOR, OverlayRef, OverlayService, RangeSliderComponent, SaturationComponent, SliderComponent, ValueModel, WINDOW, getOffsetPosition, makeConfetti, mergeConfig, randomStrnig };
-export type { Alignment, BaseOverlayOptions, Direction, IPosition, IValue, OverlayInstance, OverlayOptions, Placement, Point, TemplateOptions };
+export { BrowserService, DIALOG_OVERLAY_CLASSNAME, DirectionService, FOCUSABLE_SELECTOR, OverlayRef, OverlayService, RangeSliderComponent, SaturationComponent, SliderComponent, ValueModel, WINDOW, getOffsetPosition, makeConfetti, mergeConfig, randomStrnig, startDragSession };
+export type { Alignment, BaseOverlayOptions, Direction, DragSessionCallbacks, IPosition, IValue, OverlayInstance, OverlayOptions, Placement, Point, TemplateOptions };

package/types/ngx-kit-time-picker.d.ts

@@ -0,0 +1,150 @@
+import * as _angular_core from '@angular/core';
+import { OnInit, ElementRef } from '@angular/core';
+import { BrowserService } from 'ngx-kit/shared';
+import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
+
+declare class NgxTimePickerConfig {
+    cancelButtonText: string;
+    confirmButtonText: string;
+    amText: string;
+    pmText: string;
+    format: '12' | '24';
+    minuteStep: number;
+    autoSwitchToMinute: boolean;
+}
+
+declare type NgxTimePickerMode = 'hour' | 'minute';
+
+declare class NgxInputTimePickerComponent implements ControlValueAccessor, Validator, OnInit {
+    protected readonly browserService: BrowserService;
+    readonly change: _angular_core.OutputEmitterRef<string | null>;
+    readonly cancel: _angular_core.OutputEmitterRef<void>;
+    protected readonly config: NgxTimePickerConfig;
+    isDisabled: boolean;
+    /**
+     * Time value.
+     *
+     * Example:
+     * 14:35
+     */
+    readonly value: _angular_core.ModelSignal<string>;
+    /**
+     * 12h or 24h.
+     */
+    readonly format: _angular_core.InputSignal<"12" | "24">;
+    readonly amOrPm: _angular_core.ModelSignal<"AM" | "PM" | undefined>;
+    /**
+     * Minute step.
+     */
+    readonly minuteStep: _angular_core.InputSignal<number>;
+    /**
+     * Whether the clock is disabled.
+     */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether to automatically switch from hour to minute.
+     */
+    readonly autoSwitchToMinute: _angular_core.InputSignal<boolean>;
+    readonly clock: _angular_core.Signal<ElementRef<SVGSVGElement> | undefined>;
+    readonly mode: _angular_core.WritableSignal<NgxTimePickerMode>;
+    private dragging;
+    readonly parsedTime: _angular_core.Signal<{
+        hour: number;
+        minute: number;
+    }>;
+    readonly displayHour: _angular_core.Signal<number>;
+    readonly displayMinute: _angular_core.Signal<number>;
+    readonly hourNumbers: _angular_core.Signal<number[]>;
+    readonly minuteNumbers: _angular_core.Signal<number[]>;
+    readonly hourAngle: _angular_core.Signal<number>;
+    readonly minuteAngle: _angular_core.Signal<number>;
+    readonly currentAngle: _angular_core.Signal<number>;
+    readonly handLength: _angular_core.Signal<58 | 86>;
+    readonly handEnd: _angular_core.Signal<{
+        x: number;
+        y: number;
+    }>;
+    readonly selectedPosition: _angular_core.Signal<{
+        x: number;
+        y: number;
+    }>;
+    protected _onChange: (value: string) => void;
+    protected _onTouched: () => void;
+    protected _validatorOnChange: () => void;
+    constructor();
+    ngOnInit(): void;
+    writeValue(value: string): void;
+    validate(control: AbstractControl): ValidationErrors | null;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    registerOnValidatorChange?(fn: () => void): void;
+    setDisabledState(disabled: boolean): void;
+    startPointer(event: PointerEvent): void;
+    movePointer(event: PointerEvent): void;
+    endPointer(event: PointerEvent): void;
+    selectHour(hour: number): void;
+    selectMinute(minute: number): void;
+    setMode(mode: NgxTimePickerMode): void;
+    private updateFromPointer;
+    private updateHourFromAngle;
+    private updateMinuteFromAngle;
+    private setTime;
+    isSelectedHour(hour: number): boolean;
+    isSelectedMinute(minute: number): boolean;
+    formatHour(hour: number): string;
+    formatMinute(minute: number): string;
+    numberPosition(index: number, total: number, radius?: number): {
+        x: number;
+        y: number;
+    };
+    hourPosition(hour: number, inner?: boolean): {
+        x: number;
+        y: number;
+    };
+    minutePosition(minute: number): {
+        x: number;
+        y: number;
+    };
+    ok(): void;
+    close(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxInputTimePickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxInputTimePickerComponent, "ngx-time-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "amOrPm": { "alias": "amOrPm"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "autoSwitchToMinute": { "alias": "autoSwitchToMinute"; "required": false; "isSignal": true; }; }, { "change": "change"; "cancel": "cancel"; "value": "valueChange"; "amOrPm": "amOrPmChange"; }, never, never, true, never>;
+}
+
+declare class NgxInputTimePicker implements ControlValueAccessor, Validator {
+    private el;
+    protected readonly config: NgxTimePickerConfig;
+    openOnCLick: _angular_core.InputSignal<boolean>;
+    readonly change: _angular_core.OutputEmitterRef<string | null>;
+    protected readonly value: _angular_core.WritableSignal<string>;
+    readonly format: _angular_core.InputSignal<"12" | "24">;
+    readonly amOrPm: _angular_core.ModelSignal<"AM" | "PM" | undefined>;
+    private pickerRef?;
+    protected _onChange: (value: string | null | undefined) => void;
+    protected _onTouched: () => void;
+    protected _validatorOnChange: () => void;
+    private isDisabled;
+    private readonly overlayService;
+    private readonly viewContainerRef;
+    private readonly renderer;
+    constructor(el: ElementRef<HTMLInputElement>);
+    ngOnDestroy(): void;
+    onClick(ev: Event): void;
+    onInput(event: Event): void;
+    onBlur(): void;
+    writeValue(value: string): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    registerOnValidatorChange?(fn: () => void): void;
+    setDisabledState(disabled: boolean): void;
+    toggle(): void;
+    private destroy;
+    private emitChange;
+    validate(control: AbstractControl): ValidationErrors | null;
+    protected _formatValue(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxInputTimePicker, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgxInputTimePicker, "[ngxInputTimePicker]", ["ngxInputTimePicker"], { "openOnCLick": { "alias": "openOnCLick"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "amOrPm": { "alias": "amOrPm"; "required": false; "isSignal": true; }; }, { "change": "change"; "amOrPm": "amOrPmChange"; }, never, never, true, never>;
+}
+
+export { NgxInputTimePicker, NgxInputTimePickerComponent };
+export type { NgxTimePickerMode };