@acorex/components 21.0.0-next.5 → 21.0.0-next.51

package/data-table/index.d.ts

@@ -1,7 +1,7 @@
 import * as i2 from '@acorex/cdk/common';
-import { AXEvent, MXBaseComponent, AXDataSource, AXSortOrder, AXButtonClickEvent, AXItemClickEvent, AXValueChangedEvent, AXListDataSource } from '@acorex/cdk/common';
+import { AXEvent, MXBaseComponent, AXDataSource, AXSortOrder, AXStyleLookType, AXButtonClickEvent, AXItemClickEvent, AXClickEvent, AXValueChangedEvent } from '@acorex/cdk/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, TemplateRef, ChangeDetectorRef, OnInit, DoCheck, QueryList, WritableSignal, ElementRef, AfterViewInit, Signal } from '@angular/core';
+import { TemplateRef, EventEmitter, ChangeDetectorRef, OnInit, AfterViewInit, WritableSignal, Signal, QueryList } from '@angular/core';
 import * as i11 from '@acorex/core/format';
 import { AXFormatOptions } from '@acorex/core/format';
 import * as i8 from '@acorex/components/button';
@@ -41,7 +41,11 @@ declare abstract class AXBaseDataTable extends MXBaseComponent {
      *
      * @defaultValue `parentId`
      */
-    parentField: string;
+    parentField: string | undefined;
+    /**
+     * Template for expanded custom row content.
+     */
+    rowDetailsTemplate?: TemplateRef<unknown>;
     selectedRowsChange: EventEmitter<unknown[]>;
     /**
      * Gets the data source key field name.
@@ -86,7 +90,15 @@ declare abstract class AXBaseDataTable extends MXBaseComponent {
 
 declare abstract class AXDataTableColumnComponent {
     caption: string;
-    width: string | number;
+    /**
+     * Width of the column.
+     * - string: e.g., '180px', '20%'
+     * - number: e.g., 180 (treated as pixels)
+     * - 'auto': automatically fits to content after data load
+     *
+     * @defaultValue 'auto'
+     */
+    width: string | number | 'auto';
     fixed: 'start' | 'end' | undefined;
     allowSorting: boolean;
     allowResizing: boolean;
@@ -245,14 +257,24 @@ declare class AXDataTableTextColumnComponent extends AXDataTableColumnComponent
     static ɵcmp: i0.ɵɵComponentDeclaration<AXDataTableTextColumnComponent, "ax-text-column", never, { "width": { "alias": "width"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "allowSorting": { "alias": "allowSorting"; "required": false; }; "allowResizing": { "alias": "allowResizing"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "customExpandIcon": { "alias": "customExpandIcon"; "required": false; }; "customCollapseIcon": { "alias": "customCollapseIcon"; "required": false; }; "dataField": { "alias": "dataField"; "required": false; }; "expandHandler": { "alias": "expandHandler"; "required": false; }; "wrapText": { "alias": "wrapText"; "required": false; }; "cellTemplate": { "alias": "cellTemplate"; "required": false; }; "footerTemplate": { "alias": "footerTemplate"; "required": false; }; "headerTemplate": { "alias": "headerTemplate"; "required": false; }; "format": { "alias": "format"; "required": false; }; "formatOptions": { "alias": "formatOptions"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-type AXRowCommandItem = AXButtonItemListItem;
-type AXRowCommandItemClickEvent = AXButtonClickEvent;
+type AXRowCommandItem = AXButtonItemListItem & {
+    commandId?: string;
+    look?: AXStyleLookType;
+};
+interface AXRowCommandItemClickEvent extends AXButtonClickEvent {
+    setLoading?: (loading: boolean) => void;
+}
 declare abstract class AXBaseRowCommandColumnComponent extends AXDataTableColumnComponent {
     protected grid: AXBaseDataTable;
     protected cdr: ChangeDetectorRef;
+    protected commandLoading: i0.WritableSignal<string>;
+    private rowIdentityMap;
+    private rowIdentitySeq;
     allowSorting: boolean;
     get loadingEnabled(): boolean;
     get cssClass(): string;
+    protected resolveCommandId(rowData: unknown, commandName: string): string;
+    protected setCommandLoadingState(commandId: string, loading: boolean): void;
     onItemClick: EventEmitter<AXRowCommandItemClickEvent>;
 }
 /**
@@ -280,6 +302,10 @@ declare class AXRowDropdownCommandColumnComponent extends AXBaseRowCommandColumn
      */
     get renderHeaderTemplate(): TemplateRef<unknown>;
     footerTemplate: TemplateRef<unknown>;
+    emptyStateTemplate?: TemplateRef<unknown>;
+    emptyStateText: string;
+    protected itemsLoading: i0.WritableSignal<boolean>;
+    protected itemsFetched: i0.WritableSignal<boolean>;
     /**
      *  @ignore
      */
@@ -298,6 +324,7 @@ declare class AXRowDropdownCommandColumnComponent extends AXBaseRowCommandColumn
      */
     protected _items: AXRowCommandItem[];
     items: AXRowCommandItem[] | ((rowData: unknown) => AXRowCommandItem[] | Promise<AXRowCommandItem[]>);
+    private dropdownLoadingEffect;
     /**
      *  @ignore
      */
@@ -306,12 +333,14 @@ declare class AXRowDropdownCommandColumnComponent extends AXBaseRowCommandColumn
      *  @ignore
      */
     protected handleOnClosed(): void;
+    private decorateItems;
+    private applyLoadingState;
     /**
      *  @ignore
      */
     protected handleOnItemClick(e: AXItemClickEvent<AXButtonItemComponent>, data: unknown): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXRowDropdownCommandColumnComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXRowDropdownCommandColumnComponent, "ax-dropdown-command-column", never, { "width": { "alias": "width"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "footerTemplate": { "alias": "footerTemplate"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "onItemClick": "onItemClick"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXRowDropdownCommandColumnComponent, "ax-dropdown-command-column", never, { "width": { "alias": "width"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "footerTemplate": { "alias": "footerTemplate"; "required": false; }; "emptyStateTemplate": { "alias": "emptyStateTemplate"; "required": false; }; "emptyStateText": { "alias": "emptyStateText"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "onItemClick": "onItemClick"; }, never, never, true, never>;
 }
 /**
  * A column for displaying command buttons in a data table.
@@ -363,10 +392,15 @@ declare class AXRowCommandColumnComponent extends AXBaseRowCommandColumnComponen
      *  @ignore
      */
     protected getItems(rowData: unknown): AXRowCommandItem[];
+    protected getItemsWithIds(rowData: unknown): Array<{
+        item: AXRowCommandItem;
+        commandId: string;
+    }>;
     /**
      *  @ignore
      */
-    protected handleOnItemClick(e: MouseEvent, item: AXRowCommandItem, data: unknown): void;
+    protected getCommandId(rowData: unknown, item: AXRowCommandItem): string;
+    protected handleOnItemClick(e: AXClickEvent, item: AXRowCommandItem, data: unknown): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXRowCommandColumnComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<AXRowCommandColumnComponent, "ax-command-column", never, { "width": { "alias": "width"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "footerTemplate": { "alias": "footerTemplate"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "onItemClick": "onItemClick"; }, never, never, true, never>;
 }
@@ -558,255 +592,6 @@ declare class AXRowSelectColumnComponent extends AXDataTableColumnComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<AXRowSelectColumnComponent, "ax-select-column", never, { "width": { "alias": "width"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-/**
- * Component for a data table with infinite scrolling capabilities.
- *
- * @category Components
- */
-declare class AXInfiniteScrollDataTableComponent extends AXBaseDataTable implements OnInit, DoCheck {
-    private document;
-    private platformID;
-    private ngZone;
-    /**
-     *  @ignore
-     */
-    protected columns: QueryList<AXDataTableColumnComponent>;
-    /**
-     *  @ignore
-     */
-    protected startFixedColumn(): AXDataTableColumnComponent[];
-    /**
-     *  @ignore
-     */
-    protected endFixedColumn(): AXDataTableColumnComponent[];
-    /**
-     *  @ignore
-     */
-    protected notFixedColumn(): AXDataTableColumnComponent[];
-    /**
-     *  @ignore
-     */
-    protected notFixedColumnCount(): number;
-    /**
-     *  @ignore
-     */
-    protected fixedColumnCount(): number;
-    /**
-     * Emits an event when the page changes.
-     *
-     * @event
-     */
-    onPageChanged: EventEmitter<AXValueChangedEvent<number>>;
-    /**
-     *  @ignore
-     */
-    private clickSubject;
-    /**
-     * Emits an event when a row is clicked.
-     *
-     * @event
-     */
-    onRowClick: EventEmitter<AXDataTableRowClick>;
-    /**
-     * Emits an event when a row is double-clicked.
-     *
-     * @event
-     */
-    onRowDbClick: EventEmitter<AXDataTableRowDbClick>;
-    /**
-     * Template for rendering rows in the data table.
-     */
-    rowTemplate?: TemplateRef<unknown>;
-    /**
-     * Template to display when the data table is empty.
-     */
-    emptyTemplate?: TemplateRef<unknown>;
-    /**
-     * Controls the visibility of the table header.
-     *
-     * @defaultValue true
-     */
-    showHeader: boolean;
-    /**
-     * Defines the mode for fetching data.
-     *
-     * @defaultValue 'auto'
-     */
-    fetchDataMode: 'auto' | 'manual';
-    /**
-     * Configuration for the loading state of the data table.
-     *
-     * @defaultValue { enabled: true, animation: true }
-     */
-    loading: {
-        enabled: boolean;
-        animation: boolean;
-        loadingTemplate?: TemplateRef<unknown>;
-    };
-    /**
-     *  @ignore
-     */
-    protected listDataSource: AXListDataSource<unknown>;
-    /**
-     *  @ignore
-     */
-    protected isLoading: WritableSignal<boolean>;
-    /**
-     *  @ignore
-     */
-    protected hasItems: boolean;
-    /**
-     *  @ignore
-     */
-    protected totalRows: number;
-    /**
-     *  @ignore
-     */
-    protected currentPage: number;
-    /**
-     *  @ignore
-     */
-    protected totalPages: number;
-    /**
-     *  @ignore
-     */
-    protected startRowIndex: number;
-    /**
-     *  @ignore
-     */
-    private lastIndex;
-    /**
-     * Event emitted when the focused row changes.
-     *
-     * @event
-     */
-    focusedRowChange: EventEmitter<unknown>;
-    /**
-     *  @ignore
-     */
-    private _focusedRow;
-    /**
-     * Retrieves the currently focused row.
-     */
-    get focusedRow(): unknown;
-    /**
-     * Sets the currently focused row and emits a change event.
-     *
-     * @param v - The row data to be set as focused.
-     */
-    set focusedRow(v: unknown);
-    /**
-     * Defines the height of each item in the table.
-     *
-     * @default 40
-     */
-    itemHeight: number | 'auto';
-    /**
-     *  @ignore
-     */
-    protected width: string;
-    /**
-     *  @ignore
-     */
-    protected height: string;
-    /**
-     *  @ignore
-     */
-    private viewport;
-    /**
-     * Emitted when the scroll index changes in the table.
-     *
-     * @event
-     */
-    onScrolledIndexChanged: EventEmitter<AXDataTableScrollIndexChanged>;
-    trackByIdx(i: any): any;
-    /**
-     *  @ignore
-     */
-    ngOnInit(): void;
-    /**
-     *  @ignore
-     */
-    headerContainer: ElementRef<HTMLDivElement>;
-    /**
-     *  @ignore
-     */
-    footerContainer: ElementRef;
-    /**
-     *  @ignore
-     */
-    scrollableContainer: ElementRef<HTMLDivElement>;
-    /**
-     *  @ignore
-     */
-    protected _handleOnscrolledIndexChange(e: number): void;
-    /**
-     *  @ignore
-     */
-    ngDoCheck(): void;
-    /**
-     *  @ignore
-     */
-    private updateTotalCount;
-    /**
-     *  @ignore
-     */
-    private updateHeight;
-    /**
-     *  @ignore
-     */
-    private updateWidth;
-    /**
-     *  @ignore
-     */
-    private updateHScroll;
-    /**
-     *  @ignore
-     */
-    private copyFixedColumns;
-    /**
-     * Updates the viewport by checking its size and scrolling to the last index.
-     * Marks the component for change detection.
-     * @ignore
-     */
-    render(): void;
-    /**
-     * Resets the index to zero and refreshes the data source.
-     * @ignore
-     */
-    refresh(): void;
-    /**
-     *  @ignore
-     */
-    protected handleRowClick(event: MouseEvent, item: unknown): void;
-    /**
-     *  @ignore
-     */
-    private handleRowSingleClick;
-    /**
-     *  @ignore
-     */
-    protected handleRowDoubleClick(e: MouseEvent, item: unknown): void;
-    /**
-     * Handles column header clicks to toggle sorting on the column.
-     *
-     * @param e - The mouse event triggered by the click.
-     * @param column - The column that was clicked.
-     * @ignore
-     */
-    handleColumnClick(e: MouseEvent, column: AXDataTableColumnComponent): void;
-    /**
-     *  @ignore
-     */
-    protected getSort(column: AXDataTableColumnComponent): string | undefined;
-    /**
-     *  @ignore
-     */
-    protected _handleOnScroll(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXInfiniteScrollDataTableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXInfiniteScrollDataTableComponent, "ax-infinite-scroll-data-table", never, { "dataSource": { "alias": "dataSource"; "required": false; }; "rowTemplate": { "alias": "rowTemplate"; "required": false; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "fetchDataMode": { "alias": "fetchDataMode"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "focusedRow": { "alias": "focusedRow"; "required": false; }; "itemHeight": { "alias": "itemHeight"; "required": false; }; }, { "selectedRowsChange": "selectedRowsChange"; "onPageChanged": "onPageChanged"; "onRowClick": "onRowClick"; "onRowDbClick": "onRowDbClick"; "focusedRowChange": "focusedRowChange"; "onScrolledIndexChanged": "onScrolledIndexChanged"; }, ["columns"], ["ax-header", "ax-footer"], true, never>;
-}
-
 /**
  * Component for displaying and managing a data table with advanced features.
  *
@@ -1025,7 +810,7 @@ declare class AXDataTableComponent extends AXBaseDataTable implements OnInit, Af
     /**
      *  @ignore
      */
-    private hasLoadedData;
+    private isRefreshCalled;
     /**
      * Returns true if in manual mode and no data has been loaded yet.
      */
@@ -1042,6 +827,15 @@ declare class AXDataTableComponent extends AXBaseDataTable implements OnInit, Af
      *  @ignore
      */
     ngAfterViewInit(): void;
+    /**
+     * Toggles the expanded state of a row without managing children.
+     * Used for row details template without nested hierarchy.
+     *
+     * @param rows - The array of rows to search in
+     * @param expandedItem - The item to toggle
+     * @returns Updated rows array with toggled state
+     */
+    protected toggleExpandedState(rows: any[], expandedItem: any): any[];
     protected toggleExpanded(rows: any[], expandedItem: any, children: any[]): any[];
     protected refreshExpandedItem(id: string | number): Promise<void>;
     private updateChildren;
@@ -1096,6 +890,14 @@ declare class AXDataTableComponent extends AXBaseDataTable implements OnInit, Af
      *  @ignore
      */
     protected calculateRowIndex(index: number): number;
+    /**
+     * Handles double-click on resize handle to auto-fit column width.
+     *
+     * @param event - The mouse event from the double-click
+     * @param columnIndex - The index of the column to auto-fit
+     * @ignore
+     */
+    protected onResizeHandlerDoubleClick(event: MouseEvent, columnIndex: number): void;
     /**
      *  @ignore
      */
@@ -1116,15 +918,49 @@ declare class AXDataTableComponent extends AXBaseDataTable implements OnInit, Af
      *  @ignore
      */
     private calculateStickyColumnsPositions;
+    /**
+     * Auto-fits columns that have width='auto'.
+     * Called automatically after data load.
+     *
+     * @ignore
+     */
+    private autoFitColumnsWithAutoWidth;
+    /**
+     * Auto-fits all columns width based on their content.
+     *
+     * @param options - Configuration options
+     * @param options.skipFixed - If true, skips fixed columns (default: true)
+     * @param options.skipLoading - If true, skips if data is loading (default: true)
+     * @param options.maxWidth - Maximum width for any column in pixels (default: 500)
+     * @returns void
+     */
+    autoFitAllColumns(options?: {
+        skipFixed?: boolean;
+        skipLoading?: boolean;
+        maxWidth?: number;
+    }): void;
+    /**
+     * Auto-fits a column width based on its content.
+     * Similar to Excel's "AutoFit Column Width" feature.
+     * Uses an invisible helper table to measure actual content width without affecting the main table.
+     *
+     * @param columnIndex - The index of the column to auto-fit (0-based, based on columns QueryList)
+     * @param options - Configuration options
+     * @param options.maxWidth - Maximum width for the column in pixels (default: none)
+     * @returns void
+     */
+    autoFitColumn(columnIndex: number, options?: {
+        maxWidth?: number;
+    }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXDataTableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDataTableComponent, "ax-data-table", never, { "dataSource": { "alias": "dataSource"; "required": false; }; "selectedRows": { "alias": "selectedRows"; "required": false; }; "parentField": { "alias": "parentField"; "required": false; }; "rowTemplate": { "alias": "rowTemplate"; "required": false; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; }; "noDataTemplate": { "alias": "noDataTemplate"; "required": false; }; "alternative": { "alias": "alternative"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "fixedHeader": { "alias": "fixedHeader"; "required": false; }; "showFooter": { "alias": "showFooter"; "required": false; }; "fixedFooter": { "alias": "fixedFooter"; "required": false; }; "itemHeight": { "alias": "itemHeight"; "required": false; }; "allowReordering": { "alias": "allowReordering"; "required": false; }; "paging": { "alias": "paging"; "required": false; }; "fetchDataMode": { "alias": "fetchDataMode"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "focusedRow": { "alias": "focusedRow"; "required": false; }; }, { "selectedRowsChange": "selectedRowsChange"; "focusedRowChange": "focusedRowChange"; "onRowClick": "onRowClick"; "onRowDbClick": "onRowDbClick"; "onColumnsOrderChanged": "onColumnsOrderChanged"; "onColumnSizeChanged": "onColumnSizeChanged"; "onPageChanged": "onPageChanged"; }, ["customDataPager", "columns"], ["ax-header", "ax-data-pager", "ax-footer"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXDataTableComponent, "ax-data-table", never, { "dataSource": { "alias": "dataSource"; "required": false; }; "selectedRows": { "alias": "selectedRows"; "required": false; }; "parentField": { "alias": "parentField"; "required": false; }; "rowDetailsTemplate": { "alias": "rowDetailsTemplate"; "required": false; }; "rowTemplate": { "alias": "rowTemplate"; "required": false; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; }; "noDataTemplate": { "alias": "noDataTemplate"; "required": false; }; "alternative": { "alias": "alternative"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "fixedHeader": { "alias": "fixedHeader"; "required": false; }; "showFooter": { "alias": "showFooter"; "required": false; }; "fixedFooter": { "alias": "fixedFooter"; "required": false; }; "itemHeight": { "alias": "itemHeight"; "required": false; }; "allowReordering": { "alias": "allowReordering"; "required": false; }; "paging": { "alias": "paging"; "required": false; }; "fetchDataMode": { "alias": "fetchDataMode"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "focusedRow": { "alias": "focusedRow"; "required": false; }; }, { "selectedRowsChange": "selectedRowsChange"; "focusedRowChange": "focusedRowChange"; "onRowClick": "onRowClick"; "onRowDbClick": "onRowDbClick"; "onColumnsOrderChanged": "onColumnsOrderChanged"; "onColumnSizeChanged": "onColumnSizeChanged"; "onPageChanged": "onPageChanged"; }, ["customDataPager", "columns"], ["ax-header", "ax-data-pager", "ax-footer"], true, never>;
 }
 
 declare class AXDataTableModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<AXDataTableModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDataTableModule, never, [typeof i1.CommonModule, typeof i2.AXCommonModule, typeof i3.ScrollingModule, typeof i4.AXTranslationModule, typeof i5.AXResultModule, typeof i6.AXLoadingModule, typeof i7.AXSkeletonModule, typeof i8.AXButtonModule, typeof i9.AXDecoratorModule, typeof i10.AXDropdownModule, typeof i11.AXFormatModule, typeof i2.AXRippleDirective, typeof i12.AXDataPagerModule, typeof i13.CdkDropList, typeof i13.CdkDrag, typeof i13.CdkDragPlaceholder, typeof i13.CdkDragHandle, typeof AXInfiniteScrollDataTableComponent, typeof AXDataTableComponent, typeof AXDataTableTextColumnComponent, typeof AXRowIndexColumnComponent, typeof AXRowSelectColumnComponent, typeof AXRowExpandColumnComponent, typeof AXRowCommandColumnComponent, typeof AXRowDropdownCommandColumnComponent, typeof AXDataTableColumnResizableDirective], [typeof AXInfiniteScrollDataTableComponent, typeof AXDataTableComponent, typeof AXDataTableTextColumnComponent, typeof AXRowIndexColumnComponent, typeof AXRowSelectColumnComponent, typeof AXRowExpandColumnComponent, typeof AXRowCommandColumnComponent, typeof AXRowDropdownCommandColumnComponent, typeof AXDataTableColumnResizableDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDataTableModule, never, [typeof i1.CommonModule, typeof i2.AXCommonModule, typeof i3.ScrollingModule, typeof i4.AXTranslationModule, typeof i5.AXResultModule, typeof i6.AXLoadingModule, typeof i7.AXSkeletonModule, typeof i8.AXButtonModule, typeof i9.AXDecoratorModule, typeof i10.AXDropdownModule, typeof i11.AXFormatModule, typeof i2.AXRippleDirective, typeof i12.AXDataPagerModule, typeof i13.CdkDropList, typeof i13.CdkDrag, typeof i13.CdkDragPlaceholder, typeof i13.CdkDragHandle, typeof AXDataTableComponent, typeof AXDataTableTextColumnComponent, typeof AXRowIndexColumnComponent, typeof AXRowSelectColumnComponent, typeof AXRowExpandColumnComponent, typeof AXRowCommandColumnComponent, typeof AXRowDropdownCommandColumnComponent, typeof AXDataTableColumnResizableDirective], [typeof AXDataTableComponent, typeof AXDataTableTextColumnComponent, typeof AXRowIndexColumnComponent, typeof AXRowSelectColumnComponent, typeof AXRowExpandColumnComponent, typeof AXRowCommandColumnComponent, typeof AXRowDropdownCommandColumnComponent, typeof AXDataTableColumnResizableDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<AXDataTableModule>;
 }
 
-export { AXBaseDataTable, AXBaseRowCommandColumnComponent, AXDataTableColumnComponent, AXDataTableColumnResizableDirective, AXDataTableComponent, AXDataTableModule, AXDataTableTextColumnComponent, AXInfiniteScrollDataTableComponent, AXRowCommandColumnComponent, AXRowDropdownCommandColumnComponent, AXRowExpandColumnComponent, AXRowIndexColumnComponent, AXRowSelectColumnComponent };
+export { AXBaseDataTable, AXBaseRowCommandColumnComponent, AXDataTableColumnComponent, AXDataTableColumnResizableDirective, AXDataTableComponent, AXDataTableModule, AXDataTableTextColumnComponent, AXRowCommandColumnComponent, AXRowDropdownCommandColumnComponent, AXRowExpandColumnComponent, AXRowIndexColumnComponent, AXRowSelectColumnComponent };
 export type { AXColumnsOrderChangedEvent, AXDataTableRowClick, AXDataTableRowDbClick, AXDataTableScrollIndexChanged, AXRowCommandItem, AXRowCommandItemClickEvent, onColumnSizeChangedEvent };

package/dialog/index.d.ts

@@ -109,7 +109,7 @@ declare class AXDialogService {
      * @param draggable - Whether the dialog can be dragged.
      * @returns Promise<void> - Promise that resolves when the dialog is closed.
      */
-    alert(title: string, content: string, type?: AXStyleColorType, orientation?: 'horizontal' | 'vertical', draggable?: boolean): Promise<void>;
+    alert(title: string, content: string, type?: AXStyleColorType, orientation?: 'horizontal' | 'vertical', draggable?: boolean, buttonLook?: AXStyleLookType): Promise<void>;
     /**
      * Show a confirm box with 'Okay' & 'Cancel' buttons.
      *

package/drawer/README.md

@@ -1,3 +1,3 @@
-# @acorex/components/drawer
+# @acorex/components/drawer-2
 
-Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer`.
+Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer-2`.

package/drawer/index.d.ts

@@ -1,86 +1,62 @@
-import { MXBaseComponent } from '@acorex/cdk/common';
-import * as i0 from '@angular/core';
-import { AfterContentInit, DoCheck } from '@angular/core';
-import * as i1 from '@angular/common';
+import { MXBaseComponent, AXClickEvent } from '@acorex/cdk/common';
+import * as _angular_core from '@angular/core';
+import * as i1 from '@acorex/cdk/drawer';
+import { AXDrawerLocation, AXDrawerMode } from '@acorex/cdk/drawer';
 
 /**
  * A container component that organizes and positions drawer components.
  * @category component
  */
 declare class AXDrawerContainerComponent extends MXBaseComponent {
-    private service;
-    constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerContainerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerContainerComponent, "ax-drawer-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, never>;
+    #private;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerContainerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXDrawerContainerComponent, "ax-drawer-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, [{ directive: typeof i1.AXDrawerContainerDirective; inputs: {}; outputs: {}; }]>;
 }
 
-type AXDrawerMode = 'push' | 'overlay';
-type AXDrawerLocation = 'start' | 'end';
 /**
  * A component that represents a drawer with header and content sections.
  *
  * @category Components
  */
-declare class AXDrawerComponent extends MXBaseComponent implements AfterContentInit, DoCheck {
+declare class AXDrawerComponent extends MXBaseComponent {
     #private;
-    location: i0.ModelSignal<AXDrawerLocation>;
-    showBackdrop: i0.InputSignal<boolean>;
-    mode: i0.ModelSignal<AXDrawerMode>;
-    closeOthers: i0.InputSignal<boolean>;
-    collapsed: i0.ModelSignal<boolean>;
-    private backdropElement;
-    protected loaded: i0.WritableSignal<boolean>;
-    private service;
-    private _zone;
-    private document;
-    private platformID;
-    /**
+    readonly location: _angular_core.InputSignal<AXDrawerLocation>;
+    readonly showBackdrop: _angular_core.InputSignal<boolean>;
+    readonly mode: _angular_core.InputSignal<AXDrawerMode>;
+    readonly transition: _angular_core.InputSignal<number>;
+    readonly closeOnBackdropClick: _angular_core.InputSignal<boolean>;
+    readonly backdropClass: _angular_core.InputSignal<string>;
+    readonly collapsed: _angular_core.InputSignal<boolean>;
+    readonly singleOpenMode: _angular_core.InputSignal<boolean>;
+    onBackdropClick: _angular_core.OutputEmitterRef<AXClickEvent>;
+    collapsedStateChanged: _angular_core.OutputEmitterRef<boolean>;
+    private drawerItem;
+    /**
+     * Toggles the drawer state between open and closed.
      *
-     *  @ignore
-     */
-    ngAfterContentInit(): void;
-    /**
-     *  @ignore
-     */
-    ngDoCheck(): void;
-    /**
-     *  @ignore
-     */
-    private _detectBoundingSize;
-    /**
-     * Toggles the collapsed state of the drawer.
+     * @returns void - No return value. The drawer state is toggled.
      */
     toggle(): void;
     /**
-     * Collapses the drawer.
-     * @ignore
+     * Closes the drawer.
+     *
+     * @returns void - No return value. The drawer is collapsed.
      */
     close(): void;
     /**
-     * Expands the drawer.
+     * Opens the drawer.
+     *
+     * @returns void - No return value. The drawer is expanded.
      */
     open(): void;
-    /**
-     *  @ignore
-     */
-    private _addBackdrop;
-    /**
-     *  @ignore
-     */
-    private _removeBackdrop;
-    /**
-     *  @ignore
-     */
-    private get __hostClass();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerComponent, "ax-drawer", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "closeOthers": { "alias": "closeOthers"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "location": "locationChange"; "mode": "modeChange"; "collapsed": "collapsedChange"; }, never, ["ax-header", "ax-content"], true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXDrawerComponent, "ax-drawer", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "transition": { "alias": "transition"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; "backdropClass": { "alias": "backdropClass"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "singleOpenMode": { "alias": "singleOpenMode"; "required": false; "isSignal": true; }; }, { "onBackdropClick": "onBackdropClick"; "collapsedStateChanged": "collapsedStateChanged"; }, never, ["ax-header", "ax-content"], true, [{ directive: typeof i1.AXDrawerItemDirective; inputs: {}; outputs: {}; }]>;
 }
 
 declare class AXDrawerModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDrawerModule, never, [typeof i1.CommonModule, typeof AXDrawerComponent, typeof AXDrawerContainerComponent], [typeof AXDrawerComponent, typeof AXDrawerContainerComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<AXDrawerModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXDrawerModule, never, [typeof AXDrawerComponent, typeof AXDrawerContainerComponent], [typeof AXDrawerComponent, typeof AXDrawerContainerComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXDrawerModule>;
 }
 
 export { AXDrawerComponent, AXDrawerContainerComponent, AXDrawerModule };
-export type { AXDrawerLocation, AXDrawerMode };

package/drawer-legacy/README.md

@@ -0,0 +1,3 @@
+# @acorex/components/drawer
+
+Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer`.