ngx-kit 4.0.0 → 6.0.0

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

@@ -0,0 +1,101 @@
+import * as _angular_core from '@angular/core';
+
+/**
+ * از 'start'/'end' منطقی استفاده می‌کنیم نه 'left'/'right' — یعنی توی
+ * RTL خودکار برعکس می‌شه (start یعنی راست در RTL، چپ در LTR)، دقیقاً هماهنگ
+ * با بقیه‌ی کتابخونه که همه‌جا از پراپرتی‌های منطقیِ CSS استفاده می‌کنه.
+ */
+type NgxDrawerSide = 'start' | 'end';
+/**
+ * جلوه‌ی بازوبسته‌شدنِ خودِ پنل:
+ *  - slide: اسلاید ساده‌ی کلاسیک
+ *  - curtain: چند نوار عمودیِ هم‌رنگِ پنل که با تأخیرِ پلکانی جمع می‌شن و
+ *    محتوا رو نمایان می‌کنن — حسِ باز شدنِ یه پرده‌ی چندلَته
+ *  - jelly: بازشدن با افکتِ ژله‌ای/کشسان — چند نوسانِ فنری که رفته‌رفته
+ *    فروکش می‌کنه (الهام از https://dribbble.com/shots/2307371)
+ *  - pull: یه کشیدگیِ لاستیکیِ تک‌ضربه‌ای — لبه‌ی پنل از اندازه‌ی نهایی رد
+ *    می‌شه و برمی‌گرده سرجاش (rubber-band)
+ *  - rotate3d: چرخشِ سه‌بعدیِ دور لولا (مثل باز شدنِ یه در)، با perspective
+ *  - flip3d: پنل و محتوای صفحه با هم مثل ورق‌زدنِ یه کتاب می‌چرخن
+ *  - scale: بزرگ‌شدن از مرکز همراه با fade
+ */
+type NgxDrawerEffect = 'slide' | 'curtain' | 'jelly' | 'pull' | 'rotate3d' | 'flip3d' | 'scale';
+/**
+ * رفتار محتوای اصلیِ صفحه وقتی درور باز می‌شه:
+ *  - overlay: محتوا سرجاش می‌مونه، درور روش شناور می‌شه (با بک‌دراپ)
+ *  - push: محتوا به‌اندازه‌ی عرضِ درور هل داده می‌شه (کنار می‌ره)
+ *  - reveal: محتوا کمی کوچیک/عقب می‌ره، انگار درور از زیرش نمایان می‌شه
+ *    (همون افکت معروف iOS)
+ */
+type NgxDrawerContentBehavior = 'overlay' | 'push' | 'reveal';
+
+/**
+ * درور منو (side drawer) با ۶ جلوه‌ی بازوبسته‌شدنِ متفاوت (از ساده تا
+ * سه‌بعدی/ژله‌ای) و ۳ رفتار برای محتوای صفحه (overlay/push/reveal) —
+ * دقیقاً مدل کتابخونه‌های حرفه‌ای مثل react-burger-menu یا Ionic Menu، ولی
+ * signal-based و بدون هیچ وابستگی خارجی.
+ *
+ * نکات معماری:
+ *  - از 'start'/'end' منطقی استفاده می‌کنه، پس با CSS logical properties
+ *    زیر RTL خودکار برعکس می‌شه؛ فقط ریاضیِ درگ (که برخلاف CSS جهت فیزیکیِ
+ *    واقعی لازم داره) از DirectionService مشترک استفاده می‌کنه.
+ *  - وضعیت باز/بسته با model() دوطرفه‌ست، پس هم با [(open)] قابل کنترله و
+ *    هم می‌تونه به‌صورت خودکار و زنده با عرض صفحه هماهنگ بشه (respondToViewport)
+ *    — یعنی رد شدن از breakpoint (نه فقط بار اول لود) می‌تونه خودکار باز/بسته‌ش کنه.
+ *  - افکت‌های jelly/pull با keyframe سه‌مرحله‌ای (overshoot → نوسان → استقرار)
+ *    پیاده شدن، نه فقط یه transition ساده.
+ */
+declare class NgxDrawerMenuComponent {
+    side: _angular_core.InputSignal<NgxDrawerSide>;
+    effect: _angular_core.InputSignal<NgxDrawerEffect>;
+    contentBehavior: _angular_core.InputSignal<NgxDrawerContentBehavior>;
+    width: _angular_core.InputSignal<number>;
+    swipeEdgeSize: _angular_core.InputSignal<number>;
+    curtainStrips: _angular_core.InputSignal<number>;
+    backdropClose: _angular_core.InputSignal<boolean>;
+    swipeEnabled: _angular_core.InputSignal<boolean>;
+    /** اگه true باشه، رد شدن از mobileBreakpoint به‌صورت زنده open رو با openOnDesktop/openOnMobile هماهنگ می‌کنه */
+    respondToViewport: _angular_core.InputSignal<boolean>;
+    openOnDesktop: _angular_core.InputSignal<boolean>;
+    openOnMobile: _angular_core.InputSignal<boolean>;
+    mobileBreakpoint: _angular_core.InputSignal<number>;
+    /** state دوطرفه‌ی باز/بسته؛ با [(open)] قابل bind هست */
+    open: _angular_core.ModelSignal<boolean>;
+    private readonly directionService;
+    private readonly doc;
+    private readonly destroyRef;
+    /** فقط حین یه درگِ واقعی مقدار داره؛ null یعنی از روی open() تصمیم بگیر */
+    protected readonly dragRatio: _angular_core.WritableSignal<number | null>;
+    protected readonly isDragging: _angular_core.Signal<boolean>;
+    protected readonly visualOpen: _angular_core.Signal<number>;
+    protected readonly strips: _angular_core.Signal<number[]>;
+    /**
+     * +۱ یعنی این پنل فیزیکاً روی لبه‌ی چپِ صفحه‌ست، -۱ یعنی لبه‌ی راست —
+     * برای transform:translateX() محتوای اصلی (که برخلاف inset-inline، به
+     * dir=rtl خودکار واکنش نشون نمی‌ده) لازمه. reactive هست چون هم به side()
+     * و هم به جهتِ زنده‌ی صفحه (directionService.isRtl()) وابسته‌ست.
+     */
+    protected readonly pushDirSign: _angular_core.Signal<1 | -1>;
+    /** برای افکت‌های keyframe‌محور (jelly/pull) — فقط لحظه‌ی رهاشدن (نه حین درگ زنده) پخش می‌شه */
+    protected readonly playEffectClass: _angular_core.WritableSignal<boolean>;
+    private stopDrag?;
+    private dragStartX;
+    private dragStartRatio;
+    private prevOpen;
+    constructor();
+    protected onEscape(): void;
+    protected closeFromBackdrop(): void;
+    toggle(): void;
+    /** true یعنی این پنل فیزیکاً روی لبه‌ی چپِ صفحه‌ست (صرف‌نظر از start/end منطقی) */
+    private isPhysicalLeftEdge;
+    protected stripDelay(index: number): string;
+    protected onEdgeDragStart(ev: MouseEvent | TouchEvent): void;
+    protected onPanelDragStart(ev: MouseEvent | TouchEvent): void;
+    private beginDrag;
+    private clientXOf;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxDrawerMenuComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxDrawerMenuComponent, "ngx-drawer-menu", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "effect": { "alias": "effect"; "required": false; "isSignal": true; }; "contentBehavior": { "alias": "contentBehavior"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "swipeEdgeSize": { "alias": "swipeEdgeSize"; "required": false; "isSignal": true; }; "curtainStrips": { "alias": "curtainStrips"; "required": false; "isSignal": true; }; "backdropClose": { "alias": "backdropClose"; "required": false; "isSignal": true; }; "swipeEnabled": { "alias": "swipeEnabled"; "required": false; "isSignal": true; }; "respondToViewport": { "alias": "respondToViewport"; "required": false; "isSignal": true; }; "openOnDesktop": { "alias": "openOnDesktop"; "required": false; "isSignal": true; }; "openOnMobile": { "alias": "openOnMobile"; "required": false; "isSignal": true; }; "mobileBreakpoint": { "alias": "mobileBreakpoint"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*", "[drawerContent]"], true, never>;
+}
+
+export { NgxDrawerMenuComponent };
+export type { NgxDrawerContentBehavior, NgxDrawerEffect, NgxDrawerSide };

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

@@ -0,0 +1,84 @@
+import * as _angular_core from '@angular/core';
+import { OnDestroy } from '@angular/core';
+
+interface NgxDropzoneFile {
+    /** شناسه‌ی یکتا برای track کردن توی @for و امکان حذف تکی */
+    id: string;
+    file: File;
+    /** فقط برای فایل‌های تصویری پر می‌شه (object URL) */
+    previewUrl?: string;
+    status: 'pending' | 'accepted' | 'rejected';
+    /** در صورت رد شدن، دلیلش */
+    rejectionReason?: NgxDropzoneRejectionReason;
+}
+type NgxDropzoneRejectionReason = 'type' | 'size' | 'count';
+interface NgxDropzoneRejectedFile {
+    file: File;
+    reason: NgxDropzoneRejectionReason;
+}
+
+/**
+ * ناحیه‌ی درگ‌اند‌دراپِ فایل — کاملاً مستقل (بدون وابستگی به هیچ lib
+ * دیگه‌ای، حتی shared)، signal-based و OnPush.
+ *
+ * ویژگی‌های مهمی که معمولاً پیاده‌سازی‌های ساده‌ی dropzone ندارن:
+ *  - شمارنده‌ی dragenter/dragleave: چون dragleave برای فرزندهای داخل
+ *    dropzone هم شلیک می‌شه، پیاده‌سازی‌های ساده موقع درگ‌کردن روی متن/آیکون
+ *    داخل ناحیه، حالت "درگ" رو اشتباهی خاموش می‌کنن (چشمک‌زدن). این‌جا با
+ *    شمارنده حل شده.
+ *  - پیمایش بازگشتیِ پوشه‌ها (وقتی کاربر یه پوشه رو درگ کنه، نه فقط فایل).
+ *  - قابل‌دسترسی با کیبورد (focusable + Enter/Space).
+ *  - پاک‌سازی object URL پیش‌نمایش‌ها روی حذف/destroy (وگرنه نشتی حافظه‌ست).
+ */
+declare class NgxDropzoneComponent implements OnDestroy {
+    /** الگوی accept مثل input[type=file]: "image/*", ".pdf,.docx" و ... */
+    accept: _angular_core.InputSignal<string>;
+    multiple: _angular_core.InputSignal<boolean>;
+    /** حداکثر حجم هر فایل به بایت؛ undefined یعنی بدون محدودیت */
+    maxFileSize: _angular_core.InputSignal<number | undefined>;
+    /** حداکثر تعداد فایل مجاز؛ undefined یعنی بدون محدودیت */
+    maxFiles: _angular_core.InputSignal<number | undefined>;
+    disabled: _angular_core.InputSignal<boolean>;
+    /** نمایش لیست/پیش‌نمایش فایل‌های انتخاب‌شده داخل خودِ کامپوننت */
+    showFileList: _angular_core.InputSignal<boolean>;
+    filesAdded: _angular_core.OutputEmitterRef<File[]>;
+    filesRejected: _angular_core.OutputEmitterRef<NgxDropzoneRejectedFile[]>;
+    /** کل لیست فعلی (بعد از هر تغییر) — برای binding راحت‌تر */
+    filesChange: _angular_core.OutputEmitterRef<File[]>;
+    protected readonly files: _angular_core.WritableSignal<NgxDropzoneFile[]>;
+    protected readonly isDragging: _angular_core.WritableSignal<boolean>;
+    private dragCounter;
+    private readonly fileInput;
+    protected readonly hint: _angular_core.Signal<string>;
+    protected formatSize(bytes: number): string;
+    ngOnDestroy(): void;
+    protected onDragEnter(ev: DragEvent): void;
+    protected onDragOver(ev: DragEvent): void;
+    protected onDragLeave(ev: DragEvent): void;
+    protected onDrop(ev: DragEvent): Promise<void>;
+    protected onBrowseClick(): void;
+    protected onKeydown(ev: KeyboardEvent): void;
+    protected onFileInputChange(ev: Event): void;
+    protected removeFile(id: string): void;
+    private handleIncomingFiles;
+    private emitCurrentFiles;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxDropzoneComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxDropzoneComponent, "ngx-dropzone", never, { "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "maxFiles": { "alias": "maxFiles"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "showFileList": { "alias": "showFileList"; "required": false; "isSignal": true; }; }, { "filesAdded": "filesAdded"; "filesRejected": "filesRejected"; "filesChange": "filesChange"; }, never, ["[dropzone-icon]", "*"], true, never>;
+}
+
+/**
+ * چک می‌کنه یه فایل با pattern رشته‌ای accept (مثل input[type=file])
+ * مطابقت داره یا نه. پشتیبانی می‌شه از:
+ *  - MIME کامل: "image/png"
+ *  - MIME با wildcard: "image/*"
+ *  - پسوند فایل: ".png", ".jpg"
+ *  - لیست کاما-جدا از موارد بالا: "image/*,.pdf,.docx"
+ */
+declare function matchesAccept(file: File, accept?: string): boolean;
+/** تبدیل بایت به یه رشته‌ی خوانا (KB/MB/GB) */
+declare function formatBytes(bytes: number): string;
+/** استخراج فایل‌های واقعی از یک DataTransfer، شامل پیمایش بازگشتیِ پوشه‌ها (وقتی مرورگر پشتیبانی کنه) */
+declare function extractFilesFromDataTransfer(dataTransfer: DataTransfer): Promise<File[]>;
+
+export { NgxDropzoneComponent, extractFilesFromDataTransfer, formatBytes, matchesAccept };
+export type { NgxDropzoneFile, NgxDropzoneRejectedFile, NgxDropzoneRejectionReason };

package/types/ngx-kit-form-field.d.ts

@@ -0,0 +1,31 @@
+import * as _angular_core from '@angular/core';
+
+type NgxFormFieldType = 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search' | 'textarea';
+
+declare class NgxFormField {
+    readonly value: _angular_core.ModelSignal<string | number>;
+    readonly label: _angular_core.InputSignal<string>;
+    readonly type: _angular_core.InputSignal<NgxFormFieldType>;
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly required: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    readonly float: _angular_core.InputSignal<boolean>;
+    readonly name: _angular_core.InputSignal<string | null>;
+    readonly autocomplete: _angular_core.InputSignal<string | null>;
+    readonly rows: _angular_core.InputSignal<number>;
+    readonly hint: _angular_core.InputSignal<string>;
+    readonly errorMessages: _angular_core.InputSignal<string[]>;
+    readonly dir: _angular_core.InputSignal<"" | "ltr" | "rtl">;
+    readonly id: _angular_core.InputSignal<string>;
+    readonly focused: _angular_core.OutputEmitterRef<void>;
+    readonly blurred: _angular_core.OutputEmitterRef<void>;
+    readonly hasValue: _angular_core.Signal<boolean>;
+    onInput(event: Event): void;
+    onFocus(): void;
+    onBlur(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxFormField, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxFormField, "ngx-form-field", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "float": { "alias": "float"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "focused": "focused"; "blurred": "blurred"; }, never, never, true, never>;
+}
+
+export { NgxFormField };

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

@@ -0,0 +1,168 @@
+import * as _angular_core from '@angular/core';
+
+interface NgxImageViewerItem {
+    src: string;
+    alt?: string;
+    caption?: string;
+    /** نام فایل هنگام دانلود؛ نبود یعنی از روی src حدس زده می‌شه */
+    downloadFileName?: string;
+}
+/**
+ * هر دکمه‌ی نوار ابزار جدا فعال/غیرفعال می‌شه — دقیقاً طبق خواسته: «این
+ * دکمه‌های کانفیگی باشه که هر کدوم خواست فعال کنه».
+ */
+interface NgxImageViewerToolbarConfig {
+    prevNext?: boolean;
+    counter?: boolean;
+    zoomIn?: boolean;
+    zoomOut?: boolean;
+    resetZoom?: boolean;
+    rotateLeft?: boolean;
+    rotateRight?: boolean;
+    download?: boolean;
+    print?: boolean;
+    fullscreen?: boolean;
+    close?: boolean;
+}
+declare const NGX_IMAGE_VIEWER_DEFAULT_TOOLBAR: Required<NgxImageViewerToolbarConfig>;
+
+/**
+ * ویوئر حرفه‌ایِ تصویر: یه لیست تصویر می‌گیره، اولی رو نشون می‌ده، با
+ * دکمه‌های چپ/راست (مثل کاروسل) بین‌شون می‌ره، و یه نوار ابزار کاملاً
+ * قابل‌تنظیم (هر دکمه جدا فعال/غیرفعال می‌شه) داره: زوم این/اوت/ریست،
+ * چرخش، دانلود، پرینت، تمام‌صفحه.
+ *
+ * تعامل‌ها:
+ *  - اسکرول موس روی تصویر = زوم (نسبت به همون نقطه‌ی زیر cursor، نه مرکز)
+ *  - دو انگشتی روی تاچ = پینچ زوم
+ *  - وقتی زوم‌شده، درگ با موس یا تک‌انگشتی = پن
+ *  - کیبورد: ← → برای قبلی/بعدی، +/- برای زوم، Esc برای closed
+ *
+ * چون wheel/touchmove باید preventDefault بشن (وگرنه صفحه اسکرول/زوم
+ * می‌شه) و انگیولار این ایونت‌ها رو به‌صورت پیش‌فرض passive رجیستر می‌کنه
+ * (که توش preventDefault اثر نداره)، این‌ها با addEventListener دستی و
+ * {passive:false} وصل می‌شن، نه با بایندینگ تمپلیت.
+ *
+ * می‌تونه هم مستقیم توی صفحه جا بگیره، هم توسط مصرف‌کننده داخل
+ * ngx-kit/dialog (یا هر overlay دیگه) قرار بگیره — خودش به هیچ‌کدوم وابسته
+ * نیست، فقط با closed خروجی به بیرون خبر می‌ده که «ببندم».
+ */
+declare class NgxImageViewerComponent {
+    images: _angular_core.InputSignal<NgxImageViewerItem[]>;
+    startIndex: _angular_core.InputSignal<number>;
+    toolbar: _angular_core.InputSignal<NgxImageViewerToolbarConfig>;
+    minZoom: _angular_core.InputSignal<number>;
+    maxZoom: _angular_core.InputSignal<number>;
+    zoomStep: _angular_core.InputSignal<number>;
+    indexChange: _angular_core.OutputEmitterRef<number>;
+    closed: _angular_core.OutputEmitterRef<void>;
+    protected readonly activeIndex: _angular_core.WritableSignal<number>;
+    protected readonly zoom: _angular_core.WritableSignal<number>;
+    protected readonly panX: _angular_core.WritableSignal<number>;
+    protected readonly panY: _angular_core.WritableSignal<number>;
+    protected readonly rotation: _angular_core.WritableSignal<number>;
+    protected readonly activeImage: _angular_core.Signal<NgxImageViewerItem | undefined>;
+    protected readonly toolbarConfig: _angular_core.Signal<{
+        prevNext: boolean;
+        counter: boolean;
+        zoomIn: boolean;
+        zoomOut: boolean;
+        resetZoom: boolean;
+        rotateLeft: boolean;
+        rotateRight: boolean;
+        download: boolean;
+        print: boolean;
+        fullscreen: boolean;
+        close: boolean;
+    }>;
+    protected readonly isZoomed: _angular_core.Signal<boolean>;
+    protected readonly stageTransform: _angular_core.Signal<string>;
+    private readonly stageEl;
+    private readonly hostElRef;
+    private readonly destroyRef;
+    private pinchStartDistance;
+    private pinchStartZoom;
+    private stopPanDrag?;
+    constructor();
+    protected onKeydown(ev: KeyboardEvent): void;
+    protected next(): void;
+    protected prev(): void;
+    protected goTo(index: number): void;
+    protected zoomIn(): void;
+    protected zoomOut(): void;
+    protected resetView(): void;
+    protected rotateLeft(): void;
+    protected rotateRight(): void;
+    protected download(): Promise<void>;
+    protected print(): void;
+    protected toggleFullscreen(): void;
+    protected close(): void;
+    protected onPanPointerDown(ev: MouseEvent): void;
+    private beginPanDrag;
+    private setZoomAtCenter;
+    private applyZoomAt;
+    private clientXOf;
+    private clientYOf;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxImageViewerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxImageViewerComponent, "ngx-image-viewer", never, { "images": { "alias": "images"; "required": true; "isSignal": true; }; "startIndex": { "alias": "startIndex"; "required": false; "isSignal": true; }; "toolbar": { "alias": "toolbar"; "required": false; "isSignal": true; }; "minZoom": { "alias": "minZoom"; "required": false; "isSignal": true; }; "maxZoom": { "alias": "maxZoom"; "required": false; "isSignal": true; }; "zoomStep": { "alias": "zoomStep"; "required": false; "isSignal": true; }; }, { "indexChange": "indexChange"; "closed": "closed"; }, never, never, true, never>;
+}
+
+interface NgxImageViewerOpenOptions {
+    startIndex?: number;
+    toolbar?: NgxImageViewerToolbarConfig;
+    minZoom?: number;
+    maxZoom?: number;
+    zoomStep?: number;
+}
+/**
+ * راه میان‌بر برای وقتی که کاربر می‌خواد ویوئر رو داخل یه دیالوگِ تمام‌صفحه
+ * باز کنه، بدون این‌که خودش دستی wire کنه. اگه کسی می‌خواد داخل دیالوگِ
+ * خودش (مثلاً ngx-kit/dialog) بذارتش، کافیه مستقیم از NgxImageViewerComponent
+ * استفاده کنه — این سرویس صرفاً یه میان‌بَره، وابستگی اجباری نیست.
+ *
+ * دقیقاً همون الگوی امن‌شده‌ی NgxMessageService: با Map<id, ComponentRef> و
+ * detachView قبل از destroy، تا اون نشتی حافظه‌ای که قبلاً توی message
+ * service پیدا و رفع شد، اینجا از اول تکرار نشه.
+ */
+declare class NgxImageViewerService {
+    private readonly appRef;
+    private readonly envInjector;
+    private nextId;
+    private readonly openInstances;
+    open(images: NgxImageViewerItem[], options?: NgxImageViewerOpenOptions): {
+        close: () => void;
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxImageViewerService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<NgxImageViewerService>;
+}
+
+interface PanZoomState {
+    zoom: number;
+    panX: number;
+    panY: number;
+}
+/**
+ * با تغییر zoom، pan رو طوری تنظیم می‌کنه که نقطه‌ی زیر cursor/انگشت‌ها
+ * (نسبت به مرکز کانتینر) سرجاش بمونه — یعنی zoom-to-cursor به‌جای
+ * zoom-to-center (که تجربه‌ی خیلی بهتری داره، دقیقاً مثل هر ویوئر حرفه‌ای).
+ *
+ * ریاضیِ پشتش: با transform="translate(panX,panY) scale(zoom)"، موقعیتِ
+ * صفحه‌ایِ یه نقطه‌ی محلیِ p (نسبت به مرکز) برابره با
+ * center + pan + p*zoom. اول p رو از روی وضعیت فعلی حساب می‌کنیم، بعد pan
+ * جدید رو طوری می‌سازیم که با zoom تازه، همون p به همون مختصات صفحه برسه.
+ */
+declare function zoomAroundPoint(current: PanZoomState, newZoom: number, cursorX: number, cursorY: number, containerWidth: number, containerHeight: number): PanZoomState;
+declare function distanceBetweenTouches(a: Touch, b: Touch): number;
+declare function midpointOfTouches(a: Touch, b: Touch): {
+    x: number;
+    y: number;
+};
+declare function clamp(value: number, min: number, max: number): number;
+
+/** دانلود تصویر با fetch→blob (نام‌گذاریِ درست فایل رو تضمین می‌کنه)؛ اگه CORS اجازه نداد، در تب جدید باز می‌شه */
+declare function downloadImage(src: string, filename?: string): Promise<void>;
+/** یه پنجره‌ی جدید فقط با همون تصویر باز می‌کنه و بعد از لود، print می‌زنه؛ با DOM API (نه innerHTML) پس در برابر src مخرب امنه */
+declare function printImage(src: string): void;
+
+export { NGX_IMAGE_VIEWER_DEFAULT_TOOLBAR, NgxImageViewerComponent, NgxImageViewerService, clamp, distanceBetweenTouches, downloadImage, midpointOfTouches, printImage, zoomAroundPoint };
+export type { NgxImageViewerItem, NgxImageViewerOpenOptions, NgxImageViewerToolbarConfig, PanZoomState };

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

@@ -173,8 +173,11 @@ declare class MSG {
     static success(title: string, text?: string, options?: IMessageOptions): ngx_kit_message.MessageOutput<any>;
     static warning(title: string, text?: string, options?: IMessageOptions): ngx_kit_message.MessageOutput<any>;
     static error(title: string, text?: string, options?: IMessageOptions): ngx_kit_message.MessageOutput<any>;
+    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;
@@ -216,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;
@@ -223,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;
@@ -240,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>;
@@ -291,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 };