@acorex/components 21.0.1-next.0 → 21.0.1-next.2

package/loading-dialog/index.d.ts

@@ -1,8 +1,9 @@
 import { AXStyleColorType, AXStyleLookType, AXHotKeyAction, MXBaseComponent } from '@acorex/cdk/common';
+import { AXOverlayRef } from '@acorex/cdk/overlay';
 import { AXDialogButtonItem } from '@acorex/components/dialog';
 import { AXProgressMode } from '@acorex/components/progress-bar';
 import * as i0 from '@angular/core';
-import { WritableSignal } from '@angular/core';
+import { OnInit, WritableSignal } from '@angular/core';
 
 interface AXLoadingDialogConfig {
     title: string;
@@ -28,22 +29,36 @@ interface AXLoadingDialogButtonItem {
         handled?: boolean;
     }) => void;
 }
-interface AXDialogRef {
+interface AXLoadingDialogRef {
     close(): void;
-    setProgressValue(value: number): any;
-    setProgressText(text: string): any;
-    setDialogTitle(text: string): any;
-    setProgressColor(color: AXStyleColorType): any;
-    setProgressStatus(status: string): any;
+    setProgressValue(value: number): void;
+    setProgressText(text: string): void;
+    setDialogTitle(text: string): void;
+    setProgressColor(color: AXStyleColorType): void;
+    setProgressStatus(status: string): void;
+}
+/**
+ * @deprecated Use AXLoadingDialogRef instead
+ */
+type AXDialogRef = AXLoadingDialogRef;
+/**
+ * @internal
+ * Internal reference used by loading dialog service to manage overlay instances
+ */
+interface AXLoadingDialogInternalRef {
+    overlayRef: AXOverlayRef<unknown>;
+    close: () => void;
 }
 
 /**
  * Represents a loading dialog component with custom styles and encapsulation.
  * @category components
  */
-declare class AXLoadingDialogComponent extends MXBaseComponent {
-    data: AXLoadingDialogConfig;
-    private dialogRef;
+declare class AXLoadingDialogComponent extends MXBaseComponent implements OnInit {
+    /** Loading dialog configuration data */
+    data: i0.InputSignal<AXLoadingDialogConfig>;
+    /** @internal Callback function to close the dialog */
+    onClose: i0.InputSignal<() => void>;
     /** @ignore */
     protected progressText: WritableSignal<string>;
     /** @ignore */
@@ -54,6 +69,7 @@ declare class AXLoadingDialogComponent extends MXBaseComponent {
     protected dialogTitle: WritableSignal<string>;
     /** @ignore */
     protected progressValue: WritableSignal<number>;
+    ngOnInit(): void;
     /**
      * Closes the loading dialog.
      *
@@ -100,7 +116,7 @@ declare class AXLoadingDialogComponent extends MXBaseComponent {
     /** @ignore */
     protected _hasAutoFocus(button: AXLoadingDialogButtonItem): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXLoadingDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXLoadingDialogComponent, "ax-loading-dialog", never, {}, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXLoadingDialogComponent, "ax-loading-dialog", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "onClose": { "alias": "onClose"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class AXLoadingDialogModule {
@@ -110,17 +126,17 @@ declare class AXLoadingDialogModule {
 }
 
 declare class AXLoadingDialogService {
-    private dialog;
+    private overlayService;
     /**
      * Opens a loading dialog with the specified configuration.
      *
      * @param options Configuration for the loading dialog, including title, progress mode, and optional initial values.
-     * @returns AXDialogRef - A reference with helper methods to control the dialog lifecycle and UI (close, setProgressValue, setProgressText, setDialogTitle, setProgressColor, setProgressStatus).
+     * @returns AXLoadingDialogRef - A reference with helper methods to control the dialog lifecycle and UI (close, setProgressValue, setProgressText, setDialogTitle, setProgressColor, setProgressStatus).
      */
-    show(options: AXLoadingDialogConfig): AXDialogRef;
+    show(options: AXLoadingDialogConfig): AXLoadingDialogRef;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXLoadingDialogService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<AXLoadingDialogService>;
 }
 
 export { AXLoadingDialogComponent, AXLoadingDialogModule, AXLoadingDialogService };
-export type { AXDialogRef, AXLoadingDialogButtonItem, AXLoadingDialogConfig };
+export type { AXDialogRef, AXLoadingDialogButtonItem, AXLoadingDialogConfig, AXLoadingDialogInternalRef, AXLoadingDialogRef };

package/menu/index.d.ts

@@ -65,6 +65,8 @@ declare class AXContextMenuComponent extends NXComponent {
     private renderer;
     private document;
     private platformID;
+    private zIndexService;
+    private zToken;
     /** @ignore */
     constructor();
     ngOnDestroy(): void;
@@ -127,6 +129,8 @@ declare class AXMenuItemComponent extends NXComponent implements OnDestroy {
     private scrollableParents;
     private unsuscriber;
     private renderer;
+    private zIndexService;
+    private zToken;
     protected arrowIcon: _angular_core.Signal<string>;
     onClick: _angular_core.OutputEmitterRef<AXMenuItemClickEvent>;
     name: _angular_core.InputSignal<string>;

package/modal/index.d.ts

@@ -33,6 +33,8 @@ interface AXModalRef<TResult = any> {
     restore: () => void;
     close: (data?: TResult) => void;
     setInputs: (values: AXComponentInputs) => void;
+    /** Brings this modal to the front of all other overlays */
+    bringToFront: () => void;
     onClose: Subject<TResult>;
 }
 declare abstract class AXModalComponentBase {
@@ -41,6 +43,7 @@ declare abstract class AXModalComponentBase {
     minimize(): void;
     restore(): void;
     maximize(): void;
+    bringToFront(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXModalComponentBase, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<AXModalComponentBase, never, never, { "__modal__": { "alias": "__modal__"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -117,6 +120,10 @@ declare class AXModalService {
      * Restores the modal from minimized or maximized state.
      */
     restore(): Promise<void>;
+    /**
+     * Brings the modal to the front of all other overlays.
+     */
+    bringToFront(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXModalService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<AXModalService>;
 }

package/notification/index.d.ts

@@ -1,10 +1,9 @@
-import { AXStyleColorType, AXStyleLookType, AXLocation, MXBaseComponent, AXComponentCloseEvent } from '@acorex/cdk/common';
-import { ComponentType, Portal } from '@angular/cdk/portal';
-import * as i0 from '@angular/core';
-import { TemplateRef, OnInit, InjectionToken } from '@angular/core';
-import { DialogRef } from '@angular/cdk/dialog';
+import { AXStyleColorType, AXStyleLookType, AXLocation, MXBaseComponent } from '@acorex/cdk/common';
+import { AXOverlayRef } from '@acorex/cdk/overlay';
+import * as _angular_core from '@angular/core';
+import { TemplateRef, Type, OnInit, InjectionToken } from '@angular/core';
 
-type AXNotificationContentType = string | TemplateRef<unknown> | ComponentType<unknown>;
+type AXNotificationContentType = string | TemplateRef<unknown> | Type<unknown>;
 interface AXNotificationButtonItem {
     color?: AXStyleColorType;
     look?: AXStyleLookType;
@@ -43,6 +42,16 @@ interface AXNotificationData {
 interface AXNotificationRef {
     close(): void;
 }
+/**
+ * @internal
+ * Internal reference used by notification service to manage overlay instances
+ */
+interface AXNotificationInternalRef {
+    id: string;
+    overlayRef: AXOverlayRef<unknown>;
+    config: AXNotificationData;
+    close: () => void;
+}
 
 /**
  * The Button is a component which detects user interaction and triggers a corresponding event
@@ -50,31 +59,40 @@ interface AXNotificationRef {
  * @category Components
  */
 declare class AXNotificationComponent extends MXBaseComponent implements OnInit {
-    config: AXNotificationData;
-    dialogRef: DialogRef<AXComponentCloseEvent, unknown>;
+    /** Notification configuration data */
+    config: _angular_core.InputSignal<AXNotificationData>;
+    /** @internal Callback function to close the notification */
+    onClose: _angular_core.InputSignal<() => void>;
+    private notificationService;
     /** @ignore */
-    _selectedPortal: Portal<unknown>;
-    /** @ignore */
-    _icon: string;
+    protected _icon: string;
     private intervalId;
     private isPaused;
-    protected remainingTime: i0.WritableSignal<number>;
-    protected transitionDuration: i0.WritableSignal<number>;
+    protected remainingTime: _angular_core.WritableSignal<number>;
+    protected transitionDuration: _angular_core.WritableSignal<number>;
+    /** Template content if config.content is a TemplateRef */
+    protected templateContent: _angular_core.Signal<TemplateRef<unknown>>;
+    /** Component content if config.content is a component Type */
+    protected componentContent: _angular_core.Signal<Type<unknown>>;
+    /** String content if config.content is a string */
+    protected stringContent: _angular_core.Signal<string>;
     ngOnInit(): void;
     private pauseAnimation;
     private _handleTimeOut;
     /** @ignore */
-    private _initContent;
-    /** @ignore */
     private _initIcon;
     /** @ignore */
     protected _handleButtonClick(button: AXNotificationButtonItem): void;
     /**
-     * Closes the dialog and provides the component and HTML element for reference.
+     * Closes the notification.
      */
     close(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXNotificationComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXNotificationComponent, "ax-notification", never, {}, {}, never, never, true, never>;
+    /**
+     * Closes all notifications.
+     */
+    closeAll(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXNotificationComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXNotificationComponent, "ax-notification", never, { "config": { "alias": "config"; "required": true; "isSignal": true; }; "onClose": { "alias": "onClose"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 interface AXNotificationConfig {
@@ -92,18 +110,18 @@ type PartialNotificationConfig = Partial<AXNotificationConfig>;
 declare function notificationConfig(config?: PartialNotificationConfig): AXNotificationConfig;
 
 declare class AXNotificationModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXNotificationModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXNotificationModule, never, [typeof AXNotificationComponent], [typeof AXNotificationComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<AXNotificationModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXNotificationModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXNotificationModule, never, [typeof AXNotificationComponent], [typeof AXNotificationComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXNotificationModule>;
 }
 
 declare class AXNotificationService {
-    private dialog;
+    private overlayService;
     private translationService;
     private defaultConfig;
     private activeNotifications;
     private reservedNotifications;
-    private notificationCounterElement;
+    private notificationCounterRef;
     private moreNotificationsColor;
     private moreNotificationsLocation;
     private reserveCounter;
@@ -112,14 +130,15 @@ declare class AXNotificationService {
     hideAll(): void;
     private handleShowReservedNotification;
     private handleReservedNotificationCounter;
-    private createReservedCounternotification;
+    private createReservedCounterNotification;
+    private positionNotification;
     private reposition;
     private getRepositionPosition;
+    private applyRepositionPosition;
     private getPosition;
-    private getPositionStrategy;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXNotificationService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<AXNotificationService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXNotificationService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<AXNotificationService>;
 }
 
 export { AXNotificationComponent, AXNotificationDefaultConfig, AXNotificationModule, AXNotificationService, AX_NOTIFICATION_CONFIG, notificationConfig };
-export type { AXNotificationButtonItem, AXNotificationConfig, AXNotificationContentType, AXNotificationData, AXNotificationOptions, AXNotificationRef, PartialNotificationConfig };
+export type { AXNotificationButtonItem, AXNotificationConfig, AXNotificationContentType, AXNotificationData, AXNotificationInternalRef, AXNotificationOptions, AXNotificationRef, PartialNotificationConfig };

package/number-box/index.d.ts

@@ -37,7 +37,7 @@ declare class AXNumberBoxComponent extends AXNumberBoxComponent_base {
     protected handleDownClick(): void;
     protected handleOnMaskChanged(e: AXInputMaskEvent): void;
     protected onWheel(event: WheelEvent): void;
-    reset(e?: boolean): void;
+    reset(): void;
     private get __hostName();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXNumberBoxComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXNumberBoxComponent, "ax-number-box", never, { "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "value": { "alias": "value"; "required": false; }; "state": { "alias": "state"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "look": { "alias": "look"; "required": false; }; "minValue": { "alias": "minValue"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; "showSpinButtons": { "alias": "showSpinButtons"; "required": false; "isSignal": true; }; "thousandsSeparator": { "alias": "thousandsSeparator"; "required": false; "isSignal": true; }; "decimals": { "alias": "decimals"; "required": false; "isSignal": true; }; "changeOnScroll": { "alias": "changeOnScroll"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "stateChange": "stateChange"; "onValueChanged": "onValueChanged"; "onBlur": "onBlur"; "onFocus": "onFocus"; "readonlyChange": "readonlyChange"; "disabledChange": "disabledChange"; "onKeyDown": "onKeyDown"; "onKeyUp": "onKeyUp"; "onKeyPress": "onKeyPress"; "thousandsSeparator": "thousandsSeparatorChange"; }, never, ["ax-prefix", "ax-clear-button", "ax-suffix", "ax-validation-rule"], true, never>;

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@acorex/components",
-  "version": "21.0.1-next.0",
+  "version": "21.0.1-next.2",
   "peerDependencies": {
-    "@acorex/core": "21.0.1-next.0",
-    "@acorex/cdk": "21.0.1-next.0",
+    "@acorex/core": "21.0.1-next.2",
+    "@acorex/cdk": "21.0.1-next.2",
     "@angular/common": "^20.0.0",
     "@angular/core": "^20.0.0",
     "@angular/cdk": "^20.0.0",
@@ -177,10 +177,6 @@
       "types": "./data-table/index.d.ts",
       "default": "./fesm2022/acorex-components-data-table.mjs"
     },
-    "./datetime-box": {
-      "types": "./datetime-box/index.d.ts",
-      "default": "./fesm2022/acorex-components-datetime-box.mjs"
-    },
     "./datetime-input": {
       "types": "./datetime-input/index.d.ts",
       "default": "./fesm2022/acorex-components-datetime-input.mjs"
@@ -189,6 +185,10 @@
       "types": "./datetime-picker/index.d.ts",
       "default": "./fesm2022/acorex-components-datetime-picker.mjs"
     },
+    "./datetime-box": {
+      "types": "./datetime-box/index.d.ts",
+      "default": "./fesm2022/acorex-components-datetime-box.mjs"
+    },
     "./decorators": {
       "types": "./decorators/index.d.ts",
       "default": "./fesm2022/acorex-components-decorators.mjs"

package/paint/index.d.ts

@@ -98,6 +98,11 @@ declare class AXPaintViewComponent implements OnDestroy {
     protected hostElem: ElementRef<any>;
     /** @ignore */
     private resizeEvent;
+    /**
+     * Specifies the class that pass to component.
+     *
+     */
+    readonly customClass: _angular_core.InputSignal<string>;
     readonly paintBackgroundColor: _angular_core.InputSignal<"black" | "white">;
     /** @ignore */
     protected canvasElem: _angular_core.Signal<ElementRef<HTMLCanvasElement>>;
@@ -129,7 +134,7 @@ declare class AXPaintViewComponent implements OnDestroy {
     getOutPut(e: 'image/webp' | 'image/png' | 'image/jpeg'): void;
     get __hostClass(): string[];
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXPaintViewComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXPaintViewComponent, "ax-paint-view", never, { "paintBackgroundColor": { "alias": "paintBackgroundColor"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXPaintViewComponent, "ax-paint-view", never, { "customClass": { "alias": "class"; "required": false; "isSignal": true; }; "paintBackgroundColor": { "alias": "paintBackgroundColor"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class AXPaintToolsSelectorComponent {

package/popover/index.d.ts

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { OnDestroy, ElementRef, ComponentRef, TemplateRef, EventEmitter } from '@angular/core';
 import { MXBaseComponent, AXPlacementType, AXEvent } from '@acorex/cdk/common';
-import { ComponentType } from '@angular/cdk/portal';
+import { AXComponentType } from '@acorex/core/components';
 import * as i1 from '@angular/common';
 
 type AXPopoverOpenTrigger = 'manual' | 'click' | 'hover' | 'toggle';
@@ -11,27 +11,19 @@ type AXPopoverCloseTrigger = 'manual' | 'clickOut' | 'leave';
  * A popover component with custom encapsulation and change detection settings.
  */
 declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
-    #private;
+    private platform;
     private document;
     private platformID;
-    private renderer;
-    private onKeyDownListenerFn;
-    /** @ignore */
-    private _platform;
-    /** @ignore */
-    private _overlay;
+    private overlayService;
+    private onKeyDownHandler;
     /** @ignore */
     private _overlayRef;
     /** @ignore */
-    private _isMouseOverButton;
-    /** @ignore */
-    private _isMouseOverTooltip;
-    /** @ignore */
     private _lastActiveElement;
     /** @ignore */
     private _targetEvents;
     /** @ignore */
-    private _overlayEvents;
+    private _outsideClickHandler;
     /** @ignore */
     private resizeObserver;
     /** @ignore */
@@ -76,7 +68,7 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
      */
     set target(v: Element | ElementRef | MXBaseComponent);
     /** @ignore */
-    private _defautPlacements;
+    private _defaultPlacements;
     /** @ignore */
     private _placements;
     /** @ignore */
@@ -90,13 +82,11 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
      */
     set placement(v: AXPlacementType);
     /** @ignore */
-    private _portal;
-    /** @ignore */
     private _componentRef;
     /**
      * Gets the reference to the component.
      */
-    get componentRef(): ComponentRef<unknown>;
+    get componentRef(): ComponentRef<unknown> | null;
     /**
      * Holds the context data for the component.
      */
@@ -106,7 +96,7 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
     /**
      * Defines the content to be displayed, which can be a template or a component.
      */
-    content: TemplateRef<unknown> | ComponentType<unknown>;
+    content: TemplateRef<unknown> | AXComponentType<unknown>;
     /** @ignore */
     private _openOn;
     /**
@@ -125,7 +115,6 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
     get closeOn(): AXPopoverCloseTrigger;
     /**
      * Sets the trigger for closing the popover and rebinds target events.
-     * @param v
      */
     set closeOn(v: AXPopoverCloseTrigger);
     /**
@@ -145,7 +134,7 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
      */
     backdropClass: string;
     /**
-     * CSS class to apply to the backdrop element.
+     * CSS class to apply to the panel element.
      */
     panelClass: string;
     /**
@@ -167,10 +156,6 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
     /** @ignore */
     private _emitOnClosedEvent;
     /** @ignore */
-    protected _handleMouseEnter(e: MouseEvent): void;
-    /** @ignore */
-    protected _handleMouseLeave(e: MouseEvent): void;
-    /** @ignore */
     private removeTargetEvents;
     /** @ignore */
     private bindTargetEvents;
@@ -178,6 +163,8 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
     private bindOverlayEvents;
     /** @ignore */
     private removeOverlayEvents;
+    /** @ignore */
+    private handleOverlayDisposed;
     /**
      * Toggles the component's open state.
      */
@@ -189,7 +176,11 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
     /**
      * Opens the component if it's not already open, saves focus, opens the overlay, and emits the opened event.
      */
-    open(): void;
+    open(): Promise<void>;
+    /** @ignore */
+    private addKeyDownListener;
+    /** @ignore */
+    private removeKeyDownListener;
     /** @ignore */
     private saveFocus;
     /** @ignore */
@@ -207,8 +198,6 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
      */
     get isActionsheetStyle(): boolean;
     /** @ignore */
-    private updatePositionStrategy;
-    /** @ignore */
     private updateOffset;
     /**
      * Updates the position of the overlay and focuses on it.
@@ -218,6 +207,10 @@ declare class AXPopoverComponent extends MXBaseComponent implements OnDestroy {
      * Focuses the overlay element.
      */
     focus(): void;
+    /**
+     * Brings this popover to the front of all other overlays.
+     */
+    bringToFront(): void;
     /** @ignore */
     private initializeResizeObserver;
     /** @ignore */