@shival99/z-ui 2.0.28 → 2.0.30

package/types/shival99-z-ui-components-z-table.d.ts

@@ -5,20 +5,23 @@ import * as _shival99_z_ui_components_z_input from '@shival99/z-ui/components/z-
 import { ZInputSize } from '@shival99/z-ui/components/z-input';
 import * as _angular_core from '@angular/core';
 import { TemplateRef, Type, AfterViewInit, ElementRef, OnInit } from '@angular/core';
-import { CdkDragDrop, CdkDragEnd } from '@angular/cdk/drag-drop';
+import { CdkDragDrop } from '@angular/cdk/drag-drop';
 import { ConnectedPosition } from '@angular/cdk/overlay';
+import { ZButtonVariants } from '@shival99/z-ui/components/z-button';
 import { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';
 import { ClassValue } from 'clsx';
 import { NgScrollbar } from 'ngx-scrollbar';
 import { ZAutocompleteType, ZAutocompleteOption } from '@shival99/z-ui/components/z-autocomplete';
-import { ZButtonVariants } from '@shival99/z-ui/components/z-button';
 import { ZIcon, ZIconVariants } from '@shival99/z-ui/components/z-icon';
 import { ZSelectOption, ZSelectConfig } from '@shival99/z-ui/components/z-select';
+import * as _shival99_z_ui_components_z_tags from '@shival99/z-ui/components/z-tags';
+import { ZTagColor } from '@shival99/z-ui/components/z-tags';
 import * as _shival99_z_ui_components_z_tooltip from '@shival99/z-ui/components/z-tooltip';
 import { ZTooltipConfig, ZTooltipContent } from '@shival99/z-ui/components/z-tooltip';
 import { ZExcelColumnConfig, ZExcelExportOptions } from '@shival99/z-ui/services';
 import { ZDateRange } from '@shival99/z-ui/components/z-calendar';
 import { ZDropdownMenuItem } from '@shival99/z-ui/components/z-dropdown-menu';
+import * as _shival99_z_ui_components_z_table from '@shival99/z-ui/components/z-table';
 
 /**
  * Z-Table Type Definitions
@@ -55,6 +58,8 @@ interface ZTableIconPart {
     strokeWidth?: number;
 }
 type ZTableAlign = 'left' | 'center' | 'right';
+type ZTableBodyContentType = 'default' | 'tag';
+type ZTableTagColor = ZTagColor;
 /**
  * Body cell content — supports static values, Angular templates/components,
  * or a function that receives the cell context and returns dynamic content.
@@ -228,6 +233,10 @@ interface ZTableHeaderColumnConfig<T> {
  */
 interface ZTableBodyColumnConfig<T> {
     content?: ZTableCellContent<T>;
+    /** Built-in visual treatment for the rendered body content. */
+    type?: ZTableBodyContentType;
+    /** Semantic color used when type is "tag". */
+    tagColor?: ZTableTagColor | ((info: CellContext<T, unknown>) => ZTableTagColor);
     class?: string | ((info: CellContext<T, unknown>) => string);
     style?: Record<string, string> | ((info: CellContext<T, unknown>) => Record<string, string>);
     align?: ZTableAlign;
@@ -711,6 +720,18 @@ interface ZResolvedEditConfig {
     disabled: boolean;
     readonly: boolean;
 }
+type ZTableDragEntity = 'row' | 'settings-column';
+type ZTableDropEdge = 'top' | 'bottom';
+interface ZTableDragData {
+    tableId: string;
+    entity: ZTableDragEntity;
+    itemId: string;
+}
+interface ZTableDragDropData {
+    source: ZTableDragData;
+    target: ZTableDragData;
+    edge: ZTableDropEdge;
+}
 /**
  * Extends TanStack's TableMeta to add a custom `updateData` callback.
  * This is used by inline edit cells to notify the table of value changes.
@@ -721,6 +742,9 @@ declare module '@tanstack/angular-table' {
     }
 }
 
+type ZTableBulkActionRenderItem<T> = ZTableBulkActionViewItem<T> & {
+    buttonType: ZButtonVariants['zType'];
+};
 declare class ZTableComponent<T> implements AfterViewInit {
     /** Unified change event — parent listens to this for all table interactions */
     readonly zChange: _angular_core.OutputEmitterRef<ZTableChangeEvent<T>>;
@@ -737,6 +761,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     /** Visual variant: 'default' has card shadow, 'borderless' has no container border */
     readonly zVariant: _angular_core.InputSignal<"default" | "borderless">;
     private readonly _destroy$;
+    private readonly _dragService;
     private readonly _zExcel;
     private readonly _zTranslate;
     /** Prevents recursive scroll sync between thead/tbody/tfoot */
@@ -747,16 +772,18 @@ declare class ZTableComponent<T> implements AfterViewInit {
     private _resizeObserver;
     /** Debounces rapid settings changes (visibility/pin toggles) */
     private _settingsDebounceTimeout;
+    private _visibilityDebounceTimeout;
     /** Debounces filter change emissions to server */
     private _filterEmitDebounceTimeout;
     /** Keeps the bulk bar mounted long enough for its exit animation */
     private _bulkBarTimer;
     private readonly _activeColumnVisibilityPopover;
+    private _hasInitializedColumnPinning;
     /** Merged loading state from both zLoading input and config.loading */
     protected readonly isLoading: _angular_core.Signal<boolean>;
     /** True during debounced async state transitions (sort/filter processing) */
     protected readonly isProcessing: _angular_core.WritableSignal<boolean>;
-    protected readonly isDraggingRow: _angular_core.WritableSignal<boolean>;
+    protected readonly dragInstanceId: string;
     protected readonly theadWrapper: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
     protected readonly tbodyContainer: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
     protected readonly tbodyWrapper: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
@@ -798,7 +825,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly bulkBarClosing: _angular_core.WritableSignal<boolean>;
     protected readonly bulkBarConfig: _angular_core.WritableSignal<ZTableBulkActionOptions<T> | null>;
     protected readonly bulkBarContext: _angular_core.WritableSignal<ZTableBulkActionContext<T> | null>;
-    protected readonly bulkBarItems: _angular_core.WritableSignal<ZTableBulkActionViewItem<T>[]>;
+    protected readonly bulkBarItems: _angular_core.WritableSignal<ZTableBulkActionRenderItem<T>[]>;
     /** True when table body is scrolled away from left edge (shows left pin shadow) */
     protected readonly hasScrollLeft: _angular_core.WritableSignal<boolean>;
     /** True when table has right-pinned columns and body isn't scrolled to the end */
@@ -843,6 +870,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
         width: number;
     } | null>;
     protected readonly hasActionColumn: _angular_core.Signal<boolean>;
+    private readonly _fixedColumnPinning;
     protected readonly hasFiltering: _angular_core.Signal<boolean>;
     protected readonly hasLocalFiltering: _angular_core.Signal<boolean>;
     protected readonly hasSorting: _angular_core.Signal<boolean>;
@@ -900,6 +928,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly virtualRightSpacerWidth: _angular_core.Signal<number>;
     protected readonly renderedColumnCount: _angular_core.Signal<number>;
     protected readonly orderedLeafColumns: _angular_core.Signal<Column<T, unknown>[]>;
+    protected readonly fillColumnId: _angular_core.Signal<string | null>;
     protected readonly hideableColumns: _angular_core.Signal<Column<T, unknown>[]>;
     protected readonly orderedHeaderGroups: _angular_core.Signal<{
         id: string;
@@ -938,16 +967,14 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly selectedRows: _angular_core.Signal<T[]>;
     protected readonly bulkActionContext: _angular_core.Signal<ZTableBulkActionContext<T>>;
     protected readonly bulkActionConfig: _angular_core.Signal<ZTableBulkActionOptions<T> | null>;
-    protected readonly bulkActionItems: _angular_core.Signal<{
-        action: ZTableBulkActionItem<T>;
-        disabled: boolean;
-    }[]>;
+    protected readonly bulkActionItems: _angular_core.Signal<ZTableBulkActionRenderItem<T>[]>;
     protected readonly showBulkBar: _angular_core.Signal<boolean>;
     protected readonly bulkBarPositions: ConnectedPosition[];
     private readonly _bulkBarExitDuration;
     /** Virtualizer instance — operates on groups rather than individual rows */
     protected readonly virtualizer: _shival99_angular_virtual.AngularVirtualizer<HTMLDivElement, Element>;
     private readonly _measureVirtualItems;
+    private readonly _rowDragAutoScroll;
     constructor();
     ngAfterViewInit(): void;
     /**
@@ -989,11 +1016,8 @@ declare class ZTableComponent<T> implements AfterViewInit {
      * Giữ tạm để các consumer/template cũ còn compile trong giai đoạn chuyển đổi.
      */
     handleSort(event: Event, handler?: (event: unknown) => void): void;
-    onColumnDrop(event: CdkDragDrop<string[]>): void;
-    onRowDragStarted(): void;
-    onRowDragEnded(_event: CdkDragEnd<Row<T>>): void;
-    onRowDrop(event: CdkDragDrop<Row<T>[]>): void;
-    private _resolveRowDragDropIndex;
+    protected _handleDragDrop(event: ZTableDragDropData): void;
+    private _handleRowDrop;
     onToggleAllColumns(): void;
     onPageChange(event: {
         pageIndex: number;
@@ -1018,6 +1042,8 @@ declare class ZTableComponent<T> implements AfterViewInit {
     hideColumnPopoversOnOutsideClick(optionsPopover: ZPopoverDirective): void;
     openSettingsDrawerFromColumnMenu(...popovers: ZPopoverDirective[]): void;
     private _isColumnHiddenFromVisibilityMenu;
+    private _setColumnPinning;
+    private _areColumnIdListsEqual;
     moveColumnLeft(columnId: string): void;
     moveColumnRight(columnId: string): void;
     isFirstMovableColumn(columnId: string): boolean;
@@ -1149,7 +1175,7 @@ declare class ZTableActionsComponent<T = unknown> {
     readonly zConfig: _angular_core.InputSignal<ZTableActionColumnConfig<T>>;
     readonly zRow: _angular_core.InputSignal<T>;
     readonly zRowId: _angular_core.InputSignal<string>;
-    readonly zDropdownButtonSize: _angular_core.InputSignal<"sm" | "default" | "lg" | "xs" | "xl" | null | undefined>;
+    readonly zDropdownButtonSize: _angular_core.InputSignal<"default" | "sm" | "lg" | "xs" | "xl" | null | undefined>;
     readonly zActionClick: _angular_core.OutputEmitterRef<ZTableActionClickEvent<T>>;
     protected readonly allActions: _angular_core.Signal<ZTableActionItem<T>[]>;
     protected readonly shouldShowAsButtons: _angular_core.Signal<boolean>;
@@ -1243,6 +1269,8 @@ declare const getHeaderConfig: <T>(col: ZTableColumnConfig<T> | undefined) => {
  */
 declare const getBodyConfig: <T>(col: ZTableColumnConfig<T> | undefined, ctx?: CellContext<T, unknown>) => {
     content: ZTableCellContent<T> | undefined;
+    type: "default";
+    tagColor: "primary";
     class: string | undefined;
     style: Record<string, string> | undefined;
     align: string | undefined;
@@ -1253,6 +1281,8 @@ declare const getBodyConfig: <T>(col: ZTableColumnConfig<T> | undefined, ctx?: C
     tooltip: string | object | undefined;
 } | {
     content: ZTableCellContent<T> | undefined;
+    type: _shival99_z_ui_components_z_table.ZTableBodyContentType;
+    tagColor: _shival99_z_ui_components_z_tags.ZTagColor | ((info: CellContext<T, unknown>) => _shival99_z_ui_components_z_table.ZTableTagColor);
     class: string | ((info: CellContext<T, unknown>) => string) | undefined;
     style: Record<string, string> | undefined;
     align: ZTableAlign | undefined;
@@ -1299,4 +1329,4 @@ declare const findColumnConfig: <T>(columnId: string, columns: ZTableColumnConfi
 declare function columnConfigToColumnDef<T>(config: ZTableColumnConfig<T>): ColumnDef<T>;
 
 export { ZTableActionsComponent, ZTableComponent, ZTableEditCellComponent, ZTableFilterComponent, ZTableIconTextComponent, columnConfigToColumnDef, findColumnConfig, getBodyConfig, getFooterConfig, getHeaderConfig, isBodyConfig, isFooterConfig, isHeaderConfig };
-export type { ZTableActionBodyConfig, ZTableActionClickEvent, ZTableActionColumnConfig, ZTableActionItem, ZTableActionList, ZTableAdvancedFilterType, ZTableBulkActionClickEvent, ZTableBulkActionConfig, ZTableBulkActionContext, ZTableBulkActionHandlerContext, ZTableBulkActionItem, ZTableBulkActionList, ZTableBulkActionOptions, ZTableBulkActionViewItem, ZTableCellEditChange, ZTableCellEditEvent, ZTableChangeEvent, ZTableColumn, ZTableColumnConfig, ZTableConfig, ZTableControl, ZTableEditCellChangeEvent, ZTableEditConfig, ZTableEditSize, ZTableEditType, ZTableExcelExportConfig, ZTableExcelExportContext, ZTableExcelExportScope, ZTableFilterChangeEvent, ZTableFilterCondition, ZTableFilterConfig, ZTableFilterJoinOperator, ZTableFilterOperator, ZTableFilterOptionSource, ZTableFilterUi, ZTableFilterValueType, ZTablePageChangeEvent, ZTablePaginationConfig, ZTableRowExpandEvent, ZTableRowSelectEvent, ZTableSearchChangeEvent, ZTableSearchConfig, ZTableSortChangeEvent, ZTableSortConfig };
+export type { ZTableActionBodyConfig, ZTableActionClickEvent, ZTableActionColumnConfig, ZTableActionItem, ZTableActionList, ZTableAdvancedFilterType, ZTableBodyContentType, ZTableBulkActionClickEvent, ZTableBulkActionConfig, ZTableBulkActionContext, ZTableBulkActionHandlerContext, ZTableBulkActionItem, ZTableBulkActionList, ZTableBulkActionOptions, ZTableBulkActionViewItem, ZTableCellEditChange, ZTableCellEditEvent, ZTableChangeEvent, ZTableColumn, ZTableColumnConfig, ZTableConfig, ZTableControl, ZTableEditCellChangeEvent, ZTableEditConfig, ZTableEditSize, ZTableEditType, ZTableExcelExportConfig, ZTableExcelExportContext, ZTableExcelExportScope, ZTableFilterChangeEvent, ZTableFilterCondition, ZTableFilterConfig, ZTableFilterJoinOperator, ZTableFilterOperator, ZTableFilterOptionSource, ZTableFilterUi, ZTableFilterValueType, ZTablePageChangeEvent, ZTablePaginationConfig, ZTableRowExpandEvent, ZTableRowSelectEvent, ZTableSearchChangeEvent, ZTableSearchConfig, ZTableSortChangeEvent, ZTableSortConfig, ZTableTagColor };

package/types/shival99-z-ui-components-z-tags.d.ts

@@ -18,6 +18,9 @@ interface ZTagRandomColorCache {
     text: string;
     border: string;
     hoverBg: string;
+    darkBg?: string;
+    darkText?: string;
+    darkHoverBg?: string;
 }
 interface ZTagConfig {
     size: ZTagSize;